/* ==========================================================================================================
   ISKAY ERP TEMALARI — SERVİS YÖNETİMİNE ÖZGÜ BAĞLAR (26.10.2026)
   ----------------------------------------------------------------------------------------------------------
   Kullanıcı 26.10.2026: "iskay erp deki temalarını, vhena için yaptığımız servis yazılımı tarafında da uygula".
   Temalar ERP'deki gibi dört tanedir: STANDART (servis.css'in kendisi, renk seçimli) · MODERN (AC2, varsayılan) ·
   KLASİK (Mühür) · PETEK. Tema dosyaları ELLE YAZILMAZ (.dbtools/_servis_tema_uret.mjs ERP'den kopyalar / ortak
   kaynaktan üretir): ac2-worker.css, tema-muhur.css, tema-petek.css. Bu dosya yalnız şunları bağlar:
     1. tema seçim kartları (her temada görünür; ERP admin.css "TEMA SEÇİM KARTLARI" bloğunun birebir kopyası)
     2. bu ürünün görünüm açılırı
     3. Modern: servis.css değişkenleri + giriş ekranı + bu ürüne özgü sınıflar
     4. Klasik, 5. Petek: servis.css'in ek değişkenleri (rgb üçlüsü, köşe, gölge, ızgara dokusu) + pano şeridi kabı
   Sabit renk kodları yalnız tema tanım bloklarındadır (servis.css kuralı). Yazdırmada hiçbir tema uygulanmaz.
   Geri dönüş: _YEDEK/SERVIS_YONETIMI_TEMA_20261026_oncesi/ (SHA256SUMS.txt ile).
   ========================================================================================================== */

/* ══ 1. TEMA SEÇİM KARTLARI — ERP admin.css'ten birebir (ERP_MUHASEBE K-045/K-046). Köşe 3 px: hap/oval yok (K-042). */

/* ══ TEMA SEÇİM KARTLARI — TEK TANIM (24.10.2026, ERP_MUHASEBE K-045) ═════════════════════════════
   Üst çubuk → Renk Teması menüsündeki üç kart: STANDART (ilk tasarım) · MODERN (AC2) · KLASİK (Mühür).
   Kart her temada görünür, bu yüzden tema dosyalarında değil burada durur. Örnek şeritler o temanın
   küçük bir izidir (görsel değil, CSS ile çizilir). Köşe 3 px: hap/oval yok (K-042). */
.tema-kartlari { display: flex; gap: .5rem; }
.tema-karti {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .35rem;
    padding: .4rem;
    background: transparent;
    border: 1px solid var(--border-color);
    border-radius: 3px;
    color: var(--text-main);
    font-size: .72rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .15s ease;
}
.tema-karti:hover { border-color: var(--marka); }
.tema-karti.secili { border-color: var(--marka); box-shadow: inset 0 0 0 1px var(--marka); }
.tema-karti-ornek { display: block; height: 2.1rem; border-radius: 2px; border: 1px solid rgba(0, 0, 0, .12); }
/* Standart: beyaz menü + açık gri sayfa */
.tema-karti-ornek.standart { background: linear-gradient(90deg, #ffffff 0 30%, #f1f5f9 30% 100%); }
/* Modern: ışıklı beyaz oda + kömür başlık kutusu + kırmızı seçim çubuğu */
.tema-karti-ornek.ac2 {
    background:
        linear-gradient(rgba(42, 42, 42, .94), rgba(42, 42, 42, .94)) 18% 26% / 46% 7px no-repeat,
        linear-gradient(#A61E1E, #A61E1E) 18% 70% / 62% 6px no-repeat,
        radial-gradient(ellipse 78% 62% at 55% 46%, #F7F7F7 0%, #E9E9E9 52%, #CFCFCF 100%);
}
/* Petek (K-046): buz odası + çapraz altıgen dizisi + kömür seçili hücre ve bağlantılı etiket kutusu */
.tema-karti-ornek.petek { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 34'%3E%3Crect width='80' height='34' fill='%23E4ECF0'/%3E%3Cpolygon points='4,25.4 7.98,27.7 7.98,32.3 4,34.6 0.02,32.3 0.02,27.7' fill='%236E93AB' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='13.5,22.2 17.48,24.5 17.48,29.1 13.5,31.4 9.52,29.1 9.52,24.5' fill='%23A9C2D2' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='23,19 26.98,21.3 26.98,25.9 23,28.2 19.02,25.9 19.02,21.3' fill='%236E93AB' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='32.5,15.8 36.48,18.1 36.48,22.7 32.5,25 28.52,22.7 28.52,18.1' fill='%232B3136' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='42,12.6 45.98,14.9 45.98,19.5 42,21.8 38.02,19.5 38.02,14.9' fill='%23A9C2D2' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='51.5,9.4 55.48,11.7 55.48,16.3 51.5,18.6 47.52,16.3 47.52,11.7' fill='%236E93AB' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='61,6.2 64.98,8.5 64.98,13.1 61,15.4 57.02,13.1 57.02,8.5' fill='%236E93AB' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='70.5,3 74.48,5.3 74.48,9.9 70.5,12.2 66.52,9.9 66.52,5.3' fill='%23A9C2D2' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cpolygon points='80,-0.2 83.98,2.1 83.98,6.7 80,9 76.02,6.7 76.02,2.1' fill='%236E93AB' stroke='%23FFFFFF' stroke-width='0.8'/%3E%3Cline x1='37.5' y1='23.4' x2='48' y2='27' stroke='%2353616A' stroke-width='0.7'/%3E%3Crect x='48' y='23.5' width='22' height='6' fill='%232B3136'/%3E%3Crect x='48' y='23.5' width='1.4' height='6' fill='%233B6E93'/%3E%3C/svg%3E") center / cover no-repeat; }
/* Klasik: kömür menü + belge kâğıdı + kızıl mühür çizgisi */
.tema-karti-ornek.muhur {
    background:
        linear-gradient(#9B1B23, #9B1B23) 34% 70% / 46% 2px no-repeat,
        linear-gradient(90deg, #141416 0 30%, #ECE8E0 30% 100%);
}

/* ══ 2. SEÇİM MENÜSÜ — servis yazılımının görünüm açılırı (UstBar) ══════════════════════════════════════════════════
   Dört kart yan yana sığsın diye açılır biraz genişler; kart yazısı tipografi merdiveninden gelir. */
.sy-gorunum-menu { min-width: 19rem; }
.sy-gorunum-menu .tema-kartlari { margin-bottom: .55rem; }
.sy-gorunum-menu .tema-karti { font-size: var(--ty-kucuk); line-height: var(--lh-kucuk); }

@media screen {

/* ══ 3. MODERN (AC2) — BU ÜRÜNÜN DEĞİŞKENLERİ VE SINIFLARI ═════════════════════════════════════════════════════════
   Ortak katman (ac2-worker.css) yönetim kabuğunun ERP ile ortak sınıflarına biner. Burada servis.css'in kendi
   değişkenleri (vurgu, köşe, gölge, durum renkleri, ızgara dokusu) ve yalnız bu üründe olan sınıflar bağlanır.
   Kapsam ortak katmanla AYNI: @scope (html[data-tema="ac2"]) to (.tema-disi). */
@scope (html[data-tema="ac2"]) to (.tema-disi) {

/* 3a. VURGU → AC2 KIRMIZISI. servis.css :root[data-accent] (0,2,0) rengi yazar; [data-accent] ile bir basamak yukarı.
       Gece kipinde YAZI olarak okunan ton açık (#E79A9A), dolu kutular --ac2-kirmizi (ERP ac2-erp.css bölüm 3). */
html:scope, html:scope body,
html:scope[data-accent], html:scope[data-accent] body {
    --marka: var(--ac2-kirmizi);
    --marka-hover: var(--ac2-kirmizi-koyu);
    --marka-soft: rgba(166, 30, 30, .08);
    --marka-contrast: #fff;
    --marka-rgb: 166, 30, 30;
    --ok: #336A49; --ok-bg: rgba(51, 106, 73, .10);
    --warn: #87590A; --warn-bg: rgba(184, 134, 27, .12);
    --err: #A61E1E; --err-bg: rgba(166, 30, 30, .08);
    --bilgi: #4F6B7A; --bilgi-bg: rgba(79, 107, 122, .10);
    --kose-mikro: 0; --kose-kucuk: 0; --kose: 0; --kose-buyuk: 0;
    --golge: none; --golge-orta: none; --golge-yuksek: none;
    --izgara-cizgi: transparent;
    --yazi-ailesi: var(--ac2-yazi);
    --bant-kirmizi: var(--ac2-komur); --bant-turuncu: var(--ac2-komur);
    --serit-zemin-1: #2A2A2A; --serit-zemin-2: #2A2A2A; --serit-metin: #F4F4F4; --serit-vurgu: #E79A9A;
}
html:scope[data-bs-theme="dark"], html:scope[data-bs-theme="dark"] body,
html:scope[data-accent][data-bs-theme="dark"], html:scope[data-accent][data-bs-theme="dark"] body {
    --marka: #E79A9A;
    --marka-hover: #F0B4B4;
    --marka-soft: rgba(255, 255, 255, .06);
    --marka-contrast: #1E1E1E;
    --marka-rgb: 231, 154, 154;
    --ok: #8CC7A0; --ok-bg: rgba(140, 199, 160, .10);
    --warn: #E6BC78; --warn-bg: rgba(184, 134, 27, .14);
    --err: #E79A9A; --err-bg: rgba(231, 154, 154, .10);
    --bilgi: #8FA9B6; --bilgi-bg: rgba(143, 169, 182, .10);
}
/* Dolu birincil düğme her kipte AC2 kırmızısı + beyaz yazı (gece kipindeki açık ton yazı içindir) */
html:scope[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: var(--ac2-kirmizi); --bs-btn-border-color: var(--ac2-kirmizi); --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--ac2-kirmizi-koyu); --bs-btn-hover-border-color: var(--ac2-kirmizi-koyu); --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--ac2-kirmizi-koyu); --bs-btn-active-border-color: var(--ac2-kirmizi-koyu); --bs-btn-active-color: #fff;
    --bs-btn-disabled-bg: var(--ac2-kirmizi); --bs-btn-disabled-border-color: var(--ac2-kirmizi); --bs-btn-disabled-color: #fff;
}

/* Dolu vurgu rozeti (pano kartındaki "BEKLEYEN", servis.css .badge.bg-primary = --marka zemin + --marka-contrast yazı):
   gece kipinde zemin AC2 kırmızısında kalıyor, yazı koyu tona dönüyordu — 2,24 ölçüldü. Dolu kutu her kipte kırmızı + beyaz. */
html:scope .badge.bg-primary { background-color: var(--ac2-kirmizi) !important; color: #fff !important; }
/* Gece kipinde satırın üstüne gelince satır zemini açılıyor; durum rozetinin yazısı eşiğe iniyordu ("Kapandı" 4,50 ölçüldü).
   Rozetin renk değişkenleri o satırda bir ton açılır (ERP ac2-erp.css bölüm 16c'deki tonlar). */
html:scope[data-bs-theme="dark"] .table-hover > tbody > tr:hover { --ok: #9FD3B0; --err: #F0B3B3; --warn: #EBC98A; --bilgi: #A9CBDD; --text-muted: #C2C2C2; --marka: #F0B3B3; }

/* 3a-2. MENÜNÜN ÜST SATIRLARI (Ana Sayfa, Raporlar, Posta, Giden kutusu). ERP'de menünün her satırı grup başlığıdır; bu üründe
         üst satırlar düz bağlantıdır (.sol-menu-liste > .nav-link). Ortak katman onlara grup girintisini vermediği için yazı soldan
         başlıyor, seçili satırın kırmızı kutusu ise grup girintisinden (66 px) başlıyordu: "ANA SAYFA"nın yarısı açık zeminde kaldı
         (Denetüst 26.10.2026, ENGEL). Üst satırlar grup başlığının diline bağlanır: aynı girinti, 3B levha + çizgi + boş kare, aynı
         boy. Yazı, seçili kutunun sol kenarının 8 px içinde başlar (grup başlıkları da aynı 74 px'e alınır, hizalar bozulmasın).
         Dar menüde (yalnız simge) ortak katmanın kuralı geçerli kalır. */
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link {
    display: flex; align-items: center; padding: 8px 10px 8px 74px; font-size: 14.5px; min-height: 38px;
}
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .grup-baslik { padding-left: 74px; }
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link > i.bi { display: none; }
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link::before {
    content: ""; position: absolute; left: 16px; top: 50%; width: 26px; height: 15px; margin-top: -8px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 30%),
                repeating-linear-gradient(180deg, #9A1C1C 0 2.2px, #5C0F0F 2.2px 3.4px);
    transform: perspective(70px) rotateX(16deg) rotateY(-30deg); transform-origin: 0 50%;
    filter: drop-shadow(1px 2px 1.4px rgba(0, 0, 0, .28)); opacity: .9;
}
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link::after {
    content: ""; position: absolute; left: 43px; top: 50%; width: 22px; height: 9px; margin-top: -4.5px;
    background: linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 0 50% / 13px 1px no-repeat,
                linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 13px 0 / 9px 1px no-repeat,
                linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 13px 100% / 9px 1px no-repeat,
                linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 13px 0 / 1px 9px no-repeat,
                linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 21px 0 / 1px 9px no-repeat,
                linear-gradient(rgba(255, 255, 255, .55), rgba(255, 255, 255, .55)) 13px 0 / 9px 9px no-repeat;
}
/* Renk grup başlığıyla aynı: bağlantı olduğu için gece kipinde bağlantı rengini (pembe #E4A0A0) alıyordu (Denetüst 26.10.2026) */
html:scope .sidebar .sol-menu-liste > .nav-link:not(.active) { color: var(--ac2-metin) !important; }
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link:not(.active):hover { color: var(--ac2-metin-koyu) !important; background: transparent; }
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link:is(:hover, .active)::after {
    background: linear-gradient(var(--ac2-cizgi), var(--ac2-cizgi)) 0 50% / 13px 1px no-repeat,
                linear-gradient(var(--ac2-kirmizi), var(--ac2-kirmizi)) 13px 0 / 9px 9px no-repeat;
}
html:scope .sayfa-kabugu:not(.menu-dar) .sidebar .sol-menu-liste > .nav-link.active::before { opacity: 1; height: 19px; margin-top: -10px; }

/* 3b. Seçim menüsü: AC2 tek vurgulu bir dildir, renk noktaları gizli (Standart'a dönünce görünür) */
html:scope .accent-renk-bolumu { display: none; }
html:scope .tema-karti { font-family: var(--ac2-yazi); font-weight: 400; text-transform: uppercase; letter-spacing: .04em; }

/* 3c. Pano şeridi kabı: ERP'de Özet sayfasının .container-fluid'i, burada panonun .fade-in kabı */
html:scope .fade-in:has(> .ac2-serit-kap) { position: relative; }
html:scope .fade-in:has(> .ac2-serit-kap) > :not(.ac2-serit-kap) { position: relative; z-index: 1; }

/* 3d. Yazı ağırlığı (AC2: yalnız 300/400) — ERP ac2-erp.css bölüm 7. Başlıklar ince kalır, marka logosu hariç. */
html:scope .sayfa-kabugu :not(h1, h2, h3, .h1, .h2, .h3, .modal-title, .header-avatar, .header-avatar *, .sy-alt-marka, .sy-alt-marka *, i, .bi) { font-weight: 400 !important; }

/* 3e. Üst çubuk düğmeleri: yazılı düğme sabit kareye sığmıyordu (ERP ac2-erp.css bölüm 10) */
html:scope .header-btn { width: auto; min-width: 38px; padding: 0 8px; flex: 0 0 auto; }
html:scope .ust-bar .header-btn :is(i.bi, .bi) { color: inherit !important; }
html:scope .btn i.bi { color: inherit !important; }

/* 3f. Kurum adı (üst çubuk) = yazı tavanının kaynağı (GENEL K-213): ERP'deki kurum adı biçimi */
html:scope .kurum-kimlik > span {
    font-family: var(--ac2-yazi); font-weight: 400 !important; letter-spacing: .16em; text-transform: uppercase;
    font-size: var(--ac2-tavan) !important; line-height: 1.2; color: var(--ac2-metin) !important;
}

/* Telefonda (≤ 575 px) geniş harf aralığı kurum adını kesiyordu ("VHENA İ…", Lidertas 26.10.2026); aralık daralır, ad sığar.
   Ad daha uzunsa servis.css'in kuralı geçerli: sol blok kırpılır, sağdaki düğmeler ezilmez. */
@media (max-width: 575.98px) { html:scope .kurum-kimlik > span { letter-spacing: .02em; } }
/* ≤ 400 px (360/390 telefonlar): Modern'in üst çubuk düğmeleri ERP ölçüsünde (38 px + 8 px iç boşluk) olduğu için ad alanı
   360 px'te 52 px'e iniyordu. Düğmeler servis.css'in telefon ölçüsüne (en az 32 px dokunma hedefi) ve aralık daralır. */
@media (max-width: 400px) {
    html:scope .ust-bar-sag { gap: .2rem; }
    html:scope .header-btn { min-width: 32px; padding: 0 4px; }
    html:scope .kurum-kimlik > span { letter-spacing: 0; }
}

/* 3f-2. Sayfa başlığı = kömür kutu (ortak katmanın sayfa başlığı / .ac2-baslik biçimi). Bu üründe sayfanın h1'i ya başlık
         şeridinde (pano, yeni talep), ya kartın başlığında (listeler, teklif, kurum kartı) ya da .sayfa-basligi (rapor) olarak
         durur; üçü de aynı kutuya bağlanır. Kenar boşluğu YAZILMAZ: .me-auto düğmeleri sağa iten şeydir. */
html:scope .sayfa-govdesi h1:not(.sy-gizli-baslik) {
    display: inline-flex; align-items: center;
    background: var(--ac2-komur); color: #F4F4F4 !important;
    font-family: var(--ac2-baslik-yazi); font-weight: 300 !important; font-size: 15px !important; line-height: 1;
    letter-spacing: .06em; text-transform: uppercase; padding: 10px 20px 11px 16px;
}
html:scope .sayfa-govdesi h1:not(.sy-gizli-baslik)::before { content: ""; width: 12px; height: 12px; border: 1.6px solid #F4F4F4; margin-right: 15px; flex: none; }
html:scope .sayfa-govdesi h1:not(.sy-gizli-baslik) > i.bi { display: none; }
html:scope .sayfa-govdesi h1:not(.sy-gizli-baslik) * { color: #F4F4F4 !important; }

/* 3f-3. Bu ürünün büyük sayıları yazı tavanını aşıyordu (pano/rapor kartı 22,4 ve 16,8 px, talep numarası 19,2 px; GENEL K-213).
         AC2'de sayılar başlık kutusuyla aynı boyda ve ince; eş aralıklı (monospace) yazı yok, rakamlar tablo rakamı. */
html:scope, html:scope body { --yazi-ailesi-sayi: var(--ac2-yazi); }
html:scope .sayfa-kabugu :is(.sy-pano-sayi, .sy-talep-no) { font-size: var(--ac2-tavan) !important; font-weight: 300 !important; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
/* Süs simgeleri gizli (GENEL K-228; ortak katman OKU: "süs simgeleri gizli"): pano ve rapor kartının köşesindeki soluk simge */
html:scope .sy-pano-ikon { display: none !important; }

/* 3f-4. ALT ŞERİT (.sy-alt-serit) = AC2 alt bilgi dili (ERP ac2-erp.css bölüm 4'teki .iskf-footer'ın karşılığı): dolu yarı
         saydam beyaz bant, solda kırmızı elmas, harf aralıklı. Logo büyük harfe ÇEVRİLMEZ (GENEL K-221/K-231). */
html:scope .sy-alt-serit {
    background: var(--ac2-serit-dolu) !important; border-top: 1px solid var(--ac2-kenar) !important;
    color: var(--ac2-ikincil); font-family: var(--ac2-yazi); letter-spacing: .12em;
}
html:scope .sy-alt-serit > .tek-satir { display: flex; align-items: center; }
html:scope .sy-alt-serit > .tek-satir::before { content: ""; width: 9px; height: 9px; background: var(--ac2-kirmizi); transform: rotate(45deg); margin-right: 10px; flex: none; }
html:scope .sy-alt-marka { letter-spacing: .02em; }
html:scope .sy-marka-iskay { color: #262626; }
html:scope .sy-marka-soft { color: var(--ac2-ikincil); }
html:scope[data-bs-theme="dark"] .sy-marka-iskay { color: #EDEDED; }

/* 3f-5. Saydamlıkla soldurulan yazı: menüdeki marka alt yazısı (opacity .85 → karşıtlık 4,15 ölçüldü; ERP ac2-erp.css bölüm 11) */
html:scope .marka-alt { opacity: 1; }

/* 3g. Uyarı kutuları: elmas işaret simgenin/yazının üstüne binmesin (ERP ac2-erp.css bölüm 14) */
html:scope .alert:not(#_) { padding-left: 46px !important; }
html:scope .alert > :first-child:not(button, .btn) > i.bi:first-child { display: none !important; }
html:scope .alert:is(.border-danger, .bg-danger) { box-shadow: inset 3px 0 0 var(--ac2-kirmizi) !important; }
html:scope .alert:is(.border-danger, .bg-danger)::before { background: var(--ac2-kirmizi); animation: ac2-ikaz 1.6s ease-in-out 3; }

/* 3h. Kesinti şeridinin akan alt çizgisi (App.razor satır içi stilde camgöbeği) — ERP ac2-erp.css bölüm 15 */
html:scope #components-reconnect-modal { background: var(--ac2-komur) !important; color: #F4F4F4 !important; box-shadow: inset 0 -2px 0 var(--ac2-kirmizi) !important; font-family: var(--ac2-yazi) !important; }
html:scope #components-reconnect-modal::after { background-image: linear-gradient(90deg, rgba(231, 154, 154, 0) 0%, #E79A9A 50%, rgba(231, 154, 154, 0) 100%) !important; }
html:scope .sy-serit-donen { border-color: rgba(244, 244, 244, .35); border-top-color: #E79A9A; }

/* 3i. Üstüne gelme hali (ERP ac2-erp.css bölüm 16) */
html:scope[data-bs-theme="dark"] .table-hover > tbody > tr:hover :is(.text-muted-adapt, .text-muted) { color: #C2C2C2 !important; }
html:scope[data-bs-theme="dark"] :is(.sayfa-govdesi, .modal) :is(.nav-tabs, .nav-pills) .nav-link:not(.active) { background: rgba(255, 255, 255, .06) !important; }

/* 3j. GİRİŞ EKRANI = ERP'nin AC2 girişi (ac2-erp.css bölüm 13; ERP'de de s1.noxsign.com girişinden alındı). Sayfanın kendi
       koyu tasarımı (--erp-* değişkenleri, küreler, küp işaret) açık odaya döner: solda kömür kutuda ürün adı + aralıklı alt
       başlık, sağda kutular; her kutunun solunda ince çizgiyle bağlı kırmızı 3B levha (js/ac2/ac2-giris.js). */
html:scope {
    --erp-bg-start: #E9E9E9; --erp-bg-mid: #E9E9E9; --erp-bg-end: #E9E9E9;
    --erp-primary: #A61E1E; --erp-primary-hover: #8A1818;
    --erp-card-bg: transparent; --erp-card-border: transparent;
    --erp-text-main: #2E2E2E; --erp-text-muted: #5E5E5E;
    --erp-input-bg: rgba(255, 255, 255, .72); --erp-input-border: rgba(0, 0, 0, .1); --erp-input-focus: #A61E1E;
}
html:scope .gr-kabuk { background: transparent !important; }
html:scope .login-shell :not(.spinner-border):not(.spinner-grow),
html:scope .login-shell :not(.spinner-border):not(.spinner-grow)::before,
html:scope .login-shell :not(.spinner-border):not(.spinner-grow)::after { border-radius: 0 !important; }
html:scope .login-shell * { box-shadow: none !important; text-shadow: none !important; }
html:scope .login-shell { position: relative; z-index: 1; background: transparent !important; }
html:scope :is(.bg-animation, .orb, .brand-mark) { display: none !important; }
html:scope .brand-panel::before, html:scope .brand-panel::after { display: none !important; }
html:scope .brand-panel { background: transparent !important; border-right: 0 !important; }
html:scope .brand-inner { position: relative; z-index: 3; }
html:scope .brand-name-lg {
    display: inline-block; background: var(--ac2-komur) !important; color: #F4F4F4 !important;
    font-family: var(--ac2-baslik-yazi) !important; font-weight: 300 !important; letter-spacing: .04em !important;
    padding: 16px 44px 16px 30px; -webkit-text-fill-color: #F4F4F4 !important; background-clip: border-box !important; animation: none !important;
}
html:scope .brand-name-lg * { color: #F4F4F4 !important; -webkit-text-fill-color: #F4F4F4 !important; animation: none !important; opacity: 1 !important; transform: none !important; }
html:scope .brand-tagline { color: var(--ac2-metin-koyu) !important; font-family: var(--ac2-yazi); letter-spacing: .24em !important; }
html:scope .brand-foot { color: var(--ac2-ikincil) !important; font-family: var(--ac2-yazi); }
html:scope .form-panel { background: transparent !important; position: relative; z-index: 3; }
html:scope .login-card { background: transparent !important; border: 0 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html:scope :is(.login-card, .login-card *) { color: var(--ac2-metin-koyu); }
html:scope .welcome-head :is(h2, h3, .fw-bold) { color: #2E2E2E !important; text-transform: uppercase; letter-spacing: .04em; font-weight: 400 !important; font-family: var(--ac2-baslik-yazi) !important; }
html:scope .welcome-head p { color: var(--ac2-metin) !important; }
html:scope .custom-input {
    border-radius: 0 !important; background: rgba(255, 255, 255, .72) !important; border: 1px solid rgba(0, 0, 0, .1) !important;
    color: #2E2E2E !important; font-family: var(--ac2-yazi) !important; font-size: 17px !important;
}
html:scope .custom-input::placeholder { color: #6A6A6A !important; }
html:scope .custom-input:focus { background: #FFFFFF !important; box-shadow: inset 4px 0 0 var(--ac2-kirmizi) !important; border-color: rgba(0, 0, 0, .25) !important; }
html:scope .input-icon { color: #5E5E5E !important; }
html:scope .btn-corporate {
    border-radius: 0 !important; background: var(--ac2-kirmizi) !important; border: 0 !important; color: #FFFFFF !important;
    text-transform: uppercase; letter-spacing: .2em !important; font-weight: 400 !important; font-family: var(--ac2-yazi) !important;
}
html:scope .btn-corporate * { color: #FFFFFF !important; }
html:scope .btn-corporate:hover:not(:disabled) { background: var(--ac2-kirmizi-koyu) !important; transform: none !important; }
html:scope .btn-corporate:disabled { background: #8A8A8A !important; }
html:scope :is(.footer-info, .footer-info *) { color: var(--ac2-ikincil) !important; font-family: var(--ac2-yazi); }
/* hata iletisi = AC2 uyarı şeridi: beyaz zemin, kırmızı sol çizgi + elmas (3 kez yanıp söner, hareket azaltmada sabit) */
html:scope .error-msg {
    position: relative; background: rgba(255, 255, 255, .85) !important; color: var(--ac2-metin-koyu) !important; border: 0 !important;
    border-left: 3px solid var(--ac2-kirmizi) !important; padding: 12px 16px 12px 40px !important;
}
html:scope .error-msg::before {
    content: ""; position: absolute; left: 16px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px;
    background: var(--ac2-kirmizi); transform: rotate(45deg); animation: ac2-ikaz 1.6s ease-in-out 3;
}
html:scope .error-msg > i.bi { display: none; }
/* 3B katman (js/ac2/ac2-giris.js): ekranın tamamı, içeriğin ARKASINDA, tıklamayı geçirir */
html:scope .ac2-giris-katman { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
html:scope .ac2-giris-katman :is(canvas, svg) { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
html:scope .ac2-giris-katman #ac2g-uzak { filter: blur(2.4px); opacity: .82; }

} /* @scope Modern */

@media (max-width: 900px) {
    @scope (html[data-tema="ac2"]) to (.tema-disi) {
        html:scope .login-card { background: rgba(255, 255, 255, .62) !important; border: 1px solid rgba(0, 0, 0, .06) !important; }
        html:scope .ac2-giris-katman { display: none; }
    }
}

/* ══ 4. KLASİK (Mühür) — BU ÜRÜNÜN DEĞİŞKENLERİ ═════════════════════════════════════════════════════════════════════
   tema-muhur.css --marka, durum renkleri ve zeminleri yazar; burada servis.css'in ek değişkenleri bağlanır:
   --marka-rgb (odak halkası ve Bootstrap köprüsü), köşe (keskin), gölge (bulanık gölge yok), ızgara dokusu, bilgi tonu. */
:root[data-accent="muhur"] {
    --marka-rgb: 155, 27, 35;
    --kose-mikro: 0; --kose-kucuk: 0; --kose: 0; --kose-buyuk: 0;
    --golge: var(--m-golge); --golge-orta: var(--m-golge); --golge-yuksek: var(--m-yuzen-golge);
    --izgara-cizgi: transparent;
    --bilgi: var(--m-bilgi-yazi); --bilgi-bg: rgba(47, 110, 115, .10);
    --yazi-ailesi: var(--m-govde-yazi);
}
:root[data-accent="muhur"][data-bs-theme="dark"] {
    --marka-rgb: 227, 91, 98;
    --bilgi: #8CC3C7; --bilgi-bg: rgba(140, 195, 199, .10);
}
/* 4a. Büyük sayılar (pano/rapor kartı, talep numarası) yazı tavanında (GENEL K-213; tema-muhur.css --m-tavan) */
:root[data-accent="muhur"] .sayfa-kabugu :is(.sy-pano-sayi, .sy-talep-no) { font-size: var(--m-tavan) !important; }
/* 4b. Alt şerit: Standart'ta menü rengini (--bg-sidebar) alıyor → Klasik'te kömür zeminde koyu yazı (1,08 / 2,53 ölçüldü).
       ERP Klasik'teki alt bilgiyle aynı: belge kâğıdı şeridi + üstte çift çizgi, önde kızıl elmas. Logo büyük harfe çevrilmez. */
:root[data-accent="muhur"] .sy-alt-serit { background: var(--bg-header); border-top: 3px double var(--m-cizgi-guclu); color: var(--text-muted); }
:root[data-accent="muhur"] .sy-alt-serit > .tek-satir { display: flex; align-items: center; }
:root[data-accent="muhur"] .sy-alt-serit > .tek-satir::before { content: ""; width: .42rem; height: .42rem; background: var(--marka); transform: rotate(45deg); margin-right: .5rem; flex: none; }
:root[data-accent="muhur"][data-bs-theme] .sy-marka-iskay { color: var(--text-main); }
:root[data-accent="muhur"][data-bs-theme] .sy-marka-soft { color: var(--text-muted); }
/* 4e. Dolu vurgu rozeti ("BEKLEYEN"): gece kipinde --marka açık kızıla dönüyor, açık yazıyla 3,31 ölçüldü. Dolu kutu her kipte
       koyu kızıl dolgu + açık yazı (tema-muhur.css'in düğme dolgusu). */
:root[data-accent="muhur"] .badge.bg-primary { background-color: var(--m-kirmizi-dolgu) !important; color: #FFF9F2 !important; }
/* 4f. Gece kipinde seçili süzgeç çipinin sayı rozeti: servis.css beyaz örtü (.25) veriyor, açık kızıl zemini daha da açıp yazıyı
       4,30'a indiriyordu (kullanıcılar ekranı, 26.10.2026). Örtü koyulaşır. */
:root[data-accent="muhur"][data-bs-theme="dark"] .secim-cipi.secili .badge { background-color: rgba(0, 0, 0, .28); }
/* 4d. Bu ürünün yuvarlak işaret noktaları (durum rozetinin noktası, zaman çizelgesi, şerit açıklaması) keskin kare (K-042:
       ışıklı nokta / oval yok; Modern'de ortak katman zaten kareye çeviriyor). Sözde öğe sayfa taramasında görünmez, ayrıca bakıldı. */
:root[data-accent="muhur"] .sayfa-kabugu .sy-durum::before,
:root[data-accent="muhur"] .sayfa-kabugu :is(.sy-cizelge-nokta, .sy-serit-nokta, .badge-dot) { border-radius: 0; }
/* 4c. Kesinti şeridinin yükleniyor halkası (tema-muhur.css bölüm 19'daki .yukleniyor-animasyonu'nun bu üründeki adı) */
:root[data-accent="muhur"]:not([data-tema="ac2"]) #components-reconnect-modal .sy-serit-donen { border-color: rgba(255, 255, 255, .25); border-top-color: #FFB4AC; }

/* ══ 5. PETEK — BU ÜRÜNÜN DEĞİŞKENLERİ ═════════════════════════════════════════════════════════════════════════════
   Köşe en çok 2 px (tema-petek.css K-042 yorumu), gölge keskin. */
:root[data-accent="petek"] {
    --marka-rgb: 47, 97, 136;
    --kose-mikro: 1px; --kose-kucuk: 2px; --kose: 2px; --kose-buyuk: 2px;
    --golge: var(--p-golge); --golge-orta: var(--p-golge); --golge-yuksek: var(--p-yuzen-golge);
    --izgara-cizgi: transparent;
    --bilgi: var(--p-bilgi-yazi); --bilgi-bg: rgba(47, 97, 136, .10);
    --yazi-ailesi: var(--p-govde-yazi);
}
:root[data-accent="petek"][data-bs-theme="dark"] {
    --marka-rgb: 134, 182, 218;
    --bilgi: #9CC3DE; --bilgi-bg: rgba(156, 195, 222, .10);
}
/* 5a. Büyük sayılar yazı tavanında (GENEL K-213; tema-petek.css --p-tavan) */
:root[data-accent="petek"] .sayfa-kabugu :is(.sy-pano-sayi, .sy-talep-no) { font-size: var(--p-tavan) !important; }
/* 5b. Alt şerit = ERP Petek'teki alt bilgi: yarı saydam beyaz bant, önde boş altıgen uç işareti */
:root[data-accent="petek"] .sy-alt-serit { background: rgba(243, 246, 248, .86); border-top: 1px solid var(--p-cizgi); color: var(--text-muted); }
:root[data-accent="petek"][data-bs-theme="dark"] .sy-alt-serit { background: rgba(22, 29, 34, .92); }
:root[data-accent="petek"] .sy-alt-serit > .tek-satir { display: flex; align-items: center; }
:root[data-accent="petek"] .sy-alt-serit > .tek-satir::before { content: ""; width: 10px; height: 11px; background: var(--p-uc) center / 10px 11px no-repeat; margin-right: .55rem; flex: none; }
:root[data-accent="petek"][data-bs-theme] .sy-marka-iskay { color: var(--text-main); }
:root[data-accent="petek"][data-bs-theme] .sy-marka-soft { color: var(--text-muted); }
/* 5d. Yuvarlak işaret noktaları keskin (K-042; köşe en çok 2 px) */
:root[data-accent="petek"] .sayfa-kabugu .sy-durum::before,
:root[data-accent="petek"] .sayfa-kabugu :is(.sy-cizelge-nokta, .sy-serit-nokta, .badge-dot) { border-radius: 1px; }
/* 5e. Üst çubuğun altındaki "eşitleme ışığı" (tema-petek.css .ust-bar::after, 9 sn'de bir akar) çubuğun sağından dışarı kayıp
       belgeyi yatay taşırıyordu (1440 px'te 1837/1440 ölçüldü, 26.10.2026). Işık çubuğun içinde kırpılır; yalnız YATAY eksen —
       açılır menüler aşağı doğru taştığı için dikey eksen görünür kalır. */
:root[data-accent="petek"] .ust-bar { overflow-x: clip; }
/* 5f. (Klasik + Petek) 360 px'te kurum adı 5 px kesiliyordu: telefonda üst çubuk araçlarının aralığı daralır. */
@media (max-width: 400px) { :root:is([data-accent="muhur"], [data-accent="petek"]) .ust-bar-sag { gap: .25rem; } }
/* 5c. Kesinti şeridinin yükleniyor halkası (tema-petek.css bölüm 19) */
:root[data-accent="petek"]:not([data-tema="ac2"]) #components-reconnect-modal .sy-serit-donen { border-color: rgba(255, 255, 255, .25); border-top-color: #86B6DA; }
/* Pano petek şeridi kabı (tema-petek.css bölüm 20'nin bu üründeki karşılığı: ERP'de .container-fluid, burada .fade-in) */
:root[data-accent="petek"] .fade-in:has(> .ac2-serit-kap) { position: relative; padding-top: 104px; }
:root[data-accent="petek"] .fade-in:has(> .ac2-serit-kap) > :not(.ac2-serit-kap) { position: relative; z-index: 1; }
:root[data-accent="petek"] .ac2-serit-kap { position: absolute; left: 0; right: 0; top: 0; height: 100px; z-index: 0; pointer-events: none; }
:root[data-accent="petek"] .ac2-serit-kap > canvas:not(.petek-tuval) { display: none; }
:root[data-accent="petek"] .ac2-serit-kap > .petek-tuval { position: absolute; inset: 0; width: 100%; height: 100%; }
@media (max-width: 768px) {
    :root[data-accent="petek"] .fade-in:has(> .ac2-serit-kap) { padding-top: 78px; }
    :root[data-accent="petek"] .ac2-serit-kap { height: 74px; }
}

} /* @media screen — yazdırmada tema uygulanmaz (teklif çıktısı dört temada aynı) */