/* Fluxos guiados: menos controles simultâneos, detalhes sob demanda. */

.material-editor-stack {
    width: min(72rem, calc(100% - 2rem));
    gap: 0.7rem;
}

.material-editor-step {
    display: block;
    padding: 0;
    overflow: clip;
}

.material-editor-step > summary,
.guided-substep > summary,
.guided-student-options > summary,
.guided-inline-editor > summary {
    list-style: none;
}

.material-editor-step > summary::-webkit-details-marker,
.guided-substep > summary::-webkit-details-marker,
.guided-student-options > summary::-webkit-details-marker,
.guided-inline-editor > summary::-webkit-details-marker {
    display: none;
}

.material-editor-step-summary {
    position: relative;
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr) auto;
    min-height: 4.3rem;
    gap: 0.72rem;
    align-items: center;
    padding: 0.72rem 0.9rem;
    cursor: pointer;
}

.material-editor-step-summary::after {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, var(--gold), var(--teal), transparent 82%);
}

.material-editor-step-summary > span:nth-child(2) {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

.material-editor-step-summary strong { font-size: 1rem; }
.material-editor-step-summary small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.material-step-icon {
    display: grid;
    width: 2.1rem;
    height: 2.1rem;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--gold) 45%, var(--line));
    border-radius: 10px;
    color: var(--gold);
    background: color-mix(in srgb, var(--gold) 8%, transparent);
    font-size: 0.82rem;
    font-weight: 900;
}

.material-step-files { color: var(--teal); border-color: color-mix(in srgb, var(--teal) 45%, var(--line)); background: color-mix(in srgb, var(--teal) 8%, transparent); }
.material-step-content { color: var(--rose); border-color: color-mix(in srgb, var(--rose) 45%, var(--line)); background: color-mix(in srgb, var(--rose) 8%, transparent); }
.material-step-icon .paperclip-icon,
.material-step-icon .note-line-icon { width: 1rem; height: 1rem; margin: 0; }
.material-step-icon .note-line-icon { position: relative; display: inline-block; color: inherit; }

.material-step-state {
    color: var(--gold);
    font-size: 0.72rem;
    font-weight: 850;
}

.material-editor-step[open] .material-step-state { font-size: 0; }
.material-editor-step[open] .material-step-state::after { content: "Fechar"; font-size: 0.72rem; }
.material-editor-step-body { display: grid; gap: 0.8rem; padding: 0.85rem 0.9rem 0.95rem; border-top: 1px solid var(--line); }

.compact-material-form { grid-template-columns: minmax(0, 1.5fr) minmax(12rem, 0.7fr); align-items: end; }
.compact-material-form .guided-field-details,
.compact-material-form .material-form-actions { grid-column: 1 / -1; }

.guided-field-details,
.guided-substep,
.guided-student-options,
.guided-inline-editor {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--surface-strong) 70%, transparent);
}

.guided-field-details > summary,
.guided-substep > summary,
.guided-student-options > summary,
.guided-inline-editor > summary {
    display: flex;
    min-height: 2.9rem;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
    padding: 0.55rem 0.7rem;
    cursor: pointer;
}

.guided-field-details > summary { justify-content: flex-start; color: var(--text); font-size: 0.8rem; font-weight: 800; }
.guided-field-details > summary span,
.guided-substep > summary small,
.guided-student-options > summary small { color: var(--muted); font-size: 0.68rem; font-weight: 650; }
.guided-field-details > .field-stack,
.guided-substep > :not(summary),
.guided-student-options-body,
.guided-inline-editor > form { margin: 0 0.7rem 0.7rem; }

