/* ===================================================================
   Field Act — Shared Design Tokens & Base Components (Winter Chill)
   این فایل از fieldact-ui.html استخراج شده تا در صفحات واقعی و
   functional هم استفاده بشه - یک منبع واحد برای رنگ/تایپوگرافی.
   =================================================================== */

:root{
  --ink:#0B2E33;
  --ink-soft:#123A40;
  --ink-softer:#1B454C;
  --ink-line:#234F56;
  --manifest:var(--ink);
  --manifest-soft:var(--ink-softer);
  --manifest-line:var(--ink-line);
  --accent-primary:#4F7C82;
  --accent-primary-deep:#123A40;
  --accent-primary-pale:#C7DEE0;
  --accent-primary-strong:#8FBDC4;
  --accent-success:#16A874;
  --accent-success-deep:#0B4A35;
  --accent-success-pale:#C8F2E0;
  --neutral-chip-pale:#D7E3E4;
  --neutral-chip-deep:#33484A;
  --ink-text:#EAF6F6;
  --paper-text:#EAF6F6;
  /* بهبود کنتراست برای WCAG AA: 4.5:1 */
  --muted-on-dark:#A5CDD1;
  --muted-on-paper:#7FA3A8;
  --danger:#E2574A;
  --danger-pale:#3A2320;
  --text-on-accent:#F5FBFB;
  --text-on-success:#FFFFFF;
  --font-fa:'YekanBakh','Yekan','Vazirmatn',sans-serif;
  --motion-fast:150ms; --motion-base:250ms; --motion-slow:400ms;
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --card-shadow:0 1px 2px rgba(0,0,0,.12),0 8px 24px rgba(0,0,0,.14),0 24px 56px rgba(0,0,0,.10);
  --font-mono:'JetBrains Mono',monospace;

  /* Spacing scale برای consistency */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;

  /* Border radius scale */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;
}
html[data-theme="light"]{
  --ink:#EAF6F7;
  --ink-soft:#FFFFFF;
  --ink-softer:#DCEEF0;
  --ink-line:#CFE4E6;
  --manifest:var(--ink);
  --manifest-soft:var(--ink-softer);
  --manifest-line:var(--ink-line);
  --accent-primary:#4F7C82;
  --accent-primary-deep:#123A40;
  --accent-primary-pale:#DCEEF0;
  --accent-primary-strong:#3A5F64;
  --accent-success:#0E9F6E;
  --accent-success-deep:#0B7C56;
  --accent-success-pale:#DCF5EA;
  --neutral-chip-pale:#E7EFEF;
  --neutral-chip-deep:#33484A;
  --ink-text:#0B2E33;
  --paper-text:#0B2E33;
  --muted-on-dark:#4F7C82;
  --muted-on-paper:#4F7C82;
  --card-shadow:0 1px 2px rgba(11,46,51,.06),0 8px 24px rgba(11,46,51,.07),0 24px 56px rgba(11,46,51,.05);
  --danger:#D6483B;
  --danger-pale:#FBE7E5;
  --text-on-accent:#F5FBFB;
  --text-on-success:#FFFFFF;
}

*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:var(--font-fa);
  background:var(--ink);
  color:var(--ink-text);
  min-height:100vh;
}
body,button,input,textarea,select{transition:background-color .18s ease,border-color .18s ease,color .18s ease;}

a{color:inherit;}

