/* [IRIDIAN AI LAYER] CSS del bloc IaTabsV1 — familia ia*v1 (pestanyes, JS-free CSS-radio).
 * Tot scoped sota .iaLayer-iatabsv1. Sense CSS global, sense tocar CSS legacy.
 * Mecanisme: radios ocults (estat) + labels (for) + panells; regla :nth-of-type fins a maxItems(12).
 */
.iaLayer-iatabsv1 {
    /* [P7B.4 estàndard 2026-07-14] Escala canònica --ia-color-* (fallback = valor original). */
    --iatabs-accent: var(--ia-color-accent, #0071e3);
    --iatabs-ink: var(--ia-color-text, #1d1d1f);
    --iatabs-ink-2: var(--ia-color-text-soft, #6e6e73);
    --iatabs-hairline: var(--ia-color-border, #e3e3e8);
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 20px;
    font-family: var(--ial-font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
    color: var(--iatabs-ink);
}
.iaLayer-iatabsv1 .iatabs-title {
    margin: 0 0 6px;
    font-size: clamp(1.5rem, 3vw, 2rem);
    letter-spacing: -.02em;
    font-weight: 700;
}
.iaLayer-iatabsv1 .iatabs-intro {
    margin: 0 0 22px;
    color: var(--iatabs-ink-2);
    font-size: 1rem;
    line-height: 1.5;
}
.iaLayer-iatabsv1 .iatabs { position: relative; }
/* radios d'estat: ocults visualment però focusables (navegació amb fletxes = canvi de tab) */
.iaLayer-iatabsv1 .iatabs-radio {
    position: absolute;
    width: 1px; height: 1px;
    opacity: 0;
    pointer-events: none;
    margin: 0;
}
.iaLayer-iatabsv1 .iatabs-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    border-bottom: 2px solid var(--iatabs-hairline);
    margin-bottom: 18px;
}
.iaLayer-iatabsv1 .iatabs-tab {
    cursor: pointer;
    padding: 10px 18px;
    font-size: .95rem;
    font-weight: 600;
    color: var(--iatabs-ink-2);
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    user-select: none;
    transition: color .15s ease, border-color .15s ease;
}
.iaLayer-iatabsv1 .iatabs-tab:hover { color: var(--iatabs-ink); }
.iaLayer-iatabsv1 .iatabs-panel {
    display: none;
    line-height: 1.65;
    font-size: .97rem;
    color: var(--iatabs-ink);
}
.iaLayer-iatabsv1 .iatabs-panel > :first-child { margin-top: 0; }
.iaLayer-iatabsv1 .iatabs-panel > :last-child { margin-bottom: 0; }

/* --- estat actiu (radio:checked) → panell visible + label ressaltat. Fins a 12 pestanyes. --- */
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(1):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(1),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(2):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(2),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(3):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(3),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(4):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(4),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(5):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(5),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(6):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(6),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(7):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(7),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(8):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(8),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(9):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(9),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(10):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(10),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(11):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(11),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(12):checked ~ .iatabs-panels > .iatabs-panel:nth-of-type(12) {
    display: block;
}
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(1):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(1),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(2):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(2),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(3):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(3),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(4):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(4),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(5):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(5),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(6):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(6),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(7):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(7),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(8):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(8),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(9):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(9),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(10):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(10),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(11):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(11),
.iaLayer-iatabsv1 .iatabs-radio:nth-of-type(12):checked ~ .iatabs-nav > .iatabs-tab:nth-of-type(12) {
    color: var(--iatabs-accent);
    border-bottom-color: var(--iatabs-accent);
}
/* focus de teclat visible al label de la pestanya enfocada */
.iaLayer-iatabsv1 .iatabs-radio:focus-visible ~ .iatabs-nav > .iatabs-tab { outline: none; }
@media (max-width: 600px) {
    .iaLayer-iatabsv1 { padding: 28px 14px; }
    .iaLayer-iatabsv1 .iatabs-tab { padding: 9px 13px; font-size: .9rem; }
}