/* ==========================================================================
   V2 ACCOUNT — /my-account/ customer dashboard.
   Loaded after v2-chrome.css (tokens + chrome) and v2-pages.css (base + button
   kit). Styles the account header card + KPIs and the tabbed dashboard shell
   (Overview / Bookings / Payments / Documents / Saved / Information). The
   dashboard's data, auth gates and Stripe/balance payment flows are unchanged;
   this sheet only skins the markup.
   ========================================================================== */

/* no final CTA on this page — the footer needs no overlap reserve */
.ftr2{ padding-top:clamp(48px,5vw,72px); }

/* ==========================================================================
   ACCOUNT HEADER — card with identity + KPI strip
   ========================================================================== */
.achd{ background:var(--bg-2); padding-top:clamp(16px,2vw,24px); }
.achd__in{ display:flex; flex-direction:column; gap:12px; }
.achd__top{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.achd .crumb{ display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-3); }
.achd .crumb a{ color:var(--ink-2); text-decoration:none; }
.achd .crumb a:hover{ color:var(--cta); text-decoration:underline; }
.achd__flag{ display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; background:#fff; border:1px solid var(--line); font-size:11.5px; font-weight:600; color:var(--ink-3); }
.achd__flag svg{ color:var(--icon); flex:none; }

.achd__card{ position:relative; overflow:hidden; border-radius:26px; background:#fff; border:1px solid var(--line); box-shadow:0 30px 60px -48px rgba(30,43,71,.55); }
.achd__card::after{ content:""; position:absolute; right:-140px; top:-160px; width:420px; height:420px; border-radius:999px; background:radial-gradient(circle, rgba(236,100,67,.13) 0%, rgba(236,100,67,0) 68%); pointer-events:none; }
.achd__bar{ position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(90deg, var(--cta) 0%, var(--icon) 46%, #E89B1C 100%); }
.achd__row{ position:relative; z-index:1; display:flex; align-items:center; gap:clamp(14px,1.8vw,22px); flex-wrap:wrap; padding:clamp(22px,2.6vw,30px) clamp(18px,2.4vw,32px) clamp(20px,2.2vw,26px); }
.achd__av{ position:relative; flex:none; width:64px; height:64px; border-radius:999px; background:linear-gradient(145deg, var(--icon) 0%, var(--cta) 100%); color:#fff; display:grid; place-items:center; font-family:var(--font-display); font-size:23px; font-weight:600; box-shadow:0 0 0 4px var(--icon-soft); }
.achd__id{ flex:1 1 300px; min-width:0; display:flex; flex-direction:column; gap:8px; }
.achd__eb{ display:inline-flex; align-items:center; gap:11px; font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--cta); }
.achd__eb i{ flex:none; width:26px; height:1.5px; background:var(--icon); }
.achd h1{ font-family:var(--font-display); font-size:clamp(25px,1.6vw + 13px,36px); line-height:1.06; letter-spacing:-.026em; color:var(--ink); }
.achd h1 em{ font-style:italic; font-weight:500; color:var(--cta); }
.achd__sub{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.achd__sub span{ display:inline-flex; align-items:center; gap:7px; padding:5px 11px; border-radius:999px; background:var(--bg-2); font-size:12.5px; color:var(--ink-3); }
.achd__sub svg{ flex:none; color:var(--icon); }
.achd__cta{ display:flex; gap:10px; flex-wrap:wrap; }

.achd__kpi{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); }
@media (max-width:900px){ .achd__kpi{ grid-template-columns:repeat(2,minmax(0,1fr)); } .ackpi:nth-child(2n){ border-right:0; } .ackpi:nth-child(-n+2){ border-bottom:1px solid var(--line); } }
@media (max-width:460px){ .achd__kpi{ grid-template-columns:1fr; } .ackpi{ border-right:0 !important; border-bottom:1px solid var(--line) !important; } .ackpi:last-child{ border-bottom:0 !important; } }
.ackpi{ display:flex; align-items:center; gap:12px; padding:16px clamp(14px,1.8vw,24px); border-right:1px solid var(--line); min-width:0; }
.ackpi:last-child{ border-right:0; }
.ackpi__ic{ flex:none; width:40px; height:40px; border-radius:13px; background:var(--bg-2); color:var(--ink-3); display:grid; place-items:center; }
.ackpi.is-ok .ackpi__ic{ background:var(--icon-soft); color:var(--cta); }
.ackpi.is-due .ackpi__ic{ background:#FDF1DE; color:#9A6209; }
.ackpi__t{ display:flex; flex-direction:column; min-width:0; }
.ackpi__t small{ font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); }
.ackpi__t b{ font-family:var(--font-display); font-size:20px; line-height:1.2; color:var(--ink); }
.ackpi__t em{ font-style:normal; font-size:12px; color:var(--ink-3); }

/* ==========================================================================
   BODY — nav rail + panels
   ========================================================================== */
.acbody{ background:var(--bg-2); padding:clamp(20px,2.6vw,32px) 0 clamp(40px,5vw,72px); }
.acbody__in{ display:grid; grid-template-columns:250px minmax(0,1fr); gap:clamp(16px,2vw,26px); align-items:start; }
@media (max-width:980px){ .acbody__in{ grid-template-columns:1fr; } }
.acnav{ position:sticky; top:96px; min-width:0; display:flex; flex-direction:column; gap:14px; }
@media (max-width:980px){ .acnav{ position:static; } }
.acnav__l{ display:flex; flex-direction:column; gap:4px; padding:10px; border-radius:22px; background:#fff; border:1px solid var(--line); }
@media (max-width:980px){ .acnav__l{ min-width:0; flex-direction:row; overflow-x:auto; scrollbar-width:none; border-radius:999px; padding:7px; } .acnav__l::-webkit-scrollbar{ display:none; } }
.acnav__b{ display:flex; align-items:center; gap:11px; width:100%; min-height:46px; padding:0 14px; border:0; border-radius:14px; background:none; font:inherit; font-size:14px; font-weight:600; color:var(--ink-2); text-align:left; cursor:pointer; transition:background .16s ease, color .16s ease; }
@media (max-width:980px){ .acnav__b{ width:auto; flex:none; border-radius:999px; white-space:nowrap; } }
.acnav__b:hover{ background:var(--bg-2); color:var(--ink); }
.acnav__b.is-on{ background:var(--navy); color:#fff; }
.acnav__ic{ flex:none; display:grid; place-items:center; width:26px; height:26px; color:var(--icon); }
.acnav__b.is-on .acnav__ic{ color:var(--accent-on-dark); }
.acnav__n{ margin-left:auto; flex:none; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:var(--cta); color:#fff; font-size:11px; font-style:normal; font-weight:700; display:grid; place-items:center; }
.acnav__help{ padding:18px 18px 20px; border-radius:22px; background:#fff; border:1px solid var(--line); display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
@media (max-width:980px){ .acnav__help{ display:none; } }
.acnav__ht{ display:inline-flex; align-items:center; gap:9px; font-size:14.5px; font-weight:700; color:var(--ink); }
.acnav__ht svg{ color:var(--icon); flex:none; }
.acnav__help p{ font-size:13px; line-height:1.55; color:var(--ink-3); }
.acnav__tel{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--ink-2); }
.acnav__tel svg{ color:var(--icon); flex:none; }

.acmain{ min-width:0; display:flex; flex-direction:column; }
.acpan{ display:none; flex-direction:column; gap:clamp(14px,1.6vw,18px); }
.acpan.is-on{ display:flex; }
.achead{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.achead h2{ font-family:var(--font-display); font-size:clamp(21px,1.1vw + 14px,26px); line-height:1.2; letter-spacing:-.02em; color:var(--ink); }
.achead p{ margin-top:4px; font-size:13.5px; color:var(--ink-3); }

.accard{ padding:20px 22px 22px; border-radius:22px; background:#fff; border:1px solid var(--line); display:flex; flex-direction:column; gap:14px; }
.aclab{ display:inline-flex; align-items:center; gap:9px; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); }
.aclab svg{ color:var(--icon); flex:none; }
.aclink{ display:inline-flex; align-items:center; gap:8px; align-self:flex-start; font-size:13.5px; font-weight:700; color:var(--cta); text-decoration:none; cursor:pointer; }
.aclink:hover{ text-decoration:underline; }

/* next trip */
.acnext{ display:grid; grid-template-columns:minmax(0,300px) minmax(0,1fr); border-radius:24px; background:#fff; border:1px solid var(--line); overflow:hidden; }
@media (max-width:760px){ .acnext{ grid-template-columns:1fr; } }
.acnext__img{ position:relative; display:block; min-height:230px; background:var(--ph); }
.acnext__img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
/* The theme's style.css carries `img[width][height]{ height:auto }` to hold an
   image's intrinsic ratio, and these <img> elements are rendered with width and
   height attributes (900x500 here, 600x380 on the booking rows). Two attribute
   selectors out-specify a single class, so that rule beat the height:100% above
   no matter the load order, and the picture sat at its natural ratio with the
   placeholder grey showing beneath it.
   This only bites on /my-account/: it is the one V2 page that still loads the
   old theme stylesheet, because its enqueue branch deliberately dequeues
   nothing. Matching the specificity is enough — no !important needed, unlike
   the header logo, which has to win against a width rule as well. */
.acnext__img img[width][height]{ height:100%; }
.acnext__cd{ position:absolute; left:14px; top:14px; display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px; background:var(--cta); color:#fff; font-size:11.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; box-shadow:0 14px 26px -16px rgba(200,70,31,.9); }
.acnext__b{ padding:20px 22px 22px; display:flex; flex-direction:column; gap:14px; min-width:0; }
.acnext__eb{ font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--cta); }
.acnext h2{ font-family:var(--font-display); font-size:clamp(19px,.8vw + 14px,23px); line-height:1.22; letter-spacing:-.018em; color:var(--ink); }
.acnext__f{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 18px; }
@media (max-width:520px){ .acnext__f{ grid-template-columns:1fr; } }
.acnext__f li{ display:flex; gap:10px; min-width:0; }
.acnext__f svg{ flex:none; color:var(--icon); margin-top:2px; }
.acnext__f span{ display:flex; flex-direction:column; min-width:0; font-size:12.5px; color:var(--ink-3); }
.acnext__f b{ font-size:14px; color:var(--ink); }
.acday__l{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
@media (max-width:640px){ .acday__l{ grid-template-columns:1fr; } }
.acday{ padding:12px 14px; border-radius:16px; background:var(--bg-2); display:flex; flex-direction:column; gap:4px; min-width:0; }
.acday b{ font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--cta); }
.acday span{ font-size:13px; font-weight:600; line-height:1.35; color:var(--ink); }
.acday small{ font-size:12px; line-height:1.45; color:var(--ink-3); }
.acnext__act{ display:flex; gap:9px; flex-wrap:wrap; }

.ac2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(12px,1.4vw,16px); align-items:start; }
@media (max-width:760px){ .ac2{ grid-template-columns:1fr; } }

/* request timeline */
.actr__l{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.actr__s{ position:relative; display:flex; gap:14px; padding-bottom:16px; }
.actr__s:last-child{ padding-bottom:0; }
.actr__s::before{ content:""; position:absolute; left:6px; top:16px; bottom:0; width:2px; background:var(--line); }
.actr__s:last-child::before{ display:none; }
.actr__d{ position:relative; z-index:2; flex:none; width:14px; height:14px; border-radius:999px; border:3px solid var(--line); background:#fff; margin-top:2px; }
.actr__s.is-done .actr__d{ border-color:var(--green); background:var(--green); }
.actr__s.is-now .actr__d{ border-color:var(--cta); background:var(--cta); box-shadow:0 0 0 4px rgba(200,70,31,.16); }
.actr__t{ display:flex; flex-direction:column; font-size:12.5px; color:var(--ink-3); }
.actr__t b{ font-size:14px; color:var(--ink); }
.actr__s.is-next .actr__t b{ color:var(--ink-3); font-weight:600; }

/* checklist */
.acpg{ display:flex; align-items:center; gap:12px; }
.acpg__bar{ flex:1; height:7px; border-radius:999px; background:var(--bg-2); overflow:hidden; }
.acpg__bar i{ display:block; height:100%; border-radius:999px; background:var(--green); transition:width .25s ease; }
.acpg b{ flex:none; font-size:12px; font-weight:700; color:var(--ink-3); }
.acck__l{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.acck{ display:flex; gap:11px; cursor:pointer; }
.acck__i{ position:absolute; opacity:0; width:0; height:0; }
.acck__b{ flex:none; width:19px; height:19px; margin-top:1px; border-radius:7px; border:1.5px solid #CDD4E1; background:#fff; display:grid; place-items:center; color:transparent; transition:background .16s ease, border-color .16s ease; }
.acck__b svg{ display:block; }
.acck__i:checked + .acck__b{ background:var(--green); border-color:var(--green); color:#fff; }
.acck__i:focus-visible + .acck__b{ box-shadow:0 0 0 3px rgba(200,70,31,.22); }
.acck__t{ font-size:13.5px; line-height:1.5; color:var(--ink-2); }
.acck__i:checked ~ .acck__t{ color:var(--ink-3); text-decoration:line-through; }

.acbal{ display:flex; align-items:center; gap:14px; padding:15px 18px; border-radius:20px; background:#fff; border:1px solid #F3E3C6; flex-wrap:wrap; }
.acbal__ic{ flex:none; width:42px; height:42px; border-radius:14px; background:#FDF1DE; color:#9A6209; display:grid; place-items:center; }
.acbal__t{ flex:1 1 220px; display:flex; flex-direction:column; font-size:12.5px; color:var(--ink-3); }
.acbal__t b{ font-family:var(--font-display); font-size:19px; color:var(--ink); }

/* bookings */
.acfil{ display:flex; gap:7px; flex-wrap:wrap; }
.acfil__b{ display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 14px; border:1.5px solid #DCE2EC; border-radius:999px; background:#fff; font:inherit; font-size:13px; font-weight:700; color:var(--ink); cursor:pointer; transition:background .16s ease, border-color .16s ease, color .16s ease; }
.acfil__b:hover{ border-color:var(--navy); }
.acfil__b i{ font-style:normal; font-size:11.5px; font-weight:700; color:var(--ink-3); }
.acfil__b.is-on{ background:var(--navy); border-color:var(--navy); color:#fff; }
.acfil__b.is-on i{ color:var(--accent-on-dark); }
.acbk__g{ display:flex; flex-direction:column; gap:12px; }
.acbk[hidden]{ display:none; }
.acbk{ display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:18px; align-items:center; padding:14px; border:1px solid var(--line); border-radius:22px; background:#fff; }
@media (max-width:860px){ .acbk{ grid-template-columns:110px minmax(0,1fr); } .acbk__side{ grid-column:1 / -1; flex-direction:row; align-items:center; justify-content:space-between; } }
@media (max-width:480px){ .acbk{ grid-template-columns:1fr; } .acbk__img{ height:150px; } }
.acbk__img{ display:block; height:106px; border-radius:16px; overflow:hidden; background:var(--ph); }
.acbk__img img{ width:100%; height:100%; object-fit:cover; }
.acbk__img img[width][height]{ height:100%; }   /* same trap as .acnext__img above */
.acbk__b{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.acbk__top{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.acbk__st{ padding:5px 11px; border-radius:999px; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.acbk__st.is-ok{ background:#E6F4EC; color:var(--green); }
.acbk__st.is-wait{ background:#FEF3E2; color:#9A6209; }
.acbk__st.is-done{ background:var(--bg-2); color:var(--ink-3); }
.acbk__ref{ font-size:11.5px; color:var(--ink-3); }
.acbk h3{ font-size:16.5px; line-height:1.24; color:var(--ink); }
.acbk__m{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-3); }
.acbk__m svg{ color:var(--icon); }
.acbk__m i{ width:3px; height:3px; border-radius:99px; background:#B7C0D0; }
.acbk__side{ display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.acbk__p{ display:flex; flex-direction:column; align-items:flex-end; font-size:11.5px; color:var(--ink-3); }
.acbk__p b{ font-family:var(--font-display); font-size:20px; color:var(--ink); }
.acbk__p b.acbk__pt{ font-family:inherit; font-size:14.5px; font-weight:700; color:#9A6209; }
.acbk__act{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.acempty{ padding:22px; border-radius:18px; background:#fff; border:1px dashed var(--line); text-align:center; font-size:14px; color:var(--ink-3); }

/* payments */
.acsum{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
@media (max-width:640px){ .acsum{ grid-template-columns:1fr; } }
.acsum__i{ display:flex; flex-direction:column; gap:3px; padding:16px 18px; border-radius:20px; background:#fff; border:1px solid var(--line); }
.acsum__i small{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); }
.acsum__i b{ font-family:var(--font-display); font-size:25px; color:var(--ink); }
.acsum__i.is-ok{ border-color:#CBE6D8; }
.acsum__i.is-ok b{ color:var(--green); }
.acsum__i.is-due{ border-color:#F3E3C6; }
.acsum__i.is-due b{ color:#9A6209; }
.actbl__w{ border-radius:22px; background:#fff; border:1px solid var(--line); overflow:hidden; }
.actbl{ width:100%; border-collapse:collapse; }
.actbl th{ padding:13px 18px; text-align:left; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); background:var(--bg-2); }
.actbl td{ padding:15px 18px; border-top:1px solid var(--line); font-size:13.5px; color:var(--ink-2); vertical-align:middle; }
.actbl__c{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.actbl td b{ display:block; font-size:14px; color:var(--ink); }
.actbl td small{ font-size:11.5px; color:var(--ink-3); }
.acpay__a{ font-family:var(--font-display); font-size:18px; color:var(--ink); }
.acpay__st{ display:inline-block; padding:5px 11px; border-radius:999px; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.acpay__st.is-ok{ background:#E6F4EC; color:var(--green); }
.acpay__st.is-due{ background:#FEF3E2; color:#9A6209; }
@media (max-width:640px){
  .actbl thead{ position:absolute; left:-9999px; }
  .actbl tr{ display:block; border-top:1px solid var(--line); }
  .actbl tr:first-child{ border-top:0; }
  .actbl td{ display:flex; align-items:center; justify-content:space-between; gap:14px; border-top:0; padding:9px 16px; }
  .actbl td::before{ content:attr(data-l); flex:none; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
  .actbl__c{ align-items:flex-end; text-align:right; }
  .actbl td:first-child{ padding-top:15px; }
  .actbl td:last-child{ padding-bottom:15px; }
}
.acnote{ display:flex; gap:14px; padding:16px 18px; border-radius:20px; background:#fff; border:1px solid var(--line); }
.acnote__ic{ flex:none; width:42px; height:42px; border-radius:14px; background:var(--icon-soft); color:var(--cta); display:grid; place-items:center; }
.acnote b{ display:block; font-size:14.5px; color:var(--ink); margin-bottom:4px; }
.acnote p{ font-size:13px; line-height:1.6; color:var(--ink-3); }
.acnote--sm{ align-items:center; font-size:13px; color:var(--ink-3); }
.acnote--sm svg{ flex:none; color:var(--icon); }

/* documents */
.acdoc{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.acdoc__i{ display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line); border-radius:20px; background:#fff; }
.acdoc__ic{ flex:none; width:42px; height:42px; border-radius:14px; background:var(--icon-soft); color:var(--cta); display:grid; place-items:center; }
.acdoc__t{ flex:1; display:flex; flex-direction:column; min-width:0; font-size:12.5px; color:var(--ink-3); }
.acdoc__t b{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; font-size:14.5px; color:var(--ink); }
.acdoc__new{ padding:3px 9px; border-radius:999px; background:var(--icon-soft); color:var(--cta); font-size:10.5px; font-style:normal; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }

/* saved tours */
.acsv__g{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
@media (max-width:900px){ .acsv__g{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .acsv__g{ grid-template-columns:1fr; } }
.acsv{ display:flex; flex-direction:column; border-radius:22px; background:#fff; border:1px solid var(--line); overflow:hidden; }
.acsv__img{ display:block; height:150px; background:var(--ph); }
.acsv__img img{ width:100%; height:100%; object-fit:cover; }
.acsv__b{ padding:15px 16px 17px; display:flex; flex-direction:column; gap:9px; flex:1; }
.acsv h3{ font-size:15.5px; line-height:1.3; color:var(--ink); }
.acsv__p{ font-size:13px; font-weight:600; color:var(--cta); }
.acsv__act{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.acsv__rm{ display:grid; place-items:center; width:36px; height:36px; border:1.5px solid #DCE2EC; border-radius:999px; background:#fff; color:var(--ink-3); cursor:pointer; transition:border-color .16s ease, color .16s ease; }
.acsv__rm:hover{ border-color:var(--cta); color:var(--cta); }

/* information */
.acinf{ display:flex; flex-direction:column; gap:14px; }
.acinf__f{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.acinf__note{ display:inline-flex; align-items:center; gap:9px; font-size:13px; color:var(--ink-3); }
.acinf__note svg{ color:var(--green); flex:none; }
.acinf__msg{ font-size:13.5px; color:var(--ink-3); }
.acinf__msg.is-ok{ color:var(--green); }
.acinf__msg.is-err{ color:var(--cta); }

/* shared form fields */
.cf__g{ display:grid; gap:12px; }
.cf__g--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:560px){ .cf__g--2{ grid-template-columns:1fr; } }
.cf__f{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.cf__f label{ font-size:12.5px; font-weight:600; color:var(--ink-2); }
.cf__f input, .cf__f select, .cf__f textarea{ width:100%; min-height:46px; padding:0 13px; border-radius:13px; border:1.5px solid #CDD4E1; background:#fff; font:inherit; font-size:14.5px; color:var(--ink); }
.cf__f textarea{ min-height:0; padding:11px 13px; line-height:1.55; resize:vertical; border-radius:14px; }
.cf__f input:focus, .cf__f select:focus, .cf__f textarea:focus{ border-color:var(--cta); outline:none; box-shadow:0 0 0 3px rgba(200,70,31,.14); }
.cf__in{ display:flex; align-items:center; gap:8px; min-height:46px; padding:0 11px 0 13px; border-radius:13px; border:1.5px solid #CDD4E1; background:#fff; }
.cf__in:focus-within{ border-color:var(--cta); box-shadow:0 0 0 3px rgba(200,70,31,.14); }
.cf__in input{ flex:1 1 auto; width:auto; min-width:0; min-height:42px; border:0; padding:0; border-radius:0; }
.cf__in input:focus{ box-shadow:none; }
.cf__in select.cf__cc{ flex:0 0 auto; width:auto; min-width:0; min-height:40px; padding:0 4px 0 0; border:0; border-right:1px solid var(--line); border-radius:0; background:none; font:inherit; font-size:14.5px; font-weight:600; color:var(--ink); }

/* The bookings table has <th><span class="sr-only">Open</span></th> for the
   action column, but no sheet on this page ever defined .sr-only — so the word
   "Open" was simply visible in the header row. It is a screen-reader label;
   .sr in v2-pages.css does the same job for the V2 templates. */
.met-dash .sr-only, .acwrap .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; }

/* ── Account detail pages ─────────────────────────────────────────
   The booking detail reuses the landing dashboard's components, with
   three additions it needs and the tablist does not. */

/* The hero avatar holds a tour photograph here rather than an initial. */
.achd__av--photo{ background:var(--ph); box-shadow:0 0 0 4px var(--icon-soft); overflow:hidden; }
.achd__av--photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.achd__av--photo img[width][height]{ height:100%; }

/* The rail as links. The landing page builds it from <button> in a tablist;
   a detail page is a real URL, so the same rail is anchors. Only the anchor
   defaults differ — everything else is inherited from .acnav__b. */
.acnav__b--link{ text-decoration:none; }
.acnav__b--link:hover{ text-decoration:none; }
.acnav__b--out{ color:var(--ink-3); }
.acnav__b--out:hover{ color:var(--cta); }

/* Review form. The star buttons keep their .mbw-cd__star hook for the JS. */
.acrev__f{ display:flex; flex-direction:column; gap:8px; }
.acrev__stars{ display:flex; gap:4px; }
.acrev__star{ padding:2px; border:0; background:none; cursor:pointer; color:#D8DEE9; line-height:0; transition:color .14s ease, transform .14s ease; }
.acrev__star:hover{ transform:translateY(-1px); }
.acrev__star.is-on, .acrev__star.is-active{ color:var(--star); }
/* Outline until chosen, filled after — the JS toggles .is-on per star. */
.acrev__star svg{ display:block; fill:none; stroke:currentColor; }
.acrev__star.is-on svg{ fill:currentColor; }
.acrev__in{ width:100%; padding:11px 14px; border-radius:14px; border:1px solid var(--line); background:#fff; font:inherit; font-size:14px; color:var(--ink); }
.acrev__in:focus{ outline:none; border-color:var(--cta); box-shadow:0 0 0 3px rgba(200,70,31,.14); }
.acrev__in::placeholder{ color:var(--ink-3); }

/* ── Account detail pages: the stacking gap ───────────────────────
   .acmain carries no row gap of its own — on the landing dashboard that gap
   lives on .acpan, and a detail page must not emit .acpan (v2-account.js
   binds .acnav__b as a tablist and bails only because detail pages have
   none). So detail cards stacked flush, borders touching. Hidden .acpan
   panels are not flex items, so the landing tablist is unaffected. */
.acmain{ gap:clamp(14px,1.6vw,18px); }

/* A card's own heading. .aclab sets everything except font-family, which
   v2-pages' `h1,h2,h3` would otherwise render in the display serif. */
.accard h2.aclab{ font-family:var(--font-body); }

/* A row of actions inside a card. The nearest existing thing is .acnext__act,
   which belongs to the landing page's next-trip block. */
.acacts{ display:flex; gap:10px; flex-wrap:wrap; }

/* ── Preferences: choice tiles ────────────────────────────────────
   The previous generation's .mbw-opt__choice — a tile that is a link, with
   the chosen one unmistakable. Used for currency and for language. */
.acopt__g{ display:grid; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); gap:10px; }
.acopt{ display:flex; flex-direction:column; gap:3px; padding:14px 16px 15px; border-radius:16px; border:1.5px solid var(--line); background:var(--bg-2); text-decoration:none; transition:border-color .16s ease, background-color .16s ease, transform .16s ease; }
.acopt:hover{ border-color:var(--cta); background:#fff; transform:translateY(-2px); text-decoration:none; }
.acopt__k{ font-family:var(--font-display); font-size:18px; line-height:1.25; color:var(--ink); }
.acopt__s{ font-size:12.5px; color:var(--ink-3); }
.acopt.is-on{ border-color:var(--cta); background:var(--icon-soft); }
.acopt.is-on:hover{ background:var(--icon-soft); }
.acopt__t{ display:inline-flex; align-items:center; gap:6px; margin-top:7px; font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--cta); }
.acopt__t svg{ flex:none; }

/* A detail page's header card carries fewer figures than the landing
   dashboard's four. .achd__kpi is a hard 4-column grid, so three would leave
   an empty quarter. Restates both breakpoints, because the base rules live
   inside media queries a later single-class selector would out-rank. */
.achd__kpi--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:900px){ .achd__kpi--3{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:460px){ .achd__kpi--3{ grid-template-columns:1fr; } }

/* A quote has more states than a booking's paid/due: pending review (grey),
   being prepared (blue), payment pending (amber), deposit paid (green) and
   declined (red). .acpay__st shipped only green and amber. Both classes are
   needed in each selector so these still beat `.achd__sub span`. */
.acpay__st.is-info{ background:#E8EEF9; color:var(--blue); }
.acpay__st.is-flat{ background:var(--bg-2); color:var(--ink-3); }
.acpay__st.is-off{ background:#FBE9E7; color:#B3301B; }
/* ── Saved tours ───────────────────────────────────────────────────────────
   The grid behind the "Saved tour" section. Rows rather than photo cards: this
   is a list someone came to act on, so the tour name and the two actions carry
   the width and the photo is only there to make the row recognisable. The
   remove control is the same .met-fav button as the heart on the archive
   (met-saved-tours.php), so one script keeps every copy of a tour's state in
   step. */
.acsav{ display:grid; gap:12px; }
/* A class setting display beats the browser's own [hidden] rule, so the grid
   has to switch itself off — the same note as .bk__bal in v2-single.css. */
.acsav[hidden]{ display:none; }
.acsav__i{ display:grid; grid-template-columns:132px minmax(0,1fr); gap:16px; align-items:center;
  padding:12px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.acsav__img{ display:block; aspect-ratio:3/2; border-radius:12px; overflow:hidden; background:var(--ph); }
.acsav__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.acsav__b{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.acsav__b h3{ font-size:16px; line-height:1.3; font-weight:650; letter-spacing:-.01em; }
.acsav__b h3 a{ color:var(--ink); text-decoration:none; }
.acsav__b h3 a:hover{ color:var(--cta); }
.acsav__m{ display:flex; flex-wrap:wrap; gap:6px 16px; font-size:13px; color:var(--ink-3); }
.acsav__m strong{ color:var(--ink-2); font-weight:650; }
.acsav__a{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:2px; }

@media (max-width:560px){
  .acsav__i{ grid-template-columns:1fr; }
  .acsav__img{ aspect-ratio:16/9; }
  .acsav__a .btn, .acsav__a .met-fav{ flex:1 1 auto; justify-content:center; }
}