/* ===== top bar ===== */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px;max-width:1180px;margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand-mark {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: url('/assets/logo.png') center/cover no-repeat;
  flex-shrink: 0;
}
.brand-name{font-weight:800;font-size:17px;}
.brand-name span{color:var(--accent-primary);}
.theme-toggle{
  width:38px;height:38px;border-radius:11px;border:1px solid var(--ink-line);
  background:var(--ink-soft);color:var(--ink-text);cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.theme-toggle svg{width:17px;height:17px;}
.theme-toggle .icon-sun{display:none;}
html[data-theme="light"] .theme-toggle .icon-sun{display:block;}
html[data-theme="light"] .theme-toggle .icon-moon{display:none;}

/* ===== buttons ===== */
.btn-solid{
  font-family:var(--font-fa);font-size:13px;font-weight:700;color:var(--text-on-accent);
  background:var(--accent-primary);border:none;padding:11px 18px;border-radius:11px;cursor:pointer;
}
.btn-solid:disabled{opacity:.55;cursor:not-allowed;}
.btn-ghost{
  font-family:var(--font-fa);font-size:13px;font-weight:700;color:var(--ink-text);
  background:transparent;border:1px solid var(--ink-line);padding:10px 17px;border-radius:11px;cursor:pointer;
}
.btn-block{width:100%;}

/* ===== form elements ===== */
.field-group{margin-bottom:16px;}
.field-label{font-size:12.5px;font-weight:700;color:var(--ink-text);margin-bottom:7px;display:block;}
.field-input{
  width:100%;padding:12px 14px;border-radius:11px;border:1px solid var(--ink-line);
  background:var(--ink-soft);color:var(--ink-text);font-family:var(--font-fa);font-size:13.5px;
}
.field-input:focus{outline:2px solid var(--accent-primary);outline-offset:1px;}
.field-input::placeholder{color:var(--muted-on-dark);}
.field-hint{font-size:11px;color:var(--muted-on-dark);margin-top:6px;}
.field-error{font-size:11.5px;color:var(--danger);margin-top:6px;}

/* خطای اعتبارسنجی real-time: کادر و متن قرمز + لرزش ملایم روی نمایش خطا */
.field-group.error .field-input{
  border-color:var(--danger);
  background:var(--danger-pale);
}
.field-group.error .field-label{color:var(--danger);}
.field-group.error .field-error{animation:field-shake .25s ease-in-out;}
@keyframes field-shake{
  0%,100%{transform:translateX(0);}
  25%{transform:translateX(3px);}
  75%{transform:translateX(-3px);}
}
@media (prefers-reduced-motion:reduce){
  .field-group.error .field-error{animation:none;}
}

/* ===== skeleton loading ===== */
.skeleton{
  position:relative;overflow:hidden;
  background:var(--ink-line);border-radius:10px;
}
.skeleton::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
  transform:translateX(-100%);
  animation:skeleton-shimmer 1.4s infinite;
}
.skeleton-row{display:flex;align-items:center;gap:12px;padding:12px 16px;}
.skeleton-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;}
.skeleton-line{height:12px;border-radius:6px;}
.skeleton-line.w-40{width:40%;}
.skeleton-line.w-60{width:60%;}
.skeleton-line.w-20{width:20%;}
.skeleton-stat{height:110px;border-radius:16px;}
@keyframes skeleton-shimmer{
  100%{transform:translateX(100%);}
}
@media (prefers-reduced-motion:reduce){
  .skeleton::after{animation:none;opacity:.4;}
}

/* ===== alert / toast ===== */
.alert{
  padding:12px 14px;border-radius:11px;font-size:12.5px;font-weight:600;margin-bottom:16px;
  display:flex;align-items:flex-start;gap:8px;
}
.alert.error{background:var(--danger-pale);color:var(--danger);}
.alert.success{background:var(--accent-success-pale);color:var(--accent-success-deep);}

/* ===== card ===== */
.card{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:18px;padding:24px;}

/* ===== spinner ===== */
.spinner{
  width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);
  border-top-color:currentColor;display:inline-block;animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}

.hidden{display:none !important;}

/* ===================================================================
   Admin console shared components
   =================================================================== */
