/**
 * inscricoes.css  v2 — drastic UX redesign
 *
 * Stylesheet for the school inscription flow.
 * Theme: gold #DEC26A | red #681919 | dark #3f0201
 */

/* ─── Custom Properties ─────────────────────────────────────────────────── */
:root {
    --ins-gold:       #DEC26A;
    --ins-gold-dim:   #c9ac55;
    --ins-gold-pale:  #fdf8ec;
    --ins-red:        #681919;
    --ins-red-dark:   #3f0201;
    --ins-red-pale:   #fef2f2;
    --ins-bg:         #ffffff;
    --ins-bg-raised:  #f8fafc;
    --ins-border:     #e5e7eb;
    --ins-text:       #1e1a16;
    --ins-text-muted: #6b7280;
    --ins-radius:     16px;
    --ins-radius-sm:  10px;
    --ins-shadow:     0 2px 16px rgba(0,0,0,.07), 0 1px 4px rgba(0,0,0,.04);
    --ins-shadow-lg:  0 8px 32px rgba(0,0,0,.1), 0 2px 8px rgba(0,0,0,.05);
}

/* ═══════════════════════════════════════════════════════════════════════════
   BREADCRUMB — cleaner
═══════════════════════════════════════════════════════════════════════════ */
.ins-breadcrumb-bar {
    background: #fff;
    border-bottom: 1px solid var(--ins-border);
}
.ins-breadcrumb-bar a {
    color: var(--ins-text-muted);
    text-decoration: none;
    transition: color .15s;
}
.ins-breadcrumb-bar a:hover { color: var(--ins-red); }

/* ═══════════════════════════════════════════════════════════════════════════
   HERO — stripped down, accent strip only
═══════════════════════════════════════════════════════════════════════════ */
.ins-hero {
    background: #fff;
    border-bottom: 1px solid var(--ins-border);
    position: relative;
}
.ins-hero::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ins-red) 0%, var(--ins-gold) 100%);
}
.ins-hero--minimal { padding-bottom: 1rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   STEPPER v2 — redesigned progress indicator
═══════════════════════════════════════════════════════════════════════════ */
.ins-stepper2 {
    margin-bottom: 1.5rem;
}

/* Top bar: "Step X of 5 · Name" + progress bar */
.ins-stepper2__topbar {
    background: #fff;
    border: 1px solid var(--ins-border);
    border-radius: var(--ins-radius) var(--ins-radius) 0 0;
    padding: .875rem 1.25rem .75rem;
}

.ins-stepper2__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .625rem;
}

.ins-stepper2__step-of {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--ins-text-muted);
}

.ins-stepper2__step-name {
    font-size: .8125rem;
    font-weight: 700;
    color: var(--ins-red);
}

.ins-stepper2__bar-wrap {
    width: 100%;
    height: 6px;
    background: #f0f0ef;
    border-radius: 99px;
    overflow: hidden;
}

.ins-stepper2__bar {
    height: 100%;
    background: linear-gradient(90deg, var(--ins-red) 0%, var(--ins-gold) 100%);
    border-radius: 99px;
    transition: width .5s cubic-bezier(.4,0,.2,1);
    min-width: 8px;
}

/* Step circles row */
.ins-stepper2__steps {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: .75rem 1.25rem .875rem;
    background: var(--ins-bg-raised);
    border: 1px solid var(--ins-border);
    border-top: none;
    border-radius: 0 0 var(--ins-radius) var(--ins-radius);
    gap: 0;
}

.ins-stepper2__item {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
}

/* Connector line between steps */
.ins-stepper2__connector {
    flex: 1;
    height: 2px;
    background: var(--ins-border);
    border-radius: 2px;
    transition: background .35s;
    min-width: 8px;
}
.ins-stepper2__connector.is-filled {
    background: var(--ins-gold-dim);
}

.ins-stepper2__node {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    gap: 5px;
}

.ins-stepper2__circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    border: 2px solid var(--ins-border);
    background: #fff;
    color: var(--ins-text-muted);
    transition: all .3s;
    flex-shrink: 0;
}

.ins-stepper2__item.is-done .ins-stepper2__circle {
    background: var(--ins-gold-pale);
    border-color: var(--ins-gold-dim);
    color: var(--ins-red);
}

