/* ==========================================================================
   devriye.co — tasarim sistemi (ds.css)
   Spec: docs/TASARIM-SISTEMI.md. Bootstrap 5.3 (grid, yardimcilar, JS) ustune
   KURULUR; Bootstrap degiskenleri burada ezilir, bu yuzden Bootstrap'tan SONRA
   yuklenmelidir. Sayfa icinde <style> yazilmaz; ihtiyac buraya bilesen olarak girer.
   ========================================================================== */

/* ---- Yazi tipleri (kendi sunucumuz; Google Fonts yok) --------------------- */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-ext-500-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-ext-600-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-mono-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---- Token'lar ------------------------------------------------------------ */
:root{
  /* Font Awesome 7 ikonlari varsayilan sabit genislikte (1.25em); eski duzeni korumak icin otomatik genislik */
  --fa-width:auto;
  /* Mürekkep: sidebar, auth paneli, koyu bolumler */
  --ink-950:#0A1522; --ink-900:#0E1B2B; --ink-800:#142840; --ink-700:#1D3A5C; --ink-600:#2A4D77;
  /* Çelik: yuzeyler, cizgiler, metin */
  --steel-25:#F8F9FB; --steel-50:#F2F4F7; --steel-100:#E7EBF0; --steel-200:#D6DCE4; --steel-300:#B9C2CE;
  --steel-400:#8E9AAB; --steel-500:#667487; --steel-600:#4B5869; --steel-700:#364252; --steel-800:#232D3B; --steel-900:#141B26;
  /* Liman mavisi: yalnizca etkilesim (baglanti, birincil dugme, odak) */
  --harbor-50:#F0F5FB; --harbor-100:#E3ECF7; --harbor-500:#2B63AB; --harbor-600:#1F4E8C; --harbor-700:#183E70;
  /* Isik: dikkat/aktif nokta. Koyu zemin uzerinde dolgu, ACIK zemin uzerinde yalniz --beacon-700 metin */
  --beacon-400:#F2B01E; --beacon-500:#E8A317; --beacon-100:#FCF1D8; --beacon-700:#8A5A00;
  /* Durum */
  --ok-600:#0F766E; --ok-700:#0B5A54; --ok-100:#DAF1EE;
  --alarm-600:#B42318; --alarm-700:#8F1B12; --alarm-100:#FBE4E1;
  --warn-100:var(--beacon-100); --warn-700:var(--beacon-700);

  --font-sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* Olcek: 1.2 oranli, satir uzunlugu < 75 karakter */
  --fs-xs:.75rem; --fs-sm:.8125rem; --fs-base:.9375rem; --fs-md:1.0625rem; --fs-lg:1.25rem; --fs-xl:1.5rem; --fs-2xl:2rem; --fs-3xl:2.75rem;
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem; --space-6:2rem; --space-7:3rem; --space-8:4.5rem;
  --radius:6px; --radius-lg:10px;
  --sidebar-w:248px; --topbar-h:56px; --content-max:1280px;
  --focus:0 0 0 3px rgba(31,78,140,.35);

  /* Bootstrap degiskenlerini ez: mevcut tum Bootstrap isaretlemesi yeni gorunumu alir */
  --bs-primary:#1F4E8C; --bs-primary-rgb:31,78,140;
  --bs-success:#0F766E; --bs-success-rgb:15,118,110;
  --bs-danger:#B42318; --bs-danger-rgb:180,35,24;
  --bs-warning:#E8A317; --bs-warning-rgb:232,163,23;
  --bs-info:#2B63AB; --bs-info-rgb:43,99,171;
  --bs-secondary:#667487; --bs-secondary-rgb:102,116,135;
  --bs-body-font-family:var(--font-sans); --bs-body-font-size:var(--fs-base); --bs-body-line-height:1.55;
  --bs-body-color:#232D3B; --bs-body-bg:#F2F4F7; --bs-heading-color:#0E1B2B;
  --bs-border-color:#D6DCE4; --bs-border-radius:6px; --bs-border-radius-sm:4px; --bs-border-radius-lg:10px;
  --bs-link-color:#1F4E8C; --bs-link-hover-color:#183E70; --bs-link-color-rgb:31,78,140;
  color-scheme:light;
}

