/* Aucip Appointments design system — "Juniper & Clay"
   Palette: juniper (primary), clay (accent), sand/paper neutrals, ink text.
   Type: Fraunces (display, optical-size serif) + Manrope (UI sans). Both OFL, self-hosted.
   Spacing: 4px base -> --s1..--s8 = 4 8 12 16 24 32 48 64. Type scale 1.25 (major third). */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces.woff2) format("woff2");font-weight:300 800;font-display:swap}
@font-face{font-family:"Manrope";src:url(../fonts/manrope.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{
  --ink:#14231f;--ink-2:#3d4a45;--muted:#5c605a;--line:#e4dccf;--line-2:#efe8dc;--sand:#f6f1e9;--paper:#fffdf9;
  --juniper:#1f5c4e;--juniper-700:#174a3f;--juniper-50:#e8f1ed;--clay:#c8643b;--clay-700:#a8492a;--field:#8f8676;--clay-50:#fbeee7;
  --ok:#2f7a4f;--ok-50:#e7f3ec;--warn:#8a5810;--warn-50:#fbf1df;--bad:#b3412e;--bad-50:#fbeae6;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
  --t-xs:12px;--t-sm:14px;--t-md:16px;--t-lg:20px;--t-xl:25px;--t-2xl:31px;--t-3xl:39px;
  --r-sm:6px;--r:10px;--r-lg:16px;--shadow:0 1px 0 rgba(20,35,31,.04),0 6px 20px -10px rgba(20,35,31,.18);
  --ease:cubic-bezier(.2,.7,.2,1);--dur:160ms;
  --display:"Fraunces",Georgia,"Times New Roman",serif;--ui:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:400 var(--t-md)/1.55 var(--ui);color:var(--ink);background:var(--sand);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--display);font-weight:560;letter-spacing:-.01em;line-height:1.2;margin:0 0 var(--s3)}
h1{font-size:var(--t-2xl)}h2{font-size:var(--t-xl)}h3{font-size:var(--t-lg)}
p{margin:0 0 var(--s3)}a{color:var(--juniper)}
.ico{width:18px;height:18px;flex:none;vertical-align:-3px}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s3) var(--s5);background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;display:flex;align-items:center;gap:var(--s2);font:600 var(--t-lg)/1 var(--display);color:var(--ink);text-decoration:none}
.brand .ico{width:22px;height:22px;color:var(--clay)}
.topbar nav{display:flex;gap:var(--s1);align-items:center;font-size:var(--t-sm)}
.topbar nav a,.topbar nav .link{color:var(--muted);text-decoration:none;padding:var(--s1) var(--s2);border-radius:var(--r-sm)}
.topbar nav a.active{color:var(--juniper);background:var(--juniper-50);font-weight:600}
.container{max-width:960px;margin:0 auto;padding:var(--s6) var(--s5) var(--s8)}.narrow{max-width:640px}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);margin-bottom:var(--s5)}
.page-head p{color:var(--muted);margin:0}
.eyebrow{font-size:var(--t-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--clay-700);margin-bottom:var(--s2)}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);margin:0 0 var(--s4);box-shadow:var(--shadow)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s4)}
.section-title{font:600 var(--t-xs)/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:var(--s6) 0 var(--s3)}
label{display:block;margin:0 0 var(--s3);font-size:var(--t-sm);font-weight:600;color:var(--ink-2)}
label.row{display:flex;gap:var(--s2);align-items:center;font-weight:500}
input,select{display:block;width:100%;margin-top:var(--s1);padding:10px var(--s3);border:1px solid var(--field);border-radius:var(--r);background:#fff;font:400 var(--t-md)/1.3 var(--ui);color:var(--ink);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
input:focus,select:focus{outline:none;border-color:var(--juniper);box-shadow:0 0 0 3px var(--juniper-50)}
input[type=checkbox],input[type=radio]{display:inline;width:18px;height:18px;margin:0;accent-color:var(--juniper)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:42px;background:var(--juniper);color:#fff;border:1px solid var(--juniper);border-radius:var(--r);padding:0 var(--s4);font:600 var(--t-sm)/1 var(--ui);cursor:pointer;text-decoration:none;transition:background var(--dur) var(--ease),transform var(--dur) var(--ease)}
.btn:hover{background:var(--juniper-700)}.btn:active{transform:translateY(1px)}
.btn:focus-visible,a:focus-visible,.link:focus-visible{outline:2px solid var(--clay);outline-offset:2px}
.btn.ghost{background:transparent;color:var(--juniper);border-color:var(--line)}.btn.ghost:hover{background:var(--juniper-50);border-color:var(--juniper)}
.btn.danger{background:transparent;color:var(--bad);border-color:var(--line)}.btn.danger:hover{background:var(--bad-50);border-color:var(--bad)}
.btn.sm{min-height:34px;padding:0 var(--s3)}
.link{background:none;border:0;color:var(--muted);cursor:pointer;font:inherit;display:inline-flex;gap:var(--s1);align-items:center}
.inline{display:inline}.inline-form{display:flex;gap:var(--s3);align-items:flex-end;flex-wrap:wrap}.inline-form label{margin:0;flex:1 1 200px}
.actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--line-2)}
.actions select{width:auto;margin:0;min-height:34px;padding:0 var(--s2)}.actions form{display:inline-flex;gap:var(--s2)}
.alert{display:flex;gap:var(--s2);align-items:flex-start;padding:var(--s3) var(--s4);border-radius:var(--r);margin:0 0 var(--s4);font-size:var(--t-sm);border:1px solid transparent}
.alert.ok{background:var(--ok-50);color:var(--ok);border-color:#cfe5d7}.alert.err{background:var(--bad-50);color:var(--bad);border-color:#f0cfc7}
.pill{display:inline-flex;align-items:center;gap:var(--s1);padding:2px var(--s2);border-radius:999px;font-size:var(--t-xs);font-weight:700;letter-spacing:.02em}
.pill.confirmed{background:var(--ok-50);color:var(--ok)}.pill.pending{background:var(--warn-50);color:var(--warn)}.pill.cancelled,.pill.no_show{background:var(--bad-50);color:var(--bad)}.pill.completed{background:var(--line-2);color:var(--ink-2)}
.muted{color:var(--muted)}.small{font-size:var(--t-sm)}.hidden{display:none}
.booking{display:grid;grid-template-columns:72px 1fr;gap:var(--s4)}
.date-tile{background:var(--juniper-50);color:var(--juniper);border-radius:var(--r);text-align:center;padding:var(--s2) 0;align-self:start}
.date-tile b{display:block;font:600 var(--t-2xl)/1.1 var(--display)}.date-tile span{font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.booking h3{margin-bottom:var(--s1)}
.meta{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s4);color:var(--ink-2);font-size:var(--t-sm);margin-bottom:var(--s3)}
.meta span{display:inline-flex;gap:6px;align-items:center}.meta .ico{width:16px;height:16px;color:var(--muted)}
.money{display:flex;gap:var(--s5);font-size:var(--t-sm);font-variant-numeric:tabular-nums}.money b{display:block;font-size:var(--t-md)}
.money .due b{color:var(--clay-700)}
.empty{text-align:center;padding:var(--s7) var(--s5);border:1px dashed var(--line);border-radius:var(--r-lg);color:var(--muted);background:var(--paper)}
.empty .ico{width:32px;height:32px;color:var(--clay);margin-bottom:var(--s3)}.empty p{max-width:360px;margin:0 auto var(--s4)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:var(--s2)}
.slot{display:flex;align-items:center;justify-content:center;gap:var(--s1);border:1px solid var(--line);border-radius:var(--r);padding:var(--s2);margin:0;font-variant-numeric:tabular-nums;cursor:pointer;background:#fff;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.table td,.table th{border-bottom:1px solid var(--line-2);padding:var(--s2) 0;text-align:start;font-size:var(--t-sm)}.table td:last-child,.table th:last-child{text-align:end}
.checks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--s2)}.checks li{display:flex;gap:var(--s2);align-items:center;font-size:var(--t-sm)}
.checks .ok{color:var(--ok)}.checks .bad{color:var(--bad)}
.row-item{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--line-2);font-size:var(--t-sm)}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--s6);align-items:center;padding:var(--s6) 0}
.hero h1{font-size:var(--t-3xl)}.hero .facts{display:grid;gap:var(--s3)}
.fact{display:flex;gap:var(--s3);align-items:flex-start;font-size:var(--t-sm)}.fact .ico{color:var(--juniper);margin-top:2px}
@media (max-width:640px){
  .container{padding:var(--s5) var(--s4) var(--s7)}.topbar{padding:var(--s3) var(--s4)}
  h1,.hero h1{font-size:var(--t-xl)}.brand{font-size:var(--t-md)}.topbar nav a,.topbar nav .link{padding:var(--s1)}.hero{grid-template-columns:1fr;gap:var(--s5);padding:0}
  .booking{grid-template-columns:1fr}.date-tile{display:flex;gap:var(--s2);align-items:baseline;justify-content:flex-start;padding:var(--s2) var(--s3)}
  .date-tile b{font-size:var(--t-lg)}.actions .btn,.actions form{flex:1 1 auto}.actions form .btn{flex:1}
  .page-head{flex-direction:column;align-items:flex-start}.card{padding:var(--s4)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{.topbar,.btn,.actions{display:none}body{background:#fff}.card{box-shadow:none;border:0}}
.head-row{display:flex;justify-content:space-between;gap:var(--s3);align-items:flex-start}.note{margin:var(--s3) 0 0}.flush{margin:0}.spaced{margin:var(--s5) 0}
button[aria-busy=true]{opacity:.7;cursor:progress}

/* ---- polish spec additions (portal) ---- */
/* Append to public/css/app.css. AA fixes + portal polish. */
:root{--muted:#5c605a;--field:#8f8676;--clay-700:#a8492a;--warn:#8a5810}
.eyebrow,.money .due b{color:var(--clay-700)}            /* clay text was 3.87:1 */
input,select{border-color:var(--field);min-height:44px}
.btn{min-height:44px}.btn.sm{min-height:36px}
:focus-visible{outline:2px solid var(--clay);outline-offset:2px}
/* Topbar: brand must not truncate on 360px */
.brand{font-size:var(--t-md)}
@media (max-width:480px){.topbar{padding:var(--s2) var(--s4)}.topbar nav a{padding:var(--s1)}.brand span{max-width:42vw;overflow:hidden;text-overflow:ellipsis}}
.lang{position:relative}.lang summary{list-style:none;cursor:pointer;display:inline-flex;gap:4px;align-items:center;color:var(--muted);font-size:var(--t-sm);min-height:36px;padding:0 var(--s2);border-radius:var(--r-sm)}
.lang[open] .lang-menu{position:absolute;inset-inline-end:0;top:100%;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:var(--s1);min-width:140px;z-index:10}
.lang-menu a{display:block;padding:var(--s2) var(--s3);border-radius:var(--r-sm)}
/* Booking card */
.booking .head-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s3)}
.booking .countdown{font-size:var(--t-xs);font-weight:700;color:var(--juniper);background:var(--juniper-50);padding:2px 8px;border-radius:999px}
.actions .primary-actions{display:flex;gap:var(--s2);flex-wrap:wrap}
.actions details.more{margin-inline-start:auto;position:relative}
.actions details.more summary{list-style:none}
.actions details.more[open] .menu{position:absolute;inset-inline-end:0;bottom:calc(100% + 6px);background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:var(--s1);min-width:200px;z-index:5}
.menu a,.menu button{display:flex;gap:var(--s2);align-items:center;width:100%;padding:var(--s2) var(--s3);border-radius:var(--r-sm);background:none;border:0;font:500 var(--t-sm)/1.2 var(--ui);color:var(--ink);text-decoration:none;cursor:pointer}
.menu a:hover,.menu button:hover{background:var(--line-2)}
.menu .danger{color:var(--bad)}
@media (max-width:560px){
  .booking{grid-template-columns:56px 1fr;gap:var(--s3)}
  .card{padding:var(--s4)}
  .page-head{flex-direction:column;align-items:stretch}.page-head .btn{width:100%}
  .money{gap:var(--s4)}
  .actions .primary-actions{width:100%}.actions .primary-actions>*{flex:1}
}
/* Past list */
.row-item{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--line-2)}
.row-item:last-child{border-bottom:0}
.past-empty{display:flex;gap:var(--s3);align-items:center;color:var(--muted);font-size:var(--t-sm)}
/* Cancel dialog */
dialog.sheet{border:0;border-radius:var(--r-lg);padding:var(--s5);max-width:440px;width:calc(100% - 32px);box-shadow:0 24px 60px -20px rgba(20,35,31,.45);background:var(--paper);color:var(--ink)}
dialog.sheet::backdrop{background:rgba(20,35,31,.45)}
dialog.sheet .refund{display:flex;justify-content:space-between;padding:var(--s3);border-radius:var(--r);background:var(--sand);font-variant-numeric:tabular-nums;margin:var(--s3) 0}
dialog.sheet .refund.none{background:var(--bad-50);color:var(--bad)}
dialog.sheet footer{display:flex;gap:var(--s2);justify-content:flex-end;margin-top:var(--s4)}
@media (max-width:560px){dialog.sheet{margin:auto 0 0;width:100%;max-width:none;border-radius:var(--r-lg) var(--r-lg) 0 0}dialog.sheet footer{flex-direction:column-reverse}dialog.sheet footer .btn{width:100%}}
/* Reschedule */
.resched-current{display:flex;gap:var(--s3);align-items:center;padding:var(--s3) var(--s4);border-radius:var(--r);background:var(--juniper-50);color:var(--juniper);margin-bottom:var(--s4)}
.slot{min-height:44px;border-color:var(--field)}
.slot:has(input:focus-visible){outline:2px solid var(--clay);outline-offset:2px}
.slot:has(input:checked){background:var(--juniper);color:#fff;border-color:var(--juniper)}
.sticky-confirm{position:sticky;bottom:0;background:linear-gradient(transparent,var(--paper) 35%);padding-top:var(--s4)}
.sticky-confirm .btn{width:100%}
[dir=rtl] .ico-dir{transform:scaleX(-1)}
/* integration: portal week strip, slot groups, more menu, book embed */
.week{display:grid;grid-template-columns:36px repeat(7,1fr) 36px;gap:4px;align-items:center;margin:0 0 var(--s4)}
.week .day{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:56px;justify-content:center;border-radius:var(--r);text-decoration:none;color:var(--ink)}
.week .day small{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted)}.week .day b{font:600 17px/1 var(--display)}
.week .day:hover{background:var(--juniper-50)}
.week .day[aria-current=date]{background:var(--juniper);color:#fff}.week .day[aria-current=date] small{color:#fff}
.week .day[aria-disabled=true]{opacity:.35}
.week .nav{display:grid;place-items:center;height:44px;border-radius:var(--r-sm);color:var(--ink)}.week .nav[aria-disabled=true]{opacity:.3;pointer-events:none}
.more-dates{margin-bottom:var(--s4)}
.slot-group h4{font:700 12px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:var(--s4) 0 var(--s2)}
.actions{justify-content:space-between}
.empty h3{color:var(--ink)}
.book-embed{padding:var(--s3)}
@media (max-width:640px){.week{grid-template-columns:28px repeat(7,1fr) 28px;gap:2px}.week .day b{font-size:15px}}
.lang{display:none}.lang-inline{display:inline-flex;gap:var(--s1)}
@media (max-width:480px){.lang{display:block}.lang-inline{display:none}}
@media (max-width:560px){.date-tile{display:block;text-align:center;padding:var(--s2) 0}.date-tile b{font-size:var(--t-xl)}}
/* designer review fixes */
.slot{position:relative}.slot input{position:absolute;opacity:0;pointer-events:none}
.slots .slot:has(input:checked),.slots .slot:has(input:checked):hover{background:var(--juniper);border-color:var(--juniper);color:#fff}
.js [data-nojs-only]{display:none}
.resched-card{padding-bottom:72px}
.actions{flex-wrap:nowrap;align-items:center}.actions .primary-actions{flex-wrap:wrap;min-width:0}.actions details.more{flex:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
h2.h3{font-size:var(--t-lg)}
@media (max-width:480px){.brand{font-size:15px}.signout-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.signout{min-width:44px;min-height:44px;justify-content:center}}
@media (max-width:560px){.actions .primary-actions{width:auto;flex:1}}
.js .reschedule-date-form{display:none}

/* Arabic: IBM Plex Sans Arabic (OFL, self-hosted, Arabic subset). Fraunces has no Arabic glyphs. */
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-arabic-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/plex-arabic-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plex-arabic-600.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
[dir=rtl] body,:lang(ar) body,[dir=rtl] button,[dir=rtl] input,[dir=rtl] select,[dir=rtl] textarea,:lang(ar) button,:lang(ar) input,:lang(ar) select,:lang(ar) textarea{font-family:'IBM Plex Sans Arabic','Manrope',system-ui,sans-serif!important}
[dir=rtl] body,:lang(ar) body{font-size:calc(100% + 1px);line-height:1.7}
[dir=rtl] :is(h1,h2,h3,h4,.brand,.fi-header-heading,.fi-wi-stats-overview-stat-value),:lang(ar) :is(h1,h2,h3,h4,.brand){font-family:'IBM Plex Sans Arabic','Manrope',system-ui,sans-serif!important;font-weight:600}
bdi[dir=ltr]{unicode-bidi:isolate}
