/* Shatranj Apple-style theme (iOS 26 / macOS 26 "Liquid Glass" inspired).
   Pure CSS over Frappe v16 + frappe-ui semantic tokens (--surface-*, --ink-*, --outline-*).
   Injected by nginx after shatranj-font.css. Remove the <link> to roll back. */

/* ---------- Light (Apple system palette) ---------- */
:root, [data-theme="light"]{
  --sh-tint:#007AFF; --sh-tint-hover:#0066D6; --sh-tint-soft:rgba(0,122,255,.12); --sh-focus:rgba(0,122,255,.35);
  --sh-bg:#F2F2F7; --sh-card:#FFFFFF; --sh-fill:rgba(118,118,128,.12); --sh-fill-2:rgba(118,118,128,.08);
  --sh-label:#1D1D1F; --sh-label-2:#6E6E73; --sh-label-3:#8E8E93; --sh-sep:rgba(60,60,67,.14);
  --sh-glass:rgba(255,255,255,.72); --sh-glass-border:rgba(255,255,255,.6);
  --sh-shadow-1:0 1px 2px rgba(0,0,0,.04),0 1px 1px rgba(0,0,0,.03);
  --sh-shadow-2:0 4px 16px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.05);
  --sh-shadow-3:0 20px 50px rgba(0,0,0,.14),0 4px 12px rgba(0,0,0,.08);

  /* frappe-ui semantic tokens (Desk v16, CRM, HR app share them) */
  --surface-white:var(--sh-card); --surface-modal:var(--sh-card);
  --surface-gray-1:#F7F7F9; --surface-gray-2:#EFEFF4; --surface-gray-3:#E5E5EA;
  --surface-menu-bar:var(--sh-bg);
  --ink-gray-9:var(--sh-label); --ink-gray-8:#2C2C2E; --ink-gray-7:#3A3A3C; --ink-gray-6:#545458;
  --ink-gray-5:var(--sh-label-2); --ink-gray-4:var(--sh-label-3);
  --ink-blue-link:var(--sh-tint); --ink-blue-3:var(--sh-tint); --surface-blue-2:var(--sh-tint-soft);
  --outline-gray-1:var(--sh-sep); --outline-gray-2:rgba(60,60,67,.2);

  /* classic Desk tokens */
  --bg-color:var(--sh-bg); --fg-color:var(--sh-card); --card-bg:var(--sh-card);
  --modal-bg:var(--sh-card); --popover-bg:var(--sh-card); --navbar-bg:var(--sh-glass);
  --control-bg:var(--sh-fill); --border-color:var(--sh-sep); --table-border-color:var(--sh-sep);
  --sidebar-select-color:var(--sh-tint-soft); --sidebar-hover-color:var(--sh-fill-2);
  --primary:var(--sh-tint); --primary-color:var(--sh-tint); --btn-primary:var(--sh-tint);
  --text-color:var(--sh-label); --text-muted:var(--sh-label-2); --text-light:var(--sh-label-3);
  --placeholder-color:var(--sh-label-3);

  /* geometry: macOS-like continuous corners */
  --border-radius-sm:8px; --border-radius:10px; --border-radius-md:12px; --border-radius-lg:14px; --border-radius-xl:20px;
  --shadow-sm:var(--sh-shadow-1); --shadow-base:var(--sh-shadow-1); --shadow-md:var(--sh-shadow-2); --shadow-lg:var(--sh-shadow-3);
}

