/* Brand22 kurumsal yazı tipi */
@font-face{font-family:Gilroy;src:url(assets/fonts/Gilroy-Regular.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Gilroy;src:url(assets/fonts/Gilroy-Medium.ttf) format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:Gilroy;src:url(assets/fonts/Gilroy-Bold.ttf) format("truetype");font-weight:600 700;font-display:swap}
@font-face{font-family:Gilroy;src:url(assets/fonts/Gilroy-Heavy.ttf) format("truetype");font-weight:800 900;font-display:swap}

/* Brand22 paleti: Electric Blue #3B46F2 · Royal Blue #2635D9 · Cool Gray #F7F8FC · Navy #1B2452 · Midnight #111111 */
:root{
  --bg:#070A1C;--panel:#0D1230;--panel2:#141A3E;--line:#222A5A;--text:#F7F8FC;--muted:#8D94C4;
  --accent:#3B46F2;--royal:#2635D9;--accent2:#3FA9FF;--navy:#1B2452;
  --green:#22C55E;--red:#EF4444;--orange:#F59E0B;--yellow:#EAB308;
  --r:16px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:radial-gradient(1200px 700px at 85% -10%,#2635D933,transparent 60%),radial-gradient(900px 600px at 10% 110%,#3FA9FF1a,transparent 60%),var(--bg);color:var(--text);font:14.5px/1.5 Gilroy,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;display:flex;overflow:hidden}
h1,h2,h3,h4,.kpi .v,.fee{font-family:Gilroy,"Segoe UI",sans-serif}
.head h1{font-weight:800}
.brand-logo{display:block;height:34px;width:auto;max-width:100%;object-fit:contain;align-self:flex-start}
.auth-card .brand-logo{height:40px;margin-bottom:6px}
button,input,select,textarea{font:inherit;color:inherit}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#2a2a3d;border-radius:10px}::-webkit-scrollbar-track{background:transparent}
.muted{color:var(--muted)}
.hidden{display:none!important}

/* Giriş */
body.auth{display:grid;place-items:center;background:radial-gradient(ellipse 90% 60% at 50% 115%,#3FA9FF55,transparent 60%),radial-gradient(ellipse 70% 80% at 10% 0%,#2635D9aa,transparent 55%),radial-gradient(ellipse 60% 70% at 100% 40%,#3B46F266,transparent 60%),#05071A;overflow:auto;padding:20px}
.auth-card{backdrop-filter:blur(12px);background:#0D1230cc!important}
.auth-tag{color:var(--muted);font-size:12px;letter-spacing:3px;text-transform:uppercase;margin-top:-4px}
.auth-card{width:min(400px,100%);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:14px;box-shadow:0 30px 80px #0008}
.auth-card h2{margin:6px 0 0}.auth-card p{margin:0}
.auth-card label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted)}
.auth-card input{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 12px;outline:none;color:var(--text)}
.auth-card input:focus{border-color:var(--accent)}
.auth-card .btn{padding:12px;margin-top:4px}
.auth-err{color:#f87171;font-weight:600;min-height:20px}

/* Kenar çubuğu */
.side{width:236px;flex:none;background:linear-gradient(180deg,#0D1230,#0A0E28);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 14px;z-index:30}
.logo{display:flex;align-items:center;gap:10px;padding:4px 8px 22px}
.auth-card .logo{padding:0 0 6px}
.logo-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;font-weight:800;font-size:16px;color:#fff;box-shadow:0 6px 20px #3B46F255}
.logo b{font-size:17px;letter-spacing:.2px}.logo small{display:block;color:var(--muted);font-size:11.5px;margin-top:-2px}
.nav{display:flex;flex-direction:column;gap:3px}
.nav button{all:unset;cursor:pointer;display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--muted);font-weight:500;transition:.15s}
.nav button:hover{background:var(--panel2);color:var(--text)}
.nav button.on{background:linear-gradient(90deg,#3B46F22e,#3B46F208);color:#fff;box-shadow:inset 3px 0 0 var(--accent)}
.nav .ico{width:20px;text-align:center;font-size:16px}
.nav .count{margin-left:auto;background:var(--red);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:1px 7px}
.nav .sep{height:1px;background:var(--line);margin:8px 6px}
.side-foot{margin-top:auto;font-size:12.5px;color:var(--muted);padding:12px 8px 0;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px}
.side-foot .me{flex:1;min-width:0}.side-foot .me b{display:block;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.menu-btn{display:none}

/* Ana alan */
main{flex:1;overflow:auto;padding:28px 34px 60px}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.head h1{margin:0;font-size:26px;letter-spacing:-.3px}
.head p{margin:4px 0 0;color:var(--muted)}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:var(--panel2);padding:8px 14px;border-radius:10px;cursor:pointer;font-weight:600;transition:.15s;white-space:nowrap}
.btn:hover{border-color:#3a3a55;background:#22223a}
.btn:disabled{opacity:.5;cursor:wait}
.btn.pri{background:linear-gradient(135deg,var(--accent),#2635D9);border-color:transparent;color:#fff;box-shadow:0 6px 18px #3B46F240}
.btn.pri:hover{filter:brightness(1.1)}
.btn.ai{background:linear-gradient(135deg,#3FA9FF,#3B46F2);border-color:transparent;color:#fff}
.btn.ok{background:#22c55e1f;border-color:#22c55e55;color:#4ade80}
.btn.danger{background:#ef44441a;border-color:#ef444455;color:#f87171}
.btn.sm{padding:5px 10px;font-size:12.5px;border-radius:8px}
.icon-btn{all:unset;cursor:pointer;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;color:var(--muted);flex:none}
.icon-btn:hover{background:var(--panel2);color:var(--text)}
.inp{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 12px;outline:none;color:var(--text)}
.inp:focus{border-color:var(--accent)}

.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:16px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;position:relative;overflow:hidden}
.kpi .l{color:var(--muted);font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.kpi .v{font-size:26px;font-weight:800;margin-top:6px;letter-spacing:-.5px}
.kpi .s{color:var(--muted);font-size:12.5px;margin-top:2px}
.kpi::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:var(--glow,#3B46F2);opacity:.12;filter:blur(8px)}
.bar{height:6px;background:#26263a;border-radius:6px;overflow:hidden;margin-top:10px}
.bar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--accent),var(--accent2))}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0}
.card h3{margin:0 0 14px;font-size:15px;display:flex;align-items:center;gap:8px}
.card h3 .sp{margin-left:auto}
.two{grid-template-columns:1.25fr 1fr}
@media(max-width:1100px){.two{grid-template-columns:1fr}}

.list{display:flex;flex-direction:column;gap:6px}
.li{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--panel2);border:1px solid transparent;border-radius:11px;transition:.15s}
.li:hover{border-color:var(--line)}
.li .name{font-weight:600}
.li .sub{color:var(--muted);font-size:12.5px}
.li .grow{flex:1;min-width:0}
.dot{width:10px;height:10px;border-radius:50%;flex:none}
.empty{color:var(--muted);text-align:center;padding:26px 10px;font-size:13.5px}

.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap;background:#ffffff0d;color:var(--muted)}
.badge.ok{background:#22c55e1a;color:#4ade80}
.badge.wait{background:#eab3081a;color:#facc15}
.badge.due{background:#f59e0b1f;color:#fbbf24}
.badge.late{background:#ef44441f;color:#f87171}
.badge.muted{background:#ffffff0a;color:var(--muted)}
.badge.pur{background:#3B46F226;color:#b4a3ff}
.chip{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:6px;background:#ffffff0d;color:#c9c9dc;margin:2px 4px 2px 0}

.alert{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;background:var(--panel2);font-size:13.5px}
.alert.r{box-shadow:inset 3px 0 0 var(--red)}.alert.o{box-shadow:inset 3px 0 0 var(--orange)}.alert.b{box-shadow:inset 3px 0 0 var(--accent2)}

/* Müşteriler */
.clients{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.cc{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;cursor:pointer;transition:.18s;position:relative;overflow:hidden}
.cc:hover{transform:translateY(-3px);border-color:#3a3a55;box-shadow:0 12px 30px #0006}
.cc::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--c)}
.cc .top{display:flex;align-items:center;gap:12px}
.avatar{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:800;font-size:16px;color:#111;background:var(--c);flex:none}
.cc h4{margin:0;font-size:16px}.cc .sec{color:var(--muted);font-size:12.5px}
.cc .fee{font-size:22px;font-weight:800;margin:14px 0 2px;letter-spacing:-.4px}
.cc .fee small{font-size:12.5px;color:var(--muted);font-weight:500}
.cc .meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12.5px;margin-top:12px}
.inactive{opacity:.5}

/* Tablo */
.tbl-wrap{overflow-x:auto}
table{width:100%;min-width:820px;border-collapse:separate;border-spacing:0 6px}
th{text-align:left;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:0 12px}
td{background:var(--panel2);padding:11px 12px}
td:first-child{border-radius:11px 0 0 11px}td:last-child{border-radius:0 11px 11px 0}
tr.paid td{opacity:.65}

.monthnav{display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:4px}
.monthnav b{min-width:130px;text-align:center}

/* Takvim */
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.fchip{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:20px;border:1px solid var(--line);background:var(--panel);font-size:13px;color:var(--muted)}
.fchip.on{color:#fff;border-color:var(--c,var(--accent));background:color-mix(in srgb,var(--c,var(--accent)) 18%,transparent)}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal .dh{color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;padding:4px 8px}
.cell{background:var(--panel);border:1px solid var(--line);border-radius:12px;min-height:118px;padding:7px;display:flex;flex-direction:column;gap:4px;transition:.12s;min-width:0}
.cell.out{opacity:.4}
.cell.today{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.cell .dn{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;font-weight:700;color:var(--muted);padding:0 2px}
.cell.today .dn span{background:var(--accent);color:#fff;border-radius:6px;padding:0 6px}
.cell .add{all:unset;cursor:pointer;opacity:0;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:15px;color:var(--muted)}
.cell:hover .add{opacity:1}.cell .add:hover{background:var(--panel2);color:#fff}
.over{border-color:var(--accent2)!important;background:#3FA9FF10!important}
.ev{cursor:grab;font-size:12px;padding:4px 7px;border-radius:7px;background:color-mix(in srgb,var(--c) 20%,#14141f);border-left:3px solid var(--c);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:5px}
.ev:hover{filter:brightness(1.25)}
.ev.done{opacity:.55;text-decoration:line-through}
.ev .st{width:7px;height:7px;border-radius:50%;flex:none}
.dragging{opacity:.4}

/* Pano */
.board{display:grid;grid-template-columns:repeat(7,minmax(210px,1fr));gap:12px;overflow-x:auto;padding-bottom:10px}
.col{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px;min-height:400px;display:flex;flex-direction:column;gap:8px}
.col-h{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px;padding:4px 4px 6px}
.col-h .n{margin-left:auto;color:var(--muted);font-weight:600}
.task{cursor:grab;background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:10px 11px;border-left:3px solid var(--c);transition:.12s}
.task:hover{border-color:#3a3a55}
.task .t{font-weight:600;margin-bottom:6px}
.task .m{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.task .hook{font-size:12px;color:#b8b8d0;font-style:italic;margin:-2px 0 6px}

/* AI */
.ai-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;align-items:start}
@media(max-width:1100px){.ai-grid{grid-template-columns:1fr}}
.chat{display:flex;flex-direction:column;height:calc(100vh - 170px);min-height:460px}
.chat-log{flex:1;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:4px 2px 12px}
.msg{max-width:88%;padding:11px 14px;border-radius:14px;line-height:1.55;word-wrap:break-word}
.msg.user{align-self:flex-end;background:linear-gradient(135deg,#3B46F2,#2635D9);color:#fff;border-bottom-right-radius:4px}
.msg.assistant{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg ul{margin:6px 0;padding-left:20px}
.chat-in{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.chat-in textarea{flex:1;resize:none;height:46px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px;outline:none;color:var(--text)}
.chat-in textarea:focus{border-color:var(--accent)}
.sugg{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.sugg button{all:unset;cursor:pointer;font-size:12.5px;padding:6px 11px;border-radius:20px;border:1px solid var(--line);color:#c9c9dc;background:var(--panel2)}
.sugg button:hover{border-color:var(--accent);color:#fff}
.idea{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px}
.idea .t{font-weight:700;margin-bottom:4px}
.idea .hook{font-style:italic;color:#c9c9dc;margin-bottom:6px}
.idea .cap{color:var(--muted);font-size:12.5px;white-space:pre-wrap;max-height:90px;overflow:auto}
.typing{display:inline-flex;gap:4px}.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite}.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.spin{display:inline-block;width:14px;height:14px;border:2px solid #fff6;border-top-color:#fff;border-radius:50%;animation:rot .8s linear infinite;vertical-align:-2px}
@keyframes rot{to{transform:rotate(360deg)}}

/* Günlük kontrol */
.check .cbox{all:unset;cursor:pointer;width:24px;height:24px;border-radius:8px;border:2px solid #3a448a;display:grid;place-items:center;flex:none;font-weight:800;color:#fff;transition:.15s}
.check .cbox:hover{border-color:var(--accent)}
.check.done .cbox{background:linear-gradient(135deg,var(--royal),var(--accent));border-color:transparent}
.check.done .name{text-decoration:line-through;color:var(--muted)}
.btn.big{padding:15px;font-size:16px;border-radius:14px}
.done-banner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:linear-gradient(135deg,#22c55e22,#3B46F222);border-color:#22c55e55}
.kpi-mini{font-size:22px;font-weight:800}
.hist{display:grid;grid-template-columns:repeat(14,1fr);gap:5px}
.hday{aspect-ratio:1;border-radius:7px;background:#1a2150;display:grid;place-items:center;font-size:10px;color:var(--muted)}
.hday.ok{background:linear-gradient(135deg,var(--royal),var(--accent2));color:#fff}
.hday.part{background:#3B46F255;color:#fff}

/* Modal */
.modal{position:fixed;inset:0;background:#05050acc;backdrop-filter:blur(6px);display:grid;place-items:center;z-index:50;padding:20px}
.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;width:min(640px,100%);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 30px 80px #000a;animation:pop .18s ease}
.modal-card.wide{width:min(900px,100%)}
@keyframes pop{from{transform:scale(.96);opacity:0}}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:17px}
#mBody{padding:20px 22px;overflow:auto}
.modal-foot{display:flex;gap:8px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--line);flex-wrap:wrap}
.modal-foot .left{margin-right:auto}
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .full{grid-column:1/-1}
.form label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted)}
.form input:not([type=checkbox]):not([type=color]),.form select,.form textarea{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 11px;outline:none;font-weight:400;color:var(--text);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--accent)}
.form textarea{min-height:90px;resize:vertical}
.checks{display:flex;flex-wrap:wrap;gap:6px}
.checks label{flex-direction:row;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 10px;cursor:pointer;color:var(--text);font-weight:500}
.checks input{accent-color:var(--accent)}
input[type=color]{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;background:var(--bg);padding:3px;cursor:pointer}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.stat{background:var(--panel2);border-radius:12px;padding:12px}
.stat .l{font-size:11.5px;color:var(--muted);font-weight:600}.stat .v{font-size:18px;font-weight:800;margin-top:2px}
.sect{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin:18px 0 8px}

#toasts{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:8px;z-index:99}
.toast{background:#1f1f30;border:1px solid var(--line);padding:11px 16px;border-radius:12px;box-shadow:0 10px 30px #0008;animation:pop .2s;font-weight:500;max-width:380px}
.toast.ok{border-color:#22c55e66}.toast.err{border-color:#ef444466}

svg text{fill:var(--muted);font-size:11px;font-family:inherit}

/* Mobil */
@media(max-width:820px){
  .side{position:fixed;inset:0 auto 0 0;transform:translateX(-100%);transition:.2s;box-shadow:20px 0 60px #000a}
  .side.open{transform:none}
  .menu-btn{display:grid;place-items:center;position:fixed;top:12px;left:12px;z-index:40;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:18px;cursor:pointer}
  main{padding:66px 16px 40px}
  .stats{grid-template-columns:1fr 1fr}
  .form{grid-template-columns:1fr}
  .cal{gap:3px}.cell{min-height:80px;padding:4px}.ev{font-size:10.5px;padding:2px 4px}
}