.console{
  display:grid;grid-template-columns:220px 1fr;
  background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:20px;overflow:hidden;
  min-height:70vh;max-width:1180px;margin:0 auto;
}
.rail{background:var(--ink);border-left:1px solid var(--ink-line);padding:22px 16px;display:flex;flex-direction:column;}
.rail-org{display:flex;align-items:center;gap:10px;padding:0 6px 20px;margin-bottom:14px;border-bottom:1px solid var(--ink-line);}
.rail-org-mark{width:30px;height:30px;border-radius:8px;background:var(--accent-primary);flex-shrink:0;}
.rail-org-name{font-size:13px;font-weight:700;}
.rail-org-plan{font-size:10.5px;color:var(--accent-success);font-family:var(--font-mono);font-weight:600;}
.rail-nav{display:flex;flex-direction:column;gap:2px;flex:1;}
.rail-item{
  display:flex;align-items:center;gap:10px;padding:10px 10px;border-radius:9px;
  font-size:13px;font-weight:600;color:var(--muted-on-dark);cursor:pointer;text-decoration:none;
}
.rail-item.active{background:var(--ink-softer);color:var(--ink-text);}
.rail-item .dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;flex-shrink:0;}
.rail-item.active .dot{background:var(--accent-primary);opacity:1;}
.rail-sub{margin-top:14px;padding:13px 12px;border-radius:12px;background:var(--ink-softer);border:1px solid var(--ink-line);}
.rail-sub-label{font-size:10.5px;color:var(--muted-on-dark);font-weight:600;margin-bottom:4px;}
.rail-sub-value{font-size:12.5px;font-weight:700;color:var(--ink-text);font-family:var(--font-mono);}
.rail-sub-bar{height:4px;border-radius:2px;background:var(--ink-line);margin-top:9px;overflow:hidden;}
.rail-sub-bar > div{height:100%;background:var(--accent-primary);}

.main{padding:24px 26px 30px;}
.main-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;flex-wrap:wrap;gap:12px;}
.main-title{font-size:19px;font-weight:800;}
.main-title span{font-size:12.5px;font-weight:600;color:var(--muted-on-dark);display:block;margin-top:3px;}
.main-actions{display:flex;gap:8px;}

.ledger-row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ink-line);
  border:1px solid var(--ink-line);border-radius:14px;overflow:hidden;margin-bottom:20px;
}
.ledger-stat{background:var(--ink-soft);padding:16px 18px;}
.ledger-stat-label{font-size:11px;color:var(--muted-on-dark);font-weight:600;margin-bottom:10px;}
.ledger-stat-value{font-family:var(--font-mono);font-size:24px;font-weight:700;color:var(--ink-text);}
.ledger-stat-value small{font-size:12px;color:var(--muted-on-dark);font-weight:500;margin-inline-start:4px;}
.ledger-stat-value.amber{color:var(--accent-primary);}
.ledger-stat-value.teal{color:var(--accent-success);}

.panel{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:16px;overflow:hidden;}
.panel-head{padding:15px 18px;border-bottom:1px solid var(--ink-line);display:flex;align-items:center;justify-content:space-between;}
.panel-title{font-size:13px;font-weight:700;}

.ledger-list{padding:6px 0;}
.ledger-item{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px dashed var(--ink-line);}
.ledger-item:last-child{border-bottom:none;}
.li-avatar{
  width:32px;height:32px;border-radius:50%;background:var(--ink-softer);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;
}
.li-body{flex:1;min-width:0;}
.li-name{font-size:12.5px;font-weight:700;}
.li-spot{font-size:11px;color:var(--muted-on-dark);}
.li-time{font-family:var(--font-mono);font-size:11.5px;font-weight:600;}
.li-method{font-size:9.5px;font-weight:700;padding:3px 7px;border-radius:6px;margin-inline-start:8px;white-space:nowrap;}
.li-method.gps{background:var(--accent-primary-pale);color:var(--accent-primary-deep);}
.li-method.qr{background:var(--accent-success-pale);color:var(--accent-success-deep);}
.li-method.wifi{background:var(--neutral-chip-pale);color:var(--neutral-chip-deep);}

.empty-state{padding:36px 18px;text-align:center;color:var(--muted-on-dark);font-size:12.5px;}

