/* FIF Academy accounts, learning record and competency check booking (r8 accounts lane, 13 Nov 2026).
   Option 13, inside .ac (tokens from academy.css). Yellow only for actions. 44px+ tap targets. Error red #b00020 on #fff 6.6:1. */
.ac{--bad:#b00020}
.ac [hidden]{display:none!important}
/* account strip */
.acx-bar-l{display:flex;flex-wrap:wrap;gap:4px 14px;margin-left:auto}
.ac-demo [data-ac-learner]+.acx-bar-l{margin-left:0}
.acx-bar-l a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink);text-underline-offset:3px}
.acx-mode{display:inline-block;font:700 13px/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;background:var(--bg2);border:1px solid var(--line2);border-radius:999px;padding:8px 14px;margin:0 0 8px}
.acx-flash:empty,.acx-msg:empty{display:none}
.acx-flash,.acx-msg{font:600 15.5px/1.45 var(--sans);background:var(--bg2);border-left:4px solid var(--ink);border-radius:0 10px 10px 0;padding:10px 14px;margin:8px 0 0}
.acx-flash.bad,.acx-msg.bad{border-color:var(--bad);color:var(--bad)}
/* layout */
.acx-split{display:grid;gap:clamp(24px,4vw,48px);padding-top:clamp(20px,3vw,32px);align-items:start}
@media (min-width:960px){.acx-split{grid-template-columns:minmax(0,1fr) 26rem}.acx-side{position:sticky;top:84px}}
.acx-panel{background:var(--bg2);border-radius:var(--r2);box-shadow:var(--sh);padding:clamp(20px,3.4vw,36px)}
.acx-panel>h2{font-size:clamp(24px,1rem + 1.4vw,34px)}
.acx-side{display:grid;gap:14px}
.acx-side-h{font:800 clamp(20px,1rem + .6vw,24px)/1.15 var(--sans)!important;letter-spacing:-.015em;margin:0}
.acx-fig{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:16/9;background:var(--bg3)}
.acx-fig img{width:100%;height:100%;object-fit:cover;display:block}
.acx-ticks,.acx-steps{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.acx-ticks li,.acx-steps li{background:var(--bg2);border-radius:12px;padding:12px 14px 12px 44px;position:relative;font-size:16px}
.acx-ticks li::before{content:"";position:absolute;left:16px;top:17px;width:12px;height:7px;border-left:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(-45deg)}
.acx-steps{counter-reset:s}
.acx-steps li::before{counter-increment:s;content:counter(s);position:absolute;left:10px;top:11px;width:26px;height:26px;border-radius:50%;background:var(--y);color:#000;font:800 14px/26px var(--sans);text-align:center}
.acx-small{font:500 14.5px/1.5 var(--sans);color:var(--ink2)}
/* forms */
.acx-form{display:grid;gap:4px}
.acx-f{margin:14px 0 0;padding:0;border:0;min-width:0}
.acx-f>label,.acx-f>legend,.acx-sub{display:block;font:700 16px/1.35 var(--sans);margin:0 0 8px;padding:0}
.acx-f label span,.acx-f legend span,.acx-sub span{font-weight:500;color:var(--ink3)}
.acx-sub{margin-top:14px}
.acx-hint{font:500 14.5px/1.45 var(--sans);color:var(--ink3);margin:-2px 0 8px}
.acx-form input:not([type=checkbox]):not([type=radio]),.acx-form select,.acx-form textarea{width:100%;max-width:40rem;background:var(--bg2);border:1.5px solid var(--line2);border-radius:12px;color:var(--ink);padding:12px 14px;font:400 16px/1.45 var(--sans);min-height:48px}
.acx-form input:focus,.acx-form select:focus,.acx-form textarea:focus{border-color:var(--ink)}
.acx-form [aria-invalid=true]{border-color:var(--bad)!important;outline-color:var(--bad)}
.acx-tick{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--bg);max-width:40rem;flex-wrap:wrap}
.acx-tick input{width:22px;height:22px;accent-color:var(--ink);flex:none;margin:1px 0 0}
.acx-tick label{flex:1 1 0;min-width:0;font:500 16px/1.4 var(--sans);margin:0;cursor:pointer}
.acx-tick label span{color:var(--ink3);font-weight:500}
.acx-tick .acx-err{flex-basis:100%}
.acx-err{color:var(--bad);font:700 14.5px/1.4 var(--sans);margin:6px 0 0}
.acx-err::before{content:"! ";}
.acx-errs{border:2px solid var(--bad);border-radius:12px;padding:14px 18px;background:#fff}
.acx-errs h3{color:var(--bad)!important;font-size:18px!important;margin:0 0 6px}
.acx-errs ul{margin:0;padding-left:20px}
.acx-errs a{color:var(--bad);font-weight:700}
.acx-chipset{display:flex;flex-wrap:wrap;gap:8px}
.acx-chip{position:relative;display:inline-flex}
.acx-chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.acx-chip span{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border-radius:999px;border:1.5px solid var(--line2);background:var(--bg2);font:600 14.5px/1.2 var(--sans);color:var(--ink)!important}
.acx-chip input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff!important}
.acx-chip input:checked+span::before{content:"✓ ";margin-right:4px}
.acx-chip input:focus-visible+span{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 7px var(--y)}
.acx-demo{background:var(--bg3);border-radius:var(--r);padding:16px 18px;margin:12px 0 0;border:1.5px dashed var(--line2)}
.acx-demo p{margin:0 0 8px}
.acx-signed{font:600 15px/1.45 var(--sans);background:var(--bg3);border-radius:10px;padding:10px 14px;margin:0}
.acx-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.acx-row2{display:grid;gap:0 16px}
@media (min-width:640px){.acx-row2{grid-template-columns:1fr 1fr}}
/* booking: route cards and dates */
.acx-routes{display:grid;gap:10px}
@media (min-width:640px){.acx-routes{grid-template-columns:1fr 1fr}}
.acx-rt,.acx-dt{position:relative;display:flex;gap:12px;align-items:flex-start;padding:16px;border:1.5px solid var(--line2);border-radius:14px;background:var(--bg2);cursor:pointer;font-weight:400!important}
.acx-rt input,.acx-dt input{width:22px;height:22px;accent-color:var(--ink);flex:none;margin:2px 0 0}
.acx-rt strong{display:block;font:800 18px/1.2 var(--sans);margin-bottom:4px}
.acx-rt span span,.acx-dt span span{display:block;font:500 14.5px/1.45 var(--sans);color:var(--ink2)}
.acx-rt:has(input:checked),.acx-dt:has(input:checked){border-color:var(--ink);box-shadow:0 0 0 1.5px var(--ink)}
.acx-dates{display:grid;gap:8px;margin-bottom:8px}
@media (min-width:640px){.acx-dates{grid-template-columns:1fr 1fr}}
.acx-dt[hidden]{display:none}
.acx-none{font:600 15.5px/1.45 var(--sans);background:var(--bg3);border-radius:12px;padding:12px 16px;margin:0}
.acx-exp{background:var(--bg2);border-color:var(--ink)}
/* account dashboard */
.acx-sync{display:flex;gap:8px;align-items:center;font:600 14.5px/1.4 var(--sans);color:var(--ink2)}
.acx-dot{width:10px;height:10px;border-radius:50%;background:#1a7f37;flex:none}
.acx-cards{display:grid;gap:12px;margin:18px 0}
@media (min-width:720px){.acx-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.acx-card{position:relative;display:grid;gap:6px;align-content:start;padding:18px 18px 44px;border-radius:var(--r);background:var(--bg);text-decoration:none;border:1.5px solid var(--line);transition:border-color .16s,transform .16s}
.acx-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.acx-card strong{font:800 19px/1.2 var(--sans)}
.acx-card span:not(.ac-kick):not(.acx-go){font-size:15px;color:var(--ink2)}
.acx-card-y{background:var(--y);border-color:var(--y)}
.acx-card-y span:not(.ac-kick):not(.acx-go),.acx-card-y .ac-kick{color:#000!important}
.acx-go{position:absolute;right:16px;bottom:12px;font:800 22px/1 var(--sans)}
.acx-two{display:grid;gap:16px}
@media (min-width:820px){.acx-two{grid-template-columns:1fr 1fr}}
.acx-two .ac-box{background:var(--bg);box-shadow:none;border:1px solid var(--line)}
.acx-dl{display:grid;gap:0;margin:0 0 8px}
.acx-dl>div{display:grid;grid-template-columns:9rem minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.acx-dl dt{font:700 14px/1.4 var(--sans);color:var(--ink3)}
.acx-dl dd{margin:0;overflow-wrap:anywhere}
.acx-sum{background:var(--bg2);border-radius:var(--r);padding:6px 20px;box-shadow:var(--sh);max-width:46rem}
.acx-del{margin-top:16px;border-top:1px solid var(--line);padding-top:8px}
.acx-del summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center;color:var(--bad)}
/* record page */
.acx-who{display:flex;flex-wrap:wrap;gap:8px 28px;margin:0 0 8px}
.acx-who dt{font:700 12.5px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.acx-who dd{margin:2px 0 0;font:700 17px/1.35 var(--sans)}
.acx-next{margin-top:clamp(24px,4vw,40px)}
.acx-next-in{display:grid;gap:12px 32px;align-items:center;background:var(--ink);color:#fff;border-radius:var(--r2);padding:clamp(20px,3.4vw,36px)}
.acx-next-in h2,.acx-next-in p,.acx-next-in .ac-kick{color:#fff!important}
.acx-next-in .ac-btn.o{background:transparent;border-color:#fff;color:#fff}
.acx-next-in .ac-btn.o:hover{background:#fff;color:#000}
@media (min-width:960px){.acx-next-in{grid-template-columns:minmax(0,1fr) auto}}
.acx-rcs{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:760px){.acx-rcs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1180px){.acx-rcs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.acx-rc{background:var(--bg2);border-radius:var(--r);box-shadow:var(--sh);padding:18px 20px;display:grid;gap:8px;max-width:none}
.acx-rc.ok{box-shadow:0 0 0 2px var(--ink),var(--sh)}
.acx-rc h3{margin:2px 0 0}
.acx-rc h3 a{text-decoration:none}
.acx-rc h3 a:hover{text-decoration:underline}
.acx-rc-s{margin:0}
.acx-pill{display:inline-block;font:700 13px/1.2 var(--sans);padding:6px 11px;border-radius:999px;background:var(--bg3);color:var(--ink);margin:0}
.acx-pill.ok{background:var(--ink);color:#fff}
.acx-meter{height:6px;background:var(--line);border-radius:3px;overflow:hidden}
.acx-meter i{display:block;height:100%;background:var(--ink)}
.acx-rc-d{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin:4px 0 0}
.acx-rc-d dt{font:700 12px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.acx-rc-d dd{margin:2px 0 0;font:600 14.5px/1.35 var(--sans);overflow-wrap:anywhere}
.acx-certs{display:grid;gap:12px}
.acx-id{font:700 15px/1.3 var(--sans);letter-spacing:.04em}
.acx-bk{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:760px){.acx-bk{grid-template-columns:repeat(2,minmax(0,1fr))}}
.acx-bk li{background:var(--bg2);border-radius:var(--r);box-shadow:var(--sh);padding:18px 20px;max-width:none}
@media print{
  .acx-bar-l,.acx-next,.acx-side{display:none!important}
  .acx-rc,.acx-bk li,.ac-vcard{box-shadow:none!important;border:1px solid #999;break-inside:avoid}
}
@media (prefers-reduced-motion:reduce){.acx-card:hover{transform:none}}
.acx-two .acx-dl>div{grid-template-columns:1fr;gap:2px}
.acx-rcs+.acx-small{margin-top:16px}
/* keep the preview strip to one row on desktop: the note wraps inside itself instead of pushing the links down */
@media (min-width:900px){.ac-demo .ac-w{flex-wrap:nowrap}.ac-demo .ac-w>b+span{flex:1 1 auto;min-width:0}.ac-demo .ac-w>*:not(b+span){flex:none}}