.guided-inline-editor-body { display: grid; gap: 0.65rem; margin: 0 0.7rem 0.7rem; }
.guided-general-note { margin: 0; }
.guided-general-note > summary { min-height: 3.25rem; }
.guided-general-note > summary > span:first-child { display: grid; min-width: 0; gap: 0.08rem; }
.guided-general-note > summary > span:first-child > small { overflow: hidden; color: var(--muted); font-size: 0.7rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.guided-general-note > summary strong small { color: var(--muted); font-size: 0.7rem; font-weight: 650; }
.study-empty-action { display: grid; gap: 0.15rem; padding: 0.7rem 0.8rem; border: 1px dashed var(--line-strong); border-radius: 10px; background: rgba(255, 255, 255, 0.018); }
.study-empty-action small { color: var(--muted); }

.material-content-intro {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
}

.material-content-intro > div:first-child { display: grid; gap: 0.12rem; }
.material-content-intro small { color: var(--muted); font-size: 0.72rem; }
.material-content-mode-switch { display: inline-flex; gap: 0.2rem; padding: 0.18rem; border: 1px solid var(--line); border-radius: 999px; }
.material-content-mode-switch button {
    min-height: 1.9rem;
    padding: 0.28rem 0.62rem;
    border: 0;
    border-radius: 999px;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 0.68rem;
    font-weight: 850;
}
.material-content-mode-switch button.is-active { color: var(--on-gold); background: var(--gold); }

.material-content-step[data-material-content-mode="normal"] .material-section-head > .drag-grip,
.material-content-step[data-material-content-mode="normal"] .material-section-head > .sort-accessible-actions,
.material-content-step[data-material-content-mode="normal"] .material-item-row > .drag-grip,
.material-content-step[data-material-content-mode="normal"] .material-item-row > .sort-accessible-actions,
.material-content-step[data-material-content-mode="normal"] .material-item-select,
.material-content-step[data-material-content-mode="normal"] .material-bulk-delete-toolbar,
.material-content-step[data-material-content-mode="organize"] .material-item-select,
.material-content-step[data-material-content-mode="organize"] .material-bulk-delete-toolbar,
.material-content-step[data-material-content-mode="organize"] .material-edit-actions,
.material-content-step[data-material-content-mode="organize"] .material-head-delete,
.material-content-step[data-material-content-mode="select"] .material-section-head > .drag-grip,
.material-content-step[data-material-content-mode="select"] .material-section-head > .sort-accessible-actions,
.material-content-step[data-material-content-mode="select"] .material-item-row > .drag-grip,
.material-content-step[data-material-content-mode="select"] .material-item-row > .sort-accessible-actions,
.material-content-step[data-material-content-mode="select"] .material-edit-actions,
.material-content-step[data-material-content-mode="select"] .material-head-delete {
    display: none !important;
}

.material-content-step[data-material-content-mode="select"] .material-item-select { display: inline-grid; }
.material-content-step[data-material-content-mode="select"] .material-bulk-delete-toolbar { display: flex; }
.material-content-step[data-material-content-mode="normal"] .material-section-head { grid-template-columns: 1.45rem minmax(0, 1fr) 3.18rem 1.65rem; }
.material-content-step[data-material-content-mode="normal"] .material-item-row { grid-template-columns: minmax(0, 1fr) 3.18rem 1.65rem; }
.material-content-step[data-material-content-mode="organize"] .material-section-head { grid-template-columns: 1.65rem 1.45rem minmax(0, 1fr) 3rem; }
.material-content-step[data-material-content-mode="organize"] .material-item-row { grid-template-columns: 1.35rem minmax(0, 1fr) 3rem; }
.material-content-step[data-material-content-mode="select"] .material-section-head { grid-template-columns: 1.45rem minmax(0, 1fr); }
.material-content-step[data-material-content-mode="select"] .material-item-row { grid-template-columns: 1rem minmax(0, 1fr); }
.material-content-empty { display: grid; gap: 0.14rem; padding: 0.9rem; color: var(--muted); text-align: center; }
.material-content-empty strong { color: var(--text); }

.material-content-add-shell { display: grid; gap: 0.5rem; }
.material-primary-add > summary { min-height: 2.8rem; color: var(--on-gold); background: var(--gold); font-weight: 900; }
.material-primary-add:not([open]) > summary:hover,
.material-primary-add:not([open]) > summary:focus-visible { color: var(--on-gold); background: var(--gold); }
.material-primary-add[open] > summary { color: var(--text); background: color-mix(in srgb, var(--gold) 12%, var(--surface)); }
.material-add-choice-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.5rem; padding: 0.55rem; }
.material-add-choice-grid > details { width: 100%; }
.material-add-choice-grid > details > summary { display: grid; width: 100%; gap: 0.08rem; align-content: center; min-height: 3.5rem; }
.material-add-choice-grid > details > summary small { color: var(--muted); font-size: 0.66rem; }

.material-area-filter input[data-live-filter-all="area"] { border: 0; background: transparent; }
.material-area-filter input[data-live-filter-all="area"]:checked { background: transparent; }
.material-area-filter input[data-live-filter-all="area"]:checked::after { color: var(--gold); font-size: 0.82rem; }

.weekly-unit-inline-editor > summary,
.study-plan-unit-editor > summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}
.weekly-unit-inline-editor > summary > span:first-child,
.study-plan-unit-editor > summary > span:first-child { display: grid; gap: 0.05rem; }
.study-unit-edit-label,
.study-plan-unit-editor > summary > span:last-child { color: var(--gold); font-size: 0.7rem; font-weight: 850; }
.weekly-unit-inline-help,
.guided-inline-help { margin: 0.55rem 0.62rem 0.25rem; color: var(--muted); font-size: 0.72rem; }
.weekly-unit-inline-save-hint { display: block; margin: 0.35rem 0.62rem 0.62rem; color: var(--muted); }

