/* Auto Gallery Sadra — Design System Stage 9
   Final stabilization and central guardrails.
   This layer intentionally avoids page-specific redesigns and business logic.
   It standardizes shared tokens, stacking order, safe overflow, touch targets,
   print behavior and accessibility while preserving the approved banner and
   smart-dropdown behavior from v452. */

:root{
  /* Central spacing scale */
  --ds-space-1:4px;
  --ds-space-2:8px;
  --ds-space-3:12px;
  --ds-space-4:16px;
  --ds-space-5:20px;
  --ds-space-6:24px;
  --ds-space-8:32px;

  /* Central radii */
  --ds-radius-sm:8px;
  --ds-radius-md:12px;
  --ds-radius-lg:16px;
  --ds-radius-xl:20px;

  /* Central shadows */
  --ds-shadow-sm:0 4px 14px rgba(15,35,55,.08);
  --ds-shadow-md:0 12px 30px rgba(15,35,55,.12);
  --ds-shadow-lg:0 20px 48px rgba(15,35,55,.16);

  /* One documented stacking scale for the whole application. */
  --ds-z-base:1;
  --ds-z-sticky:200;
  --ds-z-header:500;
  --ds-z-dropdown:1400;
  --ds-z-drawer:1800;
  --ds-z-modal-backdrop:2000;
  --ds-z-modal:2100;
  --ds-z-toast:2400;
  --ds-z-critical:2600;

  /* Safe mobile viewport helpers. */
  --ds-safe-bottom:max(12px,env(safe-area-inset-bottom));
  --ds-safe-top:max(8px,env(safe-area-inset-top));
}

/* Prevent flex/grid descendants from causing accidental horizontal overflow. */
:where(.app-shell,.app-main,.page,.page-container,.content,.content-area,
       .container,.container-fluid,.row,.grid,.form-grid,.card-grid,
       .dashboard-grid,.dashboard-section,.modal-body,.drawer-body) > *{
  min-width:0;
}

:where(img,svg,video,canvas){
  max-width:100%;
}

/* Long identifiers and descriptions must wrap instead of widening the page. */
:where(.card,.panel,.form-card,.page-card,.alert,.message,.toast,
       td,th,.description,.details,.meta,.value,.title){
  overflow-wrap:anywhere;
  word-break:normal;
}

/* Shared stacking contract. Page-specific values can still opt out explicitly. */
:where(.sticky,.sticky-top,.page-sticky,.table-sticky){z-index:var(--ds-z-sticky)}
:where(.app-header,.topbar,.navbar,.mobile-header){z-index:var(--ds-z-header)}
:where(.dropdown-menu,.autocomplete-list,.suggestions-list,
       .person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
       .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
       .color-dropdown,.province-dropdown,.city-dropdown,.location-dropdown){
  z-index:var(--ds-z-dropdown);
}
:where(.drawer,.offcanvas,.sidebar-mobile,.mobile-menu){z-index:var(--ds-z-drawer)}
:where(.modal-backdrop,.dialog-backdrop){z-index:var(--ds-z-modal-backdrop)}
:where(.modal,.dialog,.popup-modal){z-index:var(--ds-z-modal)}
:where(.toast-container,.toasts,.flash-container,.notification-stack){z-index:var(--ds-z-toast)}

/* Stable interactive controls without changing their visual identity. */
:where(button,.btn,a.btn,input,select,textarea,[role="button"]){
  -webkit-tap-highlight-color:transparent;
}

:where(button,.btn,a.btn,[role="button"]):not(:disabled):not([aria-disabled="true"]){
  touch-action:manipulation;
}

:where(input,select,textarea){
  max-width:100%;
}

/* Avoid browser zoom on focused form controls on mobile Safari/Chrome. */
@media(max-width:820px){
  :where(input,select,textarea){font-size:max(16px,var(--type-control,16px));}

  :where(.page,.page-container,.content,.content-area,.container,.container-fluid){
    width:100%;
    max-width:100%;
  }

  /* Keep bottom action bars clear of gesture/navigation areas. */
  :where(.mobile-bottom-actions,.bottom-actions,.sticky-actions){
    padding-bottom:var(--ds-safe-bottom);
  }

  /* Do not alter v452 top/bottom attachment; only make scrolling predictable. */
  :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
         .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
         .color-dropdown,.province-dropdown,.city-dropdown,.location-dropdown){
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
}

/* Keyboard accessibility: focus remains visible even inside clipped containers. */
:where(a,button,input,select,textarea,[role="button"],[tabindex]):focus-visible{
  scroll-margin-block:84px;
}

/* Tables keep intentional local scrolling, never page-level horizontal drift. */
:where(.table-responsive,.table-wrap,.tablewrap,.ds-table-wrap){
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
}

/* Disabled controls must never retain hover/press transforms from older pages. */
:where(button,.btn,[role="button"]):disabled,
:where(button,.btn,[role="button"])[aria-disabled="true"]{
  transform:none!important;
  pointer-events:none;
}

/* Preserve the approved Sadra portal banner colors against generic rules. */
body.portal-home-v2 .portal-pro-hero,
body.portal-home-v2 .portal-pro-hero :where(h1,h2,h3,.portal-clock-time){
  color:#fff;
}
body.portal-home-v2 .portal-pro-hero :where(p,.portal-clock-date,.portal-clock-subdate){
  color:#d6e1ed;
}

