/* اتاق فرمان مجموعه — یک فایل، بدون وابستگی بیرونی */
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-arabic-400.995cd8bfda8c.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-latin-400.97b491c18ad5.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-arabic-700.7946124b2cee.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-latin-700.b57285a381ee.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-arabic-800.e39b152f735a.woff2") format("woff2"); font-weight: 800; font-display: swap; unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FEFC; }
@font-face { font-family: Vazirmatn; src: url("../fonts/vazirmatn-latin-800.612f7d165b6b.woff2") format("woff2"); font-weight: 800; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F; }

:root {
  --ink: #16201C; --muted: #5B6763; --line: #DCE2DF; --soft: #F2F4F3; --card: #FFFFFF;
  --accent: #0E6B5F; --accent-ink: #FFFFFF; --nav: #16201C; --nav-ink: #D5DDDA; --nav-muted: #9DAAA5;
  --ok: #157F3B; --ok-bg: #E3F3E8; --warn: #7A4505; --warn-bg: #FBEFD9; --bad: #B42318; --bad-bg: #FDE8E6;
  --gold: #B8860B;
}
body.theme-sup { --accent: #4B4FA8; --nav: #232647; --nav-ink: #D9DAF0; --nav-muted: #A9ACD6; }
body.theme-staff { --nav: #2B3431; }
body.theme-fin { --accent: #B4532A; --nav: #3A2A22; --nav-ink: #E7D9D1; --nav-muted: #C9B8AE; }
body.theme-partner { --accent: #6B3F7A; --nav: #2E2236; --nav-ink: #DDD2E3; --nav-muted: #B9A9C2; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--soft); color: var(--ink); font: 15px/1.8 Vazirmatn, Tahoma, sans-serif; }
a { color: var(--accent); }
h1 { font-size: 26px; font-weight: 800; margin: 0; line-height: 1.5; }
h2 { font-size: 17px; margin: 0 0 8px; }
.muted { color: var(--muted); font-size: 13px; }
.small { font-size: 12px; }

.shell { display: flex; min-height: 100vh; }
.side { flex: 0 0 230px; background: var(--nav); color: var(--nav-ink); padding: 24px 16px; display: flex; flex-direction: column; gap: 4px; }
.side .brand { font-weight: 800; font-size: 17px; padding: 0 10px; color: #fff; }
.side .who { font-size: 12px; color: var(--nav-muted); padding: 0 10px 16px; }
.side a, .side button.linkish { display: block; padding: 10px; border-radius: 8px; color: var(--nav-ink); text-decoration: none; font-size: 14px; background: none; border: 0; text-align: right; font: inherit; cursor: pointer; width: 100%; }
.side a.on { background: var(--accent); color: #fff; font-weight: 700; }
.side .sep { margin-top: 14px; }
.badge { display: inline-block; min-width: 20px; padding: 0 7px; border-radius: 99px; background: #D9A441; color: #16201C; font-size: 12px; font-weight: 800; text-align: center; line-height: 20px; }
.main { flex: 1; min-width: 0; padding: 28px 32px 90px; display: flex; flex-direction: column; gap: 18px; max-width: 1100px; }

.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.card.strong { border: 2px solid var(--accent); }
.card.dark { background: var(--ink); color: #fff; border: 0; }
.grid { display: grid; gap: 14px; }
.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)); }
.stat .v { font-size: 26px; font-weight: 800; }
.row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.between { justify-content: space-between; }
.list > * { padding: 10px 0; border-top: 1px solid #EEF1EF; }
.list > *:first-child { border-top: 0; }

.pill { display: inline-block; padding: 2px 10px; border-radius: 99px; font-size: 12px; font-weight: 700; background: var(--soft); color: var(--muted); white-space: nowrap; }
.pill.ok { background: var(--ok-bg); color: var(--ok); }
.pill.warn { background: var(--warn-bg); color: var(--warn); }
.pill.bad { background: var(--bad-bg); color: var(--bad); }
.pill.acc { background: #E8E9F7; color: var(--accent); }

.bar { height: 8px; border-radius: 4px; background: #E6EAE8; overflow: hidden; }
.bar > i { display: block; height: 100%; background: var(--accent); }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 8px 16px; border-radius: 10px; border: 1px solid var(--line); background: #fff; color: var(--ink); font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; text-decoration: none; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.danger { color: var(--bad); }
.btn.sm { min-height: 36px; padding: 4px 12px; font-size: 13px; }
.btn.big { min-height: 56px; font-size: 17px; width: 100%; }
.inline { display: inline; }

form.stack { display: flex; flex-direction: column; gap: 12px; }
form.flow { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
form.flow > .f { flex: 1 1 160px; }
label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 4px; }
input[type=text], input[type=tel], input[type=number], input[type=password], select, textarea { width: 100%; font: inherit; font-size: 15px; padding: 10px 12px; border: 1px solid #C9D1CD; border-radius: 10px; background: #fff; color: var(--ink); }
input:focus, select:focus, textarea:focus, .btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 35%, transparent); outline-offset: 1px; }
.errorlist { list-style: none; margin: 4px 0 0; padding: 0; color: var(--bad); font-size: 13px; }
ul.radios { list-style: none; display: flex; gap: 8px; padding: 0; margin: 0; flex-wrap: wrap; }
ul.radios label { font-weight: 700; border: 1px solid var(--line); border-radius: 10px; padding: 8px 14px; cursor: pointer; }
.check { display: flex; align-items: center; gap: 8px; font-weight: 400; }
.check input { width: 20px; height: 20px; }

.flash { padding: 10px 14px; border-radius: 10px; font-size: 14px; }
.flash.success { background: var(--ok-bg); color: var(--ok); }
.flash.error { background: var(--bad-bg); color: var(--bad); }
.flash.info { background: var(--warn-bg); color: var(--warn); }

.why { background: #E1F0EC; border-radius: 12px; padding: 12px 14px; font-size: 14px; }
.why ol { margin: 6px 0 0; padding-inline-start: 22px; list-style: persian; }
.counter { font-size: 44px; font-weight: 800; line-height: 1.2; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 9px 6px; border-bottom: 1px solid #EEF1EF; text-align: right; vertical-align: middle; }
th { color: var(--muted); font-size: 12px; }
.table-wrap { overflow-x: auto; }

.bottom-nav { display: none; }
@media (max-width: 760px) {
  .side { display: none; }
  .main { padding: 16px 14px 96px; }
  .g2, .g3, .g4 { grid-template-columns: 1fr 1fr; }
  .bottom-nav { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; inset-inline: 0; bottom: 0; background: #fff; border-top: 1px solid var(--line); padding: 6px 6px 10px; z-index: 5; }
  .bottom-nav a { text-align: center; padding: 10px 2px; border-radius: 10px; font-size: 12px; font-weight: 700; color: var(--muted); text-decoration: none; }
  .bottom-nav a.on { background: #E1F0EC; color: var(--accent); }
  .topbar { display: flex !important; }
}
.topbar { display: none; justify-content: space-between; align-items: center; gap: 8px; }
.auth { min-height: 100vh; background: #16201C; display: flex; align-items: center; justify-content: center; padding: 24px 16px; }
.auth .box { width: 100%; max-width: 420px; }
