/* ==========================================================================
   BOSA Tennis CRM — tasarım dili
   Kaynak: bosatennis.com (assets/css/style.css) · assets/colors.png
   Raleway · turuncu tek vurgu · lacivert koyu zemin · keskin köşe · gölge yok
   ========================================================================== */

:root{
  /* bosatennis.com token'larının birebir karşılığı */
  --brand:#F68A1F;
  --brand-dark:#D9740F;
  --navy:#183C5A;
  --navy-hover:#111111;
  --ink:#111111;
  --ink-muted:#11111199;
  --ink-soft:#111111a6;
  --ink-faint:#11111166;
  --paper:#FFFFFF;
  --line:#1111112b;
  --line-soft:#11111114;
  --sand:#1111110d;
  --line-dark:#ffffff30;
  --ground:#FAFAF9;

  --ok:#1F7A4D;
  --err:#A32020;

  --site-font:"Raleway","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --track-caps:.16em;
  --track-btn:.08em;
  --track-data:.04em;
  --gutter:clamp(1.25rem,3.2vw,3.5rem);
  --sidebar:238px;
  --header-h:5.5rem;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font:400 15px/1.6 var(--site-font);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,p,ul,figure{margin:0}
h1{font:400 clamp(1.9rem,2.6vw,2.4rem)/1.1 var(--site-font);letter-spacing:-.035em}
h2{font:400 1.4rem/1.25 var(--site-font);letter-spacing:-.025em}
h3{font:500 1rem/1.35 var(--site-font);letter-spacing:-.005em}
p{margin:0 0 12px}
a{color:inherit;text-decoration:none}
a:hover{color:var(--brand-dark)}
hr{border:0;border-top:1px solid var(--line-soft);margin:24px 0}
small{font-size:12px}

.label,.eyebrow{
  font-size:.75rem;font-weight:500;letter-spacing:var(--track-caps);
  text-transform:uppercase;color:var(--ink-soft);
}
.eyebrow{color:var(--brand-dark);padding-inline-start:.7rem;border-inline-start:2px solid var(--brand)}
.num{font-variant-numeric:tabular-nums;letter-spacing:var(--track-data)}
.muted{color:var(--ink-muted)}
.dim{color:var(--ink-faint)}
.right{text-align:right}
.center{text-align:center}
.nowrap{white-space:nowrap}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

/* ---------- Yerleşim ---------- */
.app{display:flex;min-height:100vh}

.sidebar{
  width:var(--sidebar);flex:0 0 var(--sidebar);
  background:var(--navy);color:#FFF;
  display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;
}
.sidebar__bar{display:flex;align-items:center;justify-content:space-between;width:100%}
.sidebar__brand{display:flex;align-items:center;gap:1rem;padding:1.6rem 1.4rem 1.4rem;width:fit-content}
.sidebar__toggle{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;margin-inline-end:.6rem;padding:0 10px;
  background:none;border:1px solid #ffffff3d;cursor:pointer;
}
.sidebar__toggle span{display:block;height:1px;background:#FFF;transition:transform .25s var(--ease),opacity .2s}
.sidebar.is-open .sidebar__toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.sidebar.is-open .sidebar__toggle span:nth-child(2){opacity:0}
.sidebar.is-open .sidebar__toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.sidebar__brand img{width:64px;height:64px;display:block}
.sidebar__brand .brand-word{
  max-width:7rem;font-size:.66rem;line-height:1.7;letter-spacing:.14em;
  text-transform:uppercase;color:#FFF;
}

.nav{padding:.75rem .9rem;flex:1;overflow-y:auto}
.nav__group{
  font-size:.62rem;letter-spacing:var(--track-caps);text-transform:uppercase;
  color:#ffffff59;padding:1.15rem .75rem .45rem;
}
.nav a{
  position:relative;display:flex;align-items:center;gap:10px;
  padding:.6rem .75rem;color:#ffffffbf;font-size:.85rem;
  transition:color .25s var(--ease),background .25s var(--ease);
}
.nav a::after{
  content:"";position:absolute;inset:auto .75rem .3rem;height:1px;
  background:var(--brand);transform:scaleX(0);transform-origin:left;
  transition:transform .25s var(--ease);
}
.nav a:hover{color:#FFF;background:#ffffff0f}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
.nav a.is-active{color:#FFF;background:#ffffff14}
.nav a .count{margin-left:auto;font-size:.7rem;color:#ffffff73;font-variant-numeric:tabular-nums}

.sidebar__foot{padding:1rem 1.4rem 1.25rem;border-top:1px solid var(--line-dark)}
.sidebar__foot .who{font-size:.82rem}
.sidebar__foot .role{font-size:.62rem;letter-spacing:var(--track-caps);text-transform:uppercase;color:#ffffff73}
.sidebar__foot button{
  margin-top:.7rem;background:none;border:1px solid #ffffff3d;color:#ffffffbf;
  font:500 .65rem/1.5 var(--site-font);letter-spacing:var(--track-btn);text-transform:uppercase;
  padding:.5rem .85rem;cursor:pointer;transition:.25s var(--ease);
}
.sidebar__foot button:hover{border-color:#FFF;color:#FFF}

.main{flex:1;min-width:0;display:flex;flex-direction:column}

.topbar{
  background:var(--paper);border-bottom:1px solid var(--line);
  min-height:var(--header-h);
  padding:1.35rem var(--gutter);display:flex;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;
}
.topbar__title{flex:1;min-width:240px}
.topbar__title .crumb{
  font-size:.7rem;letter-spacing:var(--track-caps);text-transform:uppercase;
  color:var(--ink-faint);margin-bottom:.45rem;
}
.topbar__actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}

.content{padding:1.75rem var(--gutter) 4rem;flex:1}
.stack{display:flex;flex-direction:column;gap:1.25rem}

.grid{display:grid;gap:1.25rem}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--sidebar{grid-template-columns:minmax(0,1fr) 340px}
@media(max-width:1180px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid--sidebar{grid-template-columns:minmax(0,1fr)}}
@media(max-width:900px){.grid--3,.grid--2{grid-template-columns:minmax(0,1fr)}}

/* ---------- Kart ---------- */
.card{background:var(--paper);border:1px solid var(--line)}
.card__head{padding:1rem 1.25rem;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:.75rem}
.card__head h3{flex:1}
.card__body{padding:1.25rem}
.card__body--flush{padding:0}
.card__foot{padding:.9rem 1.25rem;border-top:1px solid var(--line-soft);background:var(--sand)}

.stat{background:var(--paper);border:1px solid var(--line);padding:1.25rem}
.stat__value{
  font:400 2.4rem/1 var(--site-font);letter-spacing:-.04em;
  font-variant-numeric:tabular-nums;margin:.65rem 0 .4rem;
}
.stat__note{font-size:.75rem;color:var(--ink-faint)}
.stat--accent{border-top:2px solid var(--brand)}

/* ---------- Butonlar (bosatennis.com .btn) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:1.5rem;
  font:500 .75rem/1.5 var(--site-font);letter-spacing:var(--track-btn);text-transform:uppercase;
  min-height:2.85rem;padding:.7rem 1.25rem;
  border:1px solid var(--navy);background:var(--navy);color:var(--paper);
  cursor:pointer;transition:background .25s,border-color .25s,color .25s;white-space:nowrap;
}
.btn:hover{background:var(--navy-hover);border-color:var(--navy-hover);color:#FFF}
.btn:not(.btn--ghost):not(.btn--sm):not(.btn--danger)::after{content:"→";color:var(--brand);transition:transform .25s var(--ease)}
.btn:not(.btn--ghost):not(.btn--sm):not(.btn--danger):hover::after{transform:translateX(5px)}

.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn--accent{background:var(--brand);border-color:var(--brand);color:var(--ink)}
.btn--accent:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:var(--ink)}
.btn--accent::after{color:var(--ink) !important}
.btn--ink{background:var(--ink);border-color:var(--ink)}
.btn--danger{background:transparent;border-color:#a3202059;color:var(--err)}
.btn--danger:hover{background:var(--err);border-color:var(--err);color:#FFF}
.btn--sm{min-height:2.25rem;padding:.45rem .85rem;gap:.75rem;font-size:.68rem}
.btn[disabled]{opacity:.4;pointer-events:none}

.linkish{
  position:relative;font-size:.72rem;letter-spacing:var(--track-caps);text-transform:uppercase;
  font-weight:500;padding-bottom:.3rem;
}
.linkish::after{
  content:"";position:absolute;inset:auto 0 0;height:1px;background:var(--brand);
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);
}
.linkish:hover::after{transform:scaleX(1)}

/* ---------- Form ---------- */
.field{display:block;margin-bottom:1.1rem}
.field > .label{display:block;margin-bottom:.45rem}
.input,.select,.textarea{
  width:100%;font:400 .9rem/1.5 var(--site-font);color:var(--ink);
  background:var(--paper);border:1px solid var(--line);
  padding:.65rem .75rem;transition:border-color .25s var(--ease);
}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--ink)}
.textarea{min-height:6rem;resize:vertical;line-height:1.6}
.select{
  appearance:none;padding-right:2.1rem;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-muted) 50%),linear-gradient(135deg,var(--ink-muted) 50%,transparent 50%);
  background-position:calc(100% - 1rem) 55%,calc(100% - .7rem) 55%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
select[multiple].select{background-image:none;padding-right:.75rem}
.field__hint{font-size:.75rem;color:var(--ink-faint);margin-top:.35rem}
.field--row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.25rem}
.check{display:flex;align-items:flex-start;gap:.55rem;font-size:.88rem;margin-bottom:.6rem;cursor:pointer}
.check input{margin-top:.2rem;accent-color:var(--brand)}
.fieldset{border:1px solid var(--line);padding:1.1rem 1.25rem;margin:0 0 1.25rem}
.fieldset > legend{
  padding:0 .5rem;font-size:.7rem;font-weight:500;letter-spacing:var(--track-caps);
  text-transform:uppercase;color:var(--ink-soft);
}

.errors{border-inline-start:2px solid var(--err);background:#a320200a;padding:.75rem 1rem;margin-bottom:1.25rem;font-size:.85rem}
.errors ul{margin:0;padding-inline-start:1.1rem}

.flash{
  display:flex;align-items:center;gap:.75rem;
  border-inline-start:2px solid var(--brand);background:#f68a1f0f;
  padding:.75rem 1rem;margin-bottom:1.25rem;font-size:.9rem;
}

/* ---------- Tablo ---------- */
.table-wrap{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:.88rem}
table.data th{
  text-align:start;font-size:.65rem;font-weight:500;
  letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-soft);
  padding:.85rem 1rem;border-bottom:1px solid var(--line);white-space:nowrap;
}
table.data th a{color:inherit}
table.data td{padding:.9rem 1rem;border-bottom:1px solid var(--line-soft);vertical-align:middle}
table.data tbody tr{transition:background .2s var(--ease)}
table.data tbody tr:hover{background:var(--sand)}
table.data tbody tr:last-child td{border-bottom:0}
table.data .cell-main{font-weight:500}
table.data .cell-sub{font-size:.75rem;color:var(--ink-faint);margin-top:.15rem}

.empty{padding:3.5rem 1.5rem;text-align:center;color:var(--ink-faint)}
.empty h3{font:400 1.25rem/1.3 var(--site-font);letter-spacing:-.02em;color:var(--ink-muted);margin-bottom:.4rem}

/* ---------- Rozetler ---------- */
.badge{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.62rem;font-weight:500;letter-spacing:var(--track-caps);text-transform:uppercase;
  padding:.25rem .5rem;border:1px solid var(--line);color:var(--ink-muted);
}
.badge--orange{border-color:#f68a1f73;color:var(--brand-dark);background:#f68a1f14}
.badge--navy{border-color:#183c5a4d;color:var(--navy);background:#183c5a0f}
.badge--ink{background:var(--ink);border-color:var(--ink);color:#FFF}
.badge--ok{border-color:#1f7a4d59;color:var(--ok);background:#1f7a4d12}
.badge--err{border-color:#a3202059;color:var(--err);background:#a3202010}
.badge--muted{color:var(--ink-faint)}

.tag{display:inline-block;font-size:.7rem;padding:.15rem .5rem;border:1px solid var(--line);color:var(--ink-muted);margin:0 .25rem .25rem 0}

/* ---------- Seviye göstergesi ---------- */
.level{display:flex;align-items:center;gap:.6rem}
.level__bar{display:flex;gap:2px}
.level__seg{width:7px;height:16px;background:var(--sand)}
.level__seg.is-on{background:var(--navy)}
.level__seg.is-cur{background:var(--brand)}
.level__text{font-size:.75rem;color:var(--ink-muted);white-space:nowrap}
.level__num{font-variant-numeric:tabular-nums;font-weight:500;font-size:.75rem}

.level--lg .level__seg{width:100%;height:26px;flex:1}
.level--lg .level__bar{flex:1;gap:3px}

/* Huni */
.funnel__row{display:grid;grid-template-columns:150px 1fr 48px;align-items:center;gap:.9rem;padding:.4rem 0}
.funnel__label{font-size:.82rem;color:var(--ink-muted)}
.funnel__track{height:12px;background:var(--sand);overflow:hidden}
.funnel__fill{height:100%;background:var(--navy);transition:width .6s var(--ease-out)}
.funnel__row--accent .funnel__fill{background:var(--brand)}
.funnel__value{text-align:end;font-variant-numeric:tabular-nums;font-size:.82rem}

/* ---------- Zaman çizelgesi ---------- */
.timeline{list-style:none;margin:0;padding:0}
.timeline li{position:relative;padding:0 0 1.4rem 1.75rem;border-inline-start:1px solid var(--line)}
.timeline li:last-child{border-inline-start-color:transparent;padding-bottom:0}
.timeline li::before{
  content:"";position:absolute;inset-inline-start:-4px;top:6px;width:7px;height:7px;
  background:var(--paper);border:1px solid var(--ink-muted);border-radius:50%;
}
.timeline li.is-accent::before{background:var(--brand);border-color:var(--brand)}
.timeline__head{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.timeline__type{font-size:.85rem;font-weight:500}
.timeline__meta{font-size:.7rem;color:var(--ink-faint);letter-spacing:var(--track-data)}
.timeline__note{font-size:.88rem;color:var(--ink-muted);margin-top:.25rem;white-space:pre-line}

/* ---------- Filtre çubuğu ---------- */
.filters{
  background:var(--paper);border:1px solid var(--line);
  padding:.9rem 1rem;display:flex;gap:.65rem;align-items:flex-end;flex-wrap:wrap;
}
.filters .field{margin:0;min-width:150px}
.filters .field--grow{flex:1;min-width:220px}
.filters .label{margin-bottom:.3rem}

.chips{display:flex;gap:.35rem;flex-wrap:wrap}
.chip{
  font-size:.7rem;letter-spacing:var(--track-data);padding:.35rem .7rem;
  border:1px solid var(--line);color:var(--ink-muted);transition:.25s var(--ease);
}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip.is-on{background:var(--navy);border-color:var(--navy);color:#FFF}

/* ---------- Sayfalama ---------- */
.pagination{display:flex;gap:.25rem;align-items:center;justify-content:center;list-style:none;margin:1.5rem 0 0;padding:0;flex-wrap:wrap}
.pagination li span,.pagination li a{
  display:block;min-width:2.1rem;text-align:center;padding:.45rem .6rem;font-size:.8rem;
  border:1px solid var(--line);color:var(--ink-muted);font-variant-numeric:tabular-nums;
  transition:.25s var(--ease);
}
.pagination li a:hover{border-color:var(--ink);color:var(--ink)}
.pagination li.active span{background:var(--navy);border-color:var(--navy);color:#FFF}
.pagination li.disabled span{opacity:.35}

/* ---------- Giriş ---------- */
.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.login__brand{
  background:var(--navy);color:#FFF;
  display:flex;flex-direction:column;justify-content:space-between;padding:3.5rem;
}
.login__brand img{width:64px;height:64px}
.login__brand h1{font:400 clamp(2.2rem,3.4vw,3.4rem)/1.08 var(--site-font);letter-spacing:-.05em;color:#FFF;max-width:11ch}
.login__brand .rule{width:54px;height:2px;background:var(--brand);margin:1.4rem 0}
.login__brand p{color:#ffffffa6;max-width:38ch}
.login__brand .foot{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#ffffff73;line-height:1.7}
.login__form{display:flex;align-items:center;justify-content:center;padding:3.5rem;background:var(--paper)}
.login__form .inner{width:100%;max-width:340px}
@media(max-width:860px){.login{grid-template-columns:1fr}.login__brand{padding:2.25rem}}

/* ---------- Yardımcılar ---------- */
.split{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.dl{display:grid;grid-template-columns:130px 1fr;gap:.55rem 1rem;font-size:.88rem;margin:0}
.dl dt{font-size:.65rem;font-weight:500;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-soft);padding-top:.15rem}
.dl dd{margin:0;word-break:break-word}
.avatar{
  width:44px;height:44px;flex:0 0 44px;
  background:var(--sand);color:var(--ink);display:flex;align-items:center;justify-content:center;
  font-size:.85rem;font-weight:500;letter-spacing:.04em;
}
.avatar--orange{background:var(--brand);color:var(--ink)}
.mb-0{margin-bottom:0}.mt-16{margin-top:1rem}.mt-24{margin-top:1.5rem}

@media(max-width:820px){
  /* ---- Uygulama kabuğu: yan menü → üstte açılır menü ---- */
  .app{flex-direction:column}
  .sidebar{
    width:100%;flex:none;height:auto;
    position:sticky;top:0;z-index:60;
    flex-direction:column;overflow:visible;
  }
  .sidebar__toggle{display:flex}
  .sidebar__brand{padding:.7rem 1rem}
  .sidebar__brand img{width:38px;height:38px}
  .sidebar__brand .brand-word{max-width:none;font-size:.58rem;line-height:1.5}

  .nav,.sidebar__foot{display:none}
  .sidebar.is-open .nav{display:block;padding:.25rem .5rem .75rem;border-top:1px solid var(--line-dark)}
  .sidebar.is-open .sidebar__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem}
  .sidebar__foot .who{font-size:.8rem}
  .sidebar__foot button{margin:0}
  .nav__group{padding:.85rem .75rem .3rem}
  .nav a{min-height:44px;font-size:.95rem;padding:.65rem .75rem}
  .nav a::after{inset:auto .75rem .25rem}

  /* ---- Başlık çubuğu ---- */
  .topbar{padding:1rem var(--gutter);min-height:0;align-items:flex-start;flex-direction:column;gap:.9rem}
  .topbar__title{min-width:0;width:100%}
  .topbar__actions{width:100%}
  .topbar__actions .btn{flex:1;min-width:0}
  .content{padding:1.1rem var(--gutter) 3rem}

  /* ---- Form: iki sütunlu satırlar tek sütuna ---- */
  .field--row{grid-template-columns:minmax(0,1fr)}
  .dl{grid-template-columns:1fr;gap:.2rem .75rem}
  .dl dd{margin-bottom:.5rem}

  /* iOS Safari 16px altındaki alanlara odaklanınca sayfayı büyütür */
  .input,.select,.textarea{font-size:16px;padding:.7rem .75rem}
  .select{background-position:calc(100% - 1rem) 58%,calc(100% - .7rem) 58%}
  .check{min-height:32px;align-items:center}

  /* ---- Filtre çubuğu: iki sütunlu ızgara ---- */
  .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;padding:.85rem}
  .filters .field{min-width:0}
  .filters .field--grow{grid-column:1 / -1}
  .filters .row{grid-column:1 / -1}
  .filters .row .btn{flex:1}

  /* ---- Detay sayfalarında özet panel önce gelsin ---- */
  .grid--aside-first{display:flex;flex-direction:column}
  .grid--aside-first > *:nth-child(2){order:-1}

  /* ---- Kart başlıkları sarsın ---- */
  .card__head{flex-wrap:wrap;padding:.9rem 1rem}
  .card__body{padding:1rem}
  .card__foot{padding:.8rem 1rem}
  .stat{padding:1rem}
  .stat__value{font-size:2rem;margin:.5rem 0 .3rem}

  .funnel__row{grid-template-columns:minmax(0,1fr) 40px;gap:.5rem .75rem}
  .funnel__track{grid-column:1 / -1}
  .funnel__label{font-size:.8rem}

  .timeline li{padding-left:1.4rem}
  .timeline__head{gap:.35rem .6rem}
}

@media(max-width:700px){
  /* ---- Geniş tablolar: satır başına kart ---- */
  table.data.stack-mobile thead{display:none}
  table.data.stack-mobile tbody tr{display:block;padding:.5rem 0;border-bottom:1px solid var(--line)}
  table.data.stack-mobile tbody tr:last-child{border-bottom:0}
  table.data.stack-mobile tbody tr:hover{background:transparent}
  table.data.stack-mobile td{
    display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
    padding:.3rem 1rem;border:0;text-align:start;
  }
  table.data.stack-mobile td::before{
    content:attr(data-label);flex:0 0 auto;
    font-size:.62rem;font-weight:500;letter-spacing:var(--track-caps);
    text-transform:uppercase;color:var(--ink-soft);
  }
  table.data.stack-mobile td:not([data-label])::before{content:none}
  table.data.stack-mobile td.cell-first{display:block;padding:.45rem 1rem .3rem}
  table.data.stack-mobile td.cell-first::before{content:none}
  table.data.stack-mobile td[colspan]{display:block;padding:0}
  table.data.stack-mobile td[colspan]::before{content:none}
  table.data.stack-mobile .right{text-align:end}
  table.data.stack-mobile .truncate{max-width:none !important}
  table.data.stack-mobile form{margin-inline-start:auto}

  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .grid{gap:1rem}
  .stack{gap:1rem}
  .empty{padding:2.5rem 1rem}
}

@media(max-width:480px){
  h1{font-size:1.6rem}
  .stat__value{font-size:1.75rem}
  .filters{grid-template-columns:minmax(0,1fr)}
  .login__brand{padding:1.75rem 1.25rem}
  .login__form{padding:2rem 1.25rem}
  .dl{grid-template-columns:1fr}
}

@media print{
  .sidebar,.topbar__actions,.filters,.pagination{display:none}
  body{background:#FFF}
  .card{border-color:#DDD}
}

/* ==========================================================================
   Kartvizit okuma ekranı
   ========================================================================== */

[hidden]{display:none !important}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.drop{
  border:1px dashed var(--line);
  background:var(--sand);
  padding:28px 20px;
  text-align:center;
  transition:background .18s var(--ease),border-color .18s var(--ease);
}
.drop.is-over{border-color:var(--brand);background:#F68A1F14}
.drop__title{margin:0 0 4px;font-size:1rem;letter-spacing:-.01em}
.drop__hint{margin:0 0 16px;color:var(--ink-muted);font-size:13px}
.drop .row{justify-content:center}
.drop label.btn{cursor:pointer}

.thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.thumb{position:relative;width:132px;border:1px solid var(--line-soft);background:var(--paper)}
.thumb img{display:block;width:100%;height:88px;object-fit:cover}
.thumb__x{
  position:absolute;top:4px;right:4px;width:22px;height:22px;line-height:1;
  border:0;background:#111111cc;color:#fff;font-size:15px;cursor:pointer;
}
.thumb__x:hover{background:var(--brand-dark)}
.thumb__size{display:block;padding:3px 6px;font-size:11px;color:var(--ink-faint);letter-spacing:var(--track-data)}

.scan-status{
  margin-top:16px;padding:10px 12px;border-left:3px solid var(--line);
  background:var(--sand);font-size:13.5px;
}
.scan-status--busy{border-color:var(--brand);background:#F68A1F14}
.scan-status--ok{border-color:var(--ok);background:#1F7A4D12}
.scan-status--warn{border-color:var(--brand);background:#F68A1F14}
.scan-status--error{border-color:var(--err);background:#A3202012;color:var(--err)}

.scan-row__grid{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:start}
.scan-row__shot{display:flex;flex-direction:column;gap:8px}
.scan-row__shot img{display:block;width:100%;border:1px solid var(--line-soft)}
.scan-row__fields .field--row:last-child .field,
.scan-row__fields > .field:last-child{margin-bottom:0}

.dup{
  margin-bottom:16px;padding:10px 12px;border-left:3px solid var(--brand);
  background:#F68A1F14;font-size:13.5px;
}

.raw{margin-top:14px;border-top:1px solid var(--line-soft);padding-top:10px}
.raw summary{cursor:pointer;font-size:12px;text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--ink-faint)}
.raw pre{
  margin:10px 0 0;padding:10px;background:var(--sand);border:1px solid var(--line-soft);
  font:400 12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;
}

.check-grid{display:flex;flex-wrap:wrap;gap:4px 18px}

@media (max-width:820px){
  .scan-row__grid{grid-template-columns:1fr}
  .scan-row__shot{flex-direction:row;flex-wrap:wrap}
  .scan-row__shot a{flex:1 1 160px}
}
