.form-acc {
border: 1.5px solid var(--line-pink-8);
border-radius: 16px;
margin: 0.3rem 0;
background: var(--surface-neutral-9, #fff);
overflow: hidden;
transition: border-color 0.15s ease;
}
.form-acc + .form-acc {
margin-top: 0.3rem;
}
.form-acc > summary {
border-radius: 0;
padding: 0.6rem 0.9rem;
font-weight: 700;
background: var(--surface-neutral-9, #fff);
color: var(--ink-pink-3);
display: flex;
align-items: center;
gap: 0.5rem;
}
.form-acc:not([open]) > summary:hover {
background: var(--surface-pink-9);
}
.form-acc[open] {
border-color: var(--line-pink-6);
}
.form-acc[open] > summary {
background: var(--line-pink-5-veil);
border-bottom: 1.5px solid var(--line-pink-7-veil);
}
.form-acc > summary:focus-visible {
outline: 2px solid var(--line-pink-4);
outline-offset: -2px;
}
.form-acc-t {
flex: 1 1 auto;
min-width: 0;
}
.form-acc-badge {
font-size: max(0.72rem, 12px);
font-weight: 700;
padding: 0.1rem 0.5rem;
border-radius: 999px;
background: var(--surface-green-9);
color: var(--ink-green-2);
white-space: nowrap;
}
.form-acc-body {
padding: 0.85rem 1rem 1rem;
}
.form-acc-body > :first-child {
margin-top: 0;
}
.form-acc-body > :has(.field-title, legend) ~ :has(.field-title, legend) {
margin-top: 0.85rem;
padding-top: 0.85rem;
border-top: 1.5px dashed var(--line-pink-8);
}
.form-acc-body .field-title {
display: flex;
align-items: center;
gap: 0.35rem;
margin: 0 0 0.5rem;
}
.form-acc-body .stack > .field-title {
margin-bottom: -0.5rem;
}
.form-acc.quiet > summary {
background: transparent;
color: var(--ink-neutral-4);
font-weight: 400;
}
.form-secs {
display: grid;
gap: 0.3rem;
}
.form-secs .form-acc {
margin: 0;
}
.form-secs-bar {
display: flex;
justify-content: flex-end;
margin-bottom: 0.2rem;
}
.form-acc-badge.espera {
background: var(--surface-amber-9);
color: var(--ink-amber-2);
}
.form-acc-badge.parte {
background: var(--line-pink-5-veil);
color: var(--ink-pink-3);
}
.arrival-row {
display: grid;
gap: 0.6rem;
}
.fill-later-list .form-acc-badge {
background: var(--surface-amber-9);
color: var(--ink-amber-2);
}
.fill-later-list .form-acc-body.fill-later {
border: 0;
padding: 0.6rem 0.85rem 0.75rem;
}
.form-acc-body > .card {
border: 0;
padding: 0;
background: none;
box-shadow: none;
margin: 0;
}
.form-acc-body > .card > h2,
.form-acc-body > .card > .section-title > h2 {
display: none;
}
.form-acc-badge.pronta {
background: var(--surface-green-9);
color: var(--ink-green-2);
}
.fill-later-list .form-acc-t small {
display: block;
font-size: 0.78rem;
font-weight: 400;
color: var(--ink-neutral-4);
margin-top: 2px;
}
.fill-later-list .fill-done {
margin-top: 0.6rem;
}
