/* Public passport: identity hero, colour-coded data sections, verification footer */
.public-page:has(.pp){max-width:1040px}
.pp{display:grid;gap:20px}
.pp .public-hero.pp-hero{margin-top:8px;padding:0;border:1px solid var(--border);border-top:1px solid var(--border);border-radius:18px;background:var(--surface);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);overflow:hidden;box-shadow:0 1px 3px #192b4510}
.pp .pp-hero-text{grid-template-columns:1fr}
.pp .pp-media{margin:0;display:grid;gap:8px;padding:16px;background:var(--surface-subtle);align-content:start}
.pp .pp-media img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:12px;border:1px solid var(--border)}
.pp .pp-media img+img{display:none}
.pp .pp-identity{padding:28px 28px 24px;display:grid;gap:14px;align-content:start;min-width:0}
.pp .pp-identity .eyebrow{color:var(--accent);letter-spacing:.08em}
.pp .pp-identity h1{margin:0;font-size:clamp(26px,3.4vw,34px);line-height:1.1;letter-spacing:-.6px;text-wrap:balance}
.pp-chips{display:flex;flex-wrap:wrap;gap:6px}
.pp-chip{font-size:12px;font-weight:500;border:1px solid var(--border);border-radius:999px;padding:3px 10px;background:var(--surface-subtle);color:var(--muted)}
.pp-chip.ok{background:var(--success-soft);border-color:transparent;color:var(--success)}
.pp .public-unit{margin:0}
.pp .public-facts{margin:0;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.pp .public-facts>div{background:var(--surface-subtle)}
/* Key facts carry the colour of their passport section */
.pp .pp-facts>div{position:relative;background:color-mix(in srgb,var(--sec) 9%,var(--surface));border-color:color-mix(in srgb,var(--sec) 26%,var(--border));padding-left:16px}
.pp .pp-facts>div::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--sec)}
.pp .pp-facts dt{color:color-mix(in srgb,var(--sec) 60%,var(--muted));font-weight:500}
.pp .pp-facts dd{color:color-mix(in srgb,var(--sec) 30%,var(--ink))}
.pp .pp-facts dd small{display:inline;font-size:12px;font-weight:500;color:var(--muted)}
.pp-actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}
.pp-actions .btn{text-decoration:none}
.pp .public-section-nav{margin:0;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(6px)}
.pp .public-section-nav a{display:inline-flex;align-items:center;gap:6px}
.pp-group{display:grid;gap:16px;scroll-margin-top:64px}
.pp-card{border:1px solid color-mix(in srgb,var(--sec,var(--accent)) 26%,var(--border));border-radius:16px;background:var(--surface);overflow:hidden;scroll-margin-top:64px}
.pp-card-head{padding:14px 20px;background:color-mix(in srgb,var(--sec,var(--accent)) 8%,var(--surface));border-bottom:1px solid color-mix(in srgb,var(--sec,var(--accent)) 18%,var(--border))}
.pp-card-head h2{margin:0;font-size:17px;display:flex;align-items:center;gap:9px;color:color-mix(in srgb,var(--sec,var(--accent)) 70%,var(--ink))}
.pp-card-head h2::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--sec,var(--accent))}
.pp-card-head p{margin:4px 0 0;font-size:12px;color:var(--muted);line-height:1.5}
.pp-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
.pp-fields>div{padding:12px 20px;border-bottom:1px solid var(--border);min-width:0}
.pp-fields>div:nth-child(odd):not(.wide){border-right:1px solid var(--border)}
.pp-fields>div.wide{grid-column:1/-1}
.pp-fields>div:last-child,.pp-fields>div:nth-last-child(2):nth-child(odd):not(.wide){border-bottom:0}
.pp-fields dt{font-size:12px;color:var(--muted);margin-bottom:3px}
.pp-fields dd{margin:0;font-weight:500;overflow-wrap:anywhere;white-space:pre-line;font-variant-numeric:tabular-nums}
.pp-fields dd a{color:var(--accent)}
.pp-fields .technical-fact h3{display:none}
.pp-fields .technical-fact{padding:0;border:0;background:none;box-shadow:none}
.pp-description{margin:0;padding:16px 20px;border-bottom:1px solid var(--border);color:var(--ink);font-size:14px;line-height:1.7}
.pp-body{padding:16px 20px;display:grid;gap:12px}
.pp-body p{margin:0}
.pp-verified{display:grid;gap:12px;padding:18px 20px;border-radius:16px;background:var(--surface-subtle);border:1px solid var(--border)}
.pp-verified h2{font-size:15px;margin:0 0 4px}
.pp-verified p{margin:0;font-size:13px;color:var(--muted)}
.pp-verified .public-data-links{margin:0}
.pp-disclaimer{font-size:12px!important}
.pp-safety{margin:0}
@media(max-width:860px){.pp .public-hero.pp-hero{grid-template-columns:1fr}.pp .pp-identity{padding:20px}}
@media(max-width:600px){.pp-fields{grid-template-columns:1fr}.pp-fields>div,.pp-fields>div:nth-child(odd):not(.wide){border-right:0}.pp-fields>div:nth-last-child(2):nth-child(odd):not(.wide){border-bottom:1px solid var(--border)}}
.pp .public-section-nav{align-items:center}
.pp .public-section-nav{flex-wrap:wrap;overflow-x:visible}
.pp .public-section-nav .pp-search{order:99;flex:1 0 100%;margin:6px 0 0;min-width:0;padding:8px 14px!important;border:1px solid var(--border);border-radius:999px;padding:6px 12px;font:inherit;font-size:12px;background:var(--surface);color:var(--ink)}