/* Printing: remove application chrome and avoid clipped report content. */
@media print{
  :root{
    --ds-shadow-sm:none;
    --ds-shadow-md:none;
    --ds-shadow-lg:none;
  }

  :where(.app-header,.topbar,.navbar,.sidebar,.mobile-menu,.toast-container,
         .no-print,.page-actions,.floating-actions){
    display:none!important;
  }

  :where(body,.app-shell,.app-main,main,.page,.page-container,.content,.content-area){
    overflow:visible!important;
    max-width:none!important;
  }

  :where(.table-responsive,.table-wrap,.tablewrap,.ds-table-wrap){
    overflow:visible!important;
  }
}

/* Respect system preferences with no impact on normal users. */
@media(prefers-reduced-motion:reduce){
  :where(html){scroll-behavior:auto!important;}
}

@media(forced-colors:active){
  :where(button,.btn,input,select,textarea,.card,.panel,.modal-content){
    border:1px solid CanvasText;
  }
}



/* Stage 9.3 — central desktop content frame.
   Keep application pages visually focused on large monitors without changing
   mobile/tablet layouts or forcing individual templates to own a max-width. */
:root{
  --app-content-max-width:1560px;
}

.app-content-frame{
  width:100%;
  max-width:var(--app-content-max-width);
  min-width:0;
  margin-inline:auto;
}

/* Root page sections must stay inside the central frame. */
.app-content-frame > *{
  min-width:0;
  max-width:100%;
}

/* On ordinary laptops the page keeps using all available width. */
@media(max-width:1279px){
  .app-content-frame{
    max-width:none;
  }
}

/* Embedded popup pages should use the iframe width with no artificial gutter. */
body.popup-iframe-body .app-content-frame{
  max-width:none;
}

@media print{
  .app-content-frame{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }
}

/* Stage 9.1 — complete smart-dropdown unification.
   Every search list uses the same attached edge, motion, scrolling and state cues. */
:where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
       .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
       .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
       .location-dropdown,.category-filter-dropdown){
  top:100%;
  right:0;
  left:0;
  margin:0!important;
  max-height:var(--smart-dropdown-max-height,280px);
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  transform-origin:top center;
}

:where(.smart-drop-up) > :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
       .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
       .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
       .location-dropdown,.category-filter-dropdown){
  border-bottom-right-radius:0;
  border-bottom-left-radius:0;
  transform-origin:bottom center;
}

:where(.smart-drop-down) > :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
       .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
       .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
       .location-dropdown,.category-filter-dropdown){
  border-top-right-radius:0;
  border-top-left-radius:0;
}

:where(.smart-person,.smart-id-person,.generic-smart-box,.smart-vehicle,
       .smart-check-picker,.smart-id-cashbox,.smart-bank,.smart-bank-picker,
       .smart-color-picker,.smart-province,.smart-city,.smart-location,
       .issue-location-picker,.smart-category-filter,.deposit-person-smart).open
> :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
       .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
       .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
       .location-dropdown,.category-filter-dropdown){
  animation:ds-smart-dropdown-in .13s ease-out both;
}

@keyframes ds-smart-dropdown-in{
  from{opacity:0;transform:scaleY(.985)}
  to{opacity:1;transform:scaleY(1)}
}

:where(.person-option,.person-id-option,.generic-smart-option,.vehicle-option,
       .check-option,.cashbox-id-option,.bank-option,.smart-bank-option,
       .color-option,.province-option,.city-option,.location-option,
       .category-filter-option)[aria-selected="true"],