/* employee list */
.list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap;}
.search-input{
  flex:1;min-width:200px;max-width:340px;padding:10px 14px;border-radius:10px;
  border:1px solid var(--ink-line);background:var(--ink-soft);color:var(--ink-text);
  font-family:var(--font-fa);font-size:12.5px;
}
.search-input::placeholder{color:var(--muted-on-dark);}
.filter-chips{display:flex;gap:6px;flex-wrap:wrap;}
.filter-chip{
  padding:8px 14px;border-radius:9px;border:1px solid var(--ink-line);background:transparent;
  color:var(--muted-on-dark);font-family:var(--font-fa);font-size:12px;font-weight:600;cursor:pointer;
}
.filter-chip.active{background:var(--accent-primary);border-color:var(--accent-primary);color:var(--text-on-accent);}

.emp-table{background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:16px;overflow:hidden;}
.emp-row{
  display:grid;grid-template-columns:auto 1.6fr 1.4fr auto auto auto;gap:14px;align-items:center;
  padding:13px 18px;border-bottom:1px dashed var(--ink-line);
}
.emp-row:last-child{border-bottom:none;}
.emp-row.head{color:var(--muted-on-dark);font-size:10.5px;font-weight:700;padding-top:11px;padding-bottom:11px;border-bottom:1px solid var(--ink-line);}
/* Responsive breakpoints استاندارد */
/* Mobile: تا 767px */
@media (max-width:767px){
  .emp-row{grid-template-columns:auto 1fr auto;}
  .emp-row .col-methods,.emp-row .col-lastcheckin{display:none;}
  .console{grid-template-columns:1fr;}
  .rail{display:none;} /* تبدیل به mobile menu */
  .rail-sub{display:none;}

  /* افزایش اندازه input برای موبایل */
  .field-input, .search-input {
    font-size: 16px; /* جلوگیری از zoom در iOS */
    padding: 14px 16px;
  }

  /* دکمه‌های بزرگ‌تر در موبایل */
  .btn-solid, .btn-ghost {
    min-height: 48px;
    padding: 14px 20px;
  }
}

/* Tablet: 768px تا 1023px */
@media (min-width:768px) and (max-width:1023px){
  .console{
    grid-template-columns:200px 1fr;
    gap:24px;
  }

  .emp-row{
    grid-template-columns:auto 1fr auto auto;
  }
  .emp-row .col-methods{display:none;} /* فقط methods مخفی */

  .form-row{
    grid-template-columns:1fr 1fr;
  }
}

/* Desktop: 1024px+ */
@media (min-width:1024px){
  .console{
    grid-template-columns:240px 1fr;
  }
}
.emp-avatar{
  width:36px;height:36px;border-radius:50%;background:var(--ink-softer);
  display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:700;flex-shrink:0;
}
.emp-name{font-size:13px;font-weight:700;}
.emp-role{font-size:11px;color:var(--muted-on-dark);margin-top:2px;}
.emp-methods{display:flex;gap:4px;flex-wrap:wrap;}
.emp-status{font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:999px;white-space:nowrap;border:none;font-family:var(--font-fa);cursor:pointer;}
.emp-status.active{background:var(--accent-success-pale);color:var(--accent-success-deep);}
.emp-status.inactive{background:var(--neutral-chip-pale);color:var(--muted-on-paper);}
.emp-lastcheckin{font-family:var(--font-mono);font-size:11.5px;color:var(--muted-on-dark);white-space:nowrap;}
.emp-actions{display:flex;gap:6px;}
.icon-btn{
  /* بهبود touch target: حداقل 44px برای accessibility */
  min-width:44px;min-height:44px;
  padding:10px;
  border-radius:8px;border:1px solid var(--ink-line);background:transparent;
  color:var(--muted-on-dark);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition: all 0.2s ease;
}
.icon-btn svg{width:16px;height:16px;}
.icon-btn:hover{background:var(--ink-softer);border-color:var(--accent-primary);}
.icon-btn.danger:hover{color:var(--danger);border-color:var(--danger);background:var(--danger-pale);}

