/* ====================================================
   variables.css — colors, font sizes, spacing, fonts etc.
   ==================================================== */

/* base/fonts.css və ya variables.css içində yaz */
@font-face {
    font-family: 'PP Fraktion Mono';
    src: url('../../fonts/PPFraktionMono-Regular.otf') format('opentype'),
    url('../../fonts/PPFraktionMono-Regular.otf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

:root {
    /* === Colors === */
    --a-color-primary: #F4F4F2; /* Primary color */

    --a-color-beige-50: #F4F4F2;
    --a-color-beige-100: #E4E3DD;
    --a-color-beige-200: #CCC8BC;
    --a-color-beige-300: #AEA696;
    --a-color-beige-400: #978C78;
    --a-color-beige-500: #887C6A;
    --a-color-beige-600: #74685A;
    --a-color-beige-700: #5E534A;
    --a-color-beige-800: #524741;
    --a-color-beige-900: #483F3B;
    --a-color-beige-950: #282220;

    --a-color-black-50: #F6F6F6;
    --a-color-black-100: #E7E7E7;
    --a-color-black-200: #D1D1D1;
    --a-color-black-300: #B0B0B0;
    --a-color-black-400: #888888;
    --a-color-black-500: #6D6D6D;
    --a-color-black-600: #5D5D5D;
    --a-color-black-700: #4F4F4F;
    --a-color-black-800: #454545;
    --a-color-black-900: #3D3D3D;
    --a-color-black-950: #000000;

    --a-color-green-50: #EDFCF3;
    --a-color-green-100: #D4F7E0;
    --a-color-green-200: #ADEDC7;
    --a-color-green-300: #77DEA7;
    --a-color-green-400: #40C783;
    --a-color-green-500: #1DAC69;
    --a-color-green-600: #108B54;
    --a-color-green-700: #0D6F45;
    --a-color-green-800: #0D5839;
    --a-color-green-900: #0B492F;
    --a-color-green-950: #05291B;

    --a-color-blue-50: #F2F9FD;
    --a-color-blue-100: #E3F1FB;
    --a-color-blue-200: #C1E5F6;
    --a-color-blue-300: #88D0EE;
    --a-color-blue-400: #6BC4E8;
    --a-color-blue-500: #269FD1;
    --a-color-blue-600: #1780B2;
    --a-color-blue-700: #146690;
    --a-color-blue-800: #155777;
    --a-color-blue-900: #174863;
    --a-color-blue-950: #0F2F42;

    --a-color-orange-50: #FFF4ED;
    --a-color-orange-100: #FFE5D4;
    --a-color-orange-200: #FFC8A9;
    --a-color-orange-300: #FFA172;
    --a-color-orange-400: #FE6F39;
    --a-color-orange-500: #FD4912;
    --a-color-orange-600: #ED2F09;
    --a-color-orange-700: #C51F09;
    --a-color-orange-800: #9C1A10;
    --a-color-orange-900: #7E1910;
    --a-color-orange-950: #440806;

    --a-color-yellow-50: #FDFBE9;
    --a-color-yellow-100: #FBF5C6;
    --a-color-yellow-200: #F8E890;
    --a-color-yellow-300: #F3D551;
    --a-color-yellow-400: #EFC430;
    --a-color-yellow-500: #DEA814;
    --a-color-yellow-600: #BF820F;
    --a-color-yellow-700: #995E0F;
    --a-color-yellow-800: #7F4A14;
    --a-color-yellow-900: #6C3D17;
    --a-color-yellow-950: #3F1F09;

    --a-color-black: #000;
    --a-color-white: #fff;

    /* === Font Families === */
    --a-font-primary: 'Inter', sans-serif;
    --a-font-mono: 'PP Fraktion Mono', monospace;

    /* === Font Sizes === */
    --a-fs-sm: 0.875rem;      /* ~14px */
    --a-fs-base: 1rem;        /* ~16px */
    --a-fs-lg: 1.5rem;        /* ~24px */
    --a-fs-xl: 2rem;          /* ~32px */
    --a-fs-2xl: 2.5rem;       /* ~40px */
    --a-fs-xxl: 3rem;         /* ~48px */

    /* ==== SPACING ==== */
    --a-space-xxs: 4px;
    --a-space-xs: 8px;
    --a-space-sm: 12px;
    --a-space-md: 16px;
    --a-space-lg: 24px;
    --a-space-xl: 32px;
    --a-space-2xl: 40px;
    --a-space-3xl: 48px;
    --a-space-4xl: 64px;

    /* Font Weights */
    --a-font-weight-light: 300;
    --a-font-weight-regular: 400;
    --a-font-weight-medium: 500;
    --a-font-weight-semibold: 600;
    --a-font-weight-bold: 700;
    --a-font-weight-extrabold: 800;

    /* === Shadows === */
    --a-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --a-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);

    /* === Transition === */
    --a-transition: all 0.3s ease;

    /* === Positioning === */
    --a-position-relative: relative;
    --a-position-absolute: absolute;
    --a-position-fixed: fixed;
    --a-position-sticky: sticky;
    --a-position-static: static;

    /* === Border Radius === */
    --a-radius-sm: 8px;
    --a-radius-md: 16px;
    --a-radius-lg: 24px;

    /* === Z-index levels === */
    --a-z-header: 1000;
    --a-z-menu: 1100;
    --a-z-modal: 1200;
    --a-z-tooltip: 1300;
    --a-z-dropdown: 1400;
    --a-z-toast: 1500;
    --a-z-backdrop: 1600;
    --a-z-overlay: 1700;
    --a-z-popover: 1800;
    --a-z-banner: 1900;
    --a-z-loading: 2000;
}