:where(.person-option,.person-id-option,.generic-smart-option,.vehicle-option,
       .check-option,.cashbox-id-option,.bank-option,.smart-bank-option,
       .color-option,.province-option,.city-option,.location-option,
       .category-filter-option).active{
  background:color-mix(in srgb,var(--primary,#0f5132) 12%,#fff);
  outline:1px solid color-mix(in srgb,var(--primary,#0f5132) 30%,transparent);
}

@media(max-width:820px){
  :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
         .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
         .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
         .location-dropdown,.category-filter-dropdown){
    min-width:100%;
    max-width:min(94vw,560px);
    touch-action:pan-y;
  }
}

@media(prefers-reduced-motion:reduce){
  :where(.smart-person,.smart-id-person,.generic-smart-box,.smart-vehicle,
         .smart-check-picker,.smart-id-cashbox,.smart-bank,.smart-bank-picker,
         .smart-color-picker,.smart-province,.smart-city,.smart-location,
         .issue-location-picker,.smart-category-filter,.deposit-person-smart).open
  > :where(.person-dropdown,.person-id-dropdown,.generic-smart-dropdown,
         .vehicle-dropdown,.check-dropdown,.cashbox-id-dropdown,.bank-dropdown,
         .smart-bank-dropdown,.color-dropdown,.province-dropdown,.city-dropdown,
         .location-dropdown,.category-filter-dropdown){animation:none}
}

/* Stage 9.2 — login brand title contrast and accidental-selection protection. */
body.auth-page-sadra .auth-brand-panel .auth-brand-copy,
body.auth-page-sadra .auth-brand-panel .auth-brand-copy h1{
  position:relative;
  z-index:4;
  opacity:1!important;
  visibility:visible!important;
}
body.auth-page-sadra .auth-brand-panel .auth-brand-copy h1{
  display:block!important;
  margin:5px 0 2px!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-shadow:0 3px 12px rgba(0,0,0,.72),0 1px 0 rgba(255,255,255,.18)!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  isolation:isolate;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
}
body.auth-page-sadra .auth-brand-panel .auth-brand-copy h1::selection{
  color:#ffffff;
  -webkit-text-fill-color:#ffffff;
  background:rgba(20,115,86,.82);
}
@media(max-width:760px){
  body.auth-page-sadra .auth-brand-panel .auth-brand-copy h1{
    font-size:25px!important;
    line-height:1.55!important;
  }
}

/* Stage 9.3 — guided dropdown panel: unmistakably separate from the form. */
:where(.guided-smart-dropdown){
  --guide-accent:var(--primary,#0f6a4c);
  padding:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  background:#f4f8f7!important;
  border:2px solid color-mix(in srgb,var(--guide-accent) 58%,#ffffff)!important;
  border-radius:16px!important;
  box-shadow:0 18px 42px rgba(13,42,34,.22),0 4px 12px rgba(13,42,34,.14)!important;
  isolation:isolate;
}

:where(.smart-drop-down) > :where(.guided-smart-dropdown){
  border-top-right-radius:8px!important;
  border-top-left-radius:8px!important;
  box-shadow:0 18px 42px rgba(13,42,34,.24),0 5px 0 rgba(15,106,76,.08)!important;
}
:where(.smart-drop-up) > :where(.guided-smart-dropdown){
  border-bottom-right-radius:8px!important;
  border-bottom-left-radius:8px!important;
  box-shadow:0 -18px 42px rgba(13,42,34,.22),0 -5px 0 rgba(15,106,76,.08)!important;
}

.smart-dropdown-guide-head{
  position:sticky;
  top:0;
  z-index:6;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:68px;
  padding:10px 12px;
  background:linear-gradient(135deg,#0d6247,#13785a)!important;
  color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.2);
  box-shadow:0 4px 10px rgba(10,49,38,.18);
}
.smart-dropdown-guide-heading{display:flex;align-items:center;gap:9px;min-width:0}
.smart-dropdown-guide-symbol{
  display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;
  border-radius:12px;background:rgba(255,255,255,.17);font-size:20px;
  border:1px solid rgba(255,255,255,.2)
}
.smart-dropdown-guide-copy{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.smart-dropdown-guide-title{font-size:16px;font-weight:900;color:#fff!important}
.smart-dropdown-guide-copy small{font-size:11.5px;color:rgba(255,255,255,.82)!important;margin-top:3px}
.smart-dropdown-guide-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.smart-dropdown-result-count{
  display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:3px 9px;
  border-radius:999px;background:rgba(255,255,255,.16);font-size:11.5px;font-weight:800;white-space:nowrap
}
.smart-dropdown-close{
  display:grid!important;place-items:center!important;width:34px!important;height:34px!important;min-width:34px!important;
  margin:0!important;padding:0!important;border-radius:10px!important;border:1px solid rgba(255,255,255,.25)!important;
  background:rgba(0,0,0,.15)!important;color:#fff!important;font:900 25px/1 Arial,sans-serif!important;
  box-shadow:none!important;cursor:pointer
}
.smart-dropdown-close:active{transform:scale(.94)}

:where(.guided-smart-dropdown) > :where(.guided-smart-option){
  position:relative!important;
  display:flex;
  align-items:center;
  min-height:58px;
  margin:8px 10px!important;
  padding:10px 14px 10px 48px!important;
  border:1px solid #dce7e3!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#173b32!important;
  box-shadow:0 2px 7px rgba(23,59,50,.07)!important;
  font-weight:750;
  line-height:1.6;
  transition:background .14s ease,border-color .14s ease,transform .1s ease,box-shadow .14s ease;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option)::before{
  content:'انتخاب';
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:0;
  width:26px;height:26px;border-radius:50%;
  border:2px solid #9cb8af;background:#f6faf8;
}
.smart-option-choice-mark{
  position:absolute;left:12px;top:50%;transform:translateY(-50%) scale(.65);
  display:grid;place-items:center;width:26px;height:26px;border-radius:50%;
  color:#fff;font-size:15px;font-weight:900;background:var(--guide-accent);
  opacity:0;transition:opacity .12s ease,transform .12s ease;pointer-events:none
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option).active,
:where(.guided-smart-dropdown) > :where(.guided-smart-option)[aria-selected="true"]{
  background:#eaf7f1!important;
  border-color:var(--guide-accent)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--guide-accent) 16%,transparent),0 5px 12px rgba(15,106,76,.12)!important;
  transform:translateY(-1px)
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option).active .smart-option-choice-mark,
:where(.guided-smart-dropdown) > :where(.guided-smart-option)[aria-selected="true"] .smart-option-choice-mark{
  opacity:1;transform:translateY(-50%) scale(1)
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option):active{
  background:#dff2e9!important;transform:scale(.99)
}

.smart-dropdown-guide-foot{
  position:sticky;
  bottom:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:43px;
  padding:8px 12px;
  color:#315e50!important;
  background:rgba(234,244,240,.97)!important;
  border-top:1px solid #cfe1da;
  font-size:12px;
  font-weight:750;
  text-align:center;
  backdrop-filter:blur(8px)
}
:where(.guided-smart-dropdown) :where(.generic-smart-empty,.person-empty,.vehicle-empty,.empty-state){
  margin:12px!important;padding:18px 12px!important;border:1px dashed #b7cbc4!important;border-radius:12px!important;
  background:#fff!important;color:#6a7f78!important;text-align:center!important
}
:where(.guided-smart-dropdown).has-no-results .smart-dropdown-result-count{background:#fff0d8;color:#744500}

@media(max-width:820px){
  :where(.guided-smart-dropdown){
    border-width:2px!important;
    border-radius:15px!important;
    max-height:var(--smart-dropdown-max-height,310px)!important;
  }
  .smart-dropdown-guide-head{min-height:64px;padding:9px 10px}
  .smart-dropdown-guide-symbol{width:35px;height:35px;flex-basis:35px;font-size:18px}
  .smart-dropdown-guide-title{font-size:15px}
  .smart-dropdown-guide-copy small{font-size:10.8px}
  .smart-dropdown-result-count{font-size:10.5px;padding-inline:7px}
  :where(.guided-smart-dropdown) > :where(.guided-smart-option){
    min-height:55px;margin:7px 8px!important;padding:9px 12px 9px 45px!important;font-size:15px!important
  }
  :where(.guided-smart-dropdown) > :where(.guided-smart-option)::before,
  .smart-option-choice-mark{left:10px}
}


/* Stage 9.4 — compact, high-capacity smart dropdowns.
   Keep the guided visual separation while showing many more results. */
:where(.guided-smart-dropdown){
  max-height:var(--smart-dropdown-max-height,560px)!important;
  scrollbar-gutter:stable;
}
.smart-dropdown-guide-head{
  min-height:46px!important;
  padding:6px 8px!important;
  gap:7px!important;
}
.smart-dropdown-guide-heading{gap:7px!important}
.smart-dropdown-guide-symbol{
  width:30px!important;height:30px!important;flex-basis:30px!important;
  border-radius:9px!important;font-size:16px!important;
}
.smart-dropdown-guide-copy{line-height:1.15!important}
.smart-dropdown-guide-title{font-size:14px!important}
.smart-dropdown-guide-copy small{
  display:none!important;
}
.smart-dropdown-guide-actions{gap:5px!important}
.smart-dropdown-result-count{
  min-height:24px!important;padding:2px 7px!important;font-size:10px!important;
}
.smart-dropdown-close{
  width:30px!important;height:30px!important;min-width:30px!important;
  border-radius:8px!important;font-size:21px!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option){
  min-height:44px!important;
  margin:4px 6px!important;
  padding:6px 10px 6px 40px!important;
  border-radius:10px!important;
  line-height:1.35!important;
  font-size:13.5px!important;
  box-shadow:0 1px 3px rgba(23,59,50,.06)!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option)::before{
  left:9px!important;width:22px!important;height:22px!important;border-width:1.5px!important;
}
.smart-option-choice-mark{
  left:9px!important;width:22px!important;height:22px!important;font-size:12px!important;
}
.smart-dropdown-guide-foot{
  min-height:28px!important;
  padding:4px 8px!important;
  font-size:10.5px!important;
}
:where(.guided-smart-dropdown) :where(.generic-smart-empty,.person-empty,.vehicle-empty,.empty-state){
  margin:7px!important;padding:12px 10px!important;
}

@media(min-width:821px){
  :where(.guided-smart-dropdown){
    max-height:var(--smart-dropdown-max-height,560px)!important;
  }
}

@media(max-width:820px){
  :where(.guided-smart-dropdown){
    max-height:var(--smart-dropdown-max-height,430px)!important;
    border-radius:13px!important;
  }
  .smart-dropdown-guide-head{
    min-height:43px!important;padding:5px 7px!important;
  }
  .smart-dropdown-guide-symbol{
    width:28px!important;height:28px!important;flex-basis:28px!important;font-size:15px!important;
  }
  .smart-dropdown-guide-title{font-size:13.5px!important}
  .smart-dropdown-result-count{font-size:9.5px!important;padding-inline:6px!important}
  .smart-dropdown-close{
    width:28px!important;height:28px!important;min-width:28px!important;font-size:20px!important;
  }
  :where(.guided-smart-dropdown) > :where(.guided-smart-option){
    min-height:42px!important;
    margin:3px 5px!important;
    padding:5px 9px 5px 37px!important;
    font-size:13px!important;
    border-radius:9px!important;
  }
  :where(.guided-smart-dropdown) > :where(.guided-smart-option)::before,
  .smart-option-choice-mark{
    left:8px!important;width:21px!important;height:21px!important;
  }
  .smart-dropdown-guide-foot{
    min-height:25px!important;padding:3px 7px!important;font-size:10px!important;
  }
}

/* Stage 9.5 — results-first dropdown: remove descriptive header/footer. */
:where(.guided-smart-dropdown) > .smart-dropdown-guide-head,
:where(.guided-smart-dropdown) > .smart-dropdown-guide-foot{
  display:none!important;
}
.smart-dropdown-compact-controls{
  position:sticky;
  top:0;
  z-index:7;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  width:max-content;
  min-height:0;
  margin:4px 5px 1px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  direction:ltr;
}
.smart-dropdown-compact-controls .smart-dropdown-result-count{
  min-height:23px!important;
  padding:1px 7px!important;
  border:1px solid #c8ddd5!important;
  border-radius:999px!important;
  background:rgba(235,247,242,.96)!important;
  color:#245e4c!important;
  font-size:10px!important;
  font-weight:850!important;
  box-shadow:0 1px 3px rgba(18,74,57,.08)!important;
}
.smart-dropdown-compact-controls .smart-dropdown-close{
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  border:1px solid #c8ddd5!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.97)!important;
  color:#285b4c!important;
  font-size:18px!important;
  box-shadow:0 1px 3px rgba(18,74,57,.1)!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option){
  margin-top:3px!important;
}
@media(max-width:820px){
  .smart-dropdown-compact-controls{
    margin:3px 4px 0!important;
  }
  .smart-dropdown-compact-controls .smart-dropdown-result-count{
    min-height:21px!important;
    font-size:9px!important;
    padding-inline:6px!important;
  }
  .smart-dropdown-compact-controls .smart-dropdown-close{
    width:23px!important;
    height:23px!important;
    min-width:23px!important;
    font-size:17px!important;
  }
}

/* Commit: unify-system-datetime-typography-448
   One central size for live clock/date labels across the application. */
:root{
  --ds-datetime-font-size:13px;
  --ds-datetime-line-height:1.35;
}

:where(.global-date-time-pill #globalClock,
       .global-date-time-pill #globalJalaliDate,
       .sidebar-clock strong,
       .sidebar-clock #sidebarJalaliDate,
       .portal-clock-time,
       .portal-clock-date){
  font-size:var(--ds-datetime-font-size)!important;
  line-height:var(--ds-datetime-line-height)!important;
}

@media (max-width:620px){
  :root{
    --ds-datetime-font-size:13px;
  }
}

/* Commit: centralize-compact-person-picker-836
   Shared compact person selector for all smart person pickers.
   Business logic and submitted field values stay unchanged; this is a presentation layer. */
:root{
  --ds-person-picker-row:56px;
  --ds-person-picker-border:#dbe5ef;
  --ds-person-picker-soft:#f7fafc;
  --ds-person-picker-hover:#f0f7f4;
  --ds-person-picker-selected:#eef8f3;
  --ds-person-picker-ink:#18324d;
  --ds-person-picker-muted:#718096;
}

:where(.smart-id-person,.smart-person).ds-person-picker{
  position:relative;
}

:where(.smart-id-person,.smart-person).ds-person-picker :where(.person-id-search,.person-search){
  min-height:44px;
  border-radius:12px!important;
  background:#fff!important;
}

.ds-person-picker :where(.person-id-dropdown,.person-dropdown){
  padding:5px!important;
  border:1px solid var(--ds-person-picker-border)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:var(--ds-shadow-md)!important;
  max-height:310px!important;
  overflow:auto!important;
  scrollbar-width:thin;
  overscroll-behavior:contain;
  z-index:var(--ds-z-dropdown)!important;
}

.ds-person-picker-toolbar{
  position:sticky;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:38px;
  margin:-1px -1px 4px;
  padding:7px 9px;
  border-bottom:1px solid #edf2f7;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);
}
.ds-person-picker-title{font-size:12px;color:#3e5871;font-weight:900}
.ds-person-picker-toolbar-actions{display:flex;align-items:center;gap:7px}
.ds-person-picker-count{display:inline-flex;align-items:center;min-height:22px;padding:2px 7px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:10px;font-weight:800;white-space:nowrap}
.ds-person-picker-close{display:none;width:28px;height:28px;min-width:28px;padding:0;border:0;border-radius:9px;background:#f1f5f9;color:#475569;font:700 20px/1 Tahoma,Arial,sans-serif;cursor:pointer}
.ds-person-picker-close:hover{background:#e7edf4;color:#0f243d}

.ds-person-picker :where(.person-id-option,.person-option){
  box-sizing:border-box;
  min-height:var(--ds-person-picker-row);
  margin:2px 0!important;
  padding:8px 10px!important;
  border:1px solid transparent!important;
  border-bottom-color:#eef2f6!important;
  border-radius:11px!important;
  background:#fff!important;
  color:var(--ds-person-picker-ink)!important;
  text-align:right!important;
  line-height:1.45!important;
  cursor:pointer;
  transition:background .12s ease,border-color .12s ease,box-shadow .12s ease;
}
.ds-person-picker :where(.person-id-option,.person-option):hover,
.ds-person-picker :where(.person-id-option,.person-option).smart-active{
  background:var(--ds-person-picker-hover)!important;
  border-color:#cfe5da!important;
  outline:0!important;
  box-shadow:none!important;
  color:var(--ds-person-picker-ink)!important;
}
.ds-person-picker :where(.person-id-option,.person-option).is-selected,
.ds-person-picker :where(.person-id-option,.person-option).active{
  background:var(--ds-person-picker-selected)!important;
  border-color:#abd6c2!important;
  box-shadow:inset -3px 0 0 var(--theme-primary)!important;
  color:var(--ds-person-picker-ink)!important;
}
.ds-person-picker :where(.person-id-option,.person-option).ds-person-option-special{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#64748b!important;
  background:#f8fafc!important;
  font-size:12px;
  font-weight:800;
}
.ds-person-option-main{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.ds-person-option-name{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#173651;font-size:13px;font-weight:900}
.ds-person-option-mark{display:inline-grid;place-items:center;flex:0 0 auto;width:20px;height:20px;border:1px solid #d5e0e9;border-radius:50%;background:#fff;color:#fff;font-size:11px;opacity:.5;transition:.12s}
.ds-person-picker :where(.person-id-option,.person-option).is-selected .ds-person-option-mark,
.ds-person-picker :where(.person-id-option,.person-option).active .ds-person-option-mark{border-color:var(--theme-primary);background:var(--theme-primary);opacity:1}
.ds-person-option-meta{display:flex;align-items:center;gap:7px 12px;flex-wrap:wrap;margin-top:5px;color:var(--ds-person-picker-muted);font-size:10.5px}
.ds-person-meta-chip{display:inline-flex;align-items:center;gap:4px;min-width:0;white-space:nowrap}
.ds-person-meta-chip small{display:inline!important;margin:0!important;color:#94a3b8!important;font-size:9.5px!important;line-height:1!important}
.ds-person-meta-chip bdi{color:#62748a;font-size:10.5px;font-weight:700}

.ds-person-picker :where(.person-id-empty,.person-empty){
  margin:5px!important;
  padding:18px 10px!important;
  border:1px dashed #d8e2ec;
  border-radius:11px;
  background:#fafcff;
  color:#738399!important;
  text-align:center;
  font-size:11px!important;
}
.ds-person-picker .person-id-footer,
.ds-person-picker .ds-person-picker-add{
  display:flex!important;
  align-items:center;
  justify-content:center;
  min-height:39px;
  margin:4px 3px 1px!important;
  padding:8px 10px!important;
  border:0!important;
  border-top:1px solid #e8eef4!important;
  border-radius:9px!important;
  background:#fff!important;
  color:var(--theme-primary)!important;
  text-decoration:none!important;
  font-size:11.5px!important;
  font-weight:900!important;
}
.ds-person-picker .person-id-footer:hover,
.ds-person-picker .person-id-footer.smart-active{
  background:var(--theme-soft)!important;
  outline:0!important;
}

@media(max-width:720px){
  :root{--ds-person-picker-row:54px}
  .ds-person-picker.open :where(.person-id-dropdown,.person-dropdown){
    width:100%!important;
    max-width:100%!important;
    max-height:min(var(--smart-dropdown-max-height,430px),56dvh)!important;
    padding:5px!important;
    border-radius:14px!important;
    box-shadow:0 16px 38px rgba(15,35,55,.18)!important;
    z-index:var(--ds-z-dropdown)!important;
  }
  .ds-person-picker-toolbar{min-height:41px;padding:7px 9px;border-radius:12px 12px 0 0}
  .ds-person-picker-title{font-size:12.5px}
  .ds-person-picker-close{display:inline-grid;place-items:center}
  .ds-person-picker :where(.person-id-option,.person-option){padding:8px 10px!important;border-radius:12px!important}
  .ds-person-option-name{font-size:13px}
  .ds-person-option-meta{gap:6px 10px}
  .ds-person-picker .person-id-footer{min-height:43px;font-size:12px!important}
}


/* Commit: person-selected-display-848
   One immediate, compact selected-person summary for shared pickers. */
.ds-person-selected-summary{
  box-sizing:border-box;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr) 24px;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:64px;
  margin-top:8px;
  padding:9px 11px;
  border:1px solid #d7e4ed!important;
  border-radius:14px!important;
  background:#fbfefd!important;
  box-shadow:none!important;
  text-align:right;
}
.ds-person-selected-summary.has-selection{border-color:#b8d9ca!important;background:#f4fbf7!important}
.ds-person-selected-summary.is-empty{background:#f8fafc!important;border-color:#e1e8ef!important}
.ds-person-selected-auto.is-empty{display:none!important}
.ds-person-selected-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--theme-soft,#eef8f3);color:var(--theme-primary,#0d7f5b);font-size:18px}
.ds-person-selected-body{min-width:0}
.ds-person-selected-body>small{display:block!important;margin:0 0 2px!important;color:#7a8999!important;font-size:9.5px!important;font-weight:800!important;line-height:1.5!important}
.ds-person-selected-body>b{display:block!important;min-width:0;margin:0!important;color:#173651!important;font-size:13.5px!important;font-weight:950!important;line-height:1.65!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ds-person-selected-summary.is-empty .ds-person-selected-body>b{color:#65758a!important;font-weight:800!important}
.ds-person-selected-check{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--theme-primary,#0d7f5b);color:#fff;font-size:11px;font-weight:900;opacity:1}
.ds-person-selected-summary.is-empty .ds-person-selected-check{opacity:0}
.ds-person-selected-summary .person-preview-details{display:flex!important;align-items:center;gap:5px 12px!important;flex-wrap:wrap!important;margin:4px 0 0!important;min-width:0}
.ds-person-selected-summary .person-preview-details:empty{display:none!important}
.ds-person-selected-summary .person-preview-details span{display:inline-flex!important;align-items:center!important;gap:4px!important;min-width:0!important}
.ds-person-selected-summary .person-preview-details small{display:inline!important;margin:0!important;color:#93a1b0!important;font-size:9px!important;font-weight:700!important;white-space:nowrap}
.ds-person-selected-summary .person-preview-details strong{display:inline!important;max-width:190px;color:#53677b!important;font-size:10.5px!important;font-weight:800!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:720px){
  .ds-person-selected-summary{grid-template-columns:34px minmax(0,1fr) 22px;min-height:58px;padding:8px 9px;border-radius:13px!important}
  .ds-person-selected-avatar{width:34px;height:34px;border-radius:10px;font-size:16px}
  .ds-person-selected-body>b{font-size:13px!important}
  .ds-person-selected-summary .person-preview-details{gap:4px 9px!important}
  .ds-person-selected-summary .person-preview-details strong{max-width:150px;font-size:10px!important}
}

/* Commit: centralize-iranian-plate-display-842
   Reusable read-only Iranian license plate. The visual order mirrors the
   plate editor already used by the application; malformed legacy values
   fall back to plain text instead of being split incorrectly. */
:root{
  --ds-plate-border:#263746;
  --ds-plate-ink:#111827;
  --ds-plate-blue:#0756a8;
  --ds-plate-bg:#fff;
}
.ds-iran-plate{
  display:inline-grid;
  grid-template-columns:auto auto auto auto auto;
  align-items:stretch;
  min-width:214px;
  height:43px;
  overflow:hidden;
  border:1.5px solid var(--ds-plate-border);
  border-radius:7px;
  background:var(--ds-plate-bg);
  color:var(--ds-plate-ink);
  box-shadow:0 1px 2px rgba(15,23,42,.08);
  direction:ltr;
  unicode-bidi:isolate;
  vertical-align:middle;
  font-family:var(--app-font,Tahoma,Arial,sans-serif);
}
.ds-iran-plate-blue{
  width:27px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  padding:3px 2px;
  background:var(--ds-plate-blue);
  color:#fff;
  border-left:0;
}
.ds-iran-plate-blue strong{font:900 9px/1 Arial,sans-serif;letter-spacing:.2px}
.ds-iran-plate-blue small{font:700 6px/1 Arial,sans-serif;color:#fff!important}
.ds-iran-plate-part,.ds-iran-plate-letter{
  display:grid;
  place-items:center;
  min-width:38px;
  padding:0 5px;
  color:#111827;
  font-size:16px;
  font-weight:950;
  line-height:1;
  white-space:nowrap;
}
.ds-iran-plate-letter{min-width:31px;font-size:17px}
.ds-iran-plate-p2{min-width:50px}
.ds-iran-plate-iran{
  min-width:48px;
  display:grid;
  grid-template-rows:auto 1fr;
  place-items:center;
  padding:3px 5px 2px;
  border-left:1px solid #64748b;
  color:#111827;
}
.ds-iran-plate-iran small{font-size:8px!important;line-height:1;color:#334155!important;font-weight:850}
.ds-iran-plate-iran bdi{font-size:15px;font-weight:950;line-height:1}
.ds-iran-plate-sm{min-width:185px;height:36px;border-radius:6px}
.ds-iran-plate-sm .ds-iran-plate-blue{width:24px}
.ds-iran-plate-sm .ds-iran-plate-part{min-width:31px;font-size:14px}
.ds-iran-plate-sm .ds-iran-plate-letter{min-width:27px;font-size:15px}
.ds-iran-plate-sm .ds-iran-plate-p2{min-width:42px}
.ds-iran-plate-sm .ds-iran-plate-iran{min-width:42px;padding-inline:4px}
.ds-iran-plate-sm .ds-iran-plate-iran bdi{font-size:13px}
.ds-iran-plate-xs{min-width:145px;height:29px;border-width:1px;border-radius:5px;box-shadow:none}
.ds-iran-plate-xs .ds-iran-plate-blue{width:19px;padding:2px 1px}
.ds-iran-plate-xs .ds-iran-plate-blue strong{font-size:7px}
.ds-iran-plate-xs .ds-iran-plate-blue small{font-size:5px!important}
.ds-iran-plate-xs .ds-iran-plate-part{min-width:25px;padding-inline:3px;font-size:11px}
.ds-iran-plate-xs .ds-iran-plate-letter{min-width:22px;padding-inline:2px;font-size:12px}
.ds-iran-plate-xs .ds-iran-plate-p2{min-width:33px}
.ds-iran-plate-xs .ds-iran-plate-iran{min-width:34px;padding:2px 3px 1px}
.ds-iran-plate-xs .ds-iran-plate-iran small{font-size:6px!important}
.ds-iran-plate-xs .ds-iran-plate-iran bdi{font-size:10px}
.ds-iran-plate-fallback{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:4px 9px;
  border:1px solid #cbd5e1;
  border-radius:8px;
  background:#fff;
  color:#334155;
  font-size:11px;
  font-weight:850;
  direction:ltr;
  unicode-bidi:isolate;
}
.ds-iran-plate-fallback.is-empty{color:#94a3b8;background:#f8fafc;direction:rtl}
@media(max-width:560px){
  .ds-iran-plate{min-width:184px;height:38px}
  .ds-iran-plate .ds-iran-plate-blue{width:24px}
  .ds-iran-plate .ds-iran-plate-part{min-width:31px;padding-inline:4px;font-size:14px}
  .ds-iran-plate .ds-iran-plate-letter{min-width:27px;font-size:15px}
  .ds-iran-plate .ds-iran-plate-p2{min-width:41px}
  .ds-iran-plate .ds-iran-plate-iran{min-width:41px}
  .ds-iran-plate .ds-iran-plate-iran bdi{font-size:13px}
  .ds-iran-plate-xs{min-width:139px;height:28px}
  .ds-iran-plate-xs .ds-iran-plate-blue{width:18px}
  .ds-iran-plate-xs .ds-iran-plate-part{min-width:24px;font-size:10.5px}
  .ds-iran-plate-xs .ds-iran-plate-letter{min-width:21px;font-size:11.5px}
  .ds-iran-plate-xs .ds-iran-plate-p2{min-width:32px}
  .ds-iran-plate-xs .ds-iran-plate-iran{min-width:33px}
}

/* Commit: unified-person-picker-control-851
   Selected person and search now share one control: the committed card is shown
   at rest; clicking it switches the same control into search mode. */
.ds-person-unified{min-width:0}
.ds-person-unified>.ds-person-selected-summary{
  margin:0!important;
}
.ds-person-unified>.ds-person-selected-summary.is-empty{
  display:none!important;
}
.ds-person-unified.has-person-selection:not(.is-searching)>:is(.person-id-search,.person-search){
  display:none!important;
}
.ds-person-unified.has-person-selection.is-searching>.ds-person-selected-summary{
  display:none!important;
}
.ds-person-unified.has-person-selection:not(.is-searching)>.ds-person-selected-summary{
  display:grid!important;
}
.ds-person-unified.has-person-selection:not(.is-searching)>.smart-hint{
  display:none!important;
}
.ds-person-unified.has-person-selection:not(.is-searching)::after{
  display:none!important;
}
.ds-person-unified>.ds-person-selected-summary.has-selection{
  grid-template-columns:38px minmax(0,1fr) auto;
  min-height:58px;
  padding:8px 10px;
  border-color:#d7e2ec!important;
  background:#fff!important;
  box-shadow:0 1px 2px rgba(15,35,55,.025)!important;
  cursor:pointer;
  transition:border-color .14s ease,box-shadow .14s ease,background .14s ease;
}
.ds-person-unified>.ds-person-selected-summary.has-selection:hover{
  border-color:#b8ccdc!important;
  background:#fbfdff!important;
  box-shadow:0 4px 14px rgba(15,35,55,.055)!important;
}
.ds-person-unified>.ds-person-selected-summary.has-selection:focus-visible{
  outline:0!important;
  border-color:var(--theme-primary,#0d7f5b)!important;
  box-shadow:0 0 0 3px var(--theme-ring,rgba(13,127,91,.14))!important;
}
.ds-person-unified .ds-person-selected-avatar{
  width:36px;height:36px;border-radius:10px;
  background:#f2f6f9;
  color:#526b82;
  font-size:16px;
}
.ds-person-unified .ds-person-selected-body>small{
  display:none!important;
}
.ds-person-unified .ds-person-selected-body>b{
  color:#163653!important;
  font-size:13px!important;
}
.ds-person-selected-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  white-space:nowrap;
}
.ds-person-unified .ds-person-selected-check{
  width:18px;height:18px;
  font-size:9px;
  background:var(--theme-primary,#0d7f5b);
}
.ds-person-selected-change{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:4px 9px;
  border:1px solid #dce6ee;
  border-radius:9px;
  background:#f7fafc;
  color:#526b82;
  font-size:10px;
  font-weight:900;
}
.ds-person-unified>.ds-person-selected-summary:hover .ds-person-selected-change{
  border-color:#c9d8e4;
  background:#f1f6f9;
  color:#244c6d;
}
.ds-person-unified .ds-person-selected-summary .person-preview-details{
  margin-top:2px!important;
}
.ds-person-unified .ds-person-selected-summary .person-preview-details small{
  display:none!important;
}
.ds-person-unified .ds-person-selected-summary .person-preview-details span{
  position:relative;
}
.ds-person-unified .ds-person-selected-summary .person-preview-details span+span::before{
  content:'·';
  margin-inline:0 7px;
  color:#bdc8d2;
}
.ds-person-unified .ds-person-selected-summary .person-preview-details strong{
  max-width:180px;
  color:#6d7f91!important;
  font-size:10px!important;
  font-weight:750!important;
}
.ds-person-section-label{
  display:flex;
  align-items:center;
  gap:7px;
  margin:7px 6px 3px;
  padding:4px 5px;
  color:#7a8b9c;
  font-size:9.5px;
  font-weight:900;
  pointer-events:none;
}
.ds-person-section-label.is-recent::before{
  content:'↺';
  display:inline-grid;
  place-items:center;
  width:19px;height:19px;
  border-radius:50%;
  background:#eef5f2;
  color:var(--theme-primary,#0d7f5b);
  font-size:11px;
  font-weight:900;
}
.ds-person-section-label.is-other{
  margin-top:9px;
  padding-top:7px;
  border-top:1px solid #edf2f6;
  color:#9aa7b4;
}


@media(max-width:720px){
  .ds-person-unified>.ds-person-selected-summary.has-selection{
    grid-template-columns:34px minmax(0,1fr) auto;
    min-height:56px;
    padding:7px 9px;
  }
  .ds-person-unified .ds-person-selected-avatar{width:34px;height:34px}
  .ds-person-selected-change{min-height:27px;padding:3px 8px;font-size:9.5px}
  .ds-person-unified .ds-person-selected-summary .person-preview-details strong{max-width:135px}
}

/* Stage 9.6 — signature Smart Combo states (central, no page-local dropdown CSS).
   Hover, keyboard focus and selected value are intentionally different. */
:root{
  --ds-combo-active:#e9f7f1;
  --ds-combo-selected:#f1f8f5;
  --ds-combo-hover:#f8fbfa;
  --ds-combo-accent:var(--theme-primary,var(--primary,#0f6a4c));
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option){
  overflow:hidden;
  outline:0!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option):hover:not(.smart-active){
  background:var(--ds-combo-hover)!important;
  border-color:#cbded7!important;
  transform:none!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option).smart-active{
  background:var(--ds-combo-active)!important;
  border-color:color-mix(in srgb,var(--ds-combo-accent) 54%,#dce7e3)!important;
  box-shadow:inset -4px 0 0 var(--ds-combo-accent),0 3px 10px rgba(15,106,76,.09)!important;
  transform:none!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option)[aria-selected="true"],
:where(.guided-smart-dropdown) > :where(.guided-smart-option).is-selected{
  background:var(--ds-combo-selected)!important;
  border-color:color-mix(in srgb,var(--ds-combo-accent) 35%,#dce7e3)!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option).smart-active[aria-selected="true"]{
  background:var(--ds-combo-active)!important;
  border-color:var(--ds-combo-accent)!important;
}
/* The check means selected; keyboard-active is represented by the right accent bar. */
:where(.guided-smart-dropdown) > :where(.guided-smart-option).smart-active .smart-option-choice-mark{
  opacity:0!important;
}
:where(.guided-smart-dropdown) > :where(.guided-smart-option)[aria-selected="true"] .smart-option-choice-mark,
:where(.guided-smart-dropdown) > :where(.guided-smart-option).is-selected .smart-option-choice-mark,
:where(.guided-smart-dropdown) > :where(.guided-smart-option).smart-active[aria-selected="true"] .smart-option-choice-mark{
  opacity:1!important;
  transform:translateY(-50%) scale(1)!important;
}
:where(.guided-smart-dropdown) > .color-option.guided-smart-option{
  padding-right:44px!important;
}
.smart-color-swatch{
  position:absolute;
  right:12px;
  top:50%;
  width:21px;
  height:21px;
  transform:translateY(-50%);
  border-radius:50%;
  background:var(--smart-swatch,#e2e8f0);
  border:1px solid rgba(15,23,42,.2);
  box-shadow:0 0 0 2px rgba(255,255,255,.9),0 1px 4px rgba(15,23,42,.1);
  pointer-events:none;
}
@media(max-width:820px){
  :where(.guided-smart-dropdown) > .color-option.guided-smart-option{padding-right:40px!important}
  .smart-color-swatch{right:10px;width:19px;height:19px}
}