.guided-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.guided-check-grid > label {
    display: grid;
    grid-template-columns: 1rem minmax(0, 1fr);
    min-height: 2.35rem;
    gap: 0.42rem;
    align-items: center;
    padding: 0.32rem 0.45rem;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    cursor: pointer;
}
.guided-check-grid input { width: 0.95rem; height: 0.95rem; margin: 0; accent-color: var(--gold); }
.guided-check-grid label > span { min-width: 0; overflow: hidden; font-size: 0.74rem; text-overflow: ellipsis; white-space: nowrap; }
.guided-check-grid label > span:has(strong) { display: grid; gap: 0.03rem; }
.guided-check-grid strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.guided-check-grid small { color: var(--muted); font-size: 0.58rem; }

.guided-unit-sections { display: grid; gap: 0.4rem; }
.guided-unit-section { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; }
.guided-unit-section > summary { display: flex; justify-content: space-between; padding: 0.48rem 0.58rem; cursor: pointer; list-style: none; font-size: 0.75rem; font-weight: 850; }
.guided-unit-section > summary::-webkit-details-marker { display: none; }
.guided-unit-section > summary small { color: var(--muted); }
.study-plan-unit-editor { margin-top: 0.5rem; }

.student-page .student-next-lesson-panel {
    display: flex;
    grid-column: 1 / -1;
    order: 3;
    min-height: 0;
    gap: 0.8rem;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0.9rem;
}
.student-next-lesson-copy { display: grid; min-width: 0; gap: 0.12rem; }
.student-next-lesson-copy > strong { font-size: clamp(1rem, 2.4vw, 1.25rem); }
.student-next-lesson-copy > small { color: var(--muted); }
.student-next-lesson-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-end; }
.student-home-page .daily-tip-card { position: relative; right: auto; bottom: auto; z-index: 1; grid-column: 1 / -1; order: 4; width: 100%; max-width: none; min-height: 0; box-shadow: none; }
.student-home-page .daily-tip-card::after { display: none; }
.student-home-page .student-side-stack {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    order: 5;
}

.student-calendar-action-grid > .inline-details { min-height: 0; padding: 0; overflow: hidden; }
.student-calendar-action-grid > .inline-details:not([open]) { min-height: 0; }
.student-calendar-action-grid > .inline-details:not([open]) > summary,
.student-calendar-action-grid > .inline-details > summary { display: flex; min-height: 3.4rem; gap: 0.55rem; align-items: center; padding: 0.65rem 0.78rem; }
.student-calendar-action-grid > .inline-details > summary .nav-icon { width: 1.05rem; height: 1.05rem; color: var(--gold); }
.student-calendar-action-grid > .inline-details > :not(summary) { margin-inline: 0.78rem; }
.student-calendar-action-grid > .inline-details > :last-child { margin-bottom: 0.78rem; }
.student-upcoming-lessons { display: grid; gap: 0.6rem; }
.student-upcoming-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem; }
.student-upcoming-list article { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.65rem; align-items: center; padding: 0.58rem 0.65rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,0.018); }
.student-upcoming-list time { display: grid; min-width: 2.8rem; color: var(--gold); text-align: center; }
.student-upcoming-list time strong { font-size: 0.86rem; }
.student-upcoming-list time span,
.student-upcoming-list article > div { display: grid; }
.student-upcoming-list time span,
.student-upcoming-list article small { color: var(--muted); font-size: 0.68rem; }

.new-material-fields { gap: 0.55rem; }
.guided-substep { display: block; padding: 0; }
.guided-substep > summary > span:first-child,
.guided-student-options > summary > span:first-child { display: grid; gap: 0.05rem; }
.guided-substep > summary > span:last-child,
.guided-student-options > summary > span:last-child { color: var(--gold); font-size: 0.7rem; font-weight: 850; }
.guided-student-options-body { display: grid; gap: 0.65rem; }

