.planner-page{display:grid;gap:18px}.planner-hero{display:flex;gap:18px;align-items:flex-start;justify-content:space-between}.planner-hero h1{margin:0 0 8px}.planner-hero p{max-width:820px}.planner-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,330px);gap:18px;align-items:start}.planner-main{display:grid;gap:16px}.planner-side{display:grid;gap:16px;position:sticky;top:86px}.planner-panel{border-left:4px solid var(--blue,#1457d9)}.planner-panel.teacher{border-left-color:#7c3aed}.planner-panel.curricular{border-left-color:#0f766e}.planner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.planner-grid>.full{grid-column:1/-1}.planner-step{display:inline-grid;place-items:center;width:28px;height:28px;border:1px solid currentColor;border-radius:999px;margin-right:7px;font-size:.86rem}.planner-readonly{padding:11px 12px;border:1px solid var(--line,#dfe3e8);background:#f6f8fb;border-radius:10px;min-height:44px}.planner-items{display:grid;gap:8px;max-height:420px;overflow:auto;padding:3px}.planner-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:10px;border:1px solid var(--line,#dfe3e8);border-radius:10px;background:#fff}.planner-item input{width:auto;margin-top:4px}.planner-item small{display:block;color:var(--muted,#667085);margin-top:4px}.planner-meta{font-size:.86rem;color:var(--muted,#667085);line-height:1.45}.planner-tag{display:inline-block;font-size:.75rem;border:1px solid #aab2bd;border-radius:999px;padding:2px 7px;margin-left:5px}.planner-policy{padding:10px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc}.planner-policy[data-status="CONFLICT"],.planner-policy[data-status="INCOMPLETE"]{border-color:#dc2626;background:#fff1f2}.planner-choice-group{display:grid;gap:8px}.planner-choice-group[hidden]{display:none}.planner-loading{opacity:.55;pointer-events:none}.planner-message{margin-bottom:12px}.planner-message .error{white-space:pre-line}.planner-list{display:grid;gap:10px}.planner-list-item{padding:12px;border:1px solid var(--line,#dfe3e8);border-radius:10px;background:#fff}.planner-list-item h3{margin:0 0 5px;font-size:1rem}.planner-list-item .actions{margin-top:10px;justify-content:flex-start;flex-wrap:wrap}.planner-source-list{display:grid;gap:7px;margin:0;padding:0;list-style:none}.planner-source-list li{padding:8px 0;border-bottom:1px solid var(--line,#dfe3e8)}.planner-field-policy-note{font-size:.86rem;color:var(--muted,#667085);margin-top:6px}.planner-required{font-weight:700;color:#7a2d21}.planner-recommended{font-weight:650}.planner-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.planner-checkbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.planner-checkbox{display:flex;gap:8px;align-items:flex-start;padding:9px;border:1px solid var(--line,#dfe3e8);border-radius:9px}.planner-checkbox input{width:auto;margin-top:3px}.planner-actions-sticky{display:flex;gap:10px;justify-content:flex-end;align-items:center;position:sticky;bottom:10px;padding:10px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border:1px solid var(--line,#dfe3e8);border-radius:12px;z-index:5}.planner-inline-note{padding:10px 12px;border-radius:9px;background:#f8fafc;border:1px solid #cbd5e1}.planner-inline-note.warning{background:#fff8e6;border-color:#d7b46a}.planner-inline-note.error{background:#fff1f2;border-color:#ef4444}.planner-inline-note.success{background:#ecfdf3;border-color:#65a30d}.planner-policy-summary{display:grid;gap:8px}.planner-policy-summary dt{font-weight:700}.planner-policy-summary dd{margin:0 0 6px}.planner-hidden{display:none!important}
@media(max-width:980px){.planner-layout{grid-template-columns:1fr}.planner-side{position:static}.planner-hero{display:block}}
@media(max-width:720px){.planner-grid,.planner-checkbox-grid{grid-template-columns:1fr}.planner-grid>.full{grid-column:auto}.planner-actions-sticky{position:static;flex-wrap:wrap}.planner-actions-sticky .btn{flex:1 1 180px}.planner-item{padding:9px}}

/* ==========================================================
   EMS RESPONSIVE V4.1
   El comportamiento se basa también en el ancho útil del
   planner para contemplar el menú lateral de Plusteca.
   ========================================================== */

.planner-page-ems{
    container-name:emsplanner;
    container-type:inline-size;
    min-width:0;
}

.planner-page-ems .planner-layout,
.planner-page-ems .planner-main,
.planner-page-ems .planner-side,
.planner-page-ems .planner-panel,
.planner-page-ems .planner-grid,
.planner-page-ems .planner-grid > *,
.planner-page-ems .planner-item,
.planner-page-ems .planner-item > span{
    min-width:0;
}

.planner-page-ems input:not([type="checkbox"]):not([type="radio"]),
.planner-page-ems select,
.planner-page-ems textarea{
    box-sizing:border-box;
    max-width:100%;
    width:100%;
}

.planner-page-ems .planner-item > span,
.planner-page-ems .planner-meta,
.planner-page-ems .planner-readonly,
.planner-page-ems .planner-field-policy-note{
    overflow-wrap:anywhere;
    word-break:normal;
}

@container emsplanner (max-width:1050px){
    .planner-page-ems .planner-layout{
        grid-template-columns:minmax(0,1fr);
    }

    .planner-page-ems .planner-side{
        position:static;
        top:auto;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .planner-page-ems .planner-hero{
        display:block;
    }

    .planner-page-ems .planner-hero > .actions{
        margin-top:14px;
        justify-content:flex-start;
    }

    .planner-page-ems .planner-actions-sticky{
        position:static;
        bottom:auto;
    }
}

@container emsplanner (max-width:760px){
    .planner-page-ems .planner-grid,
    .planner-page-ems .planner-checkbox-grid,
    .planner-page-ems .planner-side{
        grid-template-columns:minmax(0,1fr);
    }

    .planner-page-ems .planner-grid > .full{
        grid-column:auto;
    }

    .planner-page-ems .planner-items{
        max-height:none;
        overflow:visible;
        padding:0;
    }

    .planner-page-ems .planner-actions-sticky{
        flex-wrap:wrap;
        padding:8px;
    }

    .planner-page-ems .planner-actions-sticky .btn{
        flex:1 1 190px;
    }

    .planner-page-ems .planner-item{
        padding:10px;
    }
}

@container emsplanner (max-width:520px){
    .planner-page-ems{
        gap:14px;
    }

    .planner-page-ems .planner-main,
    .planner-page-ems .planner-side{
        gap:12px;
    }

    .planner-page-ems .planner-section-heading{
        align-items:flex-start;
    }

    .planner-page-ems .planner-actions-sticky{
        display:grid;
        grid-template-columns:minmax(0,1fr);
    }

    .planner-page-ems .planner-actions-sticky .btn{
        width:100%;
        min-width:0;
    }

    .planner-page-ems .planner-step{
        width:25px;
        height:25px;
    }
}

/* Fallback para navegadores sin container queries o layouts
   cuyo viewport ya sea reducido. */
@media(max-width:1180px){
    .planner-page-ems .planner-layout{
        grid-template-columns:minmax(0,1fr);
    }

    .planner-page-ems .planner-side{
        position:static;
        top:auto;
    }

    .planner-page-ems .planner-actions-sticky{
        position:static;
        bottom:auto;
    }
}

@media(max-width:760px){
    .planner-page-ems .planner-grid,
    .planner-page-ems .planner-checkbox-grid,
    .planner-page-ems .planner-side{
        grid-template-columns:minmax(0,1fr);
    }

    .planner-page-ems .planner-grid > .full{
        grid-column:auto;
    }

    .planner-page-ems .planner-items{
        max-height:none;
        overflow:visible;
    }
}


/* =====================================================================
   PLUSTECA_PLANNER_DENSITY_V1
   Densidad inteligente para EBI y EMS en escritorio.
   ===================================================================== */
@media(min-width:1081px){
    .planner-page{
        gap:12px;
    }

    .planner-hero{
        gap:12px;
        align-items:center;
    }

    .planner-hero h1{
        margin-bottom:4px;
        font-size:1.8rem;
        line-height:1.1;
    }

    .planner-hero p{
        margin:6px 0 0;
        max-width:900px;
        font-size:.9rem;
        line-height:1.42;
    }

    .planner-layout{
        grid-template-columns:minmax(0,1fr) minmax(240px,290px);
        gap:14px;
    }

    .planner-main,
    .planner-side{
        gap:12px;
    }

    .planner-side{
        top:74px;
    }

    .planner-grid{
        gap:10px 12px;
    }

    .planner-section-heading{
        gap:8px;
    }

    .planner-section-heading h2{
        margin-bottom:2px;
    }

    .planner-items{
        gap:6px;
        max-height:360px;
        padding:2px;
    }

    .planner-item{
        gap:8px;
        padding:8px;
    }

    .planner-list{
        gap:8px;
    }

    .planner-list-item{
        padding:9px;
    }

    .planner-checkbox-grid{
        gap:7px;
    }

    .planner-checkbox{
        gap:7px;
        padding:7px;
    }

    .planner-actions-sticky{
        gap:8px;
        bottom:8px;
        padding:8px;
    }

    .planner-inline-note{
        padding:8px 10px;
    }

    .planner-readonly{
        min-height:38px;
        padding:8px 10px;
    }

    .planner-message{
        margin-bottom:8px;
    }

    .planner-meta,
    .planner-field-policy-note{
        font-size:.82rem;
        line-height:1.38;
    }

    .planner-step{
        width:25px;
        height:25px;
        margin-right:6px;
        font-size:.78rem;
    }

    .ebi-guided-banner{
        margin:0 0 10px !important;
        padding:9px 12px !important;
        border-radius:12px !important;
    }

    .ebi-guided-banner p{
        margin:2px 0 0 !important;
        font-size:.84rem;
        line-height:1.32;
    }
}


/* =====================================================================
   PLUSTECA_PLANNER_HERO_COHERENCE_V1
   Una sola cabecera: identidad, promesa 3+1 y acceso curricular.
   ===================================================================== */
.planner-hero-compact{
    display:grid;
    grid-template-columns:minmax(230px,auto) minmax(300px,1fr) auto;
    align-items:center;
    gap:16px;
}

.planner-hero-compact .planner-hero-identity h1{
    margin:0;
}

.planner-hero-promise{
    min-width:0;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 4px;
}

.planner-hero-promise-mark{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    font-size:.8rem;
    font-weight:800;
    color:#1457bf;
}

.planner-hero-promise-mark .planner-hero-beta{
    color:var(--muted,#667085);
    font-size:.72rem;
    font-weight:750;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.planner-hero-promise-text{
    margin:0;
    min-width:0;
    color:var(--muted,#667085);
    font-size:.86rem;
    line-height:1.35;
}

.planner-hero-compact > .actions{
    justify-self:end;
}

@media(max-width:980px){
    .planner-hero-compact{
        display:grid;
        grid-template-columns:1fr auto;
        gap:10px 12px;
    }

    .planner-hero-promise{
        grid-column:1/-1;
        grid-row:2;
        padding:0;
    }
}

@media(max-width:640px){
    .planner-hero-compact{
        grid-template-columns:1fr;
    }

    .planner-hero-compact > .actions,
    .planner-hero-promise{
        grid-column:1;
        justify-self:stretch;
    }

    .planner-hero-promise{
        align-items:flex-start;
        flex-direction:column;
        gap:4px;
    }

    .planner-hero-compact > .actions .btn{
        width:100%;
    }
}

/* =====================================================================
   PLUSTECA_P6C2A_PLANNING_MATERIAL_EDITOR_V1
   El editor de la propuesta ocupa el ancho util del formulario y conserva
   una altura de escritura comoda en escritorio y movil.
   ===================================================================== */
.planner-page-material .planner-main,
.planner-page-material .planner-panel{
    min-width:0;
}

.planner-page-material label[for="planning-material-idea"]{
    display:block;
    margin:8px 0 6px;
    font-weight:700;
}

.planner-page-material #planning-material-idea{
    display:block;
    box-sizing:border-box;
    width:100%;
    max-width:100%;
    min-height:150px;
    padding:12px 14px;
    font:inherit;
    line-height:1.45;
    resize:vertical;
}

@media(max-width:720px){
    .planner-page-material #planning-material-idea{
        min-height:132px;
    }
}
