@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@500;600;700;800;900&display=swap');
:root{
  --ink:#16204a; --ink2:#2b3566; --muted:#5d6687; --line:#e7ebf5;
  --bg1:#e8eefc; --bg2:#f1f3fc;
  --blue:#2f7bf5; --green:#22b35a; --orange:#f59e1b; --red:#ec3d5a; --purple:#8b5cf6; --gold:#f5b62e;
  --card:#ffffff; --shadow:0 10px 30px rgba(31,55,120,.08), 0 2px 6px rgba(31,55,120,.05);
  --r:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Nunito',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 80% -10%,#dfe8ff 0%,transparent 60%),linear-gradient(160deg,var(--bg1),var(--bg2));-webkit-font-smoothing:antialiased;font-weight:600}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
svg.i{width:22px;height:22px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hidden{display:none!important}

/* ===== LAYOUT ===== */
.app{display:flex;min-height:100vh;padding:14px;gap:0}
.side{width:262px;flex:none;border-radius:24px 0 0 24px;background:linear-gradient(180deg,#14295e 0%,#0f2253 42%,#123270 75%,#1a4a9a 100%);color:#fff;position:sticky;top:14px;height:calc(100vh - 28px);display:flex;flex-direction:column;overflow:hidden;z-index:30;box-shadow:0 20px 40px rgba(14,33,82,.25)}
.side .swoosh{position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none}
.brand{display:flex;align-items:center;gap:12px;padding:30px 22px 28px}
.brand .logo{width:46px;height:46px;flex:none}
.brand b{display:block;font-size:18px;font-weight:800;letter-spacing:-.2px;line-height:1.15}
.brand small{display:block;font-size:12px;white-space:nowrap;opacity:.85;font-weight:600}
.nav{display:flex;flex-direction:column;gap:6px;padding:0 10px;position:relative;z-index:2}
.nav a{display:flex;align-items:center;gap:16px;padding:13px 20px;border-radius:12px;color:#fff;text-decoration:none;font-size:17px;font-weight:700;border:1.5px solid transparent;transition:.15s}
.nav a svg.i{width:26px;height:26px;stroke-width:1.8}
.nav a:hover{background:rgba(255,255,255,.07)}
.nav a.on{background:linear-gradient(90deg,rgba(247,186,64,.95) 0%,rgba(205,160,80,.55) 30%,rgba(120,140,200,.35) 100%);border-color:#f7c35a;box-shadow:0 6px 18px rgba(245,182,46,.25),inset 0 1px 0 rgba(255,255,255,.3)}
.side .user{margin:auto 18px 22px;position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(20,40,90,.55);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px)}
.side .user .av{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.15);display:grid;place-items:center}
.side .user b{font-size:15px;display:block}.side .user small{font-size:12.5px;opacity:.85}
.side .user .chev{margin-left:auto;opacity:.9}

.main{flex:1;min-width:0;background:rgba(255,255,255,.55);border-radius:0 24px 24px 0;border:1px solid rgba(255,255,255,.8);backdrop-filter:blur(10px);padding:20px 22px 26px;box-shadow:var(--shadow)}
.top{display:flex;align-items:center;gap:18px;margin-bottom:18px}
.top .ham{width:40px;height:40px;display:grid;place-items:center;color:var(--ink)}
.top .ham svg{width:28px;height:28px}
.top h1{font-size:25px;font-weight:800;letter-spacing:-.3px}
.top p{font-size:14px;color:var(--muted);font-weight:600}
.top .sp{flex:1}
.pill{display:flex;align-items:center;gap:10px;height:44px;padding:0 16px;border-radius:12px;background:#fff;border:1px solid var(--line);box-shadow:0 2px 6px rgba(31,55,120,.06);font-weight:700;font-size:16px;position:relative}
.pill select{position:absolute;inset:0;opacity:0;cursor:pointer}
.pill input[type=month]{position:absolute;inset:0;opacity:0;cursor:pointer}
.bell{width:44px;height:44px;display:grid;place-items:center;position:relative;color:var(--ink)}
.bell svg{width:27px;height:27px}
.bell .dot{position:absolute;top:8px;right:9px;width:10px;height:10px;border-radius:50%;background:#ff4b4b;border:2px solid #fff}
.me{width:48px;height:48px;border-radius:50%;background:linear-gradient(160deg,#1d3b86,#0f2253);color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px rgba(15,34,83,.3)}

/* ===== STAT CARDS ===== */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:22px}
.stat{position:relative;overflow:hidden;border-radius:16px;padding:16px 18px;color:#fff;min-height:138px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 10px 22px rgba(0,0,0,.08)}
.stat::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 0% 0%,rgba(255,255,255,.28),transparent 55%),linear-gradient(180deg,rgba(255,255,255,.12),transparent 40%);pointer-events:none}
.stat .ic{position:absolute;top:16px;left:18px;width:40px;height:40px;display:grid;place-items:center}
.stat .ic svg{width:34px;height:34px;stroke-width:2.2}
.stat .ic.circ{border-radius:50%;background:rgba(255,255,255,.28)}
.stat .ic.circ svg{width:24px;height:24px;stroke-width:3}
.stat .ic.wcirc{border-radius:50%;background:#fff;width:36px;height:36px}
.stat .ic.wcirc svg{width:20px;height:20px;stroke-width:3.2}
.stat span{font-size:17px;font-weight:700;opacity:.97;position:relative}
.stat b{font-size:34px;font-weight:900;line-height:1.1;position:relative;letter-spacing:-.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat b small{font-size:26px;font-weight:800}
.s-blue{background:linear-gradient(140deg,#3d8dff 0%,#1f65ec 100%)}
.s-green{background:linear-gradient(140deg,#48d27c 0%,#1ea653 100%)}
.s-orange{background:linear-gradient(140deg,#ffb63f 0%,#f5861d 100%)}
.s-red{background:linear-gradient(140deg,#ff6f82 0%,#ea3b59 100%)}
.s-red .ic.wcirc{color:#ec3d5a}
.s-purple{background:linear-gradient(140deg,#a970ff 0%,#7646dd 100%)}

/* ===== CARDS ===== */
.grid2{display:grid;grid-template-columns:1.05fr 1fr;gap:14px;margin-bottom:14px}
.grid2b{display:grid;grid-template-columns:1fr .95fr;gap:14px;margin-bottom:14px}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);border:1px solid rgba(231,235,245,.8);padding:16px 18px}
.ch{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ch .ico{width:36px;height:36px;border-radius:10px;background:#eaf1ff;color:var(--blue);display:grid;place-items:center}
.ch .ico svg{width:22px;height:22px}
.ch .ico.plain{background:none;width:auto;height:auto}
.ch .ico.orange{background:none;color:var(--orange)}
.ch .ico.gold{background:none;color:var(--gold)}
.ch h3{font-size:18.5px;font-weight:800;letter-spacing:-.2px}
.ch h3 small{font-size:14px;font-weight:600;color:var(--muted)}
.ch .sub{font-size:14px;color:var(--muted);font-weight:600}
.ch .more,.ch .tumu{text-decoration:none;color:var(--ink)}
.ch .more{margin-left:auto;color:var(--ink);display:grid;place-items:center}
.ch .tumu{margin-left:auto;display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:700;box-shadow:0 2px 6px rgba(31,55,120,.05)}
.ch .tumu svg{width:16px;height:16px}

.sum{display:flex;align-items:center;gap:18px}
.donut{position:relative;width:156px;height:156px;flex:none}
.donut svg{width:100%;height:100%;transform:rotate(-90deg)}
.donut .t{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.donut .t b{font-size:34px;font-weight:800;letter-spacing:-.5px;line-height:1}
.donut .t small{font-size:14px;font-weight:600;color:var(--ink2);margin-top:4px}
.legend{flex:1;display:flex;flex-direction:column;gap:8px}
.legend div{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:#f6f8fd;border:1px solid #eef1f8;font-size:15px;font-weight:600}
.legend i{width:13px;height:13px;border-radius:50%}
.legend b{margin-left:auto;font-size:18px;font-weight:800}

.bars{display:grid;grid-template-columns:28px 1fr;height:170px;margin-top:4px}
.yax{display:flex;flex-direction:column;justify-content:space-between;font-size:12.5px;color:var(--muted);padding-bottom:22px;text-align:right;padding-right:6px}
.plot{position:relative;display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:14px;padding:0 6px 22px;background:repeating-linear-gradient(180deg,#eef1f7 0 1px,transparent 1px calc((100% - 22px)/5))}
.plot .b{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center}
.plot .b i{display:block;width:100%;max-width:34px;border-radius:3px 3px 0 0;background:linear-gradient(180deg,#3a8bff,#1e6ff2);min-height:2px;transition:height .4s}
.plot .b.l i{background:linear-gradient(180deg,#8dbcff,#5d9cf8)}
.plot .b.ll i{background:linear-gradient(180deg,#b5d3ff,#8ab8fb)}
.plot .b em{position:absolute;bottom:-22px;font-style:normal;font-size:12.5px;color:var(--ink2);font-weight:600}
.plot .b:hover::after{content:attr(data-v);position:absolute;top:-4px;font-size:11px;background:var(--ink);color:#fff;padding:2px 6px;border-radius:6px}

.qa{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.qa button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px 6px;border-radius:12px;min-height:96px;font-size:14.5px;font-weight:700;line-height:1.2;text-align:center;border:1.5px solid;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 3px 8px rgba(31,55,120,.06);transition:.15s}
.qa button:hover{transform:translateY(-2px)}
.qa svg{width:32px;height:32px;stroke-width:2}
.qa .q1{background:linear-gradient(180deg,#e9f8ee,#d8f2e1);border-color:#bfe7cd}.qa .q1 svg{color:#22a956}
.qa .q2{background:linear-gradient(180deg,#eaf2ff,#dbe8ff);border-color:#c4d8fb}.qa .q2 svg{color:#2f7bf5}
.qa .q3{background:linear-gradient(180deg,#f2ebff,#e6dbff);border-color:#d6c6fb}.qa .q3 svg{color:#8b5cf6}
.qa .q4{background:linear-gradient(180deg,#fff4df,#ffe7bd);border-color:#fbd38d}.qa .q4 svg{color:#22b35a}

.month .r{display:flex;justify-content:flex-end;font-size:16px;font-weight:700;margin:6px 0 12px}
.prog{height:18px;border-radius:999px;background:#ece9fb;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.05)}
.prog i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#9a6cff,#6f47e0);transition:width .5s}
.month .note{margin-top:14px;padding:10px 12px;border-radius:10px;background:#f6f8fd;font-size:15px;color:var(--ink2)}

.list{display:flex;flex-direction:column;gap:6px}
.row{display:flex;align-items:center;gap:12px;padding:6px 10px;border-radius:12px;background:#f7f9fd;border:1px solid #eef1f8;cursor:pointer}
.row:hover{background:#f0f4fc}
.av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;flex:none;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.row .nm{min-width:0;flex:1}
.row .nm b{display:block;font-size:15.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .nm small{display:block;font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .tm{font-size:14.5px;font-weight:600;color:var(--ink2);min-width:100px;text-align:right}
.tag{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:14px;font-weight:700;white-space:nowrap}
.tag svg{width:16px;height:16px;stroke-width:3}
.t-ok{background:#e2f6e8;color:#1a9d4b}
.t-leave{background:#fff2d3;color:#e58a00}
.t-abs{background:#ffe3e7;color:#e1344d}
.t-abs::before{content:"";width:8px;height:8px;border-radius:50%;background:#e1344d}
.t-rep{background:#ffe8ea;color:#e1344d}
.t-yil{background:#e3eeff;color:#1f6ae6}
.t-none{background:#eef1f7;color:#6a7393}
.t-hol{background:#efe7ff;color:#7646dd}
.t-job{background:#dff5f7;color:#0e8a99}
.date{padding:5px 10px;border-radius:999px;background:#eef1f8;font-size:13.5px;font-weight:700;white-space:nowrap}
.empty{padding:22px 10px;text-align:center;color:var(--muted);font-size:14.5px}

/* ===== GENERIC PAGES ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border-radius:12px;font-weight:800;font-size:15px;background:linear-gradient(140deg,#3d8dff,#1f65ec);color:#fff;box-shadow:0 6px 14px rgba(31,101,236,.25)}
.btn svg{width:19px;height:19px}
.btn.g{background:linear-gradient(140deg,#48d27c,#1ea653);box-shadow:0 6px 14px rgba(30,166,83,.25)}
.btn.o{background:linear-gradient(140deg,#ffb63f,#f5861d);box-shadow:0 6px 14px rgba(245,134,29,.25)}
.btn.p{background:linear-gradient(140deg,#a970ff,#7646dd);box-shadow:0 6px 14px rgba(118,70,221,.25)}
.btn.r{background:linear-gradient(140deg,#ff6f82,#ea3b59);box-shadow:0 6px 14px rgba(234,59,89,.2)}
.btn.w{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 2px 6px rgba(31,55,120,.06)}
.btn.sm{height:34px;padding:0 12px;font-size:13.5px;border-radius:10px}
.btns{display:flex;flex-wrap:wrap;gap:8px}
.ibtn{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--muted);background:#fff;border:1px solid var(--line)}
.ibtn svg{width:17px;height:17px}
.ibtn:hover{color:var(--blue)}
.ibtn.del:hover{color:var(--red)}
.ptitle{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ptitle h2{font-size:21px;font-weight:800;margin-right:auto}
.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:14.5px}
.tbl th{text-align:left;font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;font-weight:800;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:10px;border-bottom:1px solid #f0f2f8;white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl td.n,.tbl th.n{text-align:right}
.tbl tfoot td{font-weight:800;background:#f6f8fd;border-top:1px solid var(--line)}
.scroll{overflow-x:auto}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.kv div{padding:12px 14px;border-radius:14px;background:#f6f8fd;border:1px solid #eef1f8}
.kv small{display:block;font-size:13px;color:var(--muted);font-weight:700}
.kv b{font-size:21px;font-weight:900}
.kv .pos b{color:#1a9d4b}.kv .neg b{color:#e1344d}.kv .blu b{color:#1f6ae6}
.fcard{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#f7f9fd;border:1px solid #eef1f8}
.fcard .sw{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#fff}
.fcard .sw svg{width:22px;height:22px}
.fcard .nm{flex:1;min-width:0}
.fcard .nm b{display:block;font-size:16px}
.fcard .nm small{color:var(--muted);font-size:13px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.tabs{display:flex;flex-wrap:wrap;gap:6px;padding:4px;border-radius:12px;background:#eef1f8;width:fit-content;max-width:100%;margin-bottom:12px}
.tabs button{padding:8px 14px;border-radius:9px;font-weight:800;font-size:14px;color:var(--muted)}
.tabs button.on{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(31,55,120,.08)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.filters select,.filters input{height:40px;border-radius:10px;border:1px solid var(--line);background:#fff;padding:0 10px;font-weight:700;font-size:14.5px}

/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .h{font-size:12.5px;font-weight:800;color:var(--muted);text-align:center;padding:4px 0}
.cal .d{min-height:78px;border-radius:12px;background:#f7f9fd;border:1px solid #eef1f8;padding:6px;cursor:pointer;display:flex;flex-direction:column;gap:3px;transition:.12s;overflow:hidden}
.cal .d:hover{border-color:#bcd2fb;background:#f0f5ff}
.cal .d.x{background:transparent;border:0;cursor:default}
.cal .d.today{border:2px solid var(--gold)}
.cal .d .n{font-size:13px;font-weight:800;display:flex;justify-content:space-between}
.cal .d .n em{font-style:normal;font-size:11px;color:var(--muted)}
.cal .d .e{font-size:11px;font-weight:800;padding:2px 6px;border-radius:6px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal .d.we .n{color:#e1344d}
.cal .d .plan{font-size:10.5px;color:#9aa3bf;border:1px dashed #cdd5ea;border-radius:6px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== MODAL ===== */
.ov{position:fixed;inset:0;background:rgba(12,24,58,.45);backdrop-filter:blur(3px);z-index:100;display:grid;place-items:center;padding:16px;animation:fi .15s}
@keyframes fi{from{opacity:0}}
.md{background:#fff;border-radius:20px;width:100%;max-width:520px;max-height:92vh;overflow:auto;box-shadow:0 30px 60px rgba(12,24,58,.3);animation:up .2s}
@keyframes up{from{transform:translateY(20px);opacity:0}}
.md header{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
.md header h3{font-size:18px;font-weight:800;flex:1}
.md .bd{padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.md footer{display:flex;gap:8px;justify-content:flex-end;padding:12px 18px 18px;flex-wrap:wrap}
.fg{display:flex;flex-direction:column;gap:5px}
.fg label{font-size:13px;font-weight:800;color:var(--muted)}
.fg input,.fg select,.fg textarea{height:44px;border-radius:11px;border:1.5px solid var(--line);padding:0 12px;font-weight:700;font-size:15.5px;background:#fbfcff;outline:0;width:100%}
.fg textarea{height:70px;padding:10px 12px;resize:vertical}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:#8db5fb;background:#fff}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fr3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{padding:8px 12px;border-radius:10px;border:1.5px solid var(--line);font-weight:800;font-size:14px;background:#fbfcff}
.seg button.on{border-color:var(--blue);background:#eaf1ff;color:#1f65ec}
.prev{display:flex;gap:8px;flex-wrap:wrap}
.prev span{padding:6px 10px;border-radius:9px;background:#f3f6fd;font-size:13.5px;font-weight:700}
.chk{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14.5px}
.chk input{width:18px;height:18px}
.colors{display:flex;gap:8px;flex-wrap:wrap}
.colors button{width:30px;height:30px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px var(--line)}
.colors button.on{box-shadow:0 0 0 2px var(--ink)}
.dayitem{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#f7f9fd;border:1px solid #eef1f8}
.dayitem .nm{flex:1}
.dayitem .nm small{display:block;color:var(--muted);font-size:13px}

.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:11px 18px;border-radius:12px;font-weight:700;z-index:200;box-shadow:0 10px 24px rgba(0,0,0,.25);animation:up .2s}
.dd{position:absolute;right:0;top:52px;width:320px;background:#fff;border-radius:16px;box-shadow:0 20px 40px rgba(12,24,58,.2);border:1px solid var(--line);padding:10px;z-index:60}
.dd h4{font-size:15px;padding:6px 8px}
.dd .it{padding:10px;border-radius:10px;font-size:14px;display:flex;gap:10px;align-items:center}
.dd .it:hover{background:#f4f6fc}

/* login */
.login{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 18px;background:#0e1520;position:relative;overflow:hidden}
.login .bgl{position:absolute;inset:-10%;filter:blur(60px);opacity:.9;pointer-events:none;
  background:radial-gradient(28% 22% at 0% 55%,rgba(56,120,170,.75),transparent 70%),radial-gradient(25% 22% at 100% 62%,rgba(40,140,110,.6),transparent 70%),radial-gradient(40% 30% at 50% 0%,rgba(30,60,110,.55),transparent 70%),radial-gradient(35% 25% at 50% 105%,rgba(20,40,80,.6),transparent 70%)}
.login .box{position:relative;z-index:2;width:100%;max-width:440px;border-radius:30px;padding:30px 30px 34px;background:linear-gradient(180deg,rgba(226,229,233,.97),rgba(218,222,227,.96));border:1px solid rgba(255,255,255,.55);box-shadow:0 30px 70px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.7);animation:up .35s}
.login .hero{display:block;width:100%;max-width:320px;margin:0 auto 4px}
.login .hi{text-align:center;margin-bottom:22px}
.login .hi b{display:block;font-size:26px;font-weight:900;color:#14295e;letter-spacing:-.3px}
.login .hi span{font-size:14.5px;color:#56607a;font-weight:600}
.login label{display:block;font-size:16px;font-weight:800;color:#16204a;margin:0 0 8px}
.login .inp{position:relative;margin-bottom:18px}
.login input{width:100%;height:58px;border-radius:16px;border:2px solid #f3f5f8;background:#fbfcfd;padding:0 18px;font-size:17px;font-weight:600;outline:0;transition:.15s;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.login input::placeholder{color:#9aa1ae}
.login input:focus{border-color:#1572b6;box-shadow:0 0 0 5px rgba(21,114,182,.18);background:#fff}
.login .inp.pw input{padding-right:110px;letter-spacing:.5px}
.login .show{position:absolute;right:8px;top:8px;height:42px;padding:0 16px;border-radius:12px;border:1.5px solid #e1e5ec;background:#fff;color:#56607a;font-weight:700;font-size:15px}
.login .go{width:100%;height:60px;margin-top:10px;border-radius:18px;background:linear-gradient(180deg,#0a80c4,#0270b4);color:#fff;font-size:19px;font-weight:800;box-shadow:0 14px 26px rgba(2,112,180,.35);transition:.15s}
.login .go:hover{filter:brightness(1.06)}
.login .go:disabled{opacity:.7}
.login .err{color:#d72f4a;font-size:14.5px;font-weight:700;min-height:20px;margin-top:12px;text-align:center}
.login .info{font-size:13.5px;color:#56607a;text-align:center;margin:-8px 0 18px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.6)}
.login .lrow{display:flex;justify-content:flex-end;margin:-8px 0 6px}
.login .lrow.c{justify-content:center;gap:10px;margin:16px 0 0;color:#9aa1ae}
.login .lrow a{color:#0270b4;font-weight:800;font-size:15px;text-decoration:none}
.login .lrow a:hover{text-decoration:underline}
.code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:24px;font-weight:800;letter-spacing:3px;text-align:center;padding:16px;border-radius:16px;background:#fff;border:2px dashed #0a80c4;color:#14295e;margin:4px 0 14px}
@media (max-width:480px){.code{font-size:20px;letter-spacing:2px}.login .box{padding:24px 20px 28px}.login .hero{max-width:270px}}

/* mobile-only elements */
.m-only{display:none!important}
.mhead,.bnav,.mstats{display:none}
.scrim{display:none}

/* ===== RESPONSIVE ===== */
@media (max-width:1280px){
  .stats{grid-template-columns:repeat(5,1fr)}
  .stat b{font-size:28px}
  .grid2,.grid2b{grid-template-columns:1fr}
}
@media (max-width:980px){
  body{background:#0f2253}
  .app{padding:0;display:block}
  .side{position:fixed;left:0;top:0;bottom:0;height:100vh;border-radius:0 24px 24px 0;transform:translateX(-105%);transition:transform .25s}
  .app.open .side{transform:none}
  .app.open .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:25}
  .mhead{display:flex;align-items:center;gap:12px;padding:18px 18px 34px;color:#fff;background:linear-gradient(180deg,#14295e,#0f2253 60%,#16357a);position:relative}
  .mhead .ham{color:#fff}.mhead .ham svg{width:28px;height:28px}
  .mhead .brand{padding:0;flex:1;justify-content:center;gap:10px}
  .mhead .brand .logo{width:40px;height:40px}
  .mhead .brand b{font-size:17px}.mhead .brand small{font-size:11.5px}
  .mhead .bell{color:#fff}
  .mhead .bell .dot{border-color:#0f2253}
  .main{border-radius:24px 24px 0 0;margin-top:-22px;background:linear-gradient(180deg,#f3f5fd,#eef1fb);border:0;padding:18px 14px 100px;min-height:calc(100vh - 60px);position:relative}
  .top{flex-wrap:wrap;gap:8px;margin-bottom:14px}
  .top .ham,.top .bell,.top .me,.top .sp{display:none}
  .top>div:nth-child(2){width:100%}
  .row{gap:8px;padding:6px 8px}.row .tag{font-size:12.5px;padding:4px 9px}.row .tm{font-size:12.5px}.row .nm b{font-size:14.5px}
  .top h1{font-size:21px}.top p{font-size:12.5px}
  .top .pill{height:38px;font-size:14px;padding:0 12px}
  .stats{display:none}
  .mstats{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:14px}
  .ms{grid-column:span 2;border-radius:16px;padding:12px 8px;text-align:center;border:1.5px solid;display:flex;flex-direction:column;align-items:center;gap:2px;box-shadow:0 4px 12px rgba(31,55,120,.06)}
  .ms svg{width:32px;height:32px}
  .ms b{font-size:24px;font-weight:900;line-height:1.1;white-space:nowrap}
  .ms span{font-size:13.5px;font-weight:600}
  .ms.w{grid-column:span 3;flex-direction:row;text-align:left;gap:12px;padding:12px 14px}
  .ms.w>div{display:flex;flex-direction:column}
  .m-blue{background:linear-gradient(180deg,#e9f1ff,#dce9ff);border-color:#c7dafc}.m-blue svg{color:#2f7bf5}
  .m-green{background:linear-gradient(180deg,#e8f8ee,#d9f3e2);border-color:#c0e8cf}
  .m-green .ck{width:34px;height:34px;border-radius:50%;background:#22b35a;display:grid;place-items:center}.m-green .ck svg{color:#fff;width:20px;height:20px;stroke-width:3.2}
  .m-orange{background:linear-gradient(180deg,#fff4e1,#ffe9c6);border-color:#fbd9a0}.m-orange svg{color:#f59e1b}
  .m-red{background:linear-gradient(180deg,#ffeef0,#ffe2e6);border-color:#fbc9d1}
  .m-red .xc{width:38px;height:38px;border-radius:50%;background:#ef4561;display:grid;place-items:center;flex:none}.m-red .xc svg{color:#fff;width:20px;height:20px;stroke-width:3.2}
  .m-purple{background:linear-gradient(180deg,#f3ecff,#e9defe);border-color:#d8c8fb}.m-purple svg{color:#8b5cf6;width:40px;height:40px}
  .trend,.monthcard,.leavecard{display:none}
  .donut{width:118px;height:118px}.donut .t b{font-size:27px}.donut .t small{font-size:11.5px}
  .sum .legend{display:none}
  .sum .mprog{display:block!important;flex:1}
  .qa{gap:8px}.qa button{min-height:84px;font-size:12.5px;padding:8px 4px}.qa svg{width:28px;height:28px}
  .row .tm{min-width:auto;font-size:13.5px}
  .robar{flex-wrap:wrap}.robar>img{height:28px!important}.robar>div{flex:1 1 60%}
  .m-only{display:flex!important}.d-only{display:none!important}
  .cal{gap:4px}
  .cal .d{min-height:54px;padding:4px 3px;gap:2px;border-radius:9px}
  .cal .d .n{font-size:12px}
  .cal .d .n em{font-size:9px;font-weight:700}
  .cal .d .e{font-size:0!important;height:6px;padding:0!important;border-radius:3px;color:transparent}
  .ptitle{gap:8px}
  .ptitle .btn.sm{flex:1 1 auto}
  .kv{grid-template-columns:1fr 1fr}
  .kv b{font-size:19px}
  .tabs button{padding:7px 10px;font-size:13px}
  .main{overflow-x:hidden}
  .filters select,.filters input{flex:1 1 140px;min-width:0}
  .row .tg{display:none}
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom));z-index:20;box-shadow:0 -6px 20px rgba(31,55,120,.08)}
  .bnav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;border-radius:12px;font-size:12px;font-weight:700;color:var(--ink2);text-decoration:none}
  .bnav a svg{width:25px;height:25px;stroke-width:1.8}
  .bnav a.on{background:linear-gradient(180deg,#fff4e0,#ffe9c4);color:#b5650a}
  .bnav a.on svg{color:#e2861a;fill:#f6a43a;stroke:#c46b07}
  .md{border-radius:22px 22px 0 0;max-height:94vh;align-self:end}
  .ov{padding:0;place-items:end stretch}
  .toast{bottom:100px}
  .dd{position:fixed;left:12px;right:12px;width:auto;top:70px}
  .cal .d{min-height:58px;padding:4px}
  .cal .d .e{font-size:9.5px;padding:1px 4px}
  .cal .d .plan{display:none}
  .fr3{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
  .fr{grid-template-columns:1fr}
  .fr3{grid-template-columns:1fr 1fr}
  .ms b{font-size:21px}
  .qa button{font-size:11.5px}
}

/* ===== PRINT ===== */
#printArea{display:none}
@media print{
  body{background:#fff!important}
  body>*:not(#printArea){display:none!important}
  #printArea{display:block!important;color:#000;font-family:Arial,sans-serif;font-weight:400;padding:0}
  @page{size:A4;margin:14mm}
}
.doc h1{font-size:20px;margin-bottom:2px}
.doc .meta{display:flex;justify-content:space-between;font-size:12px;margin-bottom:14px;border-bottom:2px solid #14295e;padding-bottom:8px}
.doc table{width:100%;border-collapse:collapse;font-size:11.5px;margin-bottom:12px}
.doc th,.doc td{border:1px solid #bbb;padding:4px 6px;text-align:left}
.doc th{background:#eef1f8}
.doc td.n,.doc th.n{text-align:right}
.doc h2{font-size:14px;margin:10px 0 6px}
.doc .tot{margin-left:auto;width:60%;}
.doc .sign{display:flex;justify-content:space-between;margin-top:40px;font-size:12px}
.doc .sign div{width:40%;border-top:1px solid #000;padding-top:4px;text-align:center}

/* önizleme (firma) modu */
.robar{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:14px;border-radius:14px;background:linear-gradient(90deg,#fff6e0,#fffaf0);border:1.5px solid #f7d58c;color:#7a4b00}
.robar>svg{width:26px;height:26px;color:#e08a00;flex:none}
.robar div{flex:1;min-width:0}.robar b{display:block;font-size:15px}.robar small{font-size:13px;color:#946a1c}
.ro .row[data-act^="entryNew"]{cursor:default}

/* defter kartları */
.dfs{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:6px}
.dfc{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border-radius:12px;background:#f6f8fd;border:1.5px solid #eef1f8;text-align:left}
.dfc small{font-size:12.5px;color:var(--muted);font-weight:800}.dfc b{font-size:18px;font-weight:900}.dfc span{font-size:11.5px;color:var(--muted);font-weight:600}
.dfc.on{border-color:var(--blue);background:#eaf1ff}

.itb td{white-space:normal;vertical-align:top}.itb td.n{white-space:nowrap;padding-left:6px}
.side .brand small{white-space:normal;line-height:1.3;margin-top:2px}

/* Kovan marka & giriş */
.brand img.logo{object-fit:contain;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35))}
.login{background:#0b1222 url(img/kovan-bg.jpg) center/cover no-repeat}
.login::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,12,28,.82) 0%,rgba(6,12,28,.45) 55%,rgba(6,12,28,.2) 100%)}
.login .bgl{display:none}
.login .box{background:linear-gradient(180deg,rgba(236,239,244,.96),rgba(224,228,235,.95));backdrop-filter:blur(8px)}
.login .klogo{display:block;width:100%;max-width:250px;margin:0 auto 10px}
@media (max-width:480px){.login .klogo{max-width:210px}}
.side .user{gap:8px}
.side .user .lo{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.1);flex:none}
.side .user .lo:hover{background:rgba(236,61,90,.55)}
.side .user .lo svg{width:19px;height:19px}
.lchip{display:inline-grid;place-items:center;background:#fff;border-radius:10px;padding:4px 6px;width:64px;height:40px;flex:none}
.lchip img{max-width:100%;max-height:100%;object-fit:contain}
.lchip.lg{width:84px;height:46px;border:1px solid var(--line)}
button.me{border:0;cursor:pointer}

.xrow{display:grid;grid-template-columns:1fr 110px 34px;gap:6px;margin-bottom:10px;padding:8px;border-radius:12px;background:#f7f9fd;border:1px solid #eef1f8}

/* ===== 2026.11.10: yeni menü, kasa, talepler, kılavuz ===== */
.nav{gap:3px;overflow-y:auto;scrollbar-width:none;min-height:0;flex:0 1 auto}
.nav::-webkit-scrollbar{display:none}
.nav a{padding:9px 16px;font-size:15.5px;gap:13px;position:relative}
.nav a svg.i{width:22px;height:22px}
.side .user{margin:auto 18px 16px;flex:none}
.side .brand{flex:none}
.nb{margin-left:auto;font-style:normal;background:#ec3d5a;color:#fff;font-size:11.5px;font-weight:900;min-width:22px;height:22px;padding:0 6px;border-radius:11px;display:grid;place-items:center}
.nb.soon{background:rgba(255,255,255,.16);color:#ffe3a3;font-size:10.5px;font-weight:800;letter-spacing:.3px}
.bnav a{position:relative}.bnav .nb{position:absolute;top:2px;right:18%;margin:0;min-width:18px;height:18px;font-size:10.5px}
.stat[data-act],.ms[data-act],.kasacard{cursor:pointer;transition:transform .15s,box-shadow .15s}
.stat[data-act]:hover,.kasacard:hover{transform:translateY(-3px);box-shadow:0 14px 26px rgba(0,0,0,.12)}
.ms[data-act]:active,.stat[data-act]:active{transform:scale(.98)}
.legend2{display:flex;flex-wrap:wrap;gap:12px;margin:-2px 0 10px;font-size:13px;font-weight:700;color:var(--muted)}
.legend2 i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.ktot{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.ktot small{font-size:13px;color:var(--muted);font-weight:700}.ktot b{font-size:30px;font-weight:900;letter-spacing:-.5px}
.ktot span{font-size:13.5px;color:var(--muted);font-weight:700}.ktot em{font-style:normal;font-weight:800}
.pos{color:#1a9d4b}.neg{color:#e1344d}
.kv .pos,.kv .neg{color:inherit}
.accs{display:flex;flex-direction:column;gap:6px}
.accs div{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;border-radius:10px;background:#f7f9fd;font-size:14px;font-weight:700}
.accgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-bottom:14px}
.acard{border-radius:16px;padding:14px 16px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 12px rgba(31,55,120,.06);display:flex;flex-direction:column;gap:3px;cursor:pointer;text-align:left;min-width:0}
.acard small{font-size:13.5px;font-weight:800;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acard b{font-size:23px;font-weight:900;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acard span{font-size:12.5px;color:var(--muted);font-weight:700}
.acard.tot{background:linear-gradient(135deg,#14295e,#1f4aa0);color:#fff;border:0;cursor:default}
.acard.tot small,.acard.tot span{color:rgba(255,255,255,.85)}
.acard.cash{border-left:5px solid #22b35a}.acard.bank{border-left:5px solid #1f65ec}
.acard.add{align-items:center;justify-content:center;flex-direction:row;gap:8px;border:1.5px dashed #b9c5e0;background:#fafbff;color:#1f65ec;font-weight:800;box-shadow:none}
.acard.add svg{width:20px;height:20px}
.otag{display:inline-block;font-size:11px;font-weight:800;padding:1px 7px;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 12%,#fff);border:1px solid color-mix(in srgb,var(--c) 30%,#fff);margin-right:3px}
.hbars{display:flex;flex-direction:column;gap:7px}
.hbars div{display:grid;grid-template-columns:minmax(90px,170px) 1fr auto;gap:10px;align-items:center;font-size:13.5px;font-weight:700}
.hbars span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbars i{height:12px;border-radius:6px;background:linear-gradient(90deg,#ec3d5a,#f59e1b);display:block}
.hbars b{white-space:nowrap}
.info{font-size:13.5px;color:#3c4670;padding:10px 12px;border-radius:12px;background:#eef4ff;border:1px solid #d6e3fb}
.info.warn{background:#fff7e6;border-color:#f7d58c;color:#7a4a06}
.tabs.sm button{padding:6px 12px;font-size:13px}
.appr{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:#fff7e6;border:1px solid #f7d58c;flex-wrap:wrap}
.appr>svg{width:26px;height:26px;color:#e08a00;flex:none}
.appr span{flex:1;min-width:180px;display:flex;flex-direction:column}
.appr b{font-size:14.5px}.appr small{font-size:12.5px;color:var(--muted);font-weight:600}
.appr.ok{background:#e8f8ee;border-color:#bfe7cd}.appr.ok>svg{color:#1a9d4b}
.qa.four{grid-template-columns:repeat(4,1fr)}
.klv details{border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:#fbfcff}
.klv summary{padding:12px 14px;font-weight:800;font-size:15.5px;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
.klv summary::after{content:"+";font-weight:900;color:#1f65ec}.klv details[open] summary::after{content:"−"}
.klv details>div{padding:0 16px 12px;font-size:14.5px;line-height:1.55;color:var(--ink2)}
.klv ul{padding-left:20px;margin:6px 0}.klv li{margin-bottom:4px}.klv p{margin:6px 0}
.card.soon{background:linear-gradient(180deg,#fff,#f7f9fd)}
.fg textarea{padding:10px 12px;height:auto;resize:vertical;font-family:inherit}
tr[data-act]:hover td{background:#f7f9fd}
@media (max-width:980px){
  .accgrid{grid-template-columns:1fr 1fr}
  .acard b{font-size:19px}
  .acard.tot{grid-column:1/-1}
  .hbars div{grid-template-columns:minmax(70px,110px) 1fr auto;font-size:12.5px}
  .qa.four{grid-template-columns:repeat(2,1fr)}
  .nav a{padding:11px 16px;font-size:16px}
}

/* ===== Genişleyen satırlar (1. dokunuş aç, 2. dokunuş kapat) ===== */
.xpw{border-radius:14px;transition:transform .22s ease,box-shadow .22s ease,background .22s}
.xpw>.row,.xpw>.dayitem{cursor:pointer}
.xpw .chev{display:grid;place-items:center;color:var(--muted);transition:transform .22s;flex:none}
.xpw .chev svg{width:18px;height:18px}
.xpw .amt{white-space:nowrap;font-size:15px}
.xpd{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease}
.xpd>div{overflow:hidden;min-height:0}
.xpw.open{transform:scale(1.015);box-shadow:0 10px 26px rgba(31,55,120,.14);background:#fff;position:relative;z-index:1;margin:6px 0}
.xpw.open .chev{transform:rotate(180deg);color:#1f65ec}
.xpw.open>.row,.xpw.open>.dayitem{background:#eef4ff;border-color:#cfdcf7}
.xpw.open .xpd{grid-template-rows:1fr}
.xpw.open .xpd>div{padding:10px 12px 12px}
.bks{display:flex;flex-direction:column;gap:2px;border-radius:12px;background:#f7f9fd;border:1px solid #eef1f8;padding:6px 10px}
.bk{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;border-bottom:1px dashed #e3e8f3;font-size:14px}
.bk:last-child{border-bottom:0}
.bk span{color:var(--muted);font-weight:700;min-width:0}
.bk span small{display:block;font-size:12px;font-weight:600;opacity:.9}
.bk b{font-weight:800;text-align:right;white-space:nowrap}
.bk.ot b{color:#7646dd}.bk.ex b{color:#b5650a}.bk.ms b{color:#c22b45}
.bk.tot{border-top:2px solid #dfe5f2;border-bottom:2px solid #dfe5f2;margin:2px 0}
.bk.tot span{color:var(--ink);font-weight:900}.bk.tot b{font-size:16px;color:#1a9d4b}
.bk.role b{color:#1f65ec;font-size:13px}
.xprow{display:none}.xprow.open{display:table-row}
.xprow td{padding:0 10px 12px!important;background:#fff}
.xprow .xpd{grid-template-rows:1fr}.xprow .xpd>div{padding-top:8px}
.xptr.open td{background:#eef4ff}
.md .grab{display:none}
@media (max-width:980px){
  .md .grab{display:block;width:44px;height:5px;border-radius:3px;background:#d3dbeb;margin:8px auto -4px}
  .md header{touch-action:none}
  .bk{font-size:13.5px}
  .xpw.open{transform:scale(1.01)}
}
.bk.warn span{color:#8a5300;font-weight:700;font-size:13px}.bk.warn{background:#fff7e6;border-radius:8px;padding:8px;border:0}
.xmini{display:block;font-size:11.5px;font-weight:800;color:#c22b45;white-space:nowrap}

/* ===== Çerçeveli takvim (ortak bileşen) ===== */
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.toolbar .sp{flex:1}
.calbox{background:#fff;border-radius:20px;border:1px solid #dfe5f2;box-shadow:0 8px 24px rgba(31,55,120,.08);overflow:hidden}
.calhead{display:flex;align-items:center;gap:10px;padding:14px 16px;background:linear-gradient(135deg,#14295e,#1f4aa0);color:#fff}
.calhead .ct{flex:1;text-align:center;min-width:0}
.calhead .ct b{display:block;font-size:22px;font-weight:900;letter-spacing:-.3px}
.calhead .ct b span{color:#ffd76a}
.calhead .ct small{display:block;font-size:12.5px;opacity:.85;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calhead .cnav{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.14);display:grid;place-items:center;color:#fff;flex:none}
.calhead .cnav:hover{background:rgba(255,255,255,.24)}
.calhead .cnav svg{width:22px;height:22px}
.calhead .ctoday{padding:8px 12px;border-radius:10px;background:#f5b62e;color:#14295e;font-weight:900;font-size:13px;flex:none}
.cal.framed{gap:0;padding:0;background:#fff}
.cal.framed .h{background:#f2f5fb;border-bottom:1px solid #e3e8f3;padding:8px 0;font-size:12.5px}
.cal.framed .h.we{color:#e1344d}
.cal.framed .d{border-radius:0;border:0;border-right:1px solid #eef1f8;border-bottom:1px solid #eef1f8;background:#fff;min-height:84px}
.cal.framed .d:nth-child(7n){border-right:0}
.cal.framed .d.x{background:#fafbfe}
.cal.framed .d:hover{background:#f3f7ff}
.cal.framed .d.today{border:0;box-shadow:inset 0 0 0 2px var(--gold);background:#fffaf0}
.cal.framed .d.we{background:#fffafa}
.calfoot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;background:#f7f9fd;border-top:1px solid #e3e8f3}
.calfoot .legend2{margin:0}.calfoot small{font-size:12px;color:var(--muted);font-weight:600}
/* Ortak tarih seçici */
.dhid{position:absolute!important;opacity:0;width:1px!important;height:1px!important;pointer-events:none;padding:0!important;border:0!important}
.dbtn{display:flex;align-items:center;gap:8px;height:44px;border-radius:11px;border:1.5px solid var(--line);padding:0 12px;font-weight:800;font-size:14.5px;background:#fbfcff;width:100%;text-align:left;color:var(--ink)}
.dbtn span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dbtn svg{width:18px;height:18px;color:#1f65ec;flex:none}.dbtn svg:last-child{color:var(--muted);transition:transform .2s}
.dbtn.open{border-color:#1f65ec;box-shadow:0 0 0 3px rgba(31,101,236,.12)}.dbtn.open svg:last-child{transform:rotate(180deg)}
.dpick{display:none;border:1px solid #dfe5f2;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(31,55,120,.12);background:#fff;animation:up .15s}
.dpick.open{display:block}
.dph{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:linear-gradient(135deg,#14295e,#1f4aa0);color:#fff}
.dph b{font-size:16px;font-weight:900}
.dph button{width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.15);display:grid;place-items:center;color:#fff}
.dph svg{width:18px;height:18px}
.dpg{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:10px}
.dpg small{text-align:center;font-size:11.5px;font-weight:800;color:var(--muted)}.dpg small.we{color:#e1344d}
.dpg button{height:42px;border-radius:10px;background:#f7f9fd;font-weight:800;font-size:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid transparent}
.dpg button span{display:flex;gap:2px;height:5px}.dpg button em{width:5px;height:5px;border-radius:50%}
.dpg button.we{color:#e1344d}
.dpg button.td{border-color:var(--gold);background:#fffaf0}
.dpg button.on{background:#1f65ec;color:#fff;border-color:#1f65ec}
.dpg button:hover{border-color:#bcd2fb}
.dpf{display:flex;align-items:center;gap:8px;padding:0 10px 10px;flex-wrap:wrap}
.dpf button{padding:6px 12px;border-radius:9px;border:1px solid var(--line);font-weight:800;font-size:13px;background:#fff}
.dpf small{margin-left:auto;font-size:11.5px;color:var(--muted)}
@media (max-width:980px){
  .calhead{padding:12px 10px;gap:6px}.calhead .ct b{font-size:19px}.calhead .ct small{font-size:11.5px}
  .calhead .cnav{width:36px;height:36px}
  .cal.framed .d{min-height:58px;padding:4px 3px}
  .calfoot{padding:8px 10px}.calfoot .legend2{gap:8px;font-size:11.5px}
}

/* ===== Devir & Aylık Kayıtlar ===== */
.cal .d .e.dv{background:repeating-linear-gradient(45deg,#f5b62e,#f5b62e 6px,#f7c65a 6px,#f7c65a 12px)!important;color:#5a3a00!important}
.dvbox{border:1.5px dashed #f2c35c;background:#fffaf0;border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.dvh{font-weight:900;color:#8a5300;font-size:14px;margin-bottom:2px}
.dvr{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:9px;background:#fff;cursor:pointer;font-size:13.5px;font-weight:700}
.dvr i{width:9px;height:9px;border-radius:50%;flex:none}.dvr span{flex:1;min-width:0}.dvr b{white-space:nowrap}
.dvr:hover{background:#fff3d6}
.mrec>.row{gap:12px}
.mrec .mico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#e8f8ee;color:#1a9d4b;flex:none}
.mrec.cur .mico{background:#fff4df;color:#e08a00}.mrec .mico svg{width:20px;height:20px}
.mrec .mnums{display:flex;gap:14px;font-size:12.5px;color:var(--muted);font-weight:700;flex-wrap:wrap;justify-content:flex-end}
.mrec .mnums b{display:block;font-size:14.5px;color:var(--ink)}.mrec .mnums b.pos{color:#1a9d4b}.mrec .mnums b.neg{color:#e1344d}
.rh{margin:12px 0 6px;font-size:14px}
details.hist{margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:0 10px}
details.hist summary{padding:10px 2px;font-weight:800;cursor:pointer}
@media (max-width:980px){ .mrec>.row{flex-wrap:wrap}.mrec .mnums{width:100%;justify-content:space-between;gap:6px} }

/* ===== Mobil menü: ekrana tam sığar, çıkış her zaman görünür ===== */
@media (max-width:980px){
  .side{top:0;bottom:0;height:auto!important;max-height:100dvh;width:min(300px,86vw)}
  .side .brand{padding-top:14px;padding-bottom:10px}
  .side .brand .logo{width:46px;height:46px}
  .side .brand b{font-size:17px}.side .brand small{font-size:12px}
  .nav{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px;scrollbar-width:none}
  .nav a{padding:9px 16px;font-size:15.5px;gap:12px}
  .nav a svg.i{width:21px;height:21px}
  .side .user{margin:6px 12px calc(12px + env(safe-area-inset-bottom));padding:10px 12px;flex:none}
  .side .user .lo{width:44px;height:44px;background:rgba(236,61,90,.35)}
}
.dd .it.new{background:#fff7e6;font-weight:800}.dd .it.new span::after{content:" • yeni";color:#e1344d;font-size:11px;font-weight:900}

/* ===== Müşteri paneli: iki bölüm ===== */
.secsw{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.secsw button{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#fff;border:1.5px solid var(--line);text-align:left;box-shadow:0 3px 10px rgba(31,55,120,.06);min-width:0}
.secsw button i{font-style:normal;font-size:24px;flex:none}
.secsw button span{display:flex;flex-direction:column;min-width:0}
.secsw button b{font-size:15px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.secsw button small{font-size:12px;color:var(--muted);font-weight:700}
.secsw button.on{border-color:#1f65ec;background:linear-gradient(180deg,#f2f7ff,#e6efff);box-shadow:0 0 0 3px rgba(31,101,236,.12)}
.seccard{cursor:pointer}.seccard:hover{box-shadow:0 12px 26px rgba(31,55,120,.12)}
@media (max-width:600px){ .secsw{grid-template-columns:1fr} }
@media (max-width:600px){ .robar small{display:none} .robar{padding:10px 12px} .robar img{height:26px!important} }

/* ===== Belgeler & müşteri kartı ===== */
.docrow{gap:10px}
.docrow .dico{width:40px;height:40px;border-radius:11px;background:#eef4ff;display:grid;place-items:center;font-size:20px;text-decoration:none;flex:none}
.docrow a.ibtn{text-decoration:none}
.custhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.custhead .nm{flex:1;min-width:180px}.custhead .nm b{font-size:19px;display:block}.custhead .nm small{color:var(--muted);font-size:13px}
.custhead .sw{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff}

/* ===== Mobil üst bar sabit ===== */
@media (max-width:980px){
  .mhead{position:sticky;top:0;z-index:24;padding:12px 16px 30px;box-shadow:0 6px 16px rgba(10,25,60,.18)}
  .main{z-index:1}
}
/* tutar: toplam + döküm */
.amtsplit{display:block;font-size:11.5px;font-weight:700;color:var(--muted);white-space:nowrap}
.amtsplit em{font-style:normal;color:#c22b45;font-weight:800}
.bnav a span{font-size:11.5px;white-space:nowrap;letter-spacing:-.2px}
.tbl.cari tr.dv td{background:#eef4ff}
.tbl.cari td small{font-size:11.5px}
.tbl.cari tfoot td{font-weight:700;border-top:2px solid var(--line,#dfe5f0)}
/* Bölüm ayırıcıları: kart içindeki başlıklar ayrı bölüm olarak görünür */
#page .card h4{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:18px 0 10px!important;padding-top:14px;border-top:1.5px solid #e3e8f2;font-size:15.5px;color:#14213d}
#page .card h4::before{content:'';width:4px;height:17px;border-radius:2px;background:#4c6ef5;flex:none}
#page .card h4 small{flex-basis:100%;font-weight:500;font-size:12.5px;color:var(--muted);padding-left:12px}
#page .card h4:first-child{border-top:0;padding-top:0;margin-top:2px!important}
#page .card .rsec+.rsec,#page .card .rsec:not(:first-child){border-top:1.5px solid #e3e8f2;margin-top:16px;padding-top:14px}
#page .card .rsec>h4{margin-top:0!important}
#page .card details.hist{border-top:1.5px solid #e3e8f2;padding-top:10px;margin-top:14px}
.rsec{scroll-margin-top:96px;border-radius:12px;padding-left:4px;padding-right:4px}
@media (max-width:700px){.rsec{scroll-margin-top:84px}}
.rsec.flash{animation:secflash 1.8s ease}
@keyframes secflash{0%,35%{box-shadow:0 0 0 3px #f7b733;background:#fff8e6}100%{box-shadow:0 0 0 0 transparent;background:transparent}}
.bizchip{display:inline-block;max-width:100%;margin:3px 0 4px;padding:2px 9px;border-radius:999px;background:#eef3ff;color:#2b55c7;font-size:11.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.nm small .bizchip{display:table;white-space:normal;line-height:1.35;padding:3px 10px}