/* NESA Saha — approved B + C design layer (22.10.2026). Loaded after every other stylesheet.
   B: navy NESA identity, grouped sidebar, panels, list–detail on tablets.
   C: one prominent action per stage, outdoor contrast (ink ≥ 12:1, secondary text ≥ 7:1, action blue with
   white ≥ 7:1), larger phone text and 48px touch controls. No sticky action bars: a 52px app bar and a
   60px tab bar leave the rest of a small phone to content. Inter (NesaInter) only. */
:root{--nd-navy:#102654;--nd-navy-2:#1a3570;--nd-navy-3:#0b1c40;--nd-ink:#0e1b33;--nd-ink-2:#26344f;--nd-muted:#46556f;--nd-line:#d6dee9;--nd-line-2:#8794a8;--nd-bg:#f2f5f9;--nd-surface:#fff;--nd-surface-2:#f6f8fb;--nd-blue:#0b49d0;--nd-blue-hover:#093fb5;--nd-blue-press:#07338f;--nd-blue-soft:#e7eeff;--nd-green:#15703a;--nd-green-soft:#e6f5ec;--nd-amber:#8a4a00;--nd-amber-soft:#fff3df;--nd-red:#b42318;--nd-red-soft:#fdeceb;--nd-on-navy-2:#c9d6ef;--nd-focus:#0b49d0;--nd-focus-dark:#9cc0ff;--nd-appbar:52px;--nd-tabbar:60px}
body:not(.auth-pending){background:var(--nd-bg);color:var(--nd-ink)}
body :focus-visible{outline:3px solid var(--nd-focus);outline-offset:2px}
.ws-sidebar :focus-visible,.nd-appbar :focus-visible,.visit-flow-card :focus-visible{outline-color:var(--nd-focus-dark)}
::selection{background:#cfe0ff;color:var(--nd-ink)}
.nd-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}

/* ---------- buttons, fields, cards ---------- */
html body:not(.auth-pending) .btn{border-radius:12px;font-weight:650}
html body:not(.auth-pending) .btn.primary,html body .nesa-login-submit{background:var(--nd-blue);border-color:var(--nd-blue);color:#fff}
html body:not(.auth-pending) .btn.primary:hover,html body .nesa-login-submit:hover{background:var(--nd-blue-hover);border-color:var(--nd-blue-hover)}
html body:not(.auth-pending) .btn.primary:active{background:var(--nd-blue-press)}
html body:not(.auth-pending) .btn:disabled{background:#e6ebf2;color:#5b6880;border-color:transparent;cursor:not-allowed}
html body:not(.auth-pending) .btn[aria-busy=true]{cursor:progress}
html body:not(.auth-pending) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),html body:not(.auth-pending) select,html body:not(.auth-pending) textarea{border-color:var(--nd-line-2);color:var(--nd-ink)}
html body:not(.auth-pending) input::placeholder,html body:not(.auth-pending) textarea::placeholder{color:#5f6c82}
.form-error:not(:empty),[role=alert].form-error:not(:empty){color:var(--nd-red);font-weight:600}
.mobile-loading{margin:0;padding:18px 4px;color:var(--nd-muted);font-size:16px;font-weight:600}
.turkey-pending{display:grid;place-items:center;min-height:220px;color:var(--nd-muted);font-size:14px}

/* ---------- dialogs ---------- */
html body:not(.auth-pending) dialog.customer-dialog{border-radius:16px;color:var(--nd-ink)}
html body:not(.auth-pending) dialog .dialog-header h2{font-size:19px;letter-spacing:-.01em}
html body:not(.auth-pending) .customer-dialog>.dialog-header,html body:not(.auth-pending) .customer-dialog>form>.dialog-header{background-color:var(--nd-navy)}
html body:not(.auth-pending) .compact-customer-dialog>.dialog-header{background-color:#fff}
html body:not(.auth-pending) .customer-dialog:not(.compact-customer-dialog)>.dialog-header :is(h2,h3),html body:not(.auth-pending) .customer-dialog:not(.compact-customer-dialog)>form>.dialog-header :is(h2,h3){color:#fff!important}
html body:not(.auth-pending) .customer-dialog:not(.compact-customer-dialog) .dialog-header :is(.eyebrow,small,p){color:var(--nd-on-navy-2)!important}
html body:not(.auth-pending) .customer-dialog:not(.compact-customer-dialog) .dialog-header .btn{background:transparent!important;color:#fff!important;border-color:rgb(255 255 255 / .45)!important}
#visit-flow,#field-queue-panel{scroll-margin-top:calc(var(--nd-appbar) + 12px)}
html body:not(.auth-pending) dialog::backdrop{background:rgb(11 28 64 / .55)}

/* ---------- tablet and desktop: grouped navy sidebar, white top bar ---------- */
@media screen and (min-width:768px){
 html body .ws-sidebar{background:var(--nd-navy)}
 html body .ws-sidebar .ws-nav>button,html body .ws-sidebar .ws-sidebar-bottom>button{color:#dbe5f7;font-size:13.5px;font-weight:550;border-radius:10px}
 html body .ws-sidebar .ws-nav>button:hover,html body .ws-sidebar .ws-sidebar-bottom>button:hover{background:rgb(255 255 255 / .08);color:#fff}
 html body .ws-sidebar .ws-nav>button.active{background:var(--nd-navy-2);color:#fff;font-weight:700}
 .ws-nav-group{margin:14px 10px 4px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#a9bad8}
 .ws-nav-group:first-child{margin-top:2px}
 html body .ws-sidebar-head .ws-brand span{font-size:11px;color:#c9d6ef}
 body.ws-sidebar-collapsed .ws-nav-group{visibility:hidden;height:1px;margin:8px 0;background:rgb(255 255 255 / .15)}
 body.shell-desktop-topbar>.nesa-session-header #ws-title{color:var(--nd-ink)}
 body.shell-desktop-topbar>.nesa-session-header #ws-date{font-size:13px;color:var(--nd-muted)}
 body.shell-desktop-topbar>.nesa-session-header .ws-heading-actions .btn{min-height:40px;font-size:13.5px;padding:8px 12px}
 body.shell-desktop-topbar>.nesa-session-header .nesa-session-user,body.shell-desktop-topbar>.nesa-session-header .nesa-session-back{font-size:13px;color:var(--nd-muted)}
 .nd-appbar{display:none!important}
}

/* ---------- phones: navy app bar, 4-tab bar, no repeated page headings ---------- */
@media screen and (max-width:767px){
 body:not(.auth-pending){font-size:16px}
 .nd-appbar{position:sticky;top:0;z-index:95;display:flex;align-items:center;gap:6px;min-height:calc(var(--nd-appbar) + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));margin:0 0 4px;background:var(--nd-navy);color:#fff;box-sizing:border-box}
 body.auth-pending .nd-appbar{display:none}
 .nd-appbar-brand{font:850 20px/1 NesaInter,system-ui;letter-spacing:-.03em;color:#fff;padding-right:4px}
 .nd-appbar-title{flex:1;min-width:0;font:650 17px/1.25 NesaInter,system-ui;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
 .nd-appbar .nd-sync{color:#fff;border-color:rgb(255 255 255 / .25);background:rgb(255 255 255 / .08)}
 body:not(.auth-pending) main{padding-top:4px}
 /* The page heading is announced by the app bar; keep it for assistive technology only. */
 body:not(.auth-pending) .ws-heading h1#ws-title,body:not(.auth-pending) .ws-heading #ws-date{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;margin:0!important;padding:0!important}
 html body:not(.auth-pending) main>.ws-heading{min-height:0!important;margin:0!important;padding:0!important;gap:0!important}
 html body:not(.auth-pending) .ws-heading #ws-connection{display:none!important}
 html body:not(.auth-pending) .ws-heading .ws-heading-actions:not(:has(>:not([hidden]):not(#ws-connection))){display:none!important}
 html body:not(.auth-pending) .ws-heading .ws-heading-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 10px;justify-content:flex-start}
 html body:not(.auth-pending) .ws-heading .ws-heading-actions>*{margin:0}
 /* C: no text below 13px on phones (captions, hints, metadata). */
 body:not(.auth-pending) main :is(small,.minor,.ws-caption,.mobile-caption,.hint){font-size:max(13px,.8125rem)}
 body:not(.auth-pending) main :is(.journey-eyebrow,.trk-sync,.trk-hint,.trk-aux,.trk-badge,.nesa-presence,.trk-person-info small,.journey-state,.journey-steps span,.status-badge,.compact-help summary,.compact-tabs span,.hm-map-top span,.hm-team-toggle span,.commerce-pagination span,p.minor,.trk-chips .btn,.trk-panel-map,.ws-screen>p,.journey-steps b,.mobile-plan-stop small){font-size:12.5px!important}
 .nd-duplicate-heading{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
 html body .ws-mobile-nav{min-height:var(--nd-tabbar);padding:0 max(4px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(4px,env(safe-area-inset-left))!important;grid-template-columns:repeat(auto-fit,minmax(0,1fr))!important;background:#fff!important;border-top:1px solid var(--nd-line)!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 html body .ws-mobile-nav button{min-height:var(--nd-tabbar);gap:3px;font-size:12px;font-weight:600;color:var(--nd-muted);border-radius:0;background:transparent!important}
 html body .ws-mobile-nav button[hidden]{display:none!important}
 html body .ws-mobile-nav button.active{color:var(--nd-blue)!important;font-weight:750;background:transparent!important}
 html body .ws-mobile-nav button.active::after{background:var(--nd-blue)!important;bottom:auto!important;top:0!important;height:3px!important;width:32px!important;left:calc(50% - 16px)!important;border-radius:0 0 3px 3px!important}
 html body .ws-mobile-nav button.active svg{stroke-width:2.3!important}
 html body .ws-mobile-nav svg{width:24px;height:24px}
 /* The on-screen keyboard owns the bottom edge while a field is focused. */
 body.nd-keyboard .ws-mobile-nav,body.nd-keyboard .nc-launcher,body.nd-keyboard #nc-launcher{display:none!important}
 html body:not(.auth-pending) .btn{min-height:44px}
 html body:not(.auth-pending) .btn.primary{min-height:48px}
 html body:not(.auth-pending) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),html body:not(.auth-pending) select,html body:not(.auth-pending) textarea{font-size:16px}
 html body:not(.auth-pending) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),html body:not(.auth-pending) select{min-height:48px}
 /* Dialogs: full width, buttons inside the dialog and above the home indicator. */
 html body:not(.auth-pending) dialog.customer-dialog{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
 html body:not(.auth-pending) dialog.customer-dialog[open]{width:100vw!important;max-width:100vw!important;margin-left:0!important;margin-right:0!important;left:0!important;right:0!important}
 /* Messages appear under the app bar, never over the main action or the tab bar. */
 html body .journey-toast,html body #toast.toast{top:calc(var(--nd-appbar) + env(safe-area-inset-top) + 8px)!important;bottom:auto!important;left:12px!important;right:12px!important;width:auto!important;transform:none!important;z-index:1100}
 html body #ws-more>h2{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important}
 html body .gm-dialog-head{background-color:var(--nd-navy)}
 html body .gm-dialog-head :is(h2,h3){color:#fff}
 html body:not(.auth-pending) .gm-dialog-head .btn{background:transparent;color:#fff!important;border-color:rgb(255 255 255 / .45)}
 /* Login: full-bleed on phones. */
 body.auth-pending .nesa-login-shell,body.auth-pending .nesa-login-card{border-radius:0;box-shadow:none}
}
/* Touch screens (phones and tablets): every control is at least 44px tall; mouse screens keep the compact desktop density. */
@media (pointer:coarse){
 /* #nd-touch never exists: it only lifts the selector above the screen-specific compact rules. */
 html body:not(.auth-pending) :is(main,.ws-sidebar,.nesa-session-header,.nd-appbar,#nd-touch) :is(button,a.btn,[role=button],summary,select,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),#nd-touch):not(.nd-sr):not([hidden]),html body:not(.auth-pending) .nd-sync{min-height:44px!important}
 html body:not(.auth-pending) :is(main,#nd-touch) label:has(>input:is([type=checkbox],[type=radio])){min-height:44px;display:inline-flex;align-items:center;gap:8px}
 html body:not(.auth-pending) :is(main,.ws-sidebar) :is(button,a.btn,[role=button]):not(.nd-sr):not([hidden]){min-width:44px}
 html body:not(.auth-pending) .ws-sidebar #ws-sidebar-toggle{width:44px;height:44px}
}

/* ---------- synchronisation status: compact chip + details ---------- */
.nd-sync{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px;border-radius:999px;border:1px solid var(--nd-line);background:#fff;color:var(--nd-ink);font:600 13px/1.2 NesaInter,system-ui;white-space:nowrap;cursor:pointer;position:relative}
.nd-sync::after{content:"";position:absolute;inset:-4px}
.nd-sync svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nd-sync[data-state=ok] svg{color:var(--nd-green)}.nd-sync[data-state=pending] svg,.nd-sync[data-state=offline] svg{color:var(--nd-amber)}.nd-sync[data-state=sending] svg{color:var(--nd-blue)}.nd-sync[data-state=retry] svg{color:var(--nd-red)}
.nd-appbar .nd-sync[data-state=ok] svg{color:#86efac}.nd-appbar .nd-sync[data-state=pending] svg,.nd-appbar .nd-sync[data-state=offline] svg{color:#fcd34d}.nd-appbar .nd-sync[data-state=sending] svg{color:#9cc0ff}.nd-appbar .nd-sync[data-state=retry] svg{color:#fda4af}
.nd-sync[data-state=retry]{border-color:#f3b4ae}
.nd-appbar .nd-sync[data-state=retry]{background:#7a1d16;border-color:#fda4af}
.nd-sync[data-state=sending] svg{animation:nd-spin 1.1s linear infinite}
@keyframes nd-spin{to{transform:rotate(360deg)}}
@media screen and (max-width:420px){.nd-appbar .nd-sync[data-state=ok] .nd-sync-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.nd-appbar .nd-sync[data-state=ok]{width:44px;height:44px;justify-content:center;padding:0;border:0;background:transparent}}
.nd-sync-panel{position:fixed;z-index:120;right:max(12px,env(safe-area-inset-right));top:calc(var(--nd-appbar) + env(safe-area-inset-top) + 6px);width:min(380px,calc(100vw - 24px));max-height:calc(100dvh - 140px);overflow:auto;margin:0;padding:16px;border:1px solid var(--nd-line);border-radius:14px;background:#fff;color:var(--nd-ink);box-shadow:0 12px 32px rgb(11 28 64 / .22)}
@media screen and (min-width:768px){.nd-sync-panel{top:72px;right:24px}}
.nd-sync-panel h2{margin:0 0 4px;font-size:17px}
.nd-sync-panel p{margin:0;color:var(--nd-muted);font-size:14px;line-height:1.45}
.nd-sync-panel ul{display:grid;gap:8px;margin:12px 0;padding:0;list-style:none}
.nd-sync-panel li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:start;padding:10px 12px;border-radius:10px;background:var(--nd-surface-2);font-size:14px}
.nd-sync-panel li b{grid-column:2;font-weight:650;color:var(--nd-ink)}
.nd-sync-panel li span{grid-column:2;color:var(--nd-muted)}
.nd-sync-panel li i{grid-row:1/3;width:10px;height:10px;margin-top:5px;border-radius:50%;background:var(--nd-green)}
.nd-sync-panel li[data-state=pending] i,.nd-sync-panel li[data-state=offline] i{background:#c76a00}.nd-sync-panel li[data-state=sending] i{background:var(--nd-blue)}.nd-sync-panel li[data-state=retry] i{background:var(--nd-red)}
.nd-sync-actions{display:flex;flex-wrap:wrap;gap:8px}
.nd-sync-actions .btn{flex:1 1 140px}
/* The old always-visible status lines are summarised by the chip; failures stay visible below. */
body:not(.auth-pending) .demo-banner:not(:has(#v2-sync-status.v2-error)):not(:has(#s-clear-demo:not([hidden]))){display:none!important}
#journey-status.nd-calm{display:none}
#journey-status.nd-attention{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:8px 12px;border-radius:10px;background:var(--nd-amber-soft);color:var(--nd-amber);font-weight:600;font-size:14px}

/* ---------- phone menu (Menü): grouped list rows ---------- */
@media screen and (max-width:767px){
 html body .mobile-more-menu{display:block!important;margin:0 0 12px}
 .nd-menu-group{margin:0 0 14px}
 .nd-menu-group h3{margin:0 4px 6px;font-size:12px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;color:var(--nd-muted)}
 .nd-menu-list{display:block;border:1px solid var(--nd-line);border-radius:14px;background:#fff;overflow:hidden}
 html body .mobile-more-menu .nd-menu-list>button{display:flex!important;align-items:center;gap:12px;width:100%;min-height:56px;padding:8px 14px;border:0;border-bottom:1px solid var(--nd-line);border-radius:0;background:#fff;color:var(--nd-ink);font:600 16px/1.3 NesaInter,system-ui;text-align:left;box-shadow:none}
 html body .mobile-more-menu .nd-menu-list>button:last-child{border-bottom:0}
 html body .mobile-more-menu .nd-menu-list>button[hidden]{display:none!important}
 html body .mobile-more-menu .nd-menu-list>button svg{width:22px;height:22px;color:var(--nd-blue);flex:none}
 html body .mobile-more-menu .nd-menu-list>button>svg:last-child:not(:first-child){width:18px;height:18px;margin-left:auto;color:var(--nd-line-2)}
 html body .mobile-more-menu .nd-menu-list>button:active{background:var(--nd-surface-2)}
 html body .mobile-more-menu .nd-menu-list>button>b:not([hidden]){margin-left:auto;min-width:22px;padding:2px 7px;border-radius:999px;background:var(--nd-red);color:#fff;font-size:12px;text-align:center}
 .nd-menu-group:empty,.nd-menu-group:not(:has(.nd-menu-list>button:not([hidden]))){display:none}
}

/* ---------- travel screen and the guided visit stage card ---------- */
.journey-screen .journey-toolbar{gap:8px}
@media screen and (max-width:767px){
 .journey-screen .journey-toolbar{display:grid!important;grid-template-columns:1fr auto;align-items:end;gap:8px;margin-bottom:8px}
 .journey-screen .journey-toolbar label{font-size:13px;color:var(--nd-muted);min-width:0}
 .journey-screen .journey-toolbar label:has(#journey-person:disabled){display:none}
 .journey-screen .journey-toolbar [data-journey=refresh]{min-width:48px;padding:0 12px}
}


/* Narrow tablets (768–1099px): the top bar wraps instead of squeezing the title into several lines. */
@media screen and (min-width:768px) and (max-width:1099px){
 body.shell-desktop-topbar:not(.auth-pending)>.nesa-session-header{flex-wrap:wrap;row-gap:8px}
 body.shell-desktop-topbar>.nesa-session-header>.ws-heading{flex-wrap:wrap;row-gap:8px}
 body.shell-desktop-topbar>.nesa-session-header #ws-title{white-space:nowrap}
 body.shell-desktop-topbar>.nesa-session-header .ws-heading-actions{justify-content:flex-start}
}