/* ---------- Dark ---------- */
[data-theme="dark"]{
  --sh-tint:#0A84FF; --sh-tint-hover:#409CFF; --sh-tint-soft:rgba(10,132,255,.18); --sh-focus:rgba(10,132,255,.45);
  --sh-bg:#000000; --sh-card:#1C1C1E; --sh-fill:rgba(118,118,128,.24); --sh-fill-2:rgba(118,118,128,.16);
  --sh-label:#F5F5F7; --sh-label-2:#AEAEB2; --sh-label-3:#8E8E93; --sh-sep:rgba(84,84,88,.55);
  --sh-glass:rgba(28,28,30,.72); --sh-glass-border:rgba(255,255,255,.08);
  --sh-shadow-1:0 1px 2px rgba(0,0,0,.4); --sh-shadow-2:0 6px 20px rgba(0,0,0,.45); --sh-shadow-3:0 24px 60px rgba(0,0,0,.6);
  --surface-white:var(--sh-card); --surface-modal:#2C2C2E;
  --surface-gray-1:#1C1C1E; --surface-gray-2:#2C2C2E; --surface-gray-3:#3A3A3C; --surface-menu-bar:#000000;
  --ink-gray-9:var(--sh-label); --ink-gray-8:#E5E5EA; --ink-gray-7:#D1D1D6; --ink-gray-6:#C7C7CC;
  --ink-gray-5:var(--sh-label-2); --ink-gray-4:var(--sh-label-3);
  --outline-gray-1:var(--sh-sep); --outline-gray-2:rgba(84,84,88,.7);
  --bg-color:var(--sh-bg); --fg-color:var(--sh-card); --card-bg:var(--sh-card); --modal-bg:#2C2C2E; --popover-bg:#2C2C2E;
}

/* ---------- Page & surfaces ---------- */
body{background:var(--sh-bg)}
.frappe-card,.widget,.form-page,.layout-main-section,.frappe-list,.report-wrapper,.page-form,.number-card{
  border-radius:var(--border-radius-lg)!important;border-color:var(--sh-sep)!important;box-shadow:var(--sh-shadow-1)}

/* ---------- Liquid Glass: navigation & floating controls only ---------- */
.navbar,.body-sidebar,.page-head,.modal-content,.dropdown-menu,.popover,.awesomplete>ul,
[role="menu"],[role="dialog"]>div,.frappe-ui-dialog{
  background:var(--sh-glass)!important;
  -webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);
  border-color:var(--sh-glass-border)!important}
.modal-content,.dropdown-menu,.popover,[role="menu"]{border-radius:var(--border-radius-lg)!important;box-shadow:var(--sh-shadow-3)!important}
.dropdown-item,[role="menuitem"]{border-radius:8px}
@media (prefers-reduced-transparency: reduce){
  .navbar,.body-sidebar,.page-head,.modal-content,.dropdown-menu,.popover,.awesomplete>ul,[role="menu"],[role="dialog"]>div,.frappe-ui-dialog{
    background:var(--sh-card)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ---------- Controls ---------- */
.btn{border-radius:var(--border-radius)!important;transition:background-color .18s ease,box-shadow .18s ease,transform .12s ease}
.btn:active{transform:scale(.98)}
.btn-primary,button.bg-surface-gray-7{background:var(--sh-tint)!important;border-color:transparent!important;color:#fff!important}
.btn-primary:hover,button.bg-surface-gray-7:hover{background:var(--sh-tint-hover)!important}
.form-control,.frappe-control input,.frappe-control select,.frappe-control textarea,.awesomplete input,input.form-input,textarea.form-textarea,select.form-select{
  background:var(--sh-fill)!important;border:1px solid transparent!important;border-radius:var(--border-radius)!important}
.form-control:focus,.frappe-control input:focus,.frappe-control textarea:focus,input.form-input:focus,textarea.form-textarea:focus{
  background:var(--sh-card)!important;border-color:var(--sh-tint)!important;box-shadow:0 0 0 3px var(--sh-focus)!important;outline:none}
:focus-visible{outline:2px solid var(--sh-tint);outline-offset:2px}
.indicator-pill,.badge,.pill{border-radius:999px!important}
.checkbox input[type=checkbox]:checked,input[type=checkbox]:checked{background-color:var(--sh-tint)!important;border-color:var(--sh-tint)!important}

/* ---------- Lists & sidebar (grouped, inset selection like macOS) ---------- */
.list-row:hover,.list-row-container:hover .list-row{background:var(--sh-fill-2)}
.sidebar-item-container .standard-sidebar-item.selected,.standard-sidebar-item.selected,.sidebar-item.active{
  background:var(--sh-tint-soft)!important;color:var(--sh-tint)!important;border-radius:8px}
.list-row-head,.dt-header{background:transparent!important}

/* ---------- Login page ---------- */
.page-card,.for-login .page-card,.login-content{border-radius:20px!important;box-shadow:var(--sh-shadow-2)!important;border:1px solid var(--sh-sep)!important}

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}