﻿/* ============ پایه ============ */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#0b2e33; --ink2:#0f4149; --ink3:#15565f;
  --teal:#0e8f86; --teal-l:#e2f3f1;
  --saf:#f0a41c; --saf-d:#b97c07;
  --paper:#edf1f0; --card:#fff; --line:#d9e3e1;
  --txt:#1d2d2b; --mut:#6b7f7c; --red:#d0503c; --grn:#2e9e5b;
  --rad:12px;
}
html{scroll-behavior:smooth}
body{font-family:'Vazirmatn',sans-serif;font-size:14px;color:var(--txt);background:var(--paper);line-height:1.7}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(720px 420px at 92% -60px, rgba(14,143,134,.10), transparent 62%),
    radial-gradient(640px 400px at -120px 106%, rgba(240,164,28,.11), transparent 62%),
    radial-gradient(rgba(16,49,51,.055) 1px, transparent 1.5px);
  background-size:auto,auto,26px 26px;}
::selection{background:rgba(240,164,28,.35)}
button{font-family:inherit;cursor:pointer}
input,textarea,select{font-family:inherit;font-size:14px;color:var(--txt)}

/* ============ پوسته ============ */
.shell{display:flex;min-height:100vh}
aside{width:262px;flex-shrink:0;background:linear-gradient(180deg,#0c3138,#0a262c 58%,#082126);color:#bcd8d3;position:fixed;top:0;bottom:0;inset-inline-start:0;height:100vh;overflow:hidden;padding:20px 14px 14px;transition:width .28s cubic-bezier(.25,.8,.3,1);display:flex;flex-direction:column;z-index:80}
aside::before{content:'';position:fixed;width:262px;top:0;bottom:0;pointer-events:none;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.025) 0 2px,transparent 2px 15px)}
aside::-webkit-scrollbar{width:5px}aside::-webkit-scrollbar-thumb{background:#1d4a50;border-radius:9px}
nav::-webkit-scrollbar{width:3px}nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:9px}
nav{scrollbar-width:none}
.logo{display:flex;gap:12px;align-items:center;padding:4px 8px 18px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:14px;position:relative;flex-shrink:0}
.lmark{width:46px;height:46px;flex-shrink:0;border-radius:12px;background:linear-gradient(140deg,var(--saf),#e38a05);color:#182422;display:grid;place-items:center;font-family:'Lalezar';font-size:26px;box-shadow:0 6px 16px rgba(240,164,28,.35)}
.lmark-img{width:30px;height:30px;flex-shrink:0;border-radius:6px;object-fit:contain}
.logo b{display:block;color:#fff;font-size:15.5px}
.logo span{font-size:11px;color:#7fa39e}
nav{display:flex;flex-direction:column;gap:4px;position:relative;flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}
.nv{position:relative;display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:#9fbdb8;text-decoration:none;font-size:13.2px;font-weight:500;transition:.22s}
.nv.admin-only[hidden]{display:none!important}
.nv .no{width:24px;height:24px;flex-shrink:0;border-radius:7px;background:rgba(20,86,95,.75);color:#bfe6e0;display:grid;place-items:center;font-family:'Lalezar';font-size:14px;transition:.22s}
.nv .lb{white-space:nowrap}
.nv:hover{color:#fff;background:rgba(255,255,255,.06);transform:translateX(-3px)}
.nv.active{color:#fff;background:rgba(14,143,134,.28)}
.nv.active::before{content:'';position:absolute;inset-inline-start:-14px;top:22%;bottom:22%;width:4px;border-radius:5px;background:var(--saf)}
.nv.active .no{background:var(--saf);color:#1c2622}
.bdg{margin-inline-start:auto;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--saf);color:#241a04;font-size:11px;font-weight:800;display:none;place-items:center;line-height:20px;text-align:center}
.bdg.on{display:inline-block}
.aside-foot{margin-top:auto;padding:12px 10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:9px;color:#6f948f;position:relative;line-height:1.4;flex-shrink:0}
.aside-foot b{color:#a9ccc6;display:block;font-size:9px}
.scrim{display:none;position:fixed;inset:0;background:rgba(8,24,27,.5);z-index:85;backdrop-filter:blur(2px)}

/* ============ نوار بالا ============ */
.main{flex:1;min-width:0;display:flex;flex-direction:column;margin-inline-start:262px}
.topbar{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:12px 26px}
#crumb{font-weight:800;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;cursor:pointer;transition:.2s}
#crumb:hover{color:var(--teal)}
.top-chips{margin-inline-start:auto;display:flex;gap:8px;align-items:center;flex-shrink:0}
.chip{background:#f2f6f5;border:1px solid var(--line);border-radius:99px;padding:4px 14px;font-size:12.5px;font-weight:600;color:#33484a;white-space:nowrap}
.chip b{font-family:'Lalezar';font-weight:400;color:var(--teal);letter-spacing:.5px}
main{padding:26px 26px 60px;max-width:1220px;width:100%;margin:0 auto}

/* ============ ویوها ============ */
.view{display:none}
.view.active{display:block;animation:rise .4s cubic-bezier(.2,.7,.3,1)}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ============ سربرگ فرم ============ */
.band{position:relative;background:linear-gradient(135deg,#0b2e33 0%,#0f454c 70%,#135a58 100%);color:#fff;border-radius:16px;padding:26px 28px 20px;overflow:hidden;box-shadow:0 14px 34px rgba(11,46,51,.24)}
.band::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.03) 0 2px,transparent 2px 16px);pointer-events:none}
.band .ghost{position:absolute;left:14px;top:-42px;font-family:'Lalezar';font-size:170px;color:rgba(255,255,255,.06);line-height:1;user-select:none}
.bno{display:inline-block;background:rgba(240,164,28,.16);color:var(--saf);border:1px solid rgba(240,164,28,.45);font-size:12px;font-weight:700;padding:2px 12px;border-radius:99px;margin-bottom:8px}
.band h2{font-family:'Lalezar';font-weight:400;font-size:31px;line-height:1.25}
.band p{color:#a9c6c1;font-size:13px;margin-top:2px;max-width:560px}
.band-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;position:relative;z-index:2}
.band-meter{display:flex;align-items:center;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:#9fc0ba;position:relative;z-index:2}
.meter{flex:1;max-width:340px;height:7px;background:rgba(255,255,255,.14);border-radius:99px;overflow:hidden}
.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--saf),#ffc555);border-radius:99px;transition:width .5s cubic-bezier(.2,.7,.3,1)}
.meter-pct{font-family:'Lalezar';color:var(--saf);font-size:15px}

/* ============ دکمه‌ها ============ */
.btn{border:none;border-radius:10px;padding:9px 20px;font-size:13.5px;font-weight:700;transition:.2s;display:inline-flex;align-items:center;gap:7px}
.btn:active{transform:translateY(2px)}
.btn-p{background:var(--saf);color:#241a04;box-shadow:0 6px 16px rgba(240,164,28,.35)}
.btn-p:hover{background:#ffb637;box-shadow:0 8px 20px rgba(240,164,28,.45)}
.btn-line{background:transparent;color:#e7f3f1;border:1.5px solid rgba(255,255,255,.4)}
.btn-line:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-ghost{background:transparent;color:#9fc0ba}
.btn-ghost:hover{color:#ffb0a3}
.btn-g{background:#fff;color:#33484a;border:1.5px solid var(--line)}
.btn-g:hover{border-color:var(--teal);color:var(--teal)}
.btn-d{background:#fdeeee;color:var(--red);border:1.5px solid #f2cfcb}
.btn-d:hover{background:var(--red);color:#fff;border-color:var(--red)}

/* ============ کارت و فیلد ============ */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:20px 22px;margin-top:16px;box-shadow:0 1px 3px rgba(16,42,45,.05);transition:.25s}
.card:hover{border-color:#c3d6d2;box-shadow:0 8px 22px rgba(16,42,45,.07)}
.card h3{display:flex;align-items:center;gap:9px;font-size:15.5px;font-weight:800;margin-bottom:16px;color:#17322f;flex-wrap:wrap}
.card h3 i{width:26px;height:26px;border-radius:8px;background:var(--teal-l);color:var(--teal);display:grid;place-items:center;font-family:'Lalezar';font-style:normal;font-size:15px}
.card h3 small{font-weight:500;color:var(--mut);font-size:11.5px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g5{grid-template-columns:repeat(5,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
.fld label{display:block;font-size:12px;font-weight:700;color:#54706c;margin-bottom:6px}
.fld input:not([type=checkbox]):not([type=radio]),.fld textarea,.fld select{display:block;width:100%;min-width:0;box-sizing:border-box;border:1.5px solid #d6e0de;border-radius:9px;padding:9px 12px;background:#fbfdfd;transition:.2s;outline:none}
.fld textarea{min-height:96px;resize:vertical}
.fld input:hover,.fld textarea:hover,.fld select:hover{border-color:#b9cfcb}
.fld input:focus,.fld textarea:focus,.fld select:focus{border-color:var(--teal);background:#fff;box-shadow:0 0 0 3.5px rgba(14,143,134,.14)}
.fld .sub{font-size:11px;color:var(--mut);margin-top:4px}
.lk-row{display:flex;gap:8px;margin-bottom:8px;animation:rowin .3s}
.lk-row input{flex:1;border:1.5px solid #d6e0de;border-radius:9px;padding:8px 12px;background:#fbfdfd;outline:none;transition:.2s}
.lk-row input:hover{border-color:#b9cfcb}
.lk-row input:focus{border-color:var(--teal);background:#fff;box-shadow:0 0 0 3.5px rgba(14,143,134,.14)}
.addline{width:100%;margin-top:12px;background:none;border:2px dashed #c7d8d4;border-radius:10px;padding:10px;color:#4e7a74;font-weight:700;font-size:13px;transition:.2s}
.addline:hover{border-color:var(--teal);color:var(--teal);background:var(--teal-l)}
