/* ==========================================================================================================================================
   ALMERAM web tasarım sistemi: tek merkezi jeton kaynağı (bu dosyanın 1. bölümü).
   Kanonik kaynak Android uygulamasıdır: mobile/almeram_mobile/lib/app/theme.dart (FieldColors, fieldTheme; salt okunur). Web aynı renk ailesini,
   aynı anlamsal durum mantığını (başarı = sunucu kabulü, uyarı = bekleyen/çevrimdışı, hata = müdahale, bilgi = etkin/eşitleniyor) ve aynı ürün kimliğini
   kullanır; ekran ergonomisi ve veri yoğunluğu web'e uygundur. Görünümlerde ham renk (onaltılık, rgb, satır içi stil) kullanılmaz; yalnız bu jetonlar.
   WCAG 2.x: normal metin ≥ 4.5:1, büyük metin ve arayüz bileşeni/odak ≥ 3:1. Android tonunun web zemininde yetmediği yerde aynı ailede erişilebilir
   varyant kullanılır (aşağıda "Web varyantı" olarak işaretli; oranlar belgelenmiştir). Yalnız açık tema (Android da yalnız açık temayı destekler).
   ========================================================================================================================================== */
:root {
  /* 1a. Android ham değerleri (referans; bileşenler doğrudan kullanmaz). Birim testi bu değerleri theme.dart ile eşler. */
  --alm-android-menu: #14263D;
  --alm-android-primary: #2563EB;
  --alm-android-active: #3B82F6;
  --alm-android-canvas: #F6F8FB;
  --alm-android-surface: #FFFFFF;
  --alm-android-text: #1E293B;
  --alm-android-secondary-text: #64748B;
  --alm-android-success: #16A34A;
  --alm-android-warning: #F59E0B;
  --alm-android-error: #DC2626;
  --alm-android-border: #E2E8F0;
  --alm-android-preview: #000000;
  /* Android'in türetilmiş yüzeyleri: Color.alphaBlend(ton, beyaz) = bilgi %8, uyarı %14, hata %8, başarı %10. */
  --alm-android-info-surface: #EEF3FD;
  --alm-android-warning-surface: #FEF1DD;
  --alm-android-error-surface: #FCEEEE;
  --alm-android-success-surface: #E8F6ED;

  /* 1b. Anlamsal web jetonları. */
  --alm-menu: var(--alm-android-menu);                      /* gezinti çubuğu zemini (Android: menü/navigation rail) */
  --alm-menu-text: #E2E8F0;                                 /* menü bağlantısı: menüde 12.39:1 */
  --alm-menu-text-muted: #CBD5E1;                           /* menüde ikincil metin: 10.29:1 */
  --alm-menu-indicator: var(--alm-android-active);          /* etkin sayfa çizgisi (metin değil): menüde 4.15:1 */
  --alm-primary: var(--alm-android-primary);                /* beyaz üzerinde 5.17:1; bağlantı metni olarak da ≥ 4.58:1 (bütün yüzeylerde) */
  --alm-primary-hover: #1D4ED8;                             /* Web varyantı: Android hover'ı #3B82F6 üzerinde beyaz metin 3.68:1 olurdu; bu 6.70:1 */
  --alm-primary-pressed: #1E40AF;                           /* 8.72:1 */
  --alm-primary-container: #DBE1FF;                         /* seçili/vurgulu satır zemini; üzerinde metin 11.5:1 */
  --alm-secondary: var(--alm-android-active);               /* ikincil vurgu (yalnız metin dışı bileşenlerde) */
  --alm-on-primary: #FFFFFF;
  --alm-canvas: var(--alm-android-canvas);
  --alm-surface: var(--alm-android-surface);
  --alm-surface-variant: #E3E2E9;                           /* nötr rozet ve pasif zemin; üzerinde --alm-text 11.37:1 */
  --alm-table-head: #EEF2F7;                                /* tablo başlığı ve hover (Android'e özgü değil; kenarlık ailesinden türetildi) */
  --alm-text: var(--alm-android-text);                      /* beyazda 14.63:1, zeminde 13.75:1 */
  --alm-text-secondary: #5E6D83;                            /* Web varyantı: Android #64748B zeminde 4.47:1 ve bilgi yüzeyinde 4.28:1 idi; bu ≥ 4.66:1 her yüzeyde */
  --alm-border: var(--alm-android-border);                  /* kart ve tablo kenarlığı (süsleyici) */
  --alm-control-border: #7A8AA1;                            /* form alanı sınırı (WCAG 1.4.11): beyazda 3.51:1, zeminde 3.30:1 */
  --alm-preview: var(--alm-android-preview);                /* fotoğraf/kamera önizleme zemini */

  --alm-success: #117E39;                                   /* Web varyantı (Android #16A34A beyazda 3.30:1): metin 5.16:1, başarı yüzeyinde 4.63:1; dolgu üzerinde beyaz 5.16:1 */
  --alm-success-surface: var(--alm-android-success-surface);
  --alm-success-edge: #9ED9B4;
  --alm-warning: var(--alm-android-warning);                /* dolgu; üzerinde koyu metin 6.81:1 (Android'de de koyu metin) */
  --alm-warning-text: #986207;                              /* Web varyantı (Android #F59E0B beyazda 2.15:1): beyazda 5.14:1, uyarı yüzeyinde 4.61:1 */
  --alm-warning-surface: var(--alm-android-warning-surface);
  --alm-warning-edge: #FBD494;
  --alm-danger: #D12424;                                    /* Web varyantı (Android #DC2626 hata yüzeyinde 4.28:1): beyazda 5.26:1, hata yüzeyinde 4.66:1; dolgu üzerinde beyaz 5.26:1 */
  --alm-danger-hover: #B91C1C;                              /* 6.47:1 */
  --alm-danger-surface: var(--alm-android-error-surface);
  --alm-danger-edge: #F1A8A8;
  --alm-info: var(--alm-android-primary);                   /* Android "etkin/eşitleniyor/bilgi" = birincil ton */
  --alm-info-surface: var(--alm-android-info-surface);
  --alm-info-edge: #A8C1F7;
  --alm-neutral-edge: #CBD5E1;

  --alm-focus: var(--alm-android-primary);                  /* odak: açık yüzeylerde ≥ 4.58:1 */
  --alm-focus-on-dark: #BFDBFE;                             /* odak: menüde 10.75:1 */
  --alm-scrim: rgba(20, 38, 61, .55);                     /* iletişim kutusu arka perdesi (menü tonu, yarı saydam) */
  --alm-disabled-opacity: .65;                              /* Android'in pasif rengi alfa içerir; opak bir renk değil saydamlık kullanılır */

  --alm-radius-card: .875rem;                               /* Android kart 18; web veri yoğunluğu için 14 px */
  --alm-radius-control: .625rem;                            /* Android alan/düğme 14; web 10 px */
  --alm-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --alm-touch-target: 44px;

  /* 1c. Bootstrap köprüsü: çerçevenin değişkenleri jetonlara bağlanır (tek kaynak bu dosyadır; 5.3'ün kendi renkleri kullanılmaz). */
  --bs-font-sans-serif: var(--alm-font);
  --bs-body-font-family: var(--alm-font);
  --bs-body-line-height: 1.45;
  --bs-body-bg: var(--alm-canvas); --bs-body-bg-rgb: 246, 248, 251;
  --bs-body-color: var(--alm-text); --bs-body-color-rgb: 30, 41, 59;
  --bs-emphasis-color: var(--alm-text);
  --bs-heading-color: var(--alm-text);
  --bs-secondary-color: var(--alm-text-secondary); --bs-secondary-color-rgb: 94, 109, 131;
  --bs-tertiary-color: var(--alm-text-secondary);
  --bs-secondary-bg: var(--alm-surface-variant);
  --bs-tertiary-bg: var(--alm-table-head);
  --bs-border-color: var(--alm-border);
  --bs-border-color-translucent: var(--alm-border);
  --bs-border-radius: var(--alm-radius-control);
  --bs-border-radius-sm: .5rem;
  --bs-border-radius-lg: var(--alm-radius-card);
  --bs-primary: var(--alm-primary); --bs-primary-rgb: 37, 99, 235;
  --bs-secondary: var(--alm-text-secondary); --bs-secondary-rgb: 94, 109, 131;
  --bs-success: var(--alm-success); --bs-success-rgb: 17, 126, 57;
  --bs-danger: var(--alm-danger); --bs-danger-rgb: 209, 36, 36;
  --bs-warning: var(--alm-warning); --bs-warning-rgb: 245, 158, 11;
  --bs-info: var(--alm-info); --bs-info-rgb: 37, 99, 235;
  --bs-light: var(--alm-canvas); --bs-light-rgb: 246, 248, 251;
  --bs-dark: var(--alm-menu); --bs-dark-rgb: 20, 38, 61;
  --bs-link-color: var(--alm-primary); --bs-link-color-rgb: 37, 99, 235;
  --bs-link-hover-color: var(--alm-primary-hover); --bs-link-hover-color-rgb: 29, 78, 216;
  --bs-form-invalid-color: var(--alm-danger);
  --bs-form-invalid-border-color: var(--alm-danger);
  --bs-form-valid-color: var(--alm-success);
  --bs-form-valid-border-color: var(--alm-success);
  --bs-focus-ring-color: rgba(37, 99, 235, .25);
}

