/* Ortez CRM — atölye + klinik: karbon kenar çubuğu, alçı beyazı zemin, EVA teal vurgu, mezura sarısı */
:root{
  --carbon:#1b2427; --carbon-2:#253135; --carbon-line:#33424a;
  --plaster:#f3f5f4; --paper:#fff; --ink:#1d282d; --muted:#5d6a70; --faint:#8b979c; --line:#dde3e1; --line-2:#eaeeed;
  --teal:#0b766c; --teal-ink:#085a53; --teal-soft:#e2f1ee;
  --tape:#e7b62f; --tape-soft:#fbf2d6; --tape-ink:#7a5a05;
  --red:#b23a2b; --red-soft:#f8e5e2; --green:#2c7a4b; --green-soft:#e3f2e8; --blue:#2c5d8a; --blue-soft:#e4edf6;
  --r:6px; --r-lg:10px;
  --font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{font-size:15px}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--plaster);line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:var(--teal-ink);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em}
h1{font-size:1.55rem;line-height:1.2}
h2{font-size:1.1rem}
h3{font-size:.95rem}
p{margin:.3rem 0}
small,.small{font-size:.82rem}
.muted{color:var(--muted)} .faint{color:var(--faint)}
.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.mono{font-family:var(--mono);font-size:.85em}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* düzen */
.shell{display:grid;grid-template-columns:232px 1fr;min-height:100vh}
.side{background:var(--carbon);color:#c9d3d6;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{padding:18px 18px 14px;border-bottom:1px solid var(--carbon-line)}
.brand b{display:block;color:#fff;font-size:1.02rem;font-weight:600}
.brand span{font-size:.78rem;color:#8fa0a6}
.nav{padding:10px 8px;flex:1}
.nav a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r);color:#c9d3d6;font-size:.93rem}
.nav a:hover{background:var(--carbon-2);text-decoration:none;color:#fff}
.nav a.on{background:var(--carbon-2);color:#fff;box-shadow:inset 3px 0 0 var(--tape)}
.nav svg{width:18px;height:18px;flex:none;opacity:.85}
.nav .sep{height:1px;background:var(--carbon-line);margin:10px 6px}
.nav .count{margin-left:auto;background:var(--tape);color:#2a2000;font-size:.72rem;font-weight:600;border-radius:9px;padding:0 7px}
.me{padding:12px 16px;border-top:1px solid var(--carbon-line);font-size:.85rem}
.me b{color:#fff;font-weight:500;display:block}
.me form{display:inline}
.me button{background:none;border:0;color:#8fa0a6;padding:0;font:inherit;cursor:pointer}
.me button:hover{color:#fff}
.main{min-width:0;display:flex;flex-direction:column}
.top{display:flex;gap:12px;align-items:center;padding:12px 28px;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top .search{flex:1;max-width:560px;position:relative}
.top .search input{width:100%;padding:9px 12px 9px 36px;border:1px solid var(--line);border-radius:var(--r);background:var(--plaster);font:inherit}
.top .search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--faint)}
.top .actions{margin-left:auto;display:flex;gap:8px}
.top .menu-btn{display:none}
.content{padding:24px 28px 60px;max-width:1360px;width:100%}
.page-head{display:flex;align-items:flex-end;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.page-head .sub{color:var(--muted);margin-top:4px}
.page-head .tools{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* bileşenler */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--r);border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-size:.92rem;font-weight:500;cursor:pointer;white-space:nowrap;line-height:1.2}
.btn:hover{border-color:#b8c3c0;text-decoration:none}
.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff}
.btn.primary:hover{background:var(--teal-ink)}
.btn.danger{color:var(--red)}
.btn.sm{padding:5px 10px;font-size:.84rem}
.btn.ghost{border-color:transparent;background:none}
.btn svg{width:16px;height:16px}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg)}
.panel>header{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line-2)}
.panel>header .tools{margin-left:auto;display:flex;gap:6px}
.panel .body{padding:16px 18px}
.panel .empty{padding:28px 18px;color:var(--muted);text-align:center}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(3,minmax(0,1fr))} .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start}
.stack>*+*{margin-top:16px}

table.t{width:100%;border-collapse:collapse;font-size:.92rem}
.t th{text-align:left;font-weight:500;color:var(--muted);font-size:.8rem;padding:9px 12px;border-bottom:1px solid var(--line);background:#fafbfb;white-space:nowrap}
.t td{padding:9px 12px;border-bottom:1px solid var(--line-2);vertical-align:top}
.t tr:last-child td{border-bottom:0}
.t tbody tr:hover td{background:#fafcfb}
.t th.num,.t td.num{text-align:right}
.t .row-link{color:var(--ink);font-weight:500}
.t tfoot td{font-weight:600;border-top:1px solid var(--line);background:#fafbfb}
.table-wrap{overflow-x:auto}

.pill{display:inline-block;padding:1px 8px;border-radius:20px;font-size:.78rem;font-weight:500;background:var(--line-2);color:var(--muted);white-space:nowrap}
.pill.teal{background:var(--teal-soft);color:var(--teal-ink)} .pill.tape{background:var(--tape-soft);color:var(--tape-ink)}
.pill.red{background:var(--red-soft);color:var(--red)} .pill.green{background:var(--green-soft);color:var(--green)} .pill.blue{background:var(--blue-soft);color:var(--blue)}
.debt{color:var(--red)} .credit{color:var(--green)}

.flash{padding:10px 14px;border-radius:var(--r);margin-bottom:16px;font-size:.92rem}
.flash.ok{background:var(--green-soft);color:#1e5a37;border:1px solid #c6e3d0}
.flash.err{background:var(--red-soft);color:#7e2318;border:1px solid #efc9c3}

/* formlar */
.form{display:grid;gap:14px}
.fields{display:grid;gap:14px 16px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field.wide{grid-column:1/-1}
label,.label{font-size:.84rem;color:var(--muted);font-weight:500}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],input[type=number],input[type=tel],input[type=search],select,textarea{
  font:inherit;font-size:.95rem;padding:8px 10px;border:1px solid #cfd8d5;border-radius:var(--r);background:#fff;color:var(--ink);width:100%;min-width:0}
textarea{min-height:84px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.check{display:flex;gap:8px;align-items:flex-start;font-size:.92rem;color:var(--ink)}
.check input{margin-top:3px}
.err-text{color:var(--red);font-size:.82rem}
.form-actions{display:flex;gap:8px;align-items:center;padding-top:6px}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.filters input,.filters select{width:auto;min-width:150px}
.filters input[type=search]{min-width:240px}
.segmented{display:inline-flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.segmented a{padding:7px 12px;font-size:.88rem;color:var(--muted);border-right:1px solid var(--line)}
.segmented a:last-child{border-right:0}
.segmented a.on{background:var(--carbon);color:#fff}
.segmented a:hover{text-decoration:none}

/* metrik satırı */
.figures{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px}
.figure{background:var(--paper);padding:14px 18px}
.figure .v{font-size:1.35rem;font-weight:600;font-variant-numeric:tabular-nums}
.figure .k{color:var(--muted);font-size:.84rem}

/* mezura: üretim aşama çubuğu */
.tape{position:relative;margin:4px 0 2px}
.tape-bar{height:22px;border-radius:4px;background:var(--tape);position:relative;overflow:hidden;
  background-image:repeating-linear-gradient(90deg,rgba(60,40,0,.55) 0 1px,transparent 1px 8px),
                   repeating-linear-gradient(90deg,rgba(60,40,0,.75) 0 1px,transparent 1px 40px);
  background-size:100% 6px,100% 11px;background-repeat:no-repeat;background-position:0 0,0 0}
.tape-fill{position:absolute;inset:0 auto 0 0;background:var(--teal);opacity:.92;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 1px,transparent 1px 8px);background-size:100% 6px;background-repeat:no-repeat}
.tape-stops{display:grid;margin-top:6px;font-size:.78rem;color:var(--muted)}
.tape-stops span{position:relative;padding-top:2px}
.tape-stops span.done{color:var(--teal-ink)}
.tape-stops span.cur{color:var(--ink);font-weight:600}
.tape.mini .tape-bar{height:8px;background-size:100% 3px,100% 5px}
.tape.cancel .tape-fill{background:var(--faint)}

/* kanban */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(196px,1fr);gap:12px;overflow-x:auto;padding-bottom:8px}
.lane{background:#e9eeec;border-radius:var(--r-lg);padding:10px;min-height:200px}
.lane h3{display:flex;justify-content:space-between;font-size:.86rem;padding:2px 4px 10px;color:var(--ink)}
.lane h3 .n{color:var(--muted);font-weight:500}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:10px 11px;margin-bottom:8px;font-size:.88rem;display:block;color:var(--ink)}
.card:hover{border-color:#aebbb7;text-decoration:none}
.card .t1{font-weight:600}
.card .t2{color:var(--muted);font-size:.82rem;margin-top:2px}
.card .meta{display:flex;gap:6px;align-items:center;margin-top:8px;flex-wrap:wrap}
.card.late{box-shadow:inset 3px 0 0 var(--red)}
.card.urgent .t1::after{content:"acil";margin-left:6px;font-size:.7rem;font-weight:600;color:var(--red);vertical-align:1px}

/* hasta kartı başlığı */
.patient-head{display:flex;gap:16px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.avatar{width:54px;height:54px;border-radius:50%;background:var(--carbon);color:#fff;display:grid;place-items:center;font-weight:600;font-size:1.05rem;flex:none}
.patient-head .info{min-width:0}
.patient-head .meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:.9rem;margin-top:3px}
.balance-box{margin-left:auto;text-align:right}
.balance-box .v{font-size:1.4rem;font-weight:600;font-variant-numeric:tabular-nums}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto}
.tabs a{padding:9px 14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;font-size:.93rem}
.tabs a.on{color:var(--ink);border-color:var(--teal);font-weight:500}
.tabs a:hover{text-decoration:none;color:var(--ink)}
.tabs .c{color:var(--faint);font-size:.8rem;margin-left:4px}
dl.kv{display:grid;grid-template-columns:150px 1fr;gap:8px 12px;margin:0;font-size:.92rem}
dl.kv dt{color:var(--muted)} dl.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}

/* zaman çizelgesi */
.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.timeline li:last-child{border-bottom:0}
.timeline .when{color:var(--faint);font-size:.82rem}

/* randevu haftası */
.week{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.day{background:var(--paper);min-height:340px;display:flex;flex-direction:column}
.day header{padding:9px 10px;border-bottom:1px solid var(--line-2);font-size:.85rem;display:flex;justify-content:space-between}
.day header b{font-weight:600}
.day.today header{background:var(--teal-soft)}
.day .slots{padding:6px;display:flex;flex-direction:column;gap:6px}
.appt{border-radius:var(--r);padding:7px 8px;font-size:.82rem;background:var(--plaster);border-left:3px solid var(--faint)}
.appt .h{font-weight:600;font-variant-numeric:tabular-nums}
.appt.olcu{border-color:var(--teal)} .appt.prova{border-color:var(--tape)} .appt.teslim{border-color:var(--green)} .appt.kontrol{border-color:var(--blue)} .appt.tamir{border-color:var(--red)}
.appt.geldi{opacity:.65} .appt.iptal,.appt.gelmedi{opacity:.5;text-decoration:line-through}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.82rem;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}

/* otomatik tamamlama */
.ac{position:relative}
.ac-list{position:absolute;z-index:50;left:0;right:0;top:100%;margin-top:4px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 8px 24px rgba(20,30,35,.12);max-height:300px;overflow:auto;display:none}
.ac-list.open{display:block}
.ac-list button{display:block;width:100%;text-align:left;border:0;background:none;padding:8px 10px;font:inherit;cursor:pointer;border-bottom:1px solid var(--line-2)}
.ac-list button:hover,.ac-list button.hl{background:var(--teal-soft)}
.ac-list small{display:block;color:var(--muted)}
.chosen{display:flex;gap:8px;align-items:center;padding:7px 10px;border:1px solid var(--teal);background:var(--teal-soft);border-radius:var(--r)}
.chosen b{font-weight:500}
.chosen button{margin-left:auto;border:0;background:none;color:var(--teal-ink);cursor:pointer;font:inherit;font-size:.85rem}

/* fatura satırları */
.lines td{padding:6px 6px} .lines input,.lines select{padding:6px 8px}
.lines .rm{border:0;background:none;color:var(--faint);cursor:pointer;font-size:1.1rem}
.totals{margin-left:auto;width:300px;font-size:.95rem}
.totals div{display:flex;justify-content:space-between;padding:4px 0}
.totals .grand{border-top:1px solid var(--line);margin-top:4px;padding-top:8px;font-weight:600;font-size:1.1rem}

/* grafik çubukları */
.bars{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;align-items:end;height:170px;padding:10px 4px 0}
.bars .col{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.bars .pair{display:flex;gap:3px;align-items:flex-end;height:100%;width:100%;justify-content:center}
.bars .b{width:42%;max-width:26px;border-radius:3px 3px 0 0;min-height:2px}
.bars .b.s{background:var(--carbon)} .bars .b.c{background:var(--teal)}
.bars .lbl{font-size:.78rem;color:var(--muted)}

/* giriş */
.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.login .art{background:var(--carbon);color:#c9d3d6;padding:48px;display:flex;flex-direction:column;justify-content:space-between}
.login .art h1{color:#fff;font-size:2rem;max-width:420px;line-height:1.15}
.login .art .tape{max-width:420px}
.login .box{display:grid;place-items:center;padding:32px}
.login form{width:100%;max-width:360px}

.pagination{display:flex;gap:4px;margin-top:14px;flex-wrap:wrap}
.pagination a,.pagination span{padding:6px 11px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);font-size:.88rem;color:var(--ink)}
.pagination .on{background:var(--carbon);color:#fff;border-color:var(--carbon)}
.pagination .off{color:var(--faint)}

dialog{border:0;border-radius:var(--r-lg);padding:0;width:min(560px,94vw);box-shadow:0 20px 60px rgba(10,20,25,.3)}
dialog::backdrop{background:rgba(20,30,35,.45)}
dialog header{padding:14px 18px;border-bottom:1px solid var(--line-2);display:flex;align-items:center}
dialog header button{margin-left:auto}
dialog .body{padding:16px 18px}

.print-only{display:none}
@media print{
  .side,.top,.no-print,.tabs{display:none!important}
  .shell{display:block} .content{padding:0;max-width:none} body{background:#fff}
  .panel{border:0} .print-only{display:block}
}
@media (max-width:1100px){.split{grid-template-columns:1fr}.g4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;left:-260px;width:240px;z-index:60;transition:left .2s}
  .side.open{left:0}
  .top .menu-btn{display:inline-flex}
  .top{padding:10px 16px} .content{padding:16px 16px 50px}
  .g2,.g3,.g4{grid-template-columns:1fr}
  .top .actions .btn span{display:none}
  .login{grid-template-columns:1fr}.login .art{display:none}
  dl.kv{grid-template-columns:1fr}
  .tape-stops span:not(.cur){visibility:hidden}
  .tape-stops span.cur{white-space:nowrap}
  .balance-box{margin-left:0;text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}