/* Rows are separated horizontally only, so wide and half-width values can mix without broken column rules */
.pp-fields{column-gap:32px;padding:0 20px}
.pp-fields>div,.pp-fields>div:nth-child(odd):not(.wide){padding:12px 0;border-right:0;border-bottom:1px solid var(--border)}
.pp-fields>div:last-child{border-bottom:0}
@media(max-width:600px){.pp-fields{padding:0 16px}}
@media(max-width:600px){.pp .public-facts{grid-template-columns:1fr 1fr}.pp .pp-media{padding:12px}}
/* Legal basis "?" next to public field labels; the note spans the field width */
.pp-fields>div,.pp .pp-facts>div{position:relative}
.pp-fields dt,.pp .pp-facts dt{display:flex;align-items:center;gap:6px}
.pp-fields .pd-help,.pp .pp-facts .pd-help{position:static}
.pp-fields .pd-help-body,.pp .pp-facts .pd-help-body{top:calc(100% - 4px);left:0;right:0;width:auto;max-width:360px;white-space:normal}
.pp .pp-facts .pd-help-body{left:0;right:auto;width:min(300px,80vw)}
.pp .pp-facts>div:nth-child(2n) .pd-help-body{left:auto;right:0}
/* Collapsible passport sections */
.pp-card[data-pp-section]>.pp-card-head{position:relative;cursor:pointer;padding-right:52px}
.pp-collapse{position:absolute;top:50%;right:14px;transform:translateY(-50%);width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.pp-collapse:hover{color:var(--ink);background:var(--surface-subtle)}
.pp-collapse:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pp-collapse svg{width:16px;height:16px;transition:transform .15s}
.pp-card.is-collapsed .pp-collapse svg{transform:rotate(-90deg)}
.pp-card.is-collapsed>:not(.pp-card-head){display:none!important}
.pp-card.is-collapsed>.pp-card-head{border-bottom:0}
.pp-card.is-collapsed>.pp-card-head p{display:none}
.pp-collapse-all{display:inline-flex;gap:2px;margin-left:auto}
.pp-collapse-all button{border:0;background:none;font:inherit;font-size:12px;color:var(--muted);padding:5px 8px;border-radius:6px;cursor:pointer;white-space:nowrap}
.pp-collapse-all button:hover{color:var(--accent);background:var(--surface-subtle)}
@media(prefers-reduced-motion:reduce){.pp-collapse svg{transition:none}}
.en-passport-find{display:grid;gap:10px}.en-passport-find input[type=search]{width:100%}
/* Public battery comparison */
.pp-compare-btn{display:inline-flex;align-items:center;gap:6px}.pp-compare-btn svg{width:15px;height:15px}
.pp-compare-dialog{border:1px solid var(--border);border-radius:14px;padding:0;width:min(520px,calc(100vw - 32px));background:var(--surface);color:var(--ink)}
.pp-compare-dialog::backdrop{background:rgb(15 23 42/.4)}
.pp-compare-form{padding:20px;display:grid;gap:10px}.pp-compare-form h2{margin:0;font-size:18px}.pp-compare-form p{margin:0;color:var(--muted);font-size:13px}
.pp-compare-search{width:100%;border:1px solid var(--border);border-radius:9px;padding:9px 12px;font:inherit;background:var(--surface);color:var(--ink)}
.pp-compare-options{list-style:none;margin:0;padding:0;max-height:46vh;overflow:auto;border:1px solid var(--border);border-radius:10px}
.pp-compare-options li+li{border-top:1px solid var(--border)}
.pp-compare-options label{display:flex;gap:10px;align-items:center;padding:9px 12px;cursor:pointer}
.pp-compare-options span{display:grid}.pp-compare-options small{color:var(--muted);font-size:12px}
.pp-compare-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.pp-compare-wrap{overflow-x:auto;margin:18px 0;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.pp-compare-table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px}
.pp-compare-table th,.pp-compare-table td{padding:11px 14px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.pp-compare-table thead th{vertical-align:bottom;background:var(--surface-subtle)}
.pp-compare-table thead a{display:grid;gap:3px;color:inherit;text-decoration:none}
.pp-compare-table thead img{width:64px;height:64px;object-fit:cover;border-radius:10px;margin-bottom:6px}
.pp-compare-table thead small,.pp-compare-table td small{color:var(--muted);font-weight:500}
.pp-compare-table tbody th{font-weight:500;color:var(--muted);width:30%}
.pp-compare-table tbody tr:last-child>*{border-bottom:0}
.pp-best{background:color-mix(in srgb,#1f8a5b 10%,transparent);font-weight:700;color:color-mix(in srgb,#1f8a5b 80%,var(--ink))}
.pp-compare .pp-compare-table th,.pp-compare .pp-compare-table td{text-align:left;text-transform:none;letter-spacing:0;font-size:14px}
.pp-compare .pp-compare-table tbody th{font-size:13px;font-weight:500;color:var(--muted);background:var(--surface)}
.pp-compare .pp-compare-table thead b{font-size:15px;color:var(--ink)}
.pp-compare .pp-compare-table thead small{font-size:12px}
/* WCAG 2.2 AA: contrast and target sizes on the public passport */
:root:not([data-theme=dark]) .pp-chip.ok{color:color-mix(in srgb,var(--success) 78%,#000)}
.pd-help summary{width:24px!important;height:24px!important;font-size:11px}
.pd-help-body a{display:inline-block;min-height:24px;line-height:24px}
.ux-public-feedback summary{min-height:24px;display:flex;align-items:center}
/* Section navigation stays in place only on the full-width public passport; in previews inside the
   application and on phones it scrolls away with the content. */
#main .public-section-nav,#dialog .public-section-nav,dialog .public-section-nav{position:static!important;backdrop-filter:none}
@media (max-width:760px){.public-section-nav{position:static!important;backdrop-filter:none}}
.passport-preview .public-section-nav{position:static!important}