/* ===== 2. Temel ===== */
body { background: var(--alm-canvas); color: var(--alm-text); font-family: var(--alm-font); }
h1, .h1 { font-weight: 800; }
h2, .h2, h3, .h3, h4, .h4, h5, .h5 { font-weight: 700; }
a { text-underline-offset: .15em; }
.form-text { color: var(--alm-text-secondary); }
.text-warning { color: var(--alm-warning-text) !important; }
.text-success { color: var(--alm-success) !important; }
.text-danger { color: var(--alm-danger) !important; }
.eyebrow { color: var(--alm-primary); font-size: .8rem; letter-spacing: .14em; font-weight: 700; }
.hero { padding: clamp(1rem, 6vw, 5rem) 0; max-width: 720px; }
.hero h1 { font-weight: 750; font-size: clamp(2.7rem, 7vw, 4.7rem); letter-spacing: -.04em; margin-bottom: 1.5rem; }
.login-panel { max-width: 440px; margin: 2rem auto; }
input[type="checkbox"], input[type="radio"], progress, meter { accent-color: var(--alm-primary); }
.region-pick { max-height: 14rem; }
meter { width: 6rem; vertical-align: middle; }
meter.meter-lg { width: 100%; height: 1.25rem; }
.text-break { overflow-wrap: anywhere; }
/* Yalnız düğme biçimli <summary> işaretçisini gizler; düz metin özetler tarayıcının açılır/kapanır okunu korur (dokunmatik ekranda ipucu). */
details > summary { cursor: pointer; }
details > summary:not(.btn) { min-height: 1.5rem; padding-block: .25rem; }   /* en az 24 px hedef (WCAG 2.5.8) */
details > summary.btn { list-style: none; }
details > summary.btn::-webkit-details-marker { display: none; }
/* Çok satırlı kullanıcı notunda satır sonları korunur (CSP satır içi stile izin vermez). */
.preserve-lines { white-space: pre-line; }
code { color: var(--alm-text); background: var(--alm-table-head); border-radius: .25rem; padding: .05rem .3rem; }