/* Focus indicators واضح برای accessibility */
*:focus-visible {
  outline: 2px solid var(--accent-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(79, 124, 130, 0.2);
}

/* add-employee form */
.form-wrap{max-width:640px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px;}
@media (max-width:520px){.form-row{grid-template-columns:1fr;}}
.role-pills{display:flex;gap:8px;flex-wrap:wrap;}
.role-pill{
  padding:9px 16px;border-radius:9px;border:1px solid var(--ink-line);background:var(--ink);
  color:var(--muted-on-dark);font-family:var(--font-fa);font-size:12.5px;font-weight:600;cursor:pointer;
}
.role-pill.selected{border-color:var(--accent-primary);background:var(--accent-primary-pale);color:var(--accent-primary-deep);}
.section-divider{display:flex;align-items:center;gap:12px;margin:26px 0 16px;}
.section-divider-title{font-size:13.5px;font-weight:700;white-space:nowrap;}
.section-divider-line{height:1px;background:var(--ink-line);flex:1;}
.method-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
@media (max-width:640px){.method-grid-3{grid-template-columns:1fr;}}
.method-card{
  display:flex;gap:12px;padding:15px;border-radius:13px;border:1.5px solid var(--ink-line);
  background:var(--ink);cursor:pointer;text-align:right;
}
.method-card.selected{border-color:var(--accent-primary);background:var(--ink-softer);}
.method-icon{
  width:38px;height:38px;border-radius:10px;background:var(--ink-softer);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--muted-on-dark);
}
.method-card.selected .method-icon{background:var(--accent-primary);color:var(--text-on-accent);}
.method-icon svg{width:19px;height:19px;}
.method-body{flex:1;}
.method-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.method-title{font-size:13px;font-weight:700;color:var(--ink-text);}
.method-check{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--ink-line);flex-shrink:0;position:relative;}
.method-card.selected .method-check{border-color:var(--accent-primary);background:var(--accent-primary);}
.method-card.selected .method-check::after{
  content:"";position:absolute;inset:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5FBFB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/62% no-repeat;
}
.method-desc{font-size:11.5px;color:var(--muted-on-dark);margin-top:4px;line-height:1.7;}
.combo-hint{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;background:var(--ink-softer);border-radius:10px;font-size:11px;color:var(--muted-on-dark);}
.combo-hint b{color:var(--accent-primary);font-weight:700;}
.toggle-card{
  display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px;
  border-radius:13px;border:1.5px solid var(--ink-line);background:var(--ink);margin-top:10px;
}
.toggle-copy-title{font-size:13px;font-weight:700;color:var(--ink-text);}
.toggle-copy-desc{font-size:11.5px;color:var(--muted-on-dark);margin-top:4px;line-height:1.7;}
.toggle-switch{width:42px;height:24px;border-radius:999px;background:var(--ink-line);flex-shrink:0;position:relative;cursor:pointer;}
.toggle-switch::after{content:"";position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:var(--muted-on-dark);transition:transform .16s ease,background .16s ease;}
.toggle-switch.on{background:var(--accent-primary-pale);}
.toggle-switch.on::after{transform:translateX(-18px);background:var(--accent-primary);}
.form-footer{display:flex;align-items:center;justify-content:space-between;margin-top:26px;gap:12px;flex-wrap:wrap;}
.form-footer-note{font-size:11px;color:var(--muted-on-dark);}
.form-footer-actions{display:flex;gap:8px;}
.password-field{display:flex;gap:8px;}
.password-field .field-input{flex:1;}