/* ---- Temel ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
.ds-body{font-family:var(--font-sans);font-size:var(--fs-base);line-height:1.55;color:var(--steel-800);background:var(--steel-50);margin:0;-webkit-font-smoothing:antialiased}
.ds-body h1,.ds-body h2,.ds-body h3,.ds-body h4,.ds-body h5{font-family:var(--font-sans);color:var(--ink-900);font-weight:600;letter-spacing:-.01em;line-height:1.25;margin:0 0 var(--space-3)}
.ds-body h1{font-size:var(--fs-xl)} .ds-body h2{font-size:var(--fs-lg)} .ds-body h3{font-size:var(--fs-md)} .ds-body h4,.ds-body h5{font-size:var(--fs-base)}
.ds-body p{margin:0 0 var(--space-3);max-width:70ch}
.ds-body a{color:var(--harbor-600);text-decoration-thickness:1px;text-underline-offset:2px}
/* Baglanti dugmeleri: ".ds-body a" rengi .btn rengini eziyordu (mavi uzerinde mavi yazi) */
.ds-body a.btn{color:var(--bs-btn-color)}
.ds-body a.btn:hover,.ds-body a.btn:focus-visible{color:var(--bs-btn-hover-color)}
.ds-body a.btn:active{color:var(--bs-btn-active-color)}
.ds-body a:hover{color:var(--harbor-700)}
.ds-body :focus-visible{outline:2px solid var(--harbor-600);outline-offset:2px;border-radius:3px}
.ds-mono{font-family:var(--font-mono);font-size:.92em;letter-spacing:0}
.ds-muted{color:var(--steel-500)}
.ds-num{font-variant-numeric:tabular-nums}
.ds-skip{position:absolute;left:-9999px;top:0;background:var(--ink-900);color:#fff;padding:var(--space-2) var(--space-4);z-index:1000;border-radius:0 0 var(--radius) 0}
.ds-skip:focus{left:0}
.ds-hidden{display:none!important}
.ds-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- Panel kabugu (admin + musteri) --------------------------------------- */
.ds-shell{display:flex;min-height:100vh}
.ds-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-w);background:var(--ink-900);color:var(--steel-300);display:flex;flex-direction:column;z-index:40;transition:transform .2s ease}
.ds-brand{display:flex;align-items:center;gap:var(--space-3);height:var(--topbar-h);padding:0 var(--space-4);color:#fff;text-decoration:none;font-weight:600;letter-spacing:-.01em;border-bottom:1px solid rgba(255,255,255,.08)}
.ds-body .ds-brand:hover{color:#fff}
.ds-tld{font-weight:400;opacity:.72}
.ds-brand-mark{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:7px;background:#fff;padding:3px}
.ds-brand-mark img{display:block;width:100%;height:100%;object-fit:contain}
.ds-brand-sub{display:block;font-size:var(--fs-xs);font-weight:400;color:var(--steel-400);line-height:1.1}
.ds-nav{flex:1;overflow-y:auto;padding:var(--space-4) var(--space-3);scrollbar-width:thin}
.ds-nav-group+.ds-nav-group{margin-top:var(--space-5)}
.ds-nav-heading{font-size:var(--fs-xs);font-weight:600;color:var(--steel-400);padding:0 var(--space-3) var(--space-2);letter-spacing:.01em}
.ds-body .ds-nav-link{display:flex;align-items:center;gap:var(--space-3);padding:.5rem var(--space-3);border-radius:var(--radius);color:var(--steel-300);text-decoration:none;font-size:var(--fs-sm);font-weight:500;position:relative}
.ds-body .ds-nav-link:hover{background:var(--ink-800);color:#fff}
.ds-body .ds-nav-link.is-active{background:var(--ink-700);color:#fff}
.ds-nav-link.is-active::before{content:"";position:absolute;left:-12px;top:6px;bottom:6px;width:3px;border-radius:0 3px 3px 0;background:var(--beacon-500)}
.ds-nav-link i{width:18px;text-align:center;font-size:.95em;color:var(--steel-400)}
.ds-nav-link.is-active i,.ds-nav-link:hover i{color:var(--beacon-400)}
.ds-nav-count{margin-left:auto;min-width:20px;padding:0 6px;border-radius:10px;background:var(--beacon-500);color:var(--ink-900);font-size:var(--fs-xs);font-weight:600;text-align:center;line-height:20px}
.ds-sidebar :focus-visible{outline-color:var(--beacon-400)}
.ds-sidebar-foot{padding:var(--space-3);border-top:1px solid rgba(255,255,255,.08);font-size:var(--fs-xs);color:var(--steel-400)}
.ds-main{flex:1;min-width:0;margin-left:var(--sidebar-w);display:flex;flex-direction:column}
.ds-topbar{position:sticky;top:0;z-index:30;height:var(--topbar-h);display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-5);background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--steel-200)}
.ds-topbar-title{font-weight:600;color:var(--ink-900);font-size:var(--fs-base);margin-right:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ds-nav-toggle{display:none;border:1px solid var(--steel-200);background:#fff;border-radius:var(--radius);width:36px;height:36px;color:var(--ink-900)}
.ds-content{width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--space-5) var(--space-5) var(--space-7)}
.ds-footer{margin-top:auto;padding:var(--space-4) var(--space-5);font-size:var(--fs-xs);color:var(--steel-500);border-top:1px solid var(--steel-200);background:#fff}
.ds-scrim{display:none}

.ds-page-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}
.ds-page-head h1{margin:0}
.ds-page-head p{margin:var(--space-1) 0 0;color:var(--steel-600)}
.ds-page-actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}

/* Kullanici menusu + bildirim (panel ust cubugu) */
.ds-menu{position:relative}
.ds-menu-btn{display:flex;align-items:center;gap:var(--space-2);border:1px solid transparent;background:transparent;border-radius:var(--radius);padding:4px 8px;color:var(--steel-800);font:inherit;cursor:pointer}
.ds-menu-btn:hover,.ds-menu-btn[aria-expanded=true]{background:var(--steel-50);border-color:var(--steel-200)}
.ds-avatar{width:30px;height:30px;border-radius:50%;background:var(--ink-800);color:#fff;display:grid;place-items:center;font-size:var(--fs-sm);font-weight:600}
.ds-menu-who{text-align:left;line-height:1.2}
.ds-menu-who small{display:block;color:var(--steel-500);font-size:var(--fs-xs)}
.ds-dropdown{position:absolute;right:0;top:calc(100% + 6px);min-width:240px;max-width:min(360px,92vw);background:#fff;border:1px solid var(--steel-200);border-radius:var(--radius-lg);box-shadow:0 12px 32px rgba(10,21,34,.16);display:none;z-index:50}
.ds-dropdown.is-open{display:block}
.ds-dropdown-item{display:flex;align-items:center;gap:var(--space-3);padding:.55rem var(--space-4);color:var(--steel-800);text-decoration:none;font-size:var(--fs-sm);border:0;background:none;width:100%;text-align:left;font-family:inherit;cursor:pointer}
.ds-body .ds-dropdown-item:hover{background:var(--steel-50);color:var(--ink-900)}
.ds-dropdown-sep{height:1px;background:var(--steel-100);margin:var(--space-1) 0}
.ds-dropdown-head{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--steel-100);font-weight:600;display:flex;justify-content:space-between;align-items:center}
.ds-bell{position:relative;width:36px;height:36px;border:1px solid transparent;background:transparent;border-radius:var(--radius);color:var(--steel-700);cursor:pointer}
.ds-bell:hover,.ds-bell[aria-expanded=true]{background:var(--steel-50);border-color:var(--steel-200)}
.ds-bell-count{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--alarm-600);color:#fff;font-size:11px;font-weight:600;line-height:18px;text-align:center}
.ds-notif-list{max-height:360px;overflow-y:auto}
.ds-notif{display:flex;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--steel-100);cursor:pointer;background:#fff;width:100%;border-left:0;border-right:0;border-top:0;text-align:left;font-family:inherit}
.ds-notif:hover{background:var(--steel-25)}
.ds-notif.is-unread{background:var(--harbor-50);box-shadow:inset 3px 0 0 var(--harbor-600)}
.ds-notif strong{display:block;font-size:var(--fs-sm);color:var(--ink-900)}
.ds-notif span{display:block;font-size:var(--fs-xs);color:var(--steel-600)}
.ds-notif time{font-size:var(--fs-xs);color:var(--steel-500)}

/* ---- Yuzeyler ------------------------------------------------------------- */
.ds-panel{background:#fff;border:1px solid var(--steel-200);border-radius:var(--radius)}
.ds-stack{display:flex;flex-direction:column;gap:var(--space-5)}
.ds-stack>.ds-panel+.ds-panel,.ds-stack>.ds-metrics+.ds-panel,.ds-stack>.ds-panel+.ds-metrics{margin-top:0}
.ds-panel+.ds-panel,.ds-metrics+.ds-panel,.ds-panel+.ds-metrics,.ds-filters+.ds-panel{margin-top:var(--space-5)}
.ds-panel-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--steel-200)}
.ds-panel-head h2,.ds-panel-head h3{margin:0;font-size:var(--fs-md)}
.ds-panel-body{padding:var(--space-4)}
.ds-panel-flush{padding:0}

/* Metrik seridi: tek cerceve, bolmeli (kimlikli kart dizisi degil) */
.ds-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));background:var(--steel-200);gap:1px;border:1px solid var(--steel-200);border-radius:var(--radius);overflow:hidden}
.ds-metric{background:#fff;padding:var(--space-4) var(--space-5)}
.ds-metric-label{font-size:var(--fs-sm);color:var(--steel-600);margin:0}
.ds-metric-value{font-size:var(--fs-2xl);font-weight:600;color:var(--ink-900);letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums;margin:var(--space-1) 0}
.ds-metric-note{font-size:var(--fs-xs);color:var(--steel-500);margin:0}

/* Filtre cubugu */
.ds-filters{background:#fff;border:1px solid var(--steel-200);border-radius:var(--radius);padding:var(--space-4);display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:flex-end;margin-bottom:var(--space-5)}
.ds-filters .ds-field{min-width:150px;flex:1 1 150px}

/* ---- Tablo ---------------------------------------------------------------- */
.ds-table-wrap{overflow-x:auto;position:relative}
.ds-body .table{--bs-table-bg:transparent;--bs-table-hover-bg:var(--steel-25);margin:0;font-size:var(--fs-sm);color:var(--steel-800)}
.ds-body .table>thead th{background:var(--steel-50);color:var(--steel-600);font-weight:600;font-size:var(--fs-xs);letter-spacing:.01em;border-bottom:1px solid var(--steel-200);padding:.65rem var(--space-4);white-space:nowrap;vertical-align:middle}
.ds-body .table>tbody td{padding:.75rem var(--space-4);border-color:var(--steel-100);vertical-align:middle}
.ds-body .table>tbody tr:last-child td{border-bottom:0}
.ds-body .table-hover>tbody>tr:hover>*{background:var(--steel-25)}
.ds-th-num,.ds-td-num{text-align:right;font-variant-numeric:tabular-nums}

/* ---- Durum cipleri (renk + sembol: yalniz renge bagli degil) -------------- */
.ds-chip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px 2px 8px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;line-height:1.5;white-space:nowrap;background:var(--steel-100);color:var(--steel-700)}
.ds-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.ds-chip--ok{background:var(--ok-100);color:var(--ok-700)}
.ds-chip--warn{background:var(--beacon-100);color:var(--beacon-700)}
.ds-chip--alarm{background:var(--alarm-100);color:var(--alarm-700)}
.ds-chip--info{background:var(--harbor-100);color:var(--harbor-700)}
.ds-chip--alarm::before{border-radius:1px;transform:rotate(45deg)}       /* elmas: alarm */
.ds-chip--warn::before{border-radius:1px}                                  /* kare: dikkat */

/* ---- Dugmeler ------------------------------------------------------------- */
.ds-body .btn{--bs-btn-font-family:var(--font-sans);--bs-btn-font-size:var(--fs-sm);--bs-btn-font-weight:500;--bs-btn-border-radius:var(--radius);--bs-btn-padding-y:.45rem;--bs-btn-padding-x:.9rem;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);line-height:1.4}
.ds-body .btn-primary{--bs-btn-bg:var(--harbor-600);--bs-btn-border-color:var(--harbor-600);--bs-btn-hover-bg:var(--harbor-700);--bs-btn-hover-border-color:var(--harbor-700);--bs-btn-active-bg:var(--harbor-700);--bs-btn-active-border-color:var(--harbor-700);--bs-btn-color:#fff;--bs-btn-hover-color:#fff;--bs-btn-focus-shadow-rgb:31,78,140}
.ds-body .btn-outline-primary{--bs-btn-color:var(--harbor-600);--bs-btn-border-color:var(--harbor-600);--bs-btn-hover-bg:var(--harbor-600);--bs-btn-hover-border-color:var(--harbor-600);--bs-btn-hover-color:#fff;--bs-btn-active-bg:var(--harbor-700)}
.ds-body .btn-outline-secondary,.ds-body .btn-outline-secondary-solid{--bs-btn-color:var(--steel-700);--bs-btn-border-color:var(--steel-300);--bs-btn-bg:#fff;--bs-btn-hover-bg:var(--steel-50);--bs-btn-hover-border-color:var(--steel-400);--bs-btn-hover-color:var(--ink-900);--bs-btn-active-bg:var(--steel-100);--bs-btn-active-color:var(--ink-900)}
.ds-body .btn-success{--bs-btn-bg:var(--ok-600);--bs-btn-border-color:var(--ok-600);--bs-btn-hover-bg:var(--ok-700);--bs-btn-hover-border-color:var(--ok-700)}
.ds-body .btn-danger{--bs-btn-bg:var(--alarm-600);--bs-btn-border-color:var(--alarm-600);--bs-btn-hover-bg:var(--alarm-700);--bs-btn-hover-border-color:var(--alarm-700)}
.ds-body .btn-outline-danger{--bs-btn-color:var(--alarm-600);--bs-btn-border-color:var(--alarm-600);--bs-btn-hover-bg:var(--alarm-600);--bs-btn-hover-border-color:var(--alarm-600)}
.ds-body .btn-warning{--bs-btn-bg:var(--beacon-500);--bs-btn-border-color:var(--beacon-500);--bs-btn-color:var(--ink-900);--bs-btn-hover-bg:var(--beacon-400);--bs-btn-hover-border-color:var(--beacon-400);--bs-btn-hover-color:var(--ink-900)}
.ds-body .btn-beacon{background:var(--beacon-500);border-color:var(--beacon-500);color:var(--ink-900);font-weight:600}
.ds-body .btn-beacon:hover{background:var(--beacon-400);border-color:var(--beacon-400);color:var(--ink-900)}
.ds-body .btn-lg{--bs-btn-padding-y:.65rem;--bs-btn-padding-x:1.25rem;--bs-btn-font-size:var(--fs-base)}
.ds-body .btn-sm{--bs-btn-padding-y:.3rem;--bs-btn-padding-x:.6rem;--bs-btn-font-size:var(--fs-xs)}

/* ---- Formlar -------------------------------------------------------------- */
.ds-body .form-label,.ds-label{font-size:var(--fs-sm);font-weight:600;color:var(--steel-800);margin-bottom:var(--space-1)}
.ds-body .form-control,.ds-body .form-select{font-size:var(--fs-base);border:1px solid var(--steel-300);border-radius:var(--radius);padding:.5rem .75rem;background-color:#fff;color:var(--steel-900)}
.ds-body .form-control:focus,.ds-body .form-select:focus{border-color:var(--harbor-600);box-shadow:var(--focus);outline:0}
.ds-body .form-control::placeholder{color:var(--steel-400)}
.ds-body .form-control:disabled,.ds-body .form-select:disabled{background:var(--steel-50);color:var(--steel-500)}
.ds-body .form-text{font-size:var(--fs-xs);color:var(--steel-500)}
.ds-body .input-group-text{background:var(--steel-50);border-color:var(--steel-300);color:var(--steel-600)}
.ds-body .form-check-input:checked{background-color:var(--harbor-600);border-color:var(--harbor-600)}
.ds-body .is-invalid{border-color:var(--alarm-600)}
.ds-body .invalid-feedback{color:var(--alarm-700);font-size:var(--fs-xs)}

/* ---- Uyarilar, bos durum, modal, sekme ------------------------------------ */
.ds-body .alert{border-radius:var(--radius);border:1px solid;border-left-width:4px;font-size:var(--fs-sm);padding:.75rem 1rem}
.ds-body .alert-success{background:var(--ok-100);border-color:#9fd6cf;color:var(--ok-700)}
.ds-body .alert-danger{background:var(--alarm-100);border-color:#f0b4ad;color:var(--alarm-700)}
.ds-body .alert-warning{background:var(--beacon-100);border-color:#ebd193;color:var(--beacon-700)}
.ds-body .alert-info{background:var(--harbor-100);border-color:#b9cfe9;color:var(--harbor-700)}
.ds-empty{text-align:center;padding:var(--space-7) var(--space-4);color:var(--steel-600)}
.ds-empty i{font-size:1.75rem;color:var(--steel-400);margin-bottom:var(--space-3)}
.ds-empty h3{font-size:var(--fs-md);margin-bottom:var(--space-1)}
.ds-empty p{margin:0 auto var(--space-4)}
.ds-body .modal-content{border:0;border-radius:var(--radius-lg);box-shadow:0 24px 64px rgba(10,21,34,.28)}
.ds-body .modal-header{border-bottom:1px solid var(--steel-200);padding:var(--space-4) var(--space-5)}
.ds-body .modal-title{font-size:var(--fs-md);font-weight:600}
.ds-body .modal-footer{border-top:1px solid var(--steel-200)}
.ds-body .nav-tabs{border-bottom:1px solid var(--steel-200)}
.ds-body .nav-tabs .nav-link{color:var(--steel-600);font-weight:500;font-size:var(--fs-sm);border:0;border-bottom:2px solid transparent;border-radius:0}
.ds-body .nav-tabs .nav-link.active{color:var(--ink-900);border-bottom-color:var(--harbor-600);background:transparent}
.ds-body .progress{height:8px;border-radius:4px;background:var(--steel-100)}
.ds-body .badge{font-weight:600;font-size:var(--fs-xs)}

/* ---- Imza: devriye rotasi (nokta-dugum cizgisi) --------------------------- */
.ds-route{list-style:none;margin:0;padding:0}
.ds-route-item{position:relative;display:grid;grid-template-columns:20px 1fr auto;column-gap:var(--space-4);padding:0 0 var(--space-5)}
.ds-route-item:last-child{padding-bottom:0}
.ds-route-item::before{content:"";position:absolute;left:9px;top:20px;bottom:-2px;width:2px;background:var(--steel-200)}
.ds-route-item:last-child::before{display:none}
.ds-route-node{width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--steel-400);position:relative;z-index:1}
.ds-route-item.is-ok .ds-route-node{border-color:var(--ok-600);background:var(--ok-600)}
.ds-route-item.is-warn .ds-route-node{border-color:var(--beacon-500);background:var(--beacon-500);border-radius:3px}
.ds-route-item.is-alarm .ds-route-node{border-color:var(--alarm-600);background:var(--alarm-600);border-radius:3px;transform:rotate(45deg) scale(.82)}
.ds-route-item.is-idle .ds-route-node{border-style:dashed}
.ds-route-title{font-weight:600;color:var(--ink-900);font-size:var(--fs-sm);line-height:20px}
.ds-route-meta{color:var(--steel-600);font-size:var(--fs-xs)}
.ds-route-time{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--steel-600);line-height:20px}

/* ---- Giris sayfalari ------------------------------------------------------ */
.ds-auth{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:100vh;background:#fff}
.ds-auth-side{background:var(--ink-900);color:var(--steel-300);padding:var(--space-7) var(--space-7);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.ds-auth-side h1{color:#fff;font-size:var(--fs-2xl);max-width:16ch;letter-spacing:-.02em}
.ds-auth-side p{color:var(--steel-300);max-width:42ch}
.ds-auth-side .ds-route-title{color:#fff}.ds-auth-side .ds-route-meta,.ds-auth-side .ds-route-time{color:var(--steel-400)}
.ds-auth-side .ds-route-item::before{background:rgba(255,255,255,.14)}
.ds-auth-side .ds-route-node{background:var(--ink-900)}
.ds-auth-side .ds-route-item.is-ok .ds-route-node{background:var(--ok-600);border-color:var(--ok-600)}
.ds-auth-form{display:flex;align-items:center;justify-content:center;padding:var(--space-6) var(--space-5)}
.ds-auth-card{width:100%;max-width:400px}
.ds-auth-lang{text-align:right;margin-bottom:var(--space-3)}
.ds-lang-link{font-size:var(--fs-sm);padding:.2rem .7rem;border:1px solid var(--steel-300);border-radius:999px;color:var(--steel-700);text-decoration:none;white-space:nowrap}
.ds-body .ds-lang-link:hover{border-color:var(--harbor-600);color:var(--harbor-600)}
.ds-auth-card h2{font-size:var(--fs-xl);margin-bottom:var(--space-1)}
.ds-auth-card .ds-auth-sub{color:var(--steel-600);margin-bottom:var(--space-5)}
.ds-field{margin-bottom:var(--space-4)}

/* ---- Tanitim sitesi ------------------------------------------------------- */
.ds-pub{background:#fff}
.ds-pub-nav{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--steel-200)}
.ds-pub-nav-in{max-width:1180px;margin:0 auto;padding:0 var(--space-5);height:64px;display:flex;align-items:center;gap:var(--space-5)}
.ds-pub-brand{display:flex;align-items:center;gap:var(--space-2);font-weight:600;color:var(--ink-900);text-decoration:none;margin-right:auto}
.ds-pub-links{display:flex;gap:var(--space-5)}
.ds-body .ds-pub-links a{color:var(--steel-700);text-decoration:none;font-size:var(--fs-sm);font-weight:500;padding:6px 0;border-bottom:2px solid transparent}
.ds-body .ds-pub-links a:hover,.ds-body .ds-pub-links a[aria-current=page]{color:var(--ink-900);border-bottom-color:var(--beacon-500)}
.ds-section{padding:var(--space-8) 0}
.ds-section--tint{background:var(--steel-50);border-block:1px solid var(--steel-200)}
.ds-section--ink{background:var(--ink-900);color:var(--steel-300)}
.ds-section--ink h2,.ds-section--ink h3{color:#fff}
.ds-wrap{max-width:1180px;margin:0 auto;padding:0 var(--space-5)}
.ds-hero{padding:var(--space-8) 0 var(--space-7);background:var(--ink-900);color:var(--steel-300);position:relative;overflow:hidden}
.ds-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--space-7);align-items:center}
.ds-hero h1{color:#fff;font-size:var(--fs-3xl);letter-spacing:-.025em;line-height:1.1;max-width:15ch}
.ds-hero p{color:var(--steel-300);font-size:var(--fs-md);max-width:46ch}
.ds-hero-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-5)}
.ds-board{background:var(--ink-950);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.ds-board-head{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid rgba(255,255,255,.08);color:#fff;font-size:var(--fs-sm);font-weight:600}
.ds-board-head span{font-weight:400;color:var(--steel-400);font-size:var(--fs-xs)}
.ds-board .ds-route{padding:var(--space-5) var(--space-4)}
.ds-board .ds-route-title{color:#fff}.ds-board .ds-route-meta,.ds-board .ds-route-time{color:var(--steel-400)}
.ds-board .ds-route-item::before{background:rgba(255,255,255,.14)}.ds-board .ds-route-node{background:var(--ink-950)}
.ds-board .ds-route-item.is-ok .ds-route-node{background:var(--ok-600);border-color:var(--ok-600)}
.ds-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);counter-reset:step;list-style:none;margin:0;padding:0}
.ds-steps li{counter-increment:step;border-top:2px solid var(--ink-900);padding-top:var(--space-4)}
.ds-steps li::before{content:counter(step);display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink-900);color:#fff;font-size:var(--fs-sm);font-weight:600;margin-bottom:var(--space-3)}
.ds-pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-4)}
.ds-plan{background:#fff;border:1px solid var(--steel-200);border-radius:var(--radius);padding:var(--space-5);display:flex;flex-direction:column}
.ds-plan-price{font-size:var(--fs-2xl);font-weight:600;color:var(--ink-900);letter-spacing:-.02em}
.ds-plan-price small{font-size:var(--fs-sm);font-weight:400;color:var(--steel-600)}
.ds-plan ul{list-style:none;margin:var(--space-4) 0;padding:0;font-size:var(--fs-sm);flex:1}
.ds-plan li{padding:6px 0 6px 22px;position:relative;border-top:1px solid var(--steel-100)}
.ds-plan li::before{content:"";position:absolute;left:2px;top:12px;width:10px;height:6px;border-left:2px solid var(--ok-600);border-bottom:2px solid var(--ok-600);transform:rotate(-45deg)}
.ds-pub-footer{background:var(--ink-950);color:var(--steel-400);padding:var(--space-7) 0 var(--space-5);font-size:var(--fs-sm)}
.ds-pub-footer a{color:var(--steel-300)}

/* ---- Duyarli ------------------------------------------------------------- */
@media (max-width:991.98px){
  .ds-sidebar{transform:translateX(-100%)}
  body.ds-nav-open .ds-sidebar{transform:none}
  body.ds-nav-open .ds-scrim{display:block;position:fixed;inset:0;background:rgba(10,21,34,.5);z-index:35}
  .ds-main{margin-left:0}
  .ds-nav-toggle{display:inline-grid;place-items:center}
  .ds-content{padding:var(--space-4) var(--space-4) var(--space-6)}
  .ds-menu-who{display:none}
  .ds-hero-grid,.ds-steps,.ds-auth{grid-template-columns:1fr}
  .ds-auth-side{display:none}
  .ds-pub-links{display:none}
  .ds-hero h1{font-size:var(--fs-2xl)}
  .ds-section{padding:var(--space-7) 0}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{.ds-sidebar,.ds-topbar,.ds-footer,.ds-nav-toggle,.ds-page-actions{display:none!important}.ds-main{margin:0}.ds-content{padding:0;max-width:none}.ds-panel{border-color:#999}}

/* ui.php içi küçük yardımcılar (satır içi stil yerine) */
.ds-dropdown--wide{min-width:320px}
.ds-menu-btn .fa-chevron-down{font-size:.7rem}
.ds-on-ink{color:#fff}
.ds-on-ink-muted{color:var(--steel-400)}
.ds-route--spaced{margin-top:2rem}
.ds-pub-footer-in{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:space-between}

.ds-pager{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--steel-200)}

/* Acil yardim (SOS) seridi (musteri paneli) */
.ds-sos-banner{background:var(--alarm-600);color:#fff;padding:var(--space-3) var(--space-5);font-weight:600}
.ds-sos-banner[hidden]{display:none}
.ds-body .ds-sos-banner a{color:#fff;text-decoration:underline}
.ds-sos-banner .ds-sos-mute{margin-left:var(--space-4);background:transparent;border:1px solid #fff;color:#fff;border-radius:var(--radius);padding:2px 10px;font:inherit;font-size:var(--fs-sm);cursor:pointer}
.ds-sos-banner .ds-sos-mute:focus-visible{outline:2px solid #fff;outline-offset:2px}