/* ===== 3. Odak (WCAG 2.4.7, 1.4.11): açık yüzeylerde birincil ton, menüde açık ton; Bootstrap'in (0,2,0) odak kurallarını geçer ===== */
a:focus-visible, button:focus-visible, .btn:focus-visible, .nav-link:focus-visible, .page-link:focus-visible, summary:focus-visible, .dropdown-item:focus-visible,
.form-control:focus-visible, .form-select:focus-visible, .form-check-input:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--alm-focus); outline-offset: 3px; }
.app-header a:focus-visible, .app-header button:focus-visible, .app-header .nav-link:focus-visible { outline-color: var(--alm-focus-on-dark); }
.dropdown-menu a:focus-visible, .dropdown-menu button:focus-visible { outline-color: var(--alm-focus); outline-offset: -3px; }
.visually-hidden-focusable:focus { position: fixed; top: .5rem; left: .5rem; z-index: 2000; padding: .6rem 1rem; background: var(--alm-surface); color: var(--alm-text);
  border: 2px solid var(--alm-focus); border-radius: var(--alm-radius-control); width: auto; height: auto; clip: auto; overflow: visible; }

/* ===== 4. Üst bilgi ve gezinti (Android menü tonu) ===== */
.app-header { background: var(--alm-menu); color: var(--alm-menu-text); }
.app-header .navbar { --bs-navbar-color: var(--alm-menu-text); --bs-navbar-hover-color: #FFFFFF; --bs-navbar-active-color: #FFFFFF; --bs-navbar-disabled-color: var(--alm-menu-text-muted);
  --bs-navbar-toggler-border-color: var(--alm-menu-text-muted); --bs-navbar-brand-color: #FFFFFF; --bs-navbar-brand-hover-color: #FFFFFF; --bs-navbar-nav-link-padding-x: .75rem; }
.navbar.container { padding-left: .75rem; padding-right: .75rem; }   /* .navbar'ın sıfır yan dolgusu .container'ınkini eziyordu */
.brand { color: #FFFFFF; text-decoration: none; font-weight: 800; letter-spacing: .08em; }
.brand span { display: block; font-size: .75rem; font-weight: 500; color: var(--alm-menu-text-muted); letter-spacing: 0; }
.app-header .nav-link { border-bottom: 3px solid transparent; font-weight: 500; }
.app-header .nav-link:hover, .app-header .nav-link.show { color: #FFFFFF; }
.app-header .nav-link.active, .app-header .nav-link[aria-current="page"] { color: #FFFFFF; font-weight: 700; border-bottom-color: var(--alm-menu-indicator); }
@media (max-width: 1199.98px) { .app-header .nav-link { border-bottom: 0; border-left: 3px solid transparent; padding-left: .75rem; }
  .app-header .nav-link.active, .app-header .nav-link[aria-current="page"] { border-left-color: var(--alm-menu-indicator); } }
.app-header .dropdown-menu { --bs-dropdown-bg: var(--alm-surface); --bs-dropdown-color: var(--alm-text); --bs-dropdown-border-color: var(--alm-border); --bs-dropdown-border-radius: var(--alm-radius-card);
  --bs-dropdown-link-color: var(--alm-text); --bs-dropdown-link-hover-color: var(--alm-text); --bs-dropdown-link-hover-bg: var(--alm-info-surface);
  --bs-dropdown-link-active-color: var(--alm-on-primary); --bs-dropdown-link-active-bg: var(--alm-primary); --bs-dropdown-divider-bg: var(--alm-border); }
.dropdown-item[aria-current="page"] { background: var(--alm-primary-container); color: var(--alm-text); font-weight: 700; }
.app-header .btn-outline-light { --bs-btn-color: var(--alm-menu-text); --bs-btn-border-color: var(--alm-menu-text-muted); --bs-btn-hover-color: var(--alm-menu); --bs-btn-hover-bg: #FFFFFF;
  --bs-btn-hover-border-color: #FFFFFF; --bs-btn-active-color: var(--alm-menu); --bs-btn-active-bg: #FFFFFF; --bs-btn-active-border-color: #FFFFFF; }
.badge-count { background: var(--alm-danger); color: #FFFFFF; border: 0; }
.badge-count::before { display: none; }

/* ===== 5. Düğmeler (Android: dolgu birincil, çerçeveli ikincil, hata tonu = güvenlik/silme) ===== */
button, .btn { min-height: var(--alm-touch-target); }
.btn { --bs-btn-border-radius: var(--alm-radius-control); --bs-btn-font-weight: 600; }
.btn-sm { --bs-btn-border-radius: var(--alm-radius-control); min-height: 36px; }
.btn:disabled, .btn.disabled, fieldset:disabled .btn { opacity: var(--alm-disabled-opacity); }
.btn-primary { --bs-btn-bg: var(--alm-primary); --bs-btn-border-color: var(--alm-primary); --bs-btn-color: var(--alm-on-primary);
  --bs-btn-hover-bg: var(--alm-primary-hover); --bs-btn-hover-border-color: var(--alm-primary-hover); --bs-btn-hover-color: var(--alm-on-primary);
  --bs-btn-active-bg: var(--alm-primary-pressed); --bs-btn-active-border-color: var(--alm-primary-pressed); --bs-btn-active-color: var(--alm-on-primary);
  --bs-btn-disabled-bg: var(--alm-primary); --bs-btn-disabled-border-color: var(--alm-primary); --bs-btn-disabled-color: var(--alm-on-primary); }
.btn-success { --bs-btn-bg: var(--alm-success); --bs-btn-border-color: var(--alm-success); --bs-btn-color: #FFFFFF; --bs-btn-hover-bg: #0E6A2F; --bs-btn-hover-border-color: #0E6A2F;
  --bs-btn-hover-color: #FFFFFF; --bs-btn-active-bg: #0B5A28; --bs-btn-active-border-color: #0B5A28; --bs-btn-active-color: #FFFFFF;
  --bs-btn-disabled-bg: var(--alm-success); --bs-btn-disabled-border-color: var(--alm-success); --bs-btn-disabled-color: #FFFFFF; }
.btn-danger { --bs-btn-bg: var(--alm-danger); --bs-btn-border-color: var(--alm-danger); --bs-btn-color: #FFFFFF; --bs-btn-hover-bg: var(--alm-danger-hover); --bs-btn-hover-border-color: var(--alm-danger-hover);
  --bs-btn-hover-color: #FFFFFF; --bs-btn-active-bg: #991B1B; --bs-btn-active-border-color: #991B1B; --bs-btn-active-color: #FFFFFF;
  --bs-btn-disabled-bg: var(--alm-danger); --bs-btn-disabled-border-color: var(--alm-danger); --bs-btn-disabled-color: #FFFFFF; }
.btn-warning { --bs-btn-bg: var(--alm-warning); --bs-btn-border-color: var(--alm-warning); --bs-btn-color: var(--alm-text); --bs-btn-hover-bg: #E08F00; --bs-btn-hover-border-color: #E08F00;
  --bs-btn-hover-color: var(--alm-text); --bs-btn-active-bg: #C77F00; --bs-btn-active-border-color: #C77F00; --bs-btn-active-color: var(--alm-text);
  --bs-btn-disabled-bg: var(--alm-warning); --bs-btn-disabled-border-color: var(--alm-warning); --bs-btn-disabled-color: var(--alm-text); }
.btn-dark { --bs-btn-bg: var(--alm-menu); --bs-btn-border-color: var(--alm-menu); --bs-btn-color: #FFFFFF; --bs-btn-hover-bg: #0D1B2D; --bs-btn-hover-border-color: #0D1B2D; --bs-btn-hover-color: #FFFFFF; }
/* Çerçeveli düğme metni her yüzeyde (zemin, beyaz, bilgi/uyarı/hata yüzeyi) 4.5:1; üzerine gelince dolgu ve beyaz metin. */
.btn-outline-secondary { --bs-btn-color: var(--alm-text-secondary); --bs-btn-border-color: var(--alm-control-border); --bs-btn-hover-bg: var(--alm-text-secondary); --bs-btn-hover-border-color: var(--alm-text-secondary);
  --bs-btn-hover-color: #FFFFFF; --bs-btn-active-bg: var(--alm-text); --bs-btn-active-border-color: var(--alm-text); --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: var(--alm-text-secondary); --bs-btn-disabled-border-color: var(--alm-control-border); }
.btn-outline-primary { --bs-btn-color: var(--alm-primary); --bs-btn-border-color: var(--alm-primary); --bs-btn-hover-bg: var(--alm-primary); --bs-btn-hover-border-color: var(--alm-primary); --bs-btn-hover-color: #FFFFFF;
  --bs-btn-active-bg: var(--alm-primary-pressed); --bs-btn-active-border-color: var(--alm-primary-pressed); --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: var(--alm-primary); --bs-btn-disabled-border-color: var(--alm-primary); }
.btn-outline-danger { --bs-btn-color: var(--alm-danger); --bs-btn-border-color: var(--alm-danger); --bs-btn-hover-bg: var(--alm-danger); --bs-btn-hover-border-color: var(--alm-danger); --bs-btn-hover-color: #FFFFFF;
  --bs-btn-active-bg: var(--alm-danger-hover); --bs-btn-active-border-color: var(--alm-danger-hover); --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: var(--alm-danger); --bs-btn-disabled-border-color: var(--alm-danger); }
.btn-outline-success { --bs-btn-color: var(--alm-success); --bs-btn-border-color: var(--alm-success); --bs-btn-hover-bg: var(--alm-success); --bs-btn-hover-border-color: var(--alm-success); --bs-btn-hover-color: #FFFFFF;
  --bs-btn-active-bg: #0E6A2F; --bs-btn-active-border-color: #0E6A2F; --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: var(--alm-success); --bs-btn-disabled-border-color: var(--alm-success); }
.btn-outline-warning { --bs-btn-color: var(--alm-warning-text); --bs-btn-border-color: var(--alm-warning-text); --bs-btn-hover-bg: var(--alm-warning-text); --bs-btn-hover-border-color: var(--alm-warning-text); --bs-btn-hover-color: #FFFFFF;
  --bs-btn-active-bg: #7A4F05; --bs-btn-active-border-color: #7A4F05; --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: var(--alm-warning-text); --bs-btn-disabled-border-color: var(--alm-warning-text); }
.btn-outline-dark { --bs-btn-color: var(--alm-text); --bs-btn-border-color: var(--alm-text); --bs-btn-hover-bg: var(--alm-menu); --bs-btn-hover-border-color: var(--alm-menu); --bs-btn-hover-color: #FFFFFF; }
.btn-link { --bs-btn-color: var(--alm-primary); --bs-btn-hover-color: var(--alm-primary-hover); }

/* ===== 6. Rozetler (Android durum çipi: yüzey tonu + koyu metin; renk metnin yerine geçmez, her rozette metin vardır) ===== */
.badge { --alm-badge-dot: var(--alm-text-secondary); border: 1px solid transparent; border-radius: 999px; font-weight: 600; padding: .38em .7em; line-height: 1.15; white-space: normal; overflow-wrap: normal; word-break: normal; text-align: left; }   /* sözcük içinden bölünmez (.text-break atası da dahil): esnek yerleşimde rozet tek harfe sıkışmasın */
.badge::before { content: ""; display: inline-block; width: .5em; height: .5em; margin-inline-end: .45em; border-radius: 50%; background: var(--alm-badge-dot); vertical-align: .05em; }
.text-bg-success { --alm-badge-dot: var(--alm-success); color: var(--alm-text) !important; background-color: var(--alm-success-surface) !important; border-color: var(--alm-success-edge); }
.text-bg-warning { --alm-badge-dot: var(--alm-warning); color: var(--alm-text) !important; background-color: var(--alm-warning-surface) !important; border-color: var(--alm-warning-edge); }
.text-bg-danger { --alm-badge-dot: var(--alm-danger); color: var(--alm-text) !important; background-color: var(--alm-danger-surface) !important; border-color: var(--alm-danger-edge); }
.text-bg-primary, .text-bg-info { --alm-badge-dot: var(--alm-info); color: var(--alm-text) !important; background-color: var(--alm-info-surface) !important; border-color: var(--alm-info-edge); }
.text-bg-secondary { --alm-badge-dot: var(--alm-text-secondary); color: var(--alm-text) !important; background-color: var(--alm-surface-variant) !important; border-color: var(--alm-neutral-edge); }
.text-bg-light { --alm-badge-dot: var(--alm-control-border); color: var(--alm-text) !important; background-color: var(--alm-surface) !important; border-color: var(--alm-neutral-edge); }
.text-bg-dark { --alm-badge-dot: var(--alm-menu-indicator); color: #FFFFFF !important; background-color: var(--alm-menu) !important; border-color: var(--alm-menu); }

/* ===== 7. Uyarı kutuları (Android Notice: bilgi/hata yüzeyi, her zaman koyu metin; sol çizgi anlam tonu) ===== */
.alert { --bs-alert-border-radius: var(--alm-radius-control); --bs-alert-padding-y: .75rem; --bs-alert-padding-x: 1rem; color: var(--alm-text); border-inline-start-width: 4px; }
.alert-success { --bs-alert-bg: var(--alm-success-surface); --bs-alert-color: var(--alm-text); --bs-alert-border-color: var(--alm-success-edge); border-inline-start-color: var(--alm-success); }
.alert-warning { --bs-alert-bg: var(--alm-warning-surface); --bs-alert-color: var(--alm-text); --bs-alert-border-color: var(--alm-warning-edge); border-inline-start-color: var(--alm-warning-text); }
.alert-danger { --bs-alert-bg: var(--alm-danger-surface); --bs-alert-color: var(--alm-text); --bs-alert-border-color: var(--alm-danger-edge); border-inline-start-color: var(--alm-danger); }
.alert-info, .alert-primary { --bs-alert-bg: var(--alm-info-surface); --bs-alert-color: var(--alm-text); --bs-alert-border-color: var(--alm-info-edge); border-inline-start-color: var(--alm-info); }
.alert-secondary { --bs-alert-bg: var(--alm-surface-variant); --bs-alert-color: var(--alm-text); --bs-alert-border-color: var(--alm-neutral-edge); border-inline-start-color: var(--alm-text-secondary); }
.alert .alert-link, .alert a:not(.btn) { color: var(--alm-primary); font-weight: 600; }
.alert-heading { color: inherit; }

/* ===== 8. Formlar ===== */
.form-label { font-weight: 600; color: var(--alm-text); }
.form-control, .form-select { min-height: 48px; background-color: var(--alm-surface); color: var(--alm-text); border: 1px solid var(--alm-control-border); border-radius: var(--alm-radius-control); }
.form-control-sm, .form-select-sm { min-height: 36px; }
.form-control::placeholder { color: var(--alm-text-secondary); opacity: 1; }
.form-control:focus, .form-select:focus { border-color: var(--alm-primary); box-shadow: 0 0 0 .25rem rgba(37, 99, 235, .25); }
.form-control:disabled, .form-select:disabled, .form-control[readonly] { background-color: var(--alm-surface-variant); color: var(--alm-text); opacity: 1; }
.form-check-input { border-color: var(--alm-control-border); }
.form-check-input:checked { background-color: var(--alm-primary); border-color: var(--alm-primary); }
.form-check-input:disabled ~ .form-check-label, .form-check-input[disabled] ~ .form-check-label { opacity: var(--alm-disabled-opacity); }
/* Sunucu doğrulama hatası olan alan görsel olarak da işaretlenir (WCAG 1.4.1); site.js alanı hata metnine bağlar (aria-invalid, aria-describedby). */
.form-control.input-validation-error, .form-select.input-validation-error { border-color: var(--alm-danger); border-width: 2px; }
.field-validation-error, .validation-summary-errors, .text-danger.small { color: var(--alm-danger); }
.validation-summary-errors { background: var(--alm-danger-surface); border: 1px solid var(--alm-danger-edge); border-inline-start: 4px solid var(--alm-danger); border-radius: var(--alm-radius-control); padding: .75rem 1rem; color: var(--alm-text); }
.validation-summary-errors ul { margin-bottom: 0; }
.validation-summary-valid { display: none; }
fieldset > legend { font-weight: 700; }

/* ===== 9. Tablolar ===== */
.table { --bs-table-bg: transparent; --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-border); --bs-table-hover-bg: var(--alm-table-head); --bs-table-hover-color: var(--alm-text);
  --bs-table-striped-bg: var(--alm-table-head); --bs-table-striped-color: var(--alm-text); }
.table > thead > tr > th { background: var(--alm-table-head); color: var(--alm-text); font-weight: 700; border-bottom: 2px solid var(--alm-border); }
.table-light { --bs-table-bg: var(--alm-table-head); --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-border); }
caption { color: var(--alm-text-secondary); }
/* Bağlamsal satır tonları jetonlara bağlanır (Bootstrap'in sabit pastel tonları metin/bağlantı kontrastını bozuyordu): anlam = durum tonu, metin her zaman --alm-text. */
.table-success { --bs-table-bg: var(--alm-success-surface); --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-success-edge); --bs-table-hover-bg: var(--alm-success-surface); --bs-table-hover-color: var(--alm-text); --bs-table-striped-bg: var(--alm-success-surface); }
.table-warning { --bs-table-bg: var(--alm-warning-surface); --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-warning-edge); --bs-table-hover-bg: var(--alm-warning-surface); --bs-table-hover-color: var(--alm-text); --bs-table-striped-bg: var(--alm-warning-surface); }
.table-danger { --bs-table-bg: var(--alm-danger-surface); --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-danger-edge); --bs-table-hover-bg: var(--alm-danger-surface); --bs-table-hover-color: var(--alm-text); --bs-table-striped-bg: var(--alm-danger-surface); }
.table-info, .table-primary { --bs-table-bg: var(--alm-info-surface); --bs-table-color: var(--alm-text); --bs-table-border-color: var(--alm-info-edge); --bs-table-hover-bg: var(--alm-info-surface); --bs-table-hover-color: var(--alm-text); --bs-table-striped-bg: var(--alm-info-surface); }
.list-group-item-success { background-color: var(--alm-success-surface); color: var(--alm-text); }
.list-group-item-warning { background-color: var(--alm-warning-surface); color: var(--alm-text); }
.list-group-item-danger { background-color: var(--alm-danger-surface); color: var(--alm-text); }
.list-group-item-info, .list-group-item-primary { background-color: var(--alm-info-surface); color: var(--alm-text); }
/* Kaydırılabilir tablo kutusu: içindeki .visually-hidden (position:absolute) kutuyu bağlam olarak almazsa kırpılmaz ve sayfaya yatay kaydırma ekler. */
.table-responsive { position: relative; }
/* Telefon genişliğinde satır olarak yığılan tablo: <table class="table-stack" role="table"> ve her <td data-label="Sütun adı">. Başlık satırı yalnız ekran
   okuyucuya kalır; hücreler etiketiyle alt alta gelir. Yatay kaydırma gerektiren veri giriş tabloları için (İSG yanıtları, fotoğraf yuvaları). */
@media (max-width: 767.98px) {
  .table-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
  /* Başlık satırı olmayan <th scope="row"> hücresi de satırın başlığı olarak üstte durur. */
  .table-stack tr { padding: .5rem .75rem; border-bottom: 1px solid var(--bs-border-color); }
  .table-stack tr:last-child { border-bottom: 0; }
  .table-stack td, .table-stack tbody th { border: 0; padding: .25rem 0; }
  .table-stack tbody th { display: block; width: 100%; font-weight: 700; text-align: start; }
  .table-stack td[data-label]::before { content: attr(data-label); display: block; font-size: .8rem; color: var(--bs-secondary-color); }
  .table-stack .form-control, .table-stack .form-select { width: 100%; }
}

/* ===== 10. Kartlar ve paneller, sayfa başlığı, filtre çubuğu, boş durum, sayfalama, kırıntı ===== */
.bg-white { background-color: var(--alm-surface) !important; }
.record-form { max-width: 48rem; }                                   /* tek sütunlu kayıt formları geniş ekranda alan genişliğini aşmaz */
.action-card { transition: background-color .12s ease; }
.action-card:hover, .action-card:focus-within { background: var(--alm-info-surface); }
dialog.alm-dialog { border: 1px solid var(--alm-border); border-radius: var(--alm-radius-card); padding: 1.25rem; width: min(32rem, calc(100vw - 2rem)); color: var(--alm-text); background: var(--alm-surface); }
dialog.alm-dialog::backdrop { background: var(--alm-scrim); }
.panel { background: var(--alm-surface); border: 1px solid var(--alm-border); border-radius: var(--alm-radius-card); padding: 1rem; }
.rounded { border-radius: var(--alm-radius-card) !important; }
.page-header { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: 1rem; }
.page-header > h1 { margin: 0; }
.filter-bar { background: var(--alm-surface); border: 1px solid var(--alm-border); border-radius: var(--alm-radius-card); padding: .75rem 1rem; margin-bottom: 1rem; }
.empty-state { border: 1px dashed var(--alm-control-border); border-radius: var(--alm-radius-card); padding: 1.25rem; color: var(--alm-text-secondary); text-align: center; background: var(--alm-surface); }
.pagination { --bs-pagination-color: var(--alm-primary); --bs-pagination-hover-color: var(--alm-primary-hover); --bs-pagination-hover-bg: var(--alm-info-surface); --bs-pagination-border-color: var(--alm-border);
  --bs-pagination-active-bg: var(--alm-primary); --bs-pagination-active-border-color: var(--alm-primary); --bs-pagination-active-color: var(--alm-on-primary); --bs-pagination-disabled-color: var(--alm-text-secondary);
  --bs-pagination-border-radius: var(--alm-radius-control); }
.page-link { min-height: var(--alm-touch-target); display: inline-flex; align-items: center; }
.breadcrumb { --bs-breadcrumb-divider-color: var(--alm-text-secondary); --bs-breadcrumb-item-active-color: var(--alm-text-secondary); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--alm-primary); --bs-nav-pills-link-active-color: var(--alm-on-primary); --bs-nav-link-color: var(--alm-primary); --bs-nav-link-hover-color: var(--alm-primary-hover); }
.nav-tabs { --bs-nav-tabs-link-active-color: var(--alm-text); --bs-nav-tabs-link-active-border-color: var(--alm-border) var(--alm-border) var(--alm-surface); --bs-nav-link-color: var(--alm-primary); }
.list-group { --bs-list-group-border-color: var(--alm-border); --bs-list-group-action-hover-bg: var(--alm-info-surface); --bs-list-group-active-bg: var(--alm-primary); --bs-list-group-active-border-color: var(--alm-primary); }
.progress { --bs-progress-bg: var(--alm-surface-variant); --bs-progress-bar-bg: var(--alm-primary); --bs-progress-border-radius: 999px; }

/* Zorunlu alan işareti (WCAG 3.3.2): required öznitelikli alanın etiketi * alır (yardımcı teknolojiye okunmaz; required zaten bildirilir) ve zorunlu alanı olan form bir açıklama satırı taşır. */
.form-label:has(+ :required)::after, .form-label:has(+ .form-control:required)::after { content: " *" / ""; color: var(--alm-danger); font-weight: 700; }
.record-form:has(:required)::before { content: "* ile işaretli alanlar zorunludur." / ""; display: block; margin-bottom: .75rem; font-size: .875rem; color: var(--alm-text-secondary); }

/* <meter> göstergesi jetonlarla (tarayıcı varsayılanı yeşil/sarı/kırmızıdır); değer yanında metin olarak da yazılıdır, renk tek başına anlam taşımaz. */
meter::-webkit-meter-bar { background: var(--alm-surface-variant); border: 1px solid var(--alm-neutral-edge); border-radius: 999px; height: 1rem; }
meter.meter-lg::-webkit-meter-bar { height: 1.25rem; }
meter::-webkit-meter-optimum-value { background: var(--alm-success); border-radius: 999px; }
meter::-webkit-meter-suboptimum-value { background: var(--alm-warning); border-radius: 999px; }
meter::-webkit-meter-even-less-good-value { background: var(--alm-danger); border-radius: 999px; }
meter::-moz-meter-bar { background: var(--alm-info); }

/* ===== 11. Yardımcılar ===== */
.photo-preview { background: var(--alm-preview); }