.ins-stepper2__item.is-current .ins-stepper2__circle {
    background: var(--ins-red);
    border-color: var(--ins-red);
    color: #fff;
    box-shadow: 0 0 0 4px rgba(104,25,25,.15);
}

.ins-stepper2__item.is-pending .ins-stepper2__circle {
    opacity: .45;
}

.ins-stepper2__label {
    font-size: 9.5px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    letter-spacing: .01em;
    color: var(--ins-text-muted);
    max-width: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ins-stepper2__item.is-current  .ins-stepper2__label { color: var(--ins-red); font-weight: 800; }
.ins-stepper2__item.is-done     .ins-stepper2__label { color: var(--ins-gold-dim); }
.ins-stepper2__item.is-pending  .ins-stepper2__label { opacity: .45; }

/* Percentage badge */
.ins-stepper2__pct {
    font-size: .7rem;
    font-weight: 700;
    color: var(--ins-red);
    background: var(--ins-red-pale);
    padding: .2rem .6rem;
    border-radius: 99px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Auto-save notice */
.ins-stepper2__autosave {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin-top: .625rem;
    font-size: .7rem;
    color: #059669;
    font-weight: 600;
}
.ins-stepper2__autosave span {
    color: #6b7280;
    font-weight: 400;
}

/* Floating WhatsApp help button */
.ins-wa-help {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 999;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: #25d366;
    color: #fff !important;
    text-decoration: none !important;
    padding: .75rem 1.1rem .75rem .9rem;
    border-radius: 99px;
    box-shadow: 0 4px 18px rgba(37,211,102,.45);
    font-size: .8rem;
    font-weight: 700;
    transition: transform .2s, box-shadow .2s;
}
.ins-wa-help:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(37,211,102,.55);
}
.ins-wa-help__label {
    white-space: nowrap;
}
@media (max-width: 480px) {
    .ins-wa-help__label { display: none; }
    .ins-wa-help { padding: .85rem; border-radius: 50%; }
}

/* Mobile: hide step labels (icons stay) */
@media (max-width: 480px) {
    .ins-stepper2__label { display: none; }
    .ins-stepper2__node  { gap: 0; }
    .ins-stepper2__circle { width: 30px; height: 30px; font-size: 10px; }
    .ins-stepper2__steps { padding: .625rem 1rem .75rem; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PAGE LAYOUT — background + max-width
═══════════════════════════════════════════════════════════════════════════ */
.ins-page-bg {
    background: var(--ins-bg-raised);
    min-height: 60vh;
    padding-bottom: 4rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CARD — main form container
═══════════════════════════════════════════════════════════════════════════ */
.ins-card {
    background: #fff;
    border: 1px solid var(--ins-border);
    border-radius: var(--ins-radius);
    box-shadow: var(--ins-shadow);
    overflow: visible;
}

.ins-card__header {
    padding: 1.5rem 1.75rem 1.25rem;
    border-bottom: 1px solid var(--ins-border);
    background: linear-gradient(to right, #fff 60%, var(--ins-gold-pale) 100%);
    border-radius: var(--ins-radius) var(--ins-radius) 0 0;
}

.ins-card__title {
    font-size: 1.125rem;
    font-weight: 800;
    color: var(--ins-red-dark);
    display: flex;
    align-items: center;
    gap: .625rem;
}

.ins-card__title i {
    width: 2rem;
    height: 2rem;
    background: var(--ins-red);
    color: #fff;
    border-radius: .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .875rem;
    flex-shrink: 0;
}

.ins-card__subtitle {
    font-size: .8125rem;
    color: var(--ins-text-muted);
    margin-top: .3rem;
    line-height: 1.5;
}

.ins-card__body {
    padding: 1.75rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION DIVIDER — improved
═══════════════════════════════════════════════════════════════════════════ */
.ins-section-divider {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin: 2rem 0 1.25rem;
}
.ins-section-divider__line {
    flex: 1;
    height: 1px;
    background: var(--ins-border);
}
.ins-section-divider__label {
    font-size: .7rem;
    font-weight: 800;
    color: var(--ins-red);
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .07em;
    background: var(--ins-red-pale);
    padding: .25rem .75rem;
    border-radius: 99px;
    border: 1px solid #fecaca;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NAVIGATION FOOTER — prev/next buttons
═══════════════════════════════════════════════════════════════════════════ */
details[open] .details-chevron { transform: rotate(180deg); }

.ins-nav-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--ins-border);
    flex-wrap: wrap;
}

.ins-nav-footer__back {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .6875rem 1.25rem;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    background: #fff;
    color: var(--ins-text-muted);
    font-size: .875rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .2s, color .2s, background .2s;
}
.ins-nav-footer__back:hover {
    border-color: var(--ins-red);
    color: var(--ins-red);
    background: var(--ins-red-pale);
}

.ins-nav-footer__next {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .75rem 1.75rem;
    border-radius: var(--ins-radius-sm);
    background: var(--ins-red);
    color: #fff;
    font-size: .9375rem;
    font-weight: 700;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background .2s, transform .1s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(104,25,25,.3);
    flex: 1;
    justify-content: center;
    max-width: 320px;
}
.ins-nav-footer__next:hover {
    background: var(--ins-red-dark);
    box-shadow: 0 4px 12px rgba(63,2,1,.35);
}
.ins-nav-footer__next:active { transform: scale(.98); }
.ins-nav-footer__next:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
.ins-nav-footer__next--ghost {
    background: transparent;
    color: var(--ins-red);
    border: 1.5px solid var(--ins-red);
    box-shadow: none;
}
.ins-nav-footer__next--ghost:hover {
    background: var(--ins-red-pale);
    box-shadow: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   FORM FIELDS — enhanced
═══════════════════════════════════════════════════════════════════════════ */
.ins-field__label {
    display: block;
    font-size: .8rem;
    font-weight: 700;
    color: var(--ins-text);
    margin-bottom: .4rem;
    letter-spacing: .01em;
}

.ins-field__input,
.ins-field__select,
.ins-field__textarea {
    display: block;
    width: 100%;
    padding: .6875rem .9375rem;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    font-size: .9375rem;
    color: var(--ins-text);
    background: #ffffff;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
    line-height: 1.4;
}

.ins-field__input:focus,
.ins-field__select:focus,
.ins-field__textarea:focus {
    border-color: var(--ins-gold);
    box-shadow: 0 0 0 3px rgba(222,194,106,.22);
}

.ins-field__input.is-invalid,
.ins-field__input--error,
.ins-field__select.is-invalid {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239,68,68,.15);
}

.ins-field__hint {
    font-size: .75rem;
    color: var(--ins-text-muted);
    margin-top: .3rem;
    line-height: 1.4;
}

/* Field group label */
.ins-field-group {
    display: flex;
    flex-direction: column;
    gap: .375rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   EMAIL STATUS / IDENT
═══════════════════════════════════════════════════════════════════════════ */
.ins-email-status {
    display: flex;
    align-items: center;
    gap: .375rem;
    font-size: .8125rem;
}
.ins-ident-state { transition: opacity .25s; }
.ins-ident-state.hidden { opacity: 0; height: 0; overflow: hidden; }

/* ═══════════════════════════════════════════════════════════════════════════
   SEARCHABLE SELECT
═══════════════════════════════════════════════════════════════════════════ */
.ins-ss { position: relative; user-select: none; }

.ins-ss-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: .6875rem .9375rem;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    background: #ffffff;
    cursor: pointer;
    font-size: .9375rem;
    color: var(--ins-text);
    transition: border-color .2s, box-shadow .2s;
}
.ins-ss-trigger:focus,
.ins-ss.is-open .ins-ss-trigger {
    border-color: var(--ins-gold);
    box-shadow: 0 0 0 3px rgba(222,194,106,.22);
    outline: none;
}
.ins-ss-trigger.is-invalid {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239,68,68,.15);
}
.ins-ss-disabled .ins-ss-trigger {
    background: var(--ins-bg-raised);
    cursor: not-allowed;
    opacity: .65;
}
.ins-ss-label { flex: 1; text-align: left; }
.ins-ss-label--placeholder { color: var(--ins-text-muted); }
.ins-ss-caret { flex-shrink: 0; font-size: .75rem; color: var(--ins-text-muted); transition: transform .2s; }
.ins-ss.is-open .ins-ss-caret { transform: rotate(180deg); }

.ins-ss-dropdown {
    position: absolute;
    z-index: 100;
    top: calc(100% + 4px);
    left: 0; right: 0;
    background: #ffffff;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    box-shadow: var(--ins-shadow-lg);
    overflow: hidden;
}
.ins-ss-search { padding: .5rem; border-bottom: 1px solid var(--ins-border); }
.ins-ss-search input {
    width: 100%;
    padding: .375rem .625rem;
    border: 1px solid var(--ins-border);
    border-radius: 6px;
    font-size: .8125rem;
    outline: none;
}
.ins-ss-search input:focus {
    border-color: var(--ins-gold);
    box-shadow: 0 0 0 2px rgba(222,194,106,.2);
}
.ins-ss-options { list-style: none; margin: 0; padding: 0; max-height: 200px; overflow-y: auto; }
.ins-ss-option { padding: .5rem .9375rem; font-size: .875rem; cursor: pointer; transition: background .15s; }
.ins-ss-option:hover,
.ins-ss-option.is-active { background: rgba(104,25,25,.05); color: var(--ins-red); }

/* ═══════════════════════════════════════════════════════════════════════════
   NOTICES
═══════════════════════════════════════════════════════════════════════════ */
.ins-notice {
    border-radius: var(--ins-radius-sm);
    padding: .875rem 1rem;
    display: flex;
    align-items: flex-start;
    gap: .625rem;
    font-size: .8125rem;
    line-height: 1.5;
}
.ins-notice.hidden { display: none !important; }
.ins-notice--info   { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; }
.ins-notice--warn   { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; }
.ins-notice--escola { background: #fdf2f8; border: 1px solid #f9a8d4; color: #9d174d; }
.ins-notice--danger { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }
.ins-notice--success { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }

/* ═══════════════════════════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════════════════════════ */
.ins-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    padding: .875rem 1.5rem;
    border-radius: var(--ins-radius-sm);
    background: var(--ins-red);
    color: #ffffff;
    font-size: .9375rem;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background .2s, transform .1s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(104,25,25,.25);
}
.ins-btn-primary:hover { background: var(--ins-red-dark); box-shadow: 0 4px 14px rgba(63,2,1,.3); }
.ins-btn-primary:active { transform: scale(.99); }
.ins-btn-primary:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }

.ins-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    padding: .75rem 1.5rem;
    border-radius: var(--ins-radius-sm);
    background: #ffffff;
    border: 1.5px solid var(--ins-border);
    color: var(--ins-text-muted);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .2s, color .2s, background .2s;
}
.ins-btn-secondary:hover { border-color: var(--ins-red); color: var(--ins-red); background: var(--ins-red-pale); }

/* ═══════════════════════════════════════════════════════════════════════════
   STAFF ROWS
═══════════════════════════════════════════════════════════════════════════ */
.ins-staff-row {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .625rem .875rem;
    background: var(--ins-bg-raised);
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    transition: border-color .15s;
}
.ins-staff-row:focus-within { border-color: var(--ins-gold); }
.ins-staff-row__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: .625rem;
    font-weight: 800;
    flex-shrink: 0;
}
.ins-staff-row__badge--free { background: #dcfce7; color: #166534; }
.ins-staff-row__badge--paid { background: #fef3c7; color: #92400e; }
.ins-staff-row__input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: .875rem;
    color: var(--ins-text);
    padding: .25rem 0;
}
.ins-staff-row__input::placeholder { color: var(--ins-text-muted); }
.ins-staff-row__input--locked { color: #64748b; cursor: not-allowed; font-style: italic; opacity: .85; }

/* ═══════════════════════════════════════════════════════════════════════════
   SAVE TOAST
═══════════════════════════════════════════════════════════════════════════ */
.ins-toast {
    position: fixed;
    top: 1.25rem; right: 1.25rem;
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem 1rem;
    background: var(--ins-red);
    color: #fff;
    border-radius: 9999px;
    font-size: .8125rem;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(104,25,25,.35);
    transform: translateY(-.5rem);
    opacity: 0;
    transition: transform .25s, opacity .25s;
    pointer-events: none;
}
.ins-toast--visible { transform: translateY(0); opacity: 1; }

/* ═══════════════════════════════════════════════════════════════════════════
   DANCER ROWS (Elenco)
═══════════════════════════════════════════════════════════════════════════ */
.ins-dancer-row {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: 1rem;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: .875rem;
    transition: border-color .2s, box-shadow .2s;
}
.ins-dancer-row:focus-within {
    border-color: var(--ins-gold);
    box-shadow: 0 0 0 3px rgba(222,194,106,.15);
}
.ins-dancer-row__num {
    flex-shrink: 0;
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 50%;
    background: var(--ins-red);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .72rem;
    font-weight: 800;
    margin-top: .3rem;
}
.ins-dancer-row__fields {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.ins-dancer-row__top { position: relative; }
.ins-dancer-row__bottom {
    display: grid;
    grid-template-columns: 1.4fr 1.4fr .8fr;
    gap: .5rem;
}
.ins-dancer-row__contact {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: .5rem;
    margin-top: .5rem;
}
@media (max-width: 600px) {
    .ins-dancer-row__bottom { grid-template-columns: 1fr; }
    .ins-dancer-row__bottom .ins-dancer-cpf,
    .ins-dancer-row__bottom .ins-dancer-birth,
    .ins-dancer-row__bottom .ins-dancer-age { grid-column: 1 / -1; }
    .ins-dancer-row__contact { grid-template-columns: 1fr; }
}
.ins-dancer-remove {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: none;
    background: transparent;
    color: #cbd5e1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s, color .15s;
    margin-top: .2rem;
}
.ins-dancer-remove:hover { background: #fee2e2; color: #dc2626; }
.ins-dancer-age {
    background: #f8fafc;
    cursor: default;
    color: #64748b;
    font-size: .8rem;
}

/* ─── Dancer autocomplete ── */
.ins-dancer-ac-wrap { position: relative; }
.ins-dancer-ac {
    position: absolute;
    top: calc(100% + 4px);
    left: 0; right: 0;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: .625rem;
    box-shadow: 0 6px 18px rgba(0,0,0,.1);
    z-index: 200;
    overflow: hidden;
}
.ins-dancer-ac__item {
    padding: .5rem .875rem;
    cursor: pointer;
    font-size: .8125rem;
    transition: background .12s;
    display: flex;
    align-items: baseline;
    gap: .35rem;
    flex-wrap: wrap;
}
.ins-dancer-ac__item:hover { background: var(--ins-bg-raised); }
.ins-dancer-ac__name { font-weight: 600; color: #1e293b; }
.ins-dancer-ac__info { font-size: .7rem; color: #94a3b8; }

/* ═══════════════════════════════════════════════════════════════════════════
   CHOREOGRAPHY CARDS
═══════════════════════════════════════════════════════════════════════════ */
.ins-coreo-card {
    background: #fff;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius);
    box-shadow: var(--ins-shadow);
    transition: box-shadow .2s;
}
.ins-coreo-card:focus-within { box-shadow: 0 0 0 3px rgba(222,194,106,.2); }
.ins-coreo-card__header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .875rem 1.25rem;
    background: #fafafa;
    border-bottom: 1px solid var(--ins-border);
    border-radius: calc(var(--ins-radius) - 1px) calc(var(--ins-radius) - 1px) 0 0;
    cursor: pointer;
    user-select: none;
}
.ins-coreo-card__num-badge {
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 50%;
    background: var(--ins-red);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.ins-coreo-card__title {
    font-size: .9375rem;
    font-weight: 600;
    color: var(--ins-red-dark);
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ins-coreo-card__badges { display: flex; gap: .375rem; flex-shrink: 0; }
.ins-badge {
    display: inline-flex;
    align-items: center;
    padding: .15rem .55rem;
    border-radius: 9999px;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .02em;
}
.ins-badge--type { background: #fef3c7; color: #92400e; }
.ins-badge--cat  { background: #ede9fe; color: #5b21b6; }
.ins-coreo-card__body { padding: 1.25rem; }
.ins-coreo-card__actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    border-top: 1px solid var(--ins-border);
    padding-top: 1rem;
    margin-top: 1rem;
}

/* ─── Buttons (inline) ── */
.ins-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem 1.125rem;
    border-radius: 9999px;
    font-size: .8125rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: background .15s, opacity .15s;
}
.ins-btn--primary { background: var(--ins-red); color: #fff; }
.ins-btn--primary:hover { background: var(--ins-red-dark); }
.ins-btn--primary:disabled { opacity: .55; cursor: not-allowed; }
.ins-btn--danger { background: #ef4444; color: #fff; }
.ins-btn--danger:hover { background: #dc2626; }
.ins-btn--danger-ghost { background: transparent; color: #ef4444; border: 1px solid #fecaca; }
.ins-btn--danger-ghost:hover { background: #fef2f2; }
.ins-btn--ghost { background: transparent; color: #6b7280; border: 1px solid var(--ins-border); }
.ins-btn--ghost:hover { background: #f3f4f6; }

.ins-btn-adefinir {
    display: inline-flex;
    align-items: center;
    padding: .35rem .7rem;
    border-radius: 9999px;
    font-size: .72rem;
    font-weight: 600;
    color: var(--ins-red);
    border: 1.5px dashed var(--ins-red);
    background: transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s;
    flex-shrink: 0;
}
.ins-btn-adefinir:hover { background: var(--ins-red-pale); }

/* ─── Music source tabs ── */
.ins-co-music-source-tabs { display: flex; gap: .375rem; margin-bottom: .625rem; }
.ins-co-music-tab {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .35rem .85rem;
    border-radius: 9999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--ins-text-muted);
    background: transparent;
    border: 1.5px solid var(--ins-border);
    cursor: pointer;
    transition: all .15s;
    white-space: nowrap;
}
.ins-co-music-tab:hover { border-color: var(--ins-gold); color: var(--ins-red); }
.ins-co-music-tab.is-active { border-color: var(--ins-gold); background: var(--ins-gold); color: var(--ins-red-dark); }
.ins-co-music-tab.is-disabled { opacity: .38; cursor: not-allowed; pointer-events: none; background: var(--ins-bg-raised); border-color: var(--ins-border); color: var(--ins-text-muted); }
@media (max-width: 480px) {
    .ins-co-music-source-tabs { flex-wrap: wrap; }
    .ins-co-music-tab { flex: 1; justify-content: center; min-width: 0; }
}

/* ─── Music link row ── */
.ins-co-music-link-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    border: 1.5px solid var(--ins-border);
    border-radius: var(--ins-radius-sm);
    padding: 0 .75rem;
    background: #fff;
    transition: border-color .2s, box-shadow .2s;
}
.ins-co-music-link-row:focus-within { border-color: var(--ins-gold); box-shadow: 0 0 0 3px rgba(222,194,106,.18); }
.ins-co-music-link-icon { font-size: 1rem; flex-shrink: 0; color: var(--ins-text-muted); width: 1.25rem; text-align: center; }
.ins-co-music-link-input { flex: 1; border: none; outline: none; padding: .6rem 0; font-size: .9rem; background: transparent; color: var(--ins-text); min-width: 0; }
.ins-co-music-link-input::placeholder { color: var(--ins-text-muted); }
.ins-co-music-link-status { font-size: .75rem; margin-top: .35rem; min-height: 1rem; display: flex; align-items: center; gap: .3rem; }
.ins-co-music-link-status.ok  { color: #16a34a; font-weight: 600; }
.ins-co-music-link-status.err { color: #dc2626; }
.ins-co-music-link-status.info { color: #2563eb; }

/* ─── Tipo selector pills ── */
.ins-co-tipo-selector { display: flex; flex-direction: column; gap: .4rem; }
.ins-co-tipo-btns { display: flex; flex-wrap: wrap; gap: .375rem; }
.ins-co-tipo-opt { display: inline-flex; align-items: center; padding: .3rem .75rem; border-radius: 9999px; font-size: .78rem; font-weight: 600; color: #4b5563; border: 1.5px solid var(--ins-border); background: transparent; cursor: pointer; transition: all .15s; white-space: nowrap; }
.ins-co-tipo-opt:hover { border-color: var(--ins-gold); color: var(--ins-red); }
.ins-co-tipo-opt.is-active { border-color: var(--ins-gold); background: var(--ins-gold); color: var(--ins-red-dark); }

/* ─── "A Definir" dancer row variant ── */
.ins-co-dancer-row--adefinir { background: #fffbeb; border-color: #fde68a; }
.ins-co-dancer-age-badge--adefinir { background: #fde68a; color: #92400e; }

/* ─── Auto-info area ── */
.ins-co-auto-info { display: flex; flex-wrap: wrap; gap: .625rem; align-items: flex-start; }
.ins-co-tipo-wrap { display: flex; flex-direction: column; gap: .25rem; }

/* ─── Music upload ── */
.ins-co-music-wrap { display: flex; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.ins-co-music-upload-area {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: .25rem; min-width: 180px; min-height: 80px;
    border: 2px dashed var(--ins-border); border-radius: var(--ins-radius-sm);
    padding: .875rem 1rem; cursor: pointer;
    transition: border-color .15s, background .15s;
    background: #fafafa; flex: 1;
}
.ins-co-music-upload-area:hover { border-color: var(--ins-gold); background: var(--ins-gold-pale); }
.ins-co-music-upload-area--has-file { border-style: solid; border-color: var(--ins-gold); background: var(--ins-gold-pale); }
.ins-co-music-upload-area.is-disabled,
.ins-co-music-file-panel.is-disabled .ins-co-music-upload-area { opacity: .42; cursor: not-allowed; pointer-events: none; filter: grayscale(30%); }
.ins-co-music-placeholder { display: flex; flex-direction: column; align-items: center; gap: .1rem; }
.ins-co-music-file-info { display: flex; align-items: center; gap: .5rem; width: 100%; }
.ins-co-music-filename { font-size: .8rem; font-weight: 500; color: #374151; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ins-co-music-play-btn { flex-shrink: 0; width: 2rem; height: 2rem; border-radius: 50%; border: none; background: var(--ins-gold); color: var(--ins-red-dark); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, transform .1s; }
.ins-co-music-play-btn:hover { background: #c9ad5a; transform: scale(1.08); }
.ins-co-music-play-btn.is-playing { background: #1e293b; color: #fff; }
.ins-co-music-duration { display: flex; align-items: center; gap: .35rem; padding: .5rem .875rem; background: #fffdf0; border: 1px solid #f5e9b0; border-radius: var(--ins-radius-sm); font-size: .875rem; flex-shrink: 0; }

/* ─── Dancer rows inside a coreo card ── */
.ins-co-dancer-row {
    display: flex; align-items: center; gap: .5rem;
    padding: .5rem .75rem; background: #f9fafb;
    border: 1px solid var(--ins-border); border-radius: var(--ins-radius-sm);
    flex-wrap: wrap; min-width: 0;
}
@media (max-width: 480px) {
    .ins-co-dancer-row { flex-direction: column; align-items: flex-start; }
    .ins-co-dancer-row .ml-auto { margin-left: 0; width: 100%; }
    .ins-co-artistic-name { width: 100% !important; }
}
.ins-co-dancer-age-badge {
    display: inline-flex; align-items: center;
    padding: .1rem .45rem; border-radius: 9999px;
    background: var(--ins-gold); color: #3f0201;
    font-size: .65rem; font-weight: 700; white-space: nowrap; flex-shrink: 0;
}

/* ─── Auto fields chips ── */
.ins-co-auto-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .7rem; background: #f1f5f9; border-radius: 9999px; font-size: .78rem; }
.ins-co-auto-chip__label { color: #94a3b8; font-weight: 500; }

/* ─── Cenário radio pills ── */
.ins-co-cenario-opt { display: inline-flex; align-items: center; padding: .35rem .8rem; border: 1.5px solid var(--ins-border); border-radius: 9999px; font-size: .8rem; font-weight: 500; color: #4b5563; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.ins-co-cenario-opt:hover { border-color: var(--ins-gold); background: var(--ins-gold-pale); }
.ins-co-cenario-opt--active { border-color: var(--ins-gold); background: var(--ins-gold); color: #3f0201; }

/* ─── Empty state ── */
.ins-coreo-empty { display: flex; flex-direction: column; align-items: center; padding: 3rem 1rem; color: #9ca3af; }

/* ─── Deprecated classes kept for back-compat ── */
.ins-stepper { display: none !important; }
.ins-step-nav { display: none !important; }