/* billing / subscription */
.owner-badge{
  display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;
  color:var(--accent-primary-strong);background:var(--accent-primary-pale);
  padding:4px 10px;border-radius:999px;margin-inline-start:8px;
}
.current-plan-card{
  background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:16px;padding:22px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px;
}
.current-plan-name{font-size:16px;font-weight:800;margin-bottom:5px;}
.current-plan-expiry{font-size:12px;color:var(--muted-on-dark);}
.current-plan-expiry b{font-family:var(--font-mono);color:var(--ink-text);font-weight:600;}
.current-plan-usage{min-width:180px;}
.usage-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted-on-dark);margin-bottom:7px;}
.usage-bar{height:6px;border-radius:3px;background:var(--ink-line);overflow:hidden;}
.usage-bar > div{height:100%;background:var(--accent-primary);}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px;}
@media (max-width:900px){.plans-grid{grid-template-columns:1fr;}}
.plan-card{background:var(--ink-soft);border:1.5px solid var(--ink-line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:10px;}
.plan-card.current{border-color:var(--accent-primary);}
.plan-card-name{font-size:13.5px;font-weight:700;}
.plan-card-price{font-family:var(--font-mono);font-size:22px;font-weight:700;}
.plan-card-price small{font-size:11px;font-weight:500;color:var(--muted-on-dark);}
.plan-card-meta{font-size:11.5px;color:var(--muted-on-dark);}
.plan-card-cta{
  margin-top:8px;padding:10px;border-radius:10px;border:none;font-family:var(--font-fa);
  font-size:12.5px;font-weight:700;cursor:pointer;background:var(--accent-primary);color:var(--text-on-accent);
}
.plan-card.current .plan-card-cta{background:var(--ink-line);color:var(--muted-on-dark);cursor:default;}
.history-row{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-bottom:1px dashed var(--ink-line);font-size:12px;gap:10px;flex-wrap:wrap;}
.history-row:last-child{border-bottom:none;}
.history-date{font-family:var(--font-mono);color:var(--muted-on-dark);}
.history-amount{font-family:var(--font-mono);font-weight:700;}
.history-status{font-size:10px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.history-status.success{background:var(--accent-success-pale);color:var(--accent-success-deep);}
.history-status.pending{background:var(--neutral-chip-pale);color:var(--neutral-chip-deep);}
.history-status.failed{background:var(--danger-pale);color:var(--danger);}

/* reports page */
.report-row{
  display:grid;grid-template-columns:auto 1.6fr 1fr auto auto;gap:14px;align-items:center;
  padding:13px 18px;border-bottom:1px dashed var(--ink-line);cursor:pointer;
}
.report-row:last-child{border-bottom:none;}
.report-row:hover{background:var(--ink-softer);}
.report-row.head{cursor:default;color:var(--muted-on-dark);font-size:10.5px;font-weight:700;padding-top:11px;padding-bottom:11px;border-bottom:1px solid var(--ink-line);}
.report-row.head:hover{background:transparent;}
.report-type-badge{font-size:10px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.report-type-badge.registration{background:var(--accent-primary-pale);color:var(--accent-primary-deep);}
.report-type-badge.activity{background:var(--neutral-chip-pale);color:var(--neutral-chip-deep);}
.report-type-badge.custom{background:var(--accent-success-pale);color:var(--accent-success-deep);}
.report-date{font-family:var(--font-mono);font-size:11.5px;color:var(--muted-on-dark);}

.modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;
  padding:20px;z-index:50;
}
.modal-box{
  background:var(--ink-soft);border:1px solid var(--ink-line);border-radius:18px;padding:24px;
  max-width:480px;width:100%;max-height:80vh;overflow-y:auto;
}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.modal-title{font-size:15px;font-weight:800;}
.modal-close{
  width:30px;height:30px;border-radius:9px;border:1px solid var(--ink-line);background:transparent;
  color:var(--muted-on-dark);cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.modal-field{padding:10px 0;border-top:1px dashed var(--ink-line);}
.modal-field:first-child{border-top:none;}
.modal-field-label{font-size:11px;color:var(--muted-on-dark);margin-bottom:4px;}
.modal-field-value{font-size:13px;font-weight:600;}

/* expert report form */
.tpl-picker{display:flex;flex-direction:column;gap:8px;}
.tpl-pick-card{
  display:flex;align-items:center;gap:12px;padding:15px;border-radius:13px;border:1.5px solid var(--ink-line);
  background:var(--ink-soft);cursor:pointer;text-align:right;
}
.tpl-pick-card:hover{border-color:var(--accent-primary);}
.tpl-pick-icon{width:36px;height:36px;border-radius:10px;background:var(--ink-softer);display:flex;align-items:center;justify-content:center;color:var(--accent-primary);flex-shrink:0;}
.tpl-pick-icon svg{width:16px;height:16px;}
.dyn-field{margin-bottom:16px;}
.dyn-field-label{font-size:12.5px;font-weight:700;color:var(--ink-text);margin-bottom:7px;display:block;}
.dyn-field-label .req{color:var(--danger);}
.dyn-field-input{
  width:100%;padding:11px 13px;border-radius:11px;border:1px solid var(--ink-line);
  background:var(--ink-soft);color:var(--ink-text);font-family:var(--font-fa);font-size:13.5px;
}
.dyn-field-input:focus{outline:2px solid var(--accent-primary);outline-offset:1px;}
.dyn-checkbox-row{display:flex;align-items:center;gap:8px;}

/* locations */
.loc-row{display:grid;grid-template-columns:auto 1.4fr 1fr 1fr auto auto;gap:14px;align-items:center;padding:13px 18px;border-bottom:1px dashed var(--ink-line);}
.loc-row:last-child{border-bottom:none;}
.loc-row.head{color:var(--muted-on-dark);font-size:10.5px;font-weight:700;border-bottom:1px solid var(--ink-line);}
@media (max-width:900px){.loc-row{grid-template-columns:auto 1fr auto;}.loc-row .col-coords,.loc-row .col-radius{display:none;}}
.loc-icon{width:36px;height:36px;border-radius:10px;background:var(--ink-softer);display:flex;align-items:center;justify-content:center;color:var(--accent-primary);flex-shrink:0;}
.loc-icon svg{width:16px;height:16px;}
.loc-name{font-size:13px;font-weight:700;}
.loc-code{font-size:11px;color:var(--muted-on-dark);font-family:var(--font-mono);}
.loc-coords{font-family:var(--font-mono);font-size:11px;color:var(--muted-on-dark);direction:ltr;text-align:right;}
.loc-radius{font-family:var(--font-mono);font-size:12px;}
.radius-presets{display:flex;gap:6px;margin-top:8px;}
.radius-preset{
  padding:6px 12px;border-radius:8px;border:1px solid var(--ink-line);background:var(--ink);
  color:var(--muted-on-dark);font-family:var(--font-mono);font-size:11px;cursor:pointer;
}
.radius-preset:hover,.radius-preset.active{border-color:var(--accent-primary);color:var(--accent-primary);}
.method-select-row{display:flex;gap:8px;flex-wrap:wrap;}
.method-select-chip{
  padding:9px 16px;border-radius:9px;border:1px solid var(--ink-line);background:var(--ink);
  color:var(--muted-on-dark);font-family:var(--font-fa);font-size:12.5px;font-weight:600;cursor:pointer;
}
.method-select-chip.selected{border-color:var(--accent-primary);background:var(--accent-primary-pale);color:var(--accent-primary-deep);}

.qr-modal-box{text-align:center;}
.qr-canvas-wrap{background:#fff;padding:16px;border-radius:14px;display:inline-block;margin:12px 0;}
.qr-countdown{font-family:var(--font-mono);font-size:12px;color:var(--muted-on-dark);}

/* profile page */
.profile-avatar-wrap{display:flex;flex-direction:column;align-items:center;padding:24px 0;}
.profile-avatar{
  width:96px;height:96px;border-radius:50%;background:var(--ink-softer);border:2px solid var(--ink-line);
  display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;color:var(--ink-text);
  position:relative;overflow:hidden;cursor:pointer;
}
.profile-avatar img{width:100%;height:100%;object-fit:cover;}
.profile-avatar-overlay{
  position:absolute;inset:0;background:rgba(0,0,0,.45);color:#fff;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .15s ease;font-size:11px;font-weight:700;
}
.profile-avatar:hover .profile-avatar-overlay{opacity:1;}
.profile-name{font-size:16px;font-weight:800;margin-top:14px;}
.profile-role{font-size:12px;color:var(--muted-on-dark);margin-top:3px;}
.profile-info-row{display:flex;justify-content:space-between;padding:12px 0;border-top:1px dashed var(--ink-line);font-size:12.5px;}
.profile-info-row:first-child{border-top:none;}
.profile-info-label{color:var(--muted-on-dark);}
.profile-info-value{font-weight:600;}

/* org settings */
.bt-row{display:flex;align-items:center;justify-content:space-between;padding:11px 18px;border-bottom:1px dashed var(--ink-line);}
.bt-row:last-child{border-bottom:none;}
.bt-name{font-size:12.5px;font-weight:700;}
.interval-options{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.interval-chip{
  padding:9px 16px;border-radius:9px;border:1px solid var(--ink-line);background:var(--ink);
  color:var(--muted-on-dark);font-family:var(--font-fa);font-size:12.5px;font-weight:600;cursor:pointer;
}
.interval-chip.selected{border-color:var(--accent-primary);background:var(--accent-primary-pale);color:var(--accent-primary-deep);}
.inline-add-row{display:flex;gap:8px;padding:14px 18px;border-top:1px solid var(--ink-line);}
.inline-add-row .field-input{flex:1;}

/* live map */
.split{display:grid;grid-template-columns:1.15fr 1fr;gap:18px;margin-bottom:20px;}
@media (max-width:900px){.split{grid-template-columns:1fr;}}
.panel-legend{display:flex;gap:12px;font-size:10.5px;color:var(--muted-on-dark);font-weight:600;}
.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-inline-end:4px;background:var(--accent-primary);}
#liveMap{height:290px;width:100%;border-radius:0 0 16px 16px;}
.map-empty-overlay{
  height:290px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;
  color:var(--muted-on-dark);font-size:12px;text-align:center;padding:0 20px;
}
.neshan-marker-label{
  background:var(--ink-soft);color:var(--ink-text);border:1px solid var(--ink-line);border-radius:8px;
  padding:3px 8px;font-family:var(--font-fa);font-size:11px;font-weight:700;white-space:nowrap;
  box-shadow:0 4px 10px rgba(0,0,0,.2);
}


/* FieldAct UI polish: accessible motion, 8pt rhythm, layered card elevation */
@font-face{font-family:'YekanBakh';src:url('/assets/fonts/YekanBakh-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'YekanBakh';src:url('/assets/fonts/YekanBakh-Bold.woff2') format('woff2');font-weight:700 900;font-display:swap}
.card,.panel,.plan-card,.current-plan-card,.auth-card{border:1px solid var(--ink-line);box-shadow:var(--card-shadow)}
button,.btn-solid,.btn-ghost,.plan-card-cta,.rail-link,.nav-item{transition:transform var(--motion-fast) var(--ease-out),background-color var(--motion-base) var(--ease-out),border-color var(--motion-base) var(--ease-out),color var(--motion-base) var(--ease-out),box-shadow var(--motion-base) var(--ease-out)}
button:active,.btn-solid:active,.btn-ghost:active,.plan-card-cta:active{transform:scale(.98)}
.rail-link:hover,.nav-item:hover{background:var(--ink-softer);color:var(--ink-text);transform:translateX(-2px)}
.main .panel,.main .plan-card,.main .current-plan-card,.main .emp-table{animation:fa-enter var(--motion-slow) var(--ease-out) both}
.main .panel:nth-child(2),.main .plan-card:nth-child(2){animation-delay:50ms}
.main .panel:nth-child(3),.main .plan-card:nth-child(3){animation-delay:100ms}
@keyframes fa-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.skeleton{background:linear-gradient(90deg,var(--ink-soft) 25%,var(--ink-softer) 50%,var(--ink-soft) 75%);background-size:200% 100%;animation:fa-shimmer 1.3s linear infinite;border-radius:8px}
@keyframes fa-shimmer{to{background-position:-200% 0}}
.field-input,.auth-stage input{border:1px solid var(--ink-line)}
.field-input:focus,.auth-stage input:focus{outline:0;border-color:var(--accent-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-primary) 20%,transparent)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}