/* TuKi V10.44 — cross-site UX, accessibility and responsive polish. */
:root{
  --tuki-ink:#15181c;--tuki-muted:#66717d;--tuki-surface:#fff;--tuki-soft:#f6f7f8;
  --tuki-line:#e2e6ea;--tuki-brand:#f46f2a;--tuki-brand-dark:#d95113;
  --tuki-success:#087a55;--tuki-danger:#c8322a;--tuki-focus:#176bff;
  --tuki-radius-sm:12px;--tuki-radius:18px;--tuki-radius-lg:24px;
  --tuki-shadow:0 14px 38px rgba(17,24,39,.08);--tuki-shadow-soft:0 5px 18px rgba(17,24,39,.055);
  --tuki-font:"Alexandria","Tajawal","Segoe UI",Tahoma,Arial,sans-serif;
}

html{font-family:var(--tuki-font);text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body,button,input,select,textarea{font-family:var(--tuki-font)}
body{font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
button,a,input,select,textarea{touch-action:manipulation}
button,input,select,textarea{font-size:max(16px,1em)}
button,[role="button"],input[type="button"],input[type="submit"],input[type="reset"],select{min-height:44px}
button:not(:disabled),[role="button"],a[href],label[for],select{cursor:pointer}
button:disabled,[aria-disabled="true"]{cursor:not-allowed;opacity:.58}
img,svg,video{max-width:100%}

:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid color-mix(in srgb,var(--tuki-focus) 72%,white)!important;
  outline-offset:3px!important;box-shadow:0 0 0 5px rgba(23,107,255,.13)!important;
}
:where(input,select,textarea):user-invalid{border-color:var(--tuki-danger)!important}
::selection{background:#ffe2d1;color:#14171b}

/* Shared content surfaces */
:where(.panel,.card,.entryCard,.formCard,.loginCard,.legalCard,.obCard,.customersPanel,.adminHistoryPanel){
  border-color:var(--tuki-line)!important;box-shadow:var(--tuki-shadow-soft);background:var(--tuki-surface)
}
:where(.panel,.entryCard,.formCard,.loginCard,.legalCard,.customersPanel,.adminHistoryPanel){border-radius:var(--tuki-radius)!important}
:where(.panelHead,.paTop,.top,.compactTop,.approvedTop){gap:16px}
:where(.panelHead h1,.panelHead h2,.paTop h1,.top h1,.top h2,.dashboardHeading h1,.dashboardHeading h2){
  line-height:1.35;letter-spacing:-.02em
}
:where(.panelHead p,.paTop p,.dashboardHeading p,.muted){color:var(--tuki-muted)!important;line-height:1.75}
:where(.btn,.entryPrimary,.demoCta,.obAction,.bridgePrimaryBtn,.brandSaveBtn,.customerExportBtn,.arrivalConfirmBtn){
  min-height:44px;border-radius:var(--tuki-radius-sm)!important;font-weight:800;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease
}
:where(.btn,.entryPrimary,.demoCta,.obAction,.bridgePrimaryBtn,.brandSaveBtn,.customerExportBtn,.arrivalConfirmBtn):hover:not(:disabled){
  transform:translateY(-1px);box-shadow:0 8px 20px rgba(17,24,39,.11)
}
:where(.field input,.field select,.field textarea,.filters input,.filters select,.loginCard input,.entryForm input,.formGrid input,.formGrid select,.formGrid textarea){
  min-height:48px;border-radius:12px!important;border-color:#d5dbe1!important;background:#fff;transition:border-color .16s ease,box-shadow .16s ease
}
:where(.field input,.field select,.field textarea,.filters input,.filters select,.loginCard input,.entryForm input,.formGrid input,.formGrid select,.formGrid textarea):focus{
  border-color:var(--tuki-focus)!important
}

/* Tables remain readable and never force the whole viewport sideways. */
.tableWrap{max-width:100%;overflow:auto;overscroll-behavior-inline:contain;scrollbar-gutter:stable}
.tableWrap table{min-width:760px;border-collapse:separate;border-spacing:0}
.tableWrap th{position:sticky;top:0;z-index:2;background:#f7f8fa!important;color:#3c4651!important;font-size:13px!important;white-space:nowrap}
.tableWrap td{font-size:13px!important;line-height:1.6;vertical-align:middle}
.tableWrap tbody tr{transition:background-color .15s ease}
.tableWrap tbody tr:hover{background:#fff9f5}

/* Restaurant administration */
body:not(.entryPage):not(.legalBody):not(.repPage){color:var(--tuki-ink)}
.adminPremium,.dashboardApproved{background:#f5f3ef!important}
.side{border-inline-end:1px solid #e5e7eb;box-shadow:6px 0 28px rgba(17,24,39,.035)}
.side nav a,.mobileNav a{min-height:48px;border-radius:12px;transition:background-color .16s ease,color .16s ease,transform .16s ease}
.side nav a:hover{transform:translateX(-2px);background:#f5f6f7}
[dir="ltr"] .side nav a:hover{transform:translateX(2px)}
.side nav a.active{box-shadow:0 8px 24px rgba(17,24,39,.12)}
.content,.main{min-width:0}
.kpi,.stat,.dashboardWidgets>*,.customerStat{border-radius:var(--tuki-radius)!important;box-shadow:var(--tuki-shadow-soft)}
.badge,.status,.statPill,.platePill,.demoPill{font-size:12px!important;line-height:1.35;min-height:28px;display:inline-flex;align-items:center}
.topacts,.acts,.formActions,.gatewayActions{gap:10px;flex-wrap:wrap}
.mobileNav{padding-bottom:max(8px,env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(17,24,39,.1);border-top:1px solid #e6e8eb}
.mobileNav a{min-height:52px;min-width:56px}
.mobileNav a span{font-size:11px!important;line-height:1.3}

/* Kitchen: high contrast, fast scanning, no decorative clutter. */
.board{gap:16px}
.orderCard,.compactOrder{border-radius:20px!important;box-shadow:0 10px 30px rgba(17,24,39,.1)}
.orderCard button,.compactOrder button{min-height:48px;font-size:14px!important}
.orderCard .amt,.compactOrder .amt{font-weight:900}

/* Customer ordering */
body:has(.bottomnav){padding-bottom:max(98px,calc(82px + env(safe-area-inset-bottom)))}
.bottomnav{min-height:72px!important;padding-bottom:max(7px,env(safe-area-inset-bottom));box-shadow:0 -12px 34px rgba(36,28,24,.12);border-top:1px solid rgba(113,86,70,.14)}
.navbtn{min-width:58px;min-height:54px!important;font-size:11px!important;border-radius:12px}
.navbtn i{font-size:21px!important}
.langbtn,.iconbtn{min-width:44px!important;min-height:44px!important}
.chip{min-height:42px!important;font-size:12px!important}
.add,.qty button{min-width:44px!important;min-height:44px!important}
.card h3{font-size:14px!important;line-height:1.55!important}
.card .en,.card .meta,.from,.cartitem small,.step,.branchMetaItem{font-size:11px!important;line-height:1.55}
.quick .quickCard b{font-size:12px!important;line-height:1.45!important}
.quick .quickCard span{font-size:10px!important;line-height:1.5!important}
.toast{font-size:13px!important;white-space:normal!important;width:max-content;max-width:calc(100vw - 28px);text-align:center}
.sheet,.modalCard,.installGuideCard{max-height:min(90dvh,820px);overflow:auto;overscroll-behavior:contain}
.sheet>.panel{border-radius:25px 25px 0 0!important;box-shadow:0 -18px 46px rgba(36,28,24,.16)}

/* Entry and public platform pages */
.entryPage{background:radial-gradient(circle at 90% 0,rgba(244,111,42,.09),transparent 30%),#f6f7f8!important}
.entryWrap{width:min(1180px,calc(100% - 32px))!important}
.entryCard{padding:clamp(20px,3vw,38px)!important}
.entryIntro h1{font-size:clamp(27px,4vw,42px)!important;line-height:1.25!important}
.entryIntro p,.entryForm label>span,.entryForgotPassword,.entryOption strong{font-size:13px!important}
.entryOption span,.entryFooter,.demoCredentialsText>span{font-size:11px!important}
.entryPrimary{font-size:16px!important;background:linear-gradient(135deg,var(--tuki-brand),#ff884b)!important;box-shadow:0 12px 24px rgba(244,111,42,.24)}
.platformMergedHead h2,.sectionHead h2{font-size:clamp(25px,4vw,38px)!important}
.platformMergedHead p,.sectionHead p,.comparisonCard p,.solutionCard p,.homeCompactHead p{font-size:13px!important}
.valueGrid strong,.launchJourney article strong,.mergedFlow span,.compactBenefitPoints strong{font-size:12px!important}
.valueGrid span,.launchJourney article span,.mergedFlow small,.compactBenefitHead small{font-size:10px!important}
.formPage,.loginPage{background:radial-gradient(circle at 75% 0,rgba(244,111,42,.09),transparent 33%),#f5f6f7!important}
.formCard,.loginCard{padding:clamp(22px,4vw,38px)!important}

/* Super admin */
.paShell{background:#f4f6f8!important}
.paSide{border-inline-end:1px solid #e3e7eb;box-shadow:8px 0 30px rgba(17,24,39,.04)}
.paNav a{min-height:46px;border-radius:12px!important;font-size:14px!important;transition:background-color .16s ease,color .16s ease,transform .16s ease}
.paNav a:hover{transform:translateX(-2px)}
[dir="ltr"] .paNav a:hover{transform:translateX(2px)}
.paTop{min-height:88px!important;background:rgba(255,255,255,.92)!important;backdrop-filter:blur(14px);border-bottom:1px solid #e4e8ec}
.paTop h1{font-size:clamp(22px,2.5vw,30px)!important}
.paTop p{font-size:13px!important}
.paContent{padding:clamp(16px,2.6vw,34px)!important}
.paContent>.panel,.paContent>.grid2>.panel,.paContent>.grid3>.panel{overflow:hidden}
.paAdminBadge{font-size:12px!important;white-space:nowrap}
.kpi{padding:20px!important}.kpi strong{font-size:clamp(23px,3vw,34px)!important}.kpi span{font-size:12px!important}
.filters input,.filters select{min-width:min(260px,100%)}
.paSide .paLogout{min-height:44px}

/* Legal and onboarding */
.legalCard{width:min(900px,calc(100% - 28px));padding:clamp(22px,4vw,44px)!important}
.legalCard p,.legalCard li{font-size:15px!important;line-height:2}
.tukiLegalFooter{font-size:13px!important;line-height:1.8}
.tukiLegalFooterTrust,.tukiLegalFooterPrivacy{font-size:12px!important}
.obShell{width:min(980px,calc(100% - 28px))}
.obBody p,.obMeta,.obBottomText span,.obStatus{font-size:13px!important}
.obAction{font-size:13px!important}

/* Runtime accessibility helpers */
.tuki-skip-link{position:fixed;inset-inline-start:14px;top:10px;z-index:99999;padding:10px 14px;border-radius:10px;background:#111;color:#fff;text-decoration:none;transform:translateY(-160%);transition:transform .15s ease}
.tuki-skip-link:focus{transform:translateY(0)}
[aria-busy="true"]{cursor:progress}

@media(max-width:900px){
  .paShell{display:block!important}.paSide{position:relative!important;width:100%!important;min-height:auto!important;border:0;border-bottom:1px solid #e4e7eb;padding:12px!important}
  .paBrand{display:flex;justify-content:center}.paBrandLogo img{max-height:44px}
  .paNav{display:flex!important;overflow-x:auto;gap:7px;padding:5px 0 9px;scroll-snap-type:x proximity;scrollbar-width:none}
  .paNav::-webkit-scrollbar{display:none}.paNav a{flex:0 0 auto;scroll-snap-align:start;padding-inline:14px!important}
  .paSide .paLogout{width:100%;margin-top:4px}.paMain{width:100%!important;margin:0!important}
  .paTop{position:sticky;top:0;z-index:20;padding:14px 16px!important;min-height:76px!important}.paTop p{display:none}
  .panelHead{align-items:flex-start!important;flex-direction:column}.panelHead>.filters,.filters{width:100%}.filters input,.filters select{width:100%;min-width:0}
  .grid2,.grid3,.kpis,.detailGrid,.gatewayGrid,.paDirectPayGrid{grid-template-columns:1fr!important}
}

@media(max-width:720px){
  body{font-size:15px}.entryWrap{width:min(100% - 20px,600px)!important}.entryMainGrid,.heroGrid,.formShell,.integrationMerged{grid-template-columns:1fr!important}
  .entryCard,.formCard,.loginCard{padding:20px!important}.entryIntro h1{font-size:29px!important}
  .entryOptions,.featureGrid,.mergedFeatureGrid,.valueGrid,.solutionGrid{grid-template-columns:1fr!important}
  .launchJourney,.mergedFlow{grid-template-columns:1fr!important}.launchJourney>b{transform:rotate(90deg);min-height:22px}
  .fixedFeeBanner{grid-template-columns:48px 1fr!important}.fixedFeeBanner a{grid-column:1/-1;text-align:center}
  .tableWrap{margin-inline:-4px}.tableWrap table{min-width:680px}
  .top,.compactTop,.approvedTop,.dashboardHeading{align-items:flex-start!important;gap:12px;flex-wrap:wrap}
  .quick{gap:6px!important}.quick>div{padding:9px 4px!important}
  .cards{gap:10px!important}.card{border-radius:16px!important}.body{padding:10px!important}
  .installGuideBenefits{grid-template-columns:1fr!important}
}

@media(max-width:420px){
  .paTop h1{font-size:20px!important}.paAdminBadge{display:none}.paContent{padding:12px!important}
  .panel{border-radius:14px!important}.panelHead,.panelBody{padding-inline:14px!important}
  .bottomnav{padding-inline:4px}.navbtn{min-width:50px!important;padding-inline:3px!important}
  .brand{max-width:48vw!important;font-size:14px!important}.hello{font-size:10px!important}
  .quick .quickCard b{font-size:11px!important}.quick .quickCard span{font-size:9px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

@media(prefers-contrast:more){
  :root{--tuki-line:#b8c0c9;--tuki-muted:#4c5661}
  :where(.panel,.card,.entryCard,.formCard,.loginCard){border-width:2px!important}
}