:root{ /* --------------------------------------------------------------- RENK TEMASI Tum marka renkleri asagidaki degiskenlerden turer. Tema secimi ile yapilir (varsayilan: bordo). Yeni tema eklemek icin sadece bir [data-color-theme=...] blogu yazin; bilesen kurallarina dokunmayin. --------------------------------------------------------------- */ --brand:#7b1e3a; /* ana renk */ --brand-dark:#5c1129; /* hover / aktif */ --brand-light:#a8375a; /* acik ton (aktif menu) */ --brand-soft:#fdf2f5; /* cok acik zemin (uyari kutusu) */ --brand-tint:#f6e7ec; /* tablo basligi / satir vurgusu */ --brand-ink:#5c1129; /* marka renginde koyu metin */ --brand-ink-2:#3f0c1e; /* kart basligi */ --brand-line:#e6ccd5; /* ince cizgiler */ --brand-rgb:123,30,58; /* Sol menu */ --sb-a:#4a1226; --sb-b:#2c0a16; /* acik modda gradyan */ --sb-a-dark:#3a0e1e; --sb-b-dark:#1d0710; /* koyu modda gradyan */ --sb-text:#e3cdd5; --sb-link:#e0c6ce; --sb-muted:#b98a99; /* Koyu modda marka tonlu yuzeyler */ --surf-dark:#2a1119; --surf-dark-line:#3a1622; --ink-dark:#f0d6de; /* Giris ekrani arka plani */ --auth-a:#7b1e3a; --auth-b:#3d0d1e; --sidebar-w:260px; /* Bootstrap birincil rengi de temaya baglanir */ --bs-primary:var(--brand); --bs-primary-rgb:var(--brand-rgb); --bs-link-color:var(--brand); --bs-link-color-rgb:var(--brand-rgb); --bs-link-hover-color:var(--brand-dark); --bs-link-hover-color-rgb:var(--brand-rgb); } /* ==== Renk temalari (uretilmis; her tema ayni degisken setini tanimlar) ==== */ /* ---- Gün Batımı ---- */ [data-color-theme=gunbatimi]{--brand:#c2410c; --brand-dark:#923109; --brand-light:#cd6338; --brand-soft:#fbf4f0; --brand-tint:#f8e8e2; --brand-ink:#923109; --brand-ink-2:#6b2407; --brand-line:#f0d1c5; --brand-rgb:194,65,12; --sb-a:#6f290c; --sb-b:#411909; --sb-a-dark:#59210a; --sb-b-dark:#2e1207; --sb-text:#f3d9ce; --sb-link:#f0d1c5; --sb-muted:#df9c81; --surf-dark:#3c190a; --surf-dark-line:#4d200d; --ink-dark:#f4ddd3; --auth-a:#c2410c; --auth-b:#571d05} /* ---- Kahve Altın ---- */ [data-color-theme=altin]{--brand:#8a5a14; --brand-dark:#68440f; --brand-light:#9f783e; --brand-soft:#f8f5f1; --brand-tint:#f1ebe3; --brand-ink:#68440f; --brand-ink-2:#4c320b; --brand-line:#e3d7c7; --brand-rgb:138,90,20; --sb-a:#4f3510; --sb-b:#2f1f0a; --sb-a-dark:#3f2b0d; --sb-b-dark:#221707; --sb-text:#e8ded0; --sb-link:#e3d7c7; --sb-muted:#c2a985; --surf-dark:#2b1e0b; --surf-dark-line:#38270e; --ink-dark:#eae1d5; --auth-a:#8a5a14; --auth-b:#3e2809} /* ---- Zeytin ---- */ [data-color-theme=zeytin]{--brand:#4d6b2f; --brand-dark:#3a5023; --brand-light:#6d8654; --brand-soft:#f4f6f3; --brand-tint:#eaede6; --brand-ink:#3a5023; --brand-ink-2:#2a3b1a; --brand-line:#d4dbcd; --brand-rgb:77,107,47; --sb-a:#2e3e1e; --sb-b:#1c2513; --sb-a-dark:#253218; --sb-b-dark:#141b0d; --sb-text:#dbe1d5; --sb-link:#d4dbcd; --sb-muted:#a2b293; --surf-dark:#1a2212; --surf-dark-line:#222c18; --ink-dark:#dfe4da; --auth-a:#4d6b2f; --auth-b:#233015} /* ---- Zümrüt ---- */ [data-color-theme=zumrut]{--brand:#1f7a4d; --brand-dark:#175c3a; --brand-light:#47926d; --brand-soft:#f2f7f4; --brand-tint:#e4efea; --brand-ink:#175c3a; --brand-ink-2:#11432a; --brand-line:#c9dfd4; --brand-rgb:31,122,77; --sb-a:#16462e; --sb-b:#0d2a1c; --sb-a-dark:#113925; --sb-b-dark:#0a1e14; --sb-text:#d2e4db; --sb-link:#c9dfd4; --sb-muted:#8bbaa2; --surf-dark:#0e261a; --surf-dark-line:#123222; --ink-dark:#d7e7df; --auth-a:#1f7a4d; --auth-b:#0e3723} /* ---- Camgöbeği ---- */ [data-color-theme=camgobegi]{--brand:#0f766e; --brand-dark:#0b5852; --brand-light:#3a8f88; --brand-soft:#f1f7f6; --brand-tint:#e2efee; --brand-ink:#0b5852; --brand-ink-2:#08413c; --brand-line:#c5dedc; --brand-rgb:15,118,110; --sb-a:#0c443f; --sb-b:#082726; --sb-a-dark:#0a3633; --sb-b-dark:#061d1b; --sb-text:#cfe4e2; --sb-link:#c5dedc; --sb-muted:#82b8b4; --surf-dark:#082422; --surf-dark-line:#0c302c; --ink-dark:#d4e6e5; --auth-a:#0f766e; --auth-b:#073531} /* ---- Okyanus ---- */ [data-color-theme=okyanus]{--brand:#0e5a8a; --brand-dark:#0a4468; --brand-light:#39789f; --brand-soft:#f1f5f8; --brand-tint:#e2ebf1; --brand-ink:#0a4468; --brand-ink-2:#08324c; --brand-line:#c5d7e3; --brand-rgb:14,90,138; --sb-a:#0c354f; --sb-b:#081f2f; --sb-a-dark:#0a2a3f; --sb-b-dark:#061722; --sb-text:#cfdee8; --sb-link:#c5d7e3; --sb-muted:#82a9c2; --surf-dark:#091e2b; --surf-dark-line:#0b2738; --ink-dark:#d4e1ea; --auth-a:#0e5a8a; --auth-b:#06283e} /* ---- Lacivert ---- */ [data-color-theme=lacivert]{--brand:#1e3a7b; --brand-dark:#162c5c; --brand-light:#465d93; --brand-soft:#f2f3f7; --brand-tint:#e4e7ef; --brand-ink:#162c5c; --brand-ink-2:#102044; --brand-line:#c9d0df; --brand-rgb:30,58,123; --sb-a:#152447; --sb-b:#0d162a; --sb-a-dark:#101d39; --sb-b-dark:#0a101e; --sb-text:#d2d8e5; --sb-link:#c9d0df; --sb-muted:#8a99ba; --surf-dark:#0d1527; --surf-dark-line:#111c32; --ink-dark:#d6dce7; --auth-a:#1e3a7b; --auth-b:#0e1a37} /* ---- Gece ---- */ [data-color-theme=gece]{--brand:#312e81; --brand-dark:#252261; --brand-light:#565498; --brand-soft:#f3f2f7; --brand-tint:#e6e6f0; --brand-ink:#252261; --brand-ink-2:#1b1947; --brand-line:#cecde1; --brand-rgb:49,46,129; --sb-a:#1f1e4b; --sb-b:#14132c; --sb-a-dark:#1a183c; --sb-b-dark:#0e0e20; --sb-text:#d6d5e6; --sb-link:#cecde1; --sb-muted:#9492bd; --surf-dark:#141329; --surf-dark-line:#191835; --ink-dark:#dad9e8; --auth-a:#312e81; --auth-b:#16153a} /* ---- Mor ---- */ [data-color-theme=mor]{--brand:#5b2a86; --brand-dark:#442064; --brand-light:#79509c; --brand-soft:#f5f2f8; --brand-tint:#ebe5f0; --brand-ink:#442064; --brand-ink-2:#32174a; --brand-line:#d8cce2; --brand-rgb:91,42,134; --sb-a:#371c4d; --sb-b:#21112e; --sb-a-dark:#2c163e; --sb-b-dark:#180d21; --sb-text:#ded4e7; --sb-link:#d8cce2; --sb-muted:#aa90c0; --surf-dark:#1f112b; --surf-dark-line:#281637; --ink-dark:#e1d9e9; --auth-a:#5b2a86; --auth-b:#29133c} /* ---- Fuşya ---- */ [data-color-theme=fusya]{--brand:#a21caf; --brand-dark:#7a1583; --brand-light:#b345bd; --brand-soft:#f9f1fa; --brand-tint:#f4e4f5; --brand-ink:#7a1583; --brand-ink-2:#590f60; --brand-line:#e9c9ec; --brand-rgb:162,28,175; --sb-a:#5d1565; --sb-b:#370e3b; --sb-a-dark:#4b1150; --sb-b-dark:#280a2b; --sb-text:#ecd2ef; --sb-link:#e9c9ec; --sb-muted:#cf89d5; --surf-dark:#330f37; --surf-dark-line:#421246; --ink-dark:#eed6f1; --auth-a:#a21caf; --auth-b:#490d4f} /* ---- Antrasit ---- */ [data-color-theme=antrasit]{--brand:#374151; --brand-dark:#29313d; --brand-light:#5b6370; --brand-soft:#f3f4f5; --brand-tint:#e7e8ea; --brand-ink:#29313d; --brand-ink-2:#1e242d; --brand-line:#cfd1d5; --brand-rgb:55,65,81; --sb-a:#222730; --sb-b:#15171c; --sb-a-dark:#1b1f26; --sb-b-dark:#0f1114; --sb-text:#d7d9dc; --sb-link:#cfd1d5; --sb-muted:#979ca5; --surf-dark:#14161b; --surf-dark-line:#191d23; --ink-dark:#dbdde0; --auth-a:#374151; --auth-b:#191d24} *{box-sizing:border-box} body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;margin:0} .btn-primary{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand-dark);--bs-btn-hover-border-color:var(--brand-dark);--bs-btn-active-bg:var(--brand-dark)} a{text-decoration:none} .text-brand{color:var(--brand)!important} .bg-brand{background:var(--brand)!important;color:#fff} /* ---------- Auth ---------- */ .auth-body{min-height:100vh;display:flex;align-items:center;justify-content:center; background:linear-gradient(135deg,var(--auth-a) 0%,var(--auth-b) 100%)} .auth-container{width:100%;max-width:420px;padding:20px} .auth-card{background:#fff;border-radius:16px;padding:36px 32px;box-shadow:0 20px 60px rgba(0,0,0,.25)} .auth-brand{text-align:center;margin-bottom:24px} .auth-brand i{font-size:44px;color:var(--brand)} .auth-brand h1{font-size:24px;font-weight:700;margin:10px 0 2px} .auth-brand p{color:#888;margin:0;font-size:14px} .auth-demo{text-align:center;margin-top:18px;padding-top:16px;border-top:1px solid #eee} /* ---------- Layout ---------- */ .app-wrapper{display:flex;min-height:100vh} .sidebar{width:var(--sidebar-w);background:linear-gradient(180deg,var(--sb-a) 0%,var(--sb-b) 100%);color:var(--sb-text);position:fixed;top:0;left:0;bottom:0; display:flex;flex-direction:column;transition:transform .25s;z-index:1040} [data-bs-theme=dark] .sidebar{background:linear-gradient(180deg,var(--sb-a-dark) 0%,var(--sb-b-dark) 100%)} .sidebar-brand{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 16px;font-weight:700;color:#fff;font-size:17px; border-bottom:1px solid rgba(255,255,255,.10);min-height:104px} .sidebar-brand i{color:var(--brand);font-size:22px} /* Koyu menüde siyah yazılı logoların net görünmesi için beyaz zemin */ .sidebar-logo{height:76px;max-width:220px;width:auto;object-fit:contain; background:#fff;padding:10px 16px;border-radius:14px;box-shadow:0 4px 14px rgba(0,0,0,.28)} /* Logo ana sayfa bağlantısıdır; tıklanabilir olduğu belli olsun */ .sidebar-brand-link{display:inline-flex;line-height:0;border-radius:14px; transition:transform .15s ease,box-shadow .15s ease} .sidebar-brand-link:hover .sidebar-logo{box-shadow:0 6px 20px rgba(0,0,0,.38)} .sidebar-brand-link:hover{transform:translateY(-1px)} .sidebar-brand-link:focus-visible{outline:2px solid #fff;outline-offset:3px} .sidebar-nav{flex:1;overflow-y:auto;padding:12px 10px} .sidebar-nav .nav-link{display:flex;align-items:center;gap:12px;color:var(--sb-link);padding:11px 14px;border-radius:8px;margin-bottom:2px;font-size:14.5px} .sidebar-nav .nav-link i{width:20px;text-align:center;font-size:16px} .sidebar-nav .nav-link:hover{background:rgba(255,255,255,.10);color:#fff} .sidebar-nav .nav-link.active{background:var(--brand-light);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.25)} /* Açılır "Ayarlar" grubu */ .sidebar-nav .nav-parent{cursor:pointer} .sidebar-nav .nav-parent .caret{font-size:11px;transition:transform .2s} .sidebar-nav .nav-parent[aria-expanded="true"] .caret{transform:rotate(180deg)} .sidebar-nav .nav-parent.active-parent{color:#fff;background:rgba(255,255,255,.05)} .sidebar-nav .nav-sub{padding-left:40px;font-size:13.5px} .sidebar-nav .nav-sub i{font-size:14px} .sidebar-footer{padding:12px 20px;border-top:1px solid rgba(255,255,255,.10);color:var(--sb-muted);font-size:12px; display:flex;align-items:center;justify-content:space-between;gap:10px} .sidebar-hide{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06); color:var(--sb-link);border-radius:8px;padding:5px 10px;font-size:12px;cursor:pointer;transition:background .15s} .sidebar-hide:hover{background:rgba(255,255,255,.14);color:#fff} /* ---------- Daraltılmış menü (html.sb-hidden): yalnızca ikonlar ---------- Masaüstünde "Menüyü gizle" menüyü tamamen kaldırmaz; 72px'lik bir ikon rayına indirger. Yazılar gizlenir, ikonlar ortalanır, title ile ipucu verilir. Tercih localStorage'da tutulur ve sayfa çizilmeden önce uygulanır. */ :root{--sidebar-w-mini:72px} .sidebar{transition:width .22s ease} .main-content{transition:margin-left .22s ease} .sidebar-nav .nav-link>span,.sidebar-brand-link{transition:opacity .15s} @media(min-width:992px){ html.sb-hidden .sidebar{width:var(--sidebar-w-mini);overflow:hidden} html.sb-hidden .main-content{margin-left:var(--sidebar-w-mini)} /* logo: küçük */ html.sb-hidden .sidebar-brand{padding:12px 8px;min-height:auto} html.sb-hidden .sidebar-logo{height:44px;max-width:56px;padding:6px 8px;border-radius:10px} /* menü öğeleri: ikon kare */ html.sb-hidden .sidebar-nav{padding:10px 8px} html.sb-hidden .sidebar-nav .nav-link{justify-content:center;padding:12px 0;margin-bottom:6px;border-radius:12px} html.sb-hidden .sidebar-nav .nav-link>span, html.sb-hidden .sidebar-nav .nav-link .caret{display:none} html.sb-hidden .sidebar-nav .nav-link i{width:auto;font-size:18px} html.sb-hidden .sidebar-nav .nav-link .badge{position:absolute;top:4px;right:6px;font-size:9px;padding:2px 5px} html.sb-hidden .sidebar-nav .nav-link{position:relative} html.sb-hidden .sidebar-nav .nav-link.active{background:#e6c46a;color:#3b2a00;box-shadow:0 2px 10px rgba(0,0,0,.3)} /* Ayarlar alt öğeleri rayda gizli; dişliye tıklayınca menü genişler ve grup açılır */ html.sb-hidden .sidebar-nav #settingsMenu{display:none!important} html.sb-hidden .sidebar-nav .nav-parent{border-top:1px solid rgba(255,255,255,.12);border-radius:0;margin-top:6px;padding-top:14px} html.sb-hidden .sidebar-nav .nav-parent.active-parent{background:#e6c46a;color:#3b2a00;border-radius:12px;border-top:0;margin-top:6px;padding-top:12px} /* alt: yalnızca » butonu */ html.sb-hidden .sidebar-footer{justify-content:center;padding:10px 8px} html.sb-hidden .sidebar-footer small{display:none} html.sb-hidden .sidebar-hide{padding:8px 10px;border-radius:10px} html.sb-hidden .sidebar-hide span{display:none} html.sb-hidden .sidebar-hide i{transform:rotate(180deg)} } .main-content{flex:1;margin-left:var(--sidebar-w);min-width:0;display:flex;flex-direction:column} .topbar{height:62px;background:#fff;border-bottom:2px solid var(--brand-tint);display:flex;align-items:center;gap:14px;padding:0 20px;position:sticky;top:0;z-index:1020} [data-bs-theme=dark] .topbar{background:#1a1f2b;border-color:#2b3240} .page-title{font-size:18px;font-weight:600;margin:0;flex:1} .topbar-right{display:flex;align-items:center;gap:8px} .aj-btn{background:#5a1224;color:#f1c96b;font-weight:700;letter-spacing:.04em;border-radius:9px;padding:7px 14px;border:1px solid #7b1e3a;white-space:nowrap} .aj-btn:hover,.aj-btn:focus{background:#7b1e3a;color:#ffe08a} @media (max-width:576px){.aj-btn span,.aj-btn{padding:7px 10px}} .btn-icon{width:38px;height:38px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;background:transparent;color:inherit} .btn-icon:hover{background:rgba(0,0,0,.05)} [data-bs-theme=dark] .btn-icon:hover{background:rgba(255,255,255,.08)} .notif-badge{position:absolute;top:2px;right:2px;font-size:9px;padding:2px 5px;border-radius:10px} .notif-dropdown{width:300px;max-height:380px;overflow-y:auto} .user-btn{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:inherit} .avatar{width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600} .user-meta{display:flex;flex-direction:column;line-height:1.1;text-align:left} .user-meta small{color:#8a909c;font-size:11px} .content{padding:22px;flex:1} /* ---------- Cards / stats ---------- */ .stat-card{border:0;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.05)} .stat-card .card-body{display:flex;align-items:center;gap:16px;padding:18px 20px} .stat-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;flex-shrink:0} .stat-value{font-size:26px;font-weight:700;line-height:1} .stat-label{color:#8a909c;font-size:13px;margin-top:3px} .card{border-radius:14px} /* ---------- Barcode scan ---------- */ /* overflow:hidden KULLANILMAZ: oneri listesi (position:absolute) kartin disina tasar; kesilirse yalnizca 1-2 satir gorunur. Ust serit kendi koseleriyle yuvarlatilir. */ .scan-box{position:relative;background:#fff;border-radius:16px;padding:22px 22px 18px; box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid var(--bs-border-color)} .scan-box::before{content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:4px; border-radius:16px 16px 0 0; background:linear-gradient(90deg,var(--brand) 0%,var(--brand-light) 100%)} /* Oneri listesi her zaman kartlarin ve alt icerigin ustunde */ #psResults,#nameResults{z-index:1060!important} .scan-box h5{font-weight:700} /* Okutma alanı: ikon + kutu + kamera tek satırda */ .scan-field{display:flex;align-items:stretch;border:2px solid var(--brand-line);border-radius:14px; background:var(--bs-body-bg);transition:border-color .15s,box-shadow .15s} .scan-field:focus-within{border-color:var(--brand);box-shadow:0 0 0 4px rgba(var(--brand-rgb),.12)} .scan-field .scan-ico{display:flex;align-items:center;padding:0 14px 0 16px;color:var(--brand);font-size:20px} .scan-field .scan-input{flex:1;border:0!important;box-shadow:none!important;background:transparent; font-size:19px;padding:14px 4px;text-align:left;letter-spacing:.2px} .scan-field .scan-input::placeholder{color:#98a2b3;letter-spacing:0} .scan-field .scan-cam{border:0;background:transparent;color:#667085;padding:0 14px;font-size:18px; border-left:1px solid var(--brand-line);border-radius:0 12px 12px 0} .scan-field .scan-cam:hover{color:var(--brand);background:var(--brand-soft)} .scan-field .scan-cam.active{color:#fff;background:var(--brand)} [data-bs-theme=dark] .scan-field{border-color:var(--surf-dark-line)} [data-bs-theme=dark] .scan-field .scan-cam{border-left-color:var(--surf-dark-line)} [data-bs-theme=dark] .scan-field .scan-cam:hover{background:var(--surf-dark)} /* Adet + ses: tek satır */ .scan-ctrls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap} .scan-ctrls .qty{display:inline-flex;align-items:center;gap:8px} .scan-ctrls .qty .form-label{margin:0;font-size:12px;font-weight:600;color:#667085;text-transform:uppercase;letter-spacing:.05em} .scan-ctrls .qty .input-group{width:150px} .scan-ctrls .qty .form-control{font-weight:700;font-size:16px} .scan-ctrls .form-switch{padding:6px 12px 6px 44px;border:1px solid var(--bs-border-color);border-radius:999px;margin:0} .scan-ctrls .form-switch .form-check-input{margin-left:-32px;margin-top:.15em} .scan-ctrls .form-switch .form-check-label{font-size:13.5px} /* Özet kutucukları */ .sum-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:6px} .sum-tile{border:1px solid var(--bs-border-color);border-radius:12px;padding:12px 14px;background:var(--bs-body-bg)} .sum-tile .lbl{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#98a2b3} .sum-tile .val{font-size:24px;font-weight:700;line-height:1.15;margin-top:2px;font-variant-numeric:tabular-nums} .sum-tile.brand .val{color:var(--brand)} .sum-tile.pos .val{color:#198754} .sum-tile.neg .val{color:#dc3545} .sum-actions{display:flex;flex-direction:column;gap:8px;margin-top:14px} [data-bs-theme=dark] .scan-box,[data-bs-theme=dark] .stat-card,[data-bs-theme=dark] .card,[data-bs-theme=dark] .topbar{background:#1a1f2b} .scan-input{font-size:22px;padding:16px;text-align:center;letter-spacing:1px;border:2px dashed var(--brand)} .scan-product{display:flex;gap:18px;align-items:center;padding:16px;border-radius:12px;background:var(--brand-soft)} [data-bs-theme=dark] .scan-product{background:var(--surf-dark)} .scan-product img,.scan-product .noimg{width:90px;height:90px;object-fit:cover;border-radius:10px;background:#eee;display:flex;align-items:center;justify-content:center;color:#aaa;font-size:28px} .diff-pos{color:#198754;font-weight:700} .diff-neg{color:#dc3545;font-weight:700} .diff-zero{color:#6c757d;font-weight:700} /* ---------- Responsive ---------- */ @media(max-width:991px){ .sidebar{transform:translateX(-100%)} .sidebar.open{transform:translateX(0)} .main-content{margin-left:0} } .table-responsive{border-radius:12px} /* ---------- Bordo tema dokunuşları ---------- */ .btn-primary{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand); --bs-btn-hover-bg:var(--brand-dark);--bs-btn-hover-border-color:var(--brand-dark); --bs-btn-active-bg:var(--brand-dark);--bs-btn-active-border-color:var(--brand-dark); --bs-btn-disabled-bg:var(--brand-light);--bs-btn-disabled-border-color:var(--brand-light)} .btn-outline-primary{--bs-btn-color:var(--brand);--bs-btn-border-color:var(--brand); --bs-btn-hover-bg:var(--brand);--bs-btn-hover-border-color:var(--brand); --bs-btn-active-bg:var(--brand-dark);--bs-btn-active-border-color:var(--brand-dark)} .btn-link{--bs-btn-color:var(--brand);--bs-btn-hover-color:var(--brand-dark)} .badge.bg-primary{background:var(--brand)!important} .text-primary{color:var(--brand)!important} .border-primary{border-color:var(--brand)!important} .form-control:focus,.form-select:focus{border-color:var(--brand-light); box-shadow:0 0 0 .2rem rgba(123,30,58,.18)} .form-check-input:checked{background-color:var(--brand);border-color:var(--brand)} .form-check-input:focus{border-color:var(--brand-light);box-shadow:0 0 0 .2rem rgba(123,30,58,.18)} .table>thead th{background:var(--brand-tint);color:var(--brand-ink);border-bottom-color:var(--brand-line)} .table-hover>tbody>tr:hover>*{background-color:rgba(123,30,58,.06)} .list-group-item-action:hover{background:var(--brand-soft)} .nav-tabs .nav-link.active{color:var(--brand);border-bottom-color:var(--brand)} .progress-bar{background-color:var(--brand)} .page-item.active .page-link{background-color:var(--brand);border-color:var(--brand)} .page-link{color:var(--brand)} .alert-info{--bs-alert-bg:var(--brand-soft);--bs-alert-border-color:var(--brand-line);--bs-alert-color:var(--brand-ink)} .card-title{color:var(--brand-ink-2)} hr{border-color:var(--brand-line)} ::selection{background:rgba(123,30,58,.20)} [data-bs-theme=dark] .table>thead th{background:var(--surf-dark);color:var(--ink-dark);border-bottom-color:var(--surf-dark-line)} [data-bs-theme=dark] .card-title{color:var(--ink-dark)} [data-bs-theme=dark] hr{border-color:var(--surf-dark-line)} [data-bs-theme=dark] .list-group-item-action:hover{background:var(--surf-dark)} /* ---------- Renk temasi secici (ust cubuk) ---------- */ /* ---- Gorunum menusu (mod + renk temasi tek yerde) ---- */ .appearance-menu{min-width:300px;padding:10px 10px 8px} .appearance-menu .dropdown-header{padding:2px 6px 8px;font-size:11px;letter-spacing:.06em;text-transform:uppercase} .mode-seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--bs-tertiary-bg);border-radius:10px;padding:4px;margin:0 4px 10px} .mode-seg button{border:0;background:transparent;border-radius:8px;padding:7px 8px;font-size:13px;font-weight:600;color:inherit;display:flex;align-items:center;justify-content:center;gap:6px} .mode-seg button.active{background:var(--bs-body-bg);color:var(--brand);box-shadow:0 1px 3px rgba(0,0,0,.12)} [data-bs-theme=dark] .mode-seg button.active{background:var(--surf-dark);color:var(--ink-dark)} .theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:0 4px} .theme-grid .theme-item{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 4px 6px;border-radius:10px;cursor:pointer;font-size:11px;text-align:center;line-height:1.1;border:1px solid transparent} .theme-grid .theme-item:hover{background:var(--bs-tertiary-bg)} .theme-grid .theme-item.active{border-color:var(--brand);background:var(--brand-tint);color:var(--brand-ink);font-weight:600} [data-bs-theme=dark] .theme-grid .theme-item.active{background:var(--surf-dark);color:var(--ink-dark)} .theme-swatch{width:34px;height:34px;border-radius:50%;flex:0 0 34px;position:relative;overflow:hidden; background:linear-gradient(135deg,var(--sw1) 0 50%,var(--sw2) 50% 100%);box-shadow:0 0 0 2px #fff inset,0 1px 3px rgba(0,0,0,.25)} .theme-item.active .theme-swatch::after{content:"\2713";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.5)}