/* ================================================
   config.css — Proje Yapılandırması (Zugo Standartları)
   ================================================
   Yeni projeye başlarken bu dosyadan renkleri ve fontları özelleştirin.
   Zugo'ya özgü semantik renk rolleri (primary / secondary / tertiary / surface).
   ================================================ */

/* ===== FONT İMPORT ===== */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Inter:wght@300;400;500;600;700&family=Geist:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Urbanist:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');
/* Satoshi, Google Fonts'ta yok — Fontshare üzerinden ayrıca içe aktarılır. */
@import url('https://api.fontshare.com/v2/css?f[]=satoshi@300,400,500,600,700&display=swap');
/* display=block (swap DEĞİL): ikon fontu geç yüklenirse köşe/kenarlarda
   "payments", "car_crash" gibi ham ikon adı metinleri kısa süreliğine
   görünüp taşma/garip metin sızıntısına yol açabiliyordu. block, font hazır
   olana kadar ikonu görünmez tutar — okunabilir metin fontlarının aksine
   ikon fontları için burada swap değil block tercih edilmelidir. */
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&display=block');

:root {
  /* ===== BRAND COLOR RAMP (Mavi / Vurgu) ===== */
  --brand-50:                   #EFF5FC;
  --brand-100:                  #D8E6F6;
  --brand-200:                  #AECFEE;
  --brand-300:                  #7FB2E3;
  --brand-400:                  #5295D6;
  --brand-500:                  #2E78C4;
  --brand-600:                  #1A5DAE;
  --brand-700:                  #0A4A94;
  --brand-800:                  #00387B;
  --brand-900:                  #002A5C;
  --brand-950:                  #001B3D;

  /* ===== YAZI TİPİ (TYPOGRAPHY) ===== */
  --brand-font:      'Plus Jakarta Sans', 'Urbanist', 'Geist', 'Inter', 'Roboto', system-ui, -apple-system, sans-serif;
  --brand-font-mono: 'JetBrains Mono', monospace;

  /* ===== LIGHT TEMA - semantik Zugo Renkleri ===== */
  --zugo-primary:                 #5348CE;
  --zugo-on-primary:              #FFFFFF;
  --zugo-primary-container:       #E3E0FF;
  --zugo-on-primary-container:     #140084;

  --zugo-secondary:               #535F70;
  --zugo-on-secondary:            #FFFFFF;
  --zugo-secondary-container:     #D7E3F7;
  --zugo-on-secondary-container:   #101C2B;

  --zugo-tertiary:                #6C5778;
  --zugo-on-tertiary:             #FFFFFF;
  --zugo-tertiary-container:      #F3DAFF;
  --zugo-on-tertiary-container:    #261431;

  --zugo-background:              #FAFAFA;
  --zugo-on-background:           #131313;

  --zugo-surface:                 #FDFBFF;
  --zugo-on-surface:              #131313;
  --zugo-surface-variant:         #F3F3F3;
  --zugo-on-surface-variant:      #3C3C3C;
  /* İpucu/placeholder tonu — ikincil metinden belirgin AÇIK olmalı ki boş alan
     dolu gibi okunmasın. Kontrast 2.45:1 (AA eşiğinin altında): bu bilinçlidir,
     çünkü her form alanının üstünde kalıcı bir .form-label bulunur; placeholder
     zorunlu etiket değil yardımcı ipuçtur ve ayrıca italik ile işaretlenir. */
  --zugo-on-surface-subtle:       #A3A3A3;

  --zugo-outline:                 #646464;
  --zugo-outline-variant:         #DFE2E6;

  /* Zugo Surface Containers (Light) */
  --zugo-surface-container-lowest:  #FFFFFF;
  --zugo-surface-container-low:     #FDFBFF;
  --zugo-surface-container:          #F1F4FA;
  --zugo-surface-container-high:     #EBEFF5;
  --zugo-surface-container-highest:  #E5EAF0;

  /* Zugo Inverse Roles (Light) */
  --zugo-inverse-surface:         #2F3033;
  --zugo-inverse-on-surface:      #F1F0F4;
  --zugo-inverse-primary:         #5348CE;

  /* Semantik Durumlar (Zugo Sıcak/Soğuk Spektrum Paleti) - Light */
  --zugo-success:                 #199549;
  --zugo-on-success:              #FFFFFF;
  --zugo-success-container:       #DFF0E6;
  --zugo-on-success-container:     #137037;

  --zugo-warning:                 #F48F02;
  --zugo-on-warning:              #FFFFFF;
  --zugo-warning-container:       #FDEFDC;
  --zugo-on-warning-container:     #B76B02;

  --zugo-error:                   #D93602;
  --zugo-on-error:                #FFFFFF;
  --zugo-error-container:         #FAE3DC;
  --zugo-on-error-container:       #A32802;

  --zugo-info:                    #00757E;
  --zugo-on-info:                 #FFFFFF;
  --zugo-info-container:          #DBECED;
  --zugo-on-info-container:        #00585E;

  /* ===== DARK TEMA - semantik Zugo Renkleri ===== */
  --zugo-dark-primary:                 #C4C0FF;
  --zugo-dark-on-primary:              #241799;
  --zugo-dark-primary-container:       #3B30B4;
  --zugo-dark-on-primary-container:     #E3E0FF;

  --zugo-dark-secondary:               #BAC7DB;
  --zugo-dark-on-secondary:            #253140;
  --zugo-dark-secondary-container:     #3B4858;
  --zugo-dark-on-secondary-container:   #D7E3F7;

  --zugo-dark-tertiary:                #D7BDE7;
  --zugo-dark-on-tertiary:             #3C2947;
  --zugo-dark-tertiary-container:      #543F5E;
  --zugo-dark-on-tertiary-container:    #F3DAFF;

  --zugo-dark-background:              #1A1C1E;
  --zugo-dark-on-background:           #F3F3F3;

  --zugo-dark-surface:                 #1A1C1E;
  --zugo-dark-on-surface:              #F3F3F3;
  --zugo-dark-surface-variant:         #131313;
  --zugo-dark-on-surface-variant:      #B5B5B5;
  --zugo-dark-on-surface-subtle:       #6E7278;  /* koyu temada dengi (3.3:1) */

  --zugo-dark-outline:                 #646464;
  --zugo-dark-outline-variant:         #52565B;

  /* Zugo Surface Containers (Dark) */
  --zugo-dark-surface-container-lowest:  #0F1012;
  --zugo-dark-surface-container-low:     #363A3F;
  --zugo-dark-surface-container:          #202225;
  --zugo-dark-surface-container-high:     #2B2E32;
  --zugo-dark-surface-container-highest:  #36393E;

  /* Zugo Inverse Roles (Dark) */
  --zugo-dark-inverse-surface:         #E2E2E6;
  --zugo-dark-inverse-on-surface:      #2F3033;
  --zugo-dark-inverse-primary:         #5348CE;

  /* Semantik Durumlar (Zugo Sıcak/Soğuk Spektrum Paleti) - Dark */
  --zugo-dark-success:                 #98CFAD;
  --zugo-dark-on-success:              #072A14;
  --zugo-dark-success-container:       #0B4321;
  --zugo-dark-on-success-container:     #D1EADB;

  --zugo-dark-warning:                 #FACD8D;
  --zugo-dark-on-warning:              #442801;
  --zugo-dark-warning-container:       #6E4001;
  --zugo-dark-on-warning-container:     #FDE9CC;

  --zugo-dark-error:                   #EEA58D;
  --zugo-dark-on-error:                #3D0F01;
  --zugo-dark-error-container:         #621801;
  --zugo-dark-on-error-container:       #F7D7CC;

  --zugo-dark-info:                    #8CC1C5;
  --zugo-dark-on-info:                 #002123;
  --zugo-dark-info-container:          #003539;
  --zugo-dark-on-info-container:        #CCE3E5;
}