:root {
  --ui-accent: #a91c1c;
  --ui-accent-dark: #861616;
  --ui-accent-soft: #fff3f3;
  --ui-ink: #20292a;
  --ui-muted: #72807d;
  --ui-line: #e3e6e5;
  --ui-radius: 12px;
}
.ui-icon { color: currentColor; }
html, body { overflow-x: hidden; }
.ui-icon svg { width: 1em; height: 1em; stroke: currentColor; stroke-width: 1.8; }
.sidebar { color: #f7f9f8; }
.sidebar .nav-item, .sidebar .nav-label, .sidebar .logout-button { color: rgba(255,255,255,.84); }
.sidebar .nav-item:hover, .sidebar .nav-item:focus-visible { color: #fff; background: rgba(255,255,255,.09); }
.sidebar .nav-icon { color: rgba(255,255,255,.78); }
.sidebar .nav-item:hover .nav-icon, .sidebar .nav-item.is-active .nav-icon { color: #fff; }
.sidebar .nav-item.is-active { background: rgba(169,28,28,.34); border-right-color: #e78d8d; }
.sidebar .nav-label { color: rgba(255,255,255,.52); }
.sidebar .nav-badge, .sidebar .nav-counter { color: #fff; background: rgba(169,28,28,.72); }
.main-shell { min-width: 0; }
.topbar { direction: rtl; }
.topbar-actions { margin-inline-start: 0; }
.profile-menu { position: relative; }
.profile-trigger { min-height: 44px; padding: 4px 8px; border-radius: 10px; background: transparent; }
.profile-trigger:hover, .profile-trigger:focus-visible { background: var(--ui-accent-soft); outline: none; }
.profile-trigger:focus-visible { box-shadow: 0 0 0 3px rgba(169,28,28,.16); }
.profile-dropdown { inset-inline-start: 0; inset-inline-end: auto; width: 276px; padding: 10px; border-radius: 14px; }
.profile-dropdown-head { display: flex; align-items: center; gap: 10px; padding: 8px 9px 12px; text-align: right; }
.profile-dropdown-head strong, .profile-dropdown-head span { display: block; }
.profile-dropdown-head strong { font-size: 12px; color: var(--ui-ink); }
.profile-dropdown-head span { margin-top: 2px; font-size: 10px; color: var(--ui-muted); }
.profile-dropdown-divider { height: 1px; margin: 2px 4px 6px; background: var(--ui-line); }
.profile-dropdown a, .profile-dropdown form button { transition: background .18s ease, color .18s ease, transform .18s ease; }
.profile-dropdown a:hover, .profile-dropdown form button:hover { transform: translateX(-2px); }
.profile-dropdown a:focus-visible, .profile-dropdown form button:focus-visible { outline: 3px solid rgba(169,28,28,.18); outline-offset: 1px; }
.profile-photo { object-fit: cover; }
.avatar-medium { width: 42px; height: 42px; border-radius: 12px; font-size: 15px; }
.table-person { display: inline-flex; align-items: center; gap: 9px; }
.table-person .profile-photo { flex: 0 0 auto; }
.employee-history-heading { display: flex; align-items: center; gap: 13px; }
.employee-history-heading p { margin-bottom: 0; }
.login-hero-copy h1 { white-space: nowrap; font-size: clamp(1.72rem, 3.25vw, 3rem); letter-spacing: -.045em; }
.mobile-login-logo span { white-space: nowrap; }
.login-footer { justify-content: flex-start; }
.password-toggle { width: 38px; height: 38px; display: grid; place-items: center; margin: 0 5px; border-radius: 8px; transition: color .18s ease, background .18s ease, box-shadow .18s ease; }
.password-toggle:hover { color: var(--ui-accent); background: var(--ui-accent-soft); }
.password-toggle:focus-visible { color: var(--ui-accent); outline: none; box-shadow: 0 0 0 3px rgba(169,28,28,.16); }
.input-with-icon > .ui-icon { color: #697976; }
.input-with-icon > span:first-child { width: 43px; }
.input-with-icon input { direction: rtl; }
.jalali-picker, .time-picker { position: relative; }
.date-input-shell, .time-input-shell { position: relative; }
.date-input-shell .jalali-input { padding-inline-end: 52px; }
.date-picker-trigger, .time-picker-trigger { position: absolute; inset-inline-end: 7px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 4px; color: var(--ui-accent); background: transparent; padding: 7px; border-radius: 8px; transition: background .18s ease, color .18s ease; }
.date-picker-trigger:hover, .time-picker-trigger:hover, .date-picker-trigger:focus-visible, .time-picker-trigger:focus-visible { color: var(--ui-accent-dark); background: var(--ui-accent-soft); outline: none; }
.time-picker-input { padding-inline-start: 72px !important; }
.time-picker-trigger .ui-icon:last-child { transition: transform .18s ease; }
.time-picker.is-open .time-picker-trigger .ui-icon:last-child { transform: rotate(180deg); }
.jalali-panel, .time-picker-menu { position: absolute; z-index: 60; inset-inline: 0 auto; top: calc(100% + 8px); width: min(320px, 100%); padding: 12px; border: 1px solid #e6dada; border-radius: 14px; background: #fff; box-shadow: 0 18px 44px rgba(40,23,23,.16); }
.jalali-panel { width: min(330px, 100%); }
.jalali-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 9px; margin-bottom: 10px; }
.jalali-panel-head strong { font-size: 12px; color: var(--ui-ink); }
.jalali-panel-head .icon-button { width: 30px; height: 30px; }
.jalali-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.jalali-weekday { padding: 4px 0; text-align: center; font-size: 9px; color: var(--ui-muted); }
.jalali-day { min-height: 32px; border-radius: 8px; background: transparent; color: var(--ui-ink); font-size: 11px; transition: background .16s ease, color .16s ease, transform .16s ease; }
.jalali-day:hover, .jalali-day:focus-visible { background: var(--ui-accent-soft); color: var(--ui-accent); outline: none; }
.jalali-day.is-selected { background: var(--ui-accent); color: #fff; font-weight: 800; }
.jalali-day.is-today { box-shadow: inset 0 0 0 1px var(--ui-accent); }
.jalali-day.is-selected.is-today { box-shadow: inset 0 0 0 2px #fff; }
.jalali-day.is-empty { pointer-events: none; }
.time-picker-menu { max-height: 230px; overflow-y: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.time-option { min-height: 34px; border-radius: 8px; color: var(--ui-ink); background: #fafbfb; font-size: 11px; transition: background .16s ease, color .16s ease; }
.time-option:hover, .time-option:focus-visible { background: var(--ui-accent-soft); color: var(--ui-accent); outline: none; }
.time-option.is-selected { background: var(--ui-accent); color: #fff; }
.subject-filter-toolbar, .consistent-filter-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px; margin-bottom: 15px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: #fbfcfc; }
.subject-filter-toolbar .filter-search { min-width: 220px; flex: 1 1 220px; }
.subject-filter-toolbar select, .consistent-filter-toolbar select { min-height: 37px; border: 1px solid var(--ui-line); border-radius: 8px; background: #fff; color: var(--ui-ink); padding: 0 10px; font-size: 10px; }
.filter-reset { color: var(--ui-accent); border: 1px solid #e7bcbc; background: #fff; }
.import-upload-card, .import-mapping-card, .import-preview-card { padding: 22px; }
.import-upload-hero { display: flex; align-items: center; gap: 14px; padding-bottom: 20px; border-bottom: 1px solid var(--ui-line); }
.import-upload-hero h2 { margin: 0 0 5px; font-size: 18px; }
.import-upload-hero p { margin: 0; color: var(--ui-muted); font-size: 11px; }
.import-upload-icon { width: 54px; height: 54px; display: grid; place-items: center; color: var(--ui-accent); background: var(--ui-accent-soft); border-radius: 15px; }
.import-upload-form { display: grid; gap: 16px; padding-top: 20px; }
.import-file-zone { min-height: 90px; }
.import-column-note { display: grid; gap: 3px; padding: 12px 14px; border-radius: 10px; background: #f6f8f8; color: var(--ui-muted); font-size: 10px; direction: ltr; text-align: left; }
.import-column-note strong { color: var(--ui-ink); direction: rtl; text-align: right; }
.import-column-note small { direction: rtl; text-align: right; }
.import-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 15px; }
.import-summary-card { display: flex; align-items: center; gap: 11px; padding: 16px; }
.import-summary-card > span { color: var(--ui-accent); }
.import-summary-card strong, .import-summary-card small { display: block; }
.import-summary-card strong { font-size: 24px; color: var(--ui-ink); }
.import-summary-card small { color: var(--ui-muted); font-size: 10px; }
.import-review-form { display: grid; gap: 15px; }
.mapping-row { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(220px, 1fr); gap: 14px; align-items: center; padding: 11px 0; border-bottom: 1px solid #f0f1f1; }
.mapping-row:last-child { border-bottom: 0; }
.mapping-row strong, .mapping-row small { display: block; }
.mapping-row strong { font-size: 11px; }
.mapping-row small { margin-top: 2px; color: var(--ui-muted); font-size: 9px; }
.mapping-row select { min-height: 40px; border: 1px solid var(--ui-line); border-radius: 9px; background: #fff; padding: 0 10px; font-size: 10px; }
.import-review-actions { display: flex; justify-content: flex-start; gap: 9px; flex-wrap: wrap; }
.import-preview-table { min-width: 940px; }
.import-preview-table .status-pill { max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 900px) {
  .profile-dropdown { position: fixed; top: 68px; inset-inline-start: 12px; inset-inline-end: auto; }
  .login-hero-copy h1 { font-size: clamp(1.55rem, 5vw, 2.4rem); }
}
@media (max-width: 560px) {
  .login-hero-copy h1, .mobile-login-logo span { white-space: normal; }
  .import-summary-grid { grid-template-columns: 1fr; }
  .import-upload-card, .import-mapping-card, .import-preview-card { padding: 15px; }
  .mapping-row { grid-template-columns: 1fr; gap: 7px; }
  .subject-filter-toolbar, .consistent-filter-toolbar { align-items: stretch; flex-direction: column; }
  .subject-filter-toolbar > *, .consistent-filter-toolbar > * { width: 100%; }
}
.ui-icon svg, .ui-icon svg * { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.ui-icon svg { stroke-width: 2; }
.sidebar-collapse-toggle { display:flex; align-items:center; gap:8px; width:calc(100% - 24px); margin:14px 12px 4px; padding:9px 11px; border:1px solid rgba(255,255,255,.14); border-radius:10px; background:rgba(255,255,255,.06); color:rgba(255,255,255,.78); cursor:pointer; font:inherit; font-size:10px; transition:background-color .18s ease,color .18s ease,border-color .18s ease; }
.sidebar-collapse-toggle:hover, .sidebar-collapse-toggle:focus-visible { background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.24); outline:none; }
.sidebar-collapse-icon { display:inline-flex; transition:transform .18s ease; }
.sidebar-collapse-label { white-space:nowrap; }
.app-shell.sidebar-collapsed .sidebar-collapse-icon { transform:rotate(180deg); }
.app-shell.sidebar-collapsed .sidebar-collapse-label { display:none; }
.app-shell.sidebar-collapsed .sidebar-collapse-toggle { justify-content:center; padding-inline:8px; }
.topbar-actions { margin-inline-start:auto; flex:0 0 auto; }
.profile-dropdown { inset-inline-start:0; inset-inline-end:auto; width:276px; max-width:calc(100vw - 24px); transform-origin:top left; }
.profile-menu.is-open .profile-dropdown { transform:translateY(6px) scale(1); }
.login-footer { justify-content:center; text-align:center; }
.date-chip { min-height:50px; padding:10px 14px; border-color:#d7bbbb; background:#fff; box-shadow:0 6px 18px rgba(71,34,34,.06); }
.date-chip strong { color:var(--brand-primary); font-size:12px; }
.kpi-icon, .quick-icon, .wizard-question > .ui-icon { color:var(--brand-primary); }
.kpi-icon svg, .quick-icon svg, .wizard-question > .ui-icon svg { stroke-width:1.9; }
.dashboard-month-control { position:relative; }
.period-select-static { display:inline-flex; align-items:center; min-height:32px; }
.dashboard-month-menu { position:absolute; z-index:8; inset-inline-end:0; top:calc(100% + 7px); display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid #eadede; border-radius:10px; background:#fff; box-shadow:0 15px 35px rgba(34,25,25,.14); white-space:nowrap; }
.dashboard-month-menu[hidden] { display:none; }
.dashboard-month-menu a { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:7px; color:var(--brand-primary); }
.dashboard-month-menu a:hover, .dashboard-month-menu a:focus-visible { background:var(--brand-primary-soft); outline:none; }
.coverage-trend-panel, .trend-panel { min-height:0; }
.coverage-chart { overflow-x:auto; padding-bottom:7px; }
.coverage-chart .bar-column { min-width:18px; }
.coverage-bar { position:relative; cursor:help; }
.coverage-bar span { transition:height .3s ease, transform .18s ease, background-color .18s ease; }
.coverage-bar:hover span, .coverage-bar:focus-visible span { transform:scaleY(1.03); background:var(--brand-primary); }
.chart-tooltip { position:fixed; z-index:80; pointer-events:none; max-width:240px; padding:7px 9px; border-radius:8px; background:#20292a; color:#fff; font-size:10px; line-height:1.6; box-shadow:0 9px 24px rgba(20,20,20,.16); }
.date-selection-modal, .time-picker-modal { position:fixed; inset:0; z-index:70; display:grid; place-items:center; padding:20px; }
.date-selection-modal[hidden], .time-picker-modal[hidden] { display:none; }
.modal-backdrop { position:absolute; inset:0; background:rgba(22,20,20,.42); backdrop-filter:blur(3px); }
.modal-dialog { position:relative; width:min(420px,100%); max-height:min(720px,calc(100vh - 40px)); overflow:auto; padding:20px; border:1px solid #eadede; border-radius:16px; background:#fff; box-shadow:0 24px 70px rgba(34,25,25,.22); }
.modal-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:15px; }
.modal-dialog-head h3 { margin:0; font-size:15px; }
.modal-dialog-subtitle { margin:-8px 0 14px; color:var(--muted); font-size:10px; }
.modal-dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.time-modal-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.time-modal-fields select { width:100%; min-height:44px; direction:ltr; text-align:center; }
.time-modal-preview { margin-top:14px; padding:11px; border-radius:10px; background:var(--brand-primary-soft); color:var(--brand-primary); text-align:center; font-size:11px; }
.time-picker-hidden { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.time-selection-button { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:58px; border:1px solid #e3dddd; border-radius:10px; background:#fff; color:var(--ink); font:inherit; cursor:pointer; }
.time-selection-button:hover, .time-selection-button:focus-visible { border-color:var(--brand-primary); outline:3px solid rgba(169,28,28,.12); }
.time-selection-button strong { direction:ltr; }
.jalali-picker input[readonly] { cursor:pointer; }
.date-selection-modal .jalali-panel { position:static; inset:auto; width:auto; padding:0; border:0; box-shadow:none; background:transparent; }
.modal-backdrop { border:0; padding:0; cursor:default; }
.page-transition-loader { position:fixed; z-index:120; top:0; right:0; width:0; height:3px; background:var(--brand-primary); opacity:0; pointer-events:none; transition:width .34s ease, opacity .18s ease; }
.page-transition-loader.is-active { width:100%; opacity:1; }
body.modal-open { overflow:hidden; }
@media (min-width:901px) { .sidebar { width:264px; transition:width .2s ease; } .main-shell { transition:width .2s ease, margin-right .2s ease; } .app-shell.sidebar-collapsed .sidebar { width:78px; } .app-shell.sidebar-collapsed .main-shell { width:calc(100% - 78px); margin-right:78px; } .app-shell.sidebar-collapsed .brand-block > div, .app-shell.sidebar-collapsed .nav-label, .app-shell.sidebar-collapsed .nav-item > span:not(.nav-icon), .app-shell.sidebar-collapsed .sidebar-footer .logout-button > span:not(.nav-icon), .app-shell.sidebar-collapsed .nav-counter { display:none; } .app-shell.sidebar-collapsed .brand-block { justify-content:center; } .app-shell.sidebar-collapsed .nav-item { justify-content:center; padding-inline:0; } .app-shell.sidebar-collapsed .sidebar-footer { padding-inline:12px; } }
@media (max-width:900px) { .sidebar-collapse-toggle { display:none; } .profile-dropdown { inset-inline-start:auto; inset-inline-end:12px; top:68px; width:min(276px,calc(100vw - 24px)); } .time-modal-fields { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { .sidebar, .main-shell, .sidebar-collapse-icon, .coverage-bar span { transition:none; } }
.profile-menu { padding-right:0; border-right:0; }
.profile-dropdown { position:absolute; inset:auto; left:0; right:auto; top:calc(100% + 8px); max-width:calc(100vw - 24px); }
.date-chip { height:42px; min-height:42px; padding:0 12px; gap:8px; white-space:nowrap; }
.date-chip > span:first-child { display:inline-flex; align-items:center; font-size:18px; }
.date-chip small, .date-chip strong { display:inline; }
.date-chip small { font-size:9px; }
.date-chip strong { font-size:11px; }
.date-chip-separator { color:#b9a3a0; font-size:11px; }
.dashboard-grid .trend-panel { min-height:0; height:auto; overflow:visible; }
.dashboard-grid .coverage-chart { height:160px; min-height:0; overflow-x:auto; overflow-y:hidden; }
.dashboard-month-menu, .dashboard-month-menu span { color:#20292a; }
.dashboard-month-menu { background:#fff; }
.dashboard-month-menu a { color:var(--brand-primary); }
.login-hero-copy h1 { max-width:360px; white-space:normal; line-height:1.25; }
.input-with-icon { position:relative; }
.password-toggle { position:absolute; left:8px; top:50%; transform:translateY(-50%); width:36px; height:36px; margin:0; display:grid; place-items:center; }
.input-with-icon input[type=password], .input-with-icon input[type=text] { padding-left:52px; }
.wizard-more summary { list-style:none; display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.wizard-more summary::-webkit-details-marker { display:none; }
.wizard-more summary .ui-icon { transition:transform .18s ease; }
.wizard-more[open] summary .ui-icon { transform:rotate(180deg); }
.sidebar-footer { display:flex; flex-direction:column; }
.sidebar-footer .sidebar-collapse-toggle { order:2; margin:12px 12px 0; }
.import-export-card { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:15px; }
.import-export-card h2 { margin:4px 0; font-size:15px; }
.import-export-card p { margin:0; color:var(--ui-muted); font-size:10px; }
.import-export-form { display:flex; align-items:end; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.import-export-form label { display:grid; gap:5px; min-width:130px; }
.import-export-form label span { font-size:9px; color:var(--ui-muted); }
.import-export-form input, .import-export-form select { height:37px; min-width:130px; border:1px solid var(--ui-line); border-radius:8px; background:#fff; color:var(--ui-ink); padding:0 9px; font-size:10px; }
.import-export-form .secondary-button { height:37px; white-space:nowrap; }
.table-action .ui-icon, .excel-button .ui-icon, .report-filter-form .primary-button .ui-icon { width:20px; height:20px; font-size:20px; vertical-align:middle; }
@media (max-width:900px) { .import-export-card { align-items:stretch; flex-direction:column; } .import-export-form { justify-content:stretch; } .import-export-form > * { flex:1 1 150px; } }
@media (max-width:560px) { .import-export-form { display:grid; grid-template-columns:1fr 1fr; } .import-export-form .secondary-button { grid-column:1/-1; } }
@media (max-width:900px) { .profile-dropdown { position:fixed; inset:auto; left:auto; right:12px; top:68px; } }