/* Home: quatro decisões rápidas e duas prévias sob demanda. */
.home-inside-section { padding-block: clamp(2.2rem, 6vw, 4.6rem); }
.home-demo-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.72rem; margin-top: 1.15rem; }
.home-demo-choice {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.home-demo-choice > summary {
    display: grid;
    grid-template-columns: 2.2rem minmax(0, 1fr) auto;
    min-height: 5.2rem;
    gap: 0.7rem;
    align-items: center;
    padding: 0.75rem 0.85rem;
    cursor: pointer;
    list-style: none;
}
.home-demo-choice > summary::-webkit-details-marker { display: none; }
.home-demo-choice > summary > .nav-icon { width: 1.35rem; height: 1.35rem; color: var(--teal); }
.home-demo-choice-finance > summary > .nav-icon { color: var(--green); }
.home-demo-choice > summary > span:nth-child(2) { display: grid; min-width: 0; gap: 0.05rem; }
.home-demo-choice > summary small { color: var(--gold); font-size: 0.6rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.home-demo-choice > summary strong { font-size: 1rem; }
.home-demo-choice > summary b { color: var(--muted); font-size: 0.7rem; font-weight: 650; }
.home-demo-choice > summary > span:last-child { color: var(--gold); font-size: 1.35rem; transition: transform 160ms ease; }
.home-demo-choice[open] > summary > span:last-child { transform: rotate(90deg); }
.home-demo-choice-body { display: grid; gap: 0.45rem; padding: 0 0.7rem 0.7rem; animation: home-demo-reveal 180ms ease-out both; }
.home-demo-data-label { color: var(--muted); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.04em; text-align: right; text-transform: uppercase; }
.home-demo-choice .home-material-demo { width: 100%; margin: 0; }
.home-demo-choice .home-demo-heading h3 { margin: 0; font-size: clamp(1rem, 2.2vw, 1.25rem); }
.home-demo-choice .home-demo-heading p { margin: 0.1rem 0 0; }
.home-demo-choice .home-finance-preview { width: 100%; }

.home-audience-pitch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.72rem; margin-top: 0.72rem; }
.home-audience-copy { display: grid; gap: 0.55rem; align-content: start; padding: 0.9rem; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface-strong) 70%, transparent); }
.home-audience-copy > strong { max-width: 34rem; font-size: clamp(0.95rem, 2vw, 1.15rem); line-height: 1.35; }
.home-pitch-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.home-pitch-chips span { padding: 0.22rem 0.45rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 0.65rem; }
.home-audience-copy .home-inline-actions { margin-top: 0.1rem; }

/* Aviso instalável: espaço real para texto e ações em qualquer largura. */
.pwa-install-panel {
    display: grid;
    grid-template-columns: 3rem minmax(12rem, 1fr) auto;
    width: min(32rem, calc(100vw - 2rem));
}
.pwa-install-panel .pwa-panel-actions { justify-content: flex-end; }

@media (max-width: 900px) {
    .guided-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-demo-choice-grid,
    .home-audience-pitch { grid-template-columns: 1fr; }
    .student-home-page .student-side-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .material-editor-stack { width: min(100% - 1rem, 72rem); }
    .material-editor-step-summary { grid-template-columns: 2rem minmax(0, 1fr) auto; min-height: 3.8rem; gap: 0.55rem; padding: 0.58rem 0.62rem; }
    .material-step-icon { width: 1.85rem; height: 1.85rem; border-radius: 8px; }
    .material-editor-step-body { padding: 0.65rem; }
    .compact-material-form { grid-template-columns: 1fr; }
    .compact-material-form .guided-field-details,
    .compact-material-form .material-form-actions { grid-column: 1; }
    .material-content-intro { align-items: stretch; flex-direction: column; }
    .material-content-mode-switch { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .material-add-choice-grid,
    .guided-check-grid { grid-template-columns: 1fr; }
    .home-inside-section { padding-block: 1.8rem; }
    .home-demo-choice > summary { min-height: 4.5rem; }
    .home-audience-copy { padding: 0.75rem; }
    .student-page .student-next-lesson-panel { align-items: stretch; flex-direction: column; }
    .student-next-lesson-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .student-next-lesson-actions .button { min-width: 0; }
    .student-upcoming-list { grid-template-columns: 1fr; }
    .student-home-page .student-side-stack { grid-template-columns: 1fr; }
    .student-home-page .week-row { grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-columns: auto; grid-auto-flow: row; gap: 0.2rem; overflow-x: visible; padding: 0.15rem 0; scroll-snap-type: none; }
    .student-home-page .day-pill { width: auto; min-width: 0; min-height: 3.8rem; padding: 0.35rem 0.05rem; font-size: 0.72rem; }
    .student-home-page .day-pill .day-icon { min-width: 1.2rem; height: 1.2rem; padding-inline: 0.16rem; font-size: 0.58rem; }
    .pwa-install-panel { grid-template-columns: 3rem minmax(0, 1fr); width: min(25rem, calc(100vw - 1.5rem)); }
    .pwa-install-panel .pwa-panel-actions { grid-column: 1 / -1; width: 100%; }
    .pwa-install-panel .pwa-panel-actions .button:first-child { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .home-demo-choice-body { animation: none; }
}
