/* =====================================================================
   IAPG CMS — Sistema único para celular (≤ 860 px)
   Una sola altura de control, una sola forma de botón, deslizador,
   selector segmentado y tarjeta. Variantes: .mui-a (cómoda) / .mui-b (compacta)
   ===================================================================== */
@media (max-width: 860px) {
  body.mui-a { --mh: 52px; --mgap: 14px; }
  body.mui-b { --mh: 46px; --mgap: 10px; }

  /* Tarjetas */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard { padding: 16px !important; border-radius: 16px !important; margin: 0 0 var(--mgap) !important; gap: var(--mgap) !important; max-width: 100%; box-sizing: border-box; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard-title { display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 16px; margin: 0; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard-title > .btn { flex: 1 1 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .fgrid { display: grid !important; grid-template-columns: 1fr !important; gap: var(--mgap) !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .fgrid > .field { grid-column: 1 / -1 !important; width: 100%; min-width: 0; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .field > label { font-size: 13px; margin-bottom: 6px; display: block; }

  /* Campos */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .input,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .select { height: var(--mh) !important; min-height: var(--mh) !important; font-size: 16px !important; border-radius: 12px !important; padding: 0 14px !important; box-sizing: border-box; width: 100%; min-width: 0; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .textarea { min-height: 96px; font-size: 16px; border-radius: 12px; padding: 12px 14px; box-sizing: border-box; width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) input[type=color] { height: var(--mh) !important; min-height: var(--mh); width: var(--mh) !important; flex: 0 0 var(--mh); border-radius: 12px !important; padding: 3px; }

  /* Botones: una sola forma */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .btn { height: var(--mh) !important; min-height: var(--mh) !important; border-radius: 12px !important; font-size: 15px !important; font-weight: 700; padding: 0 16px !important; display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; box-sizing: border-box; white-space: nowrap; width: 100%; min-width: 0; margin: 0; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .btn svg { width: 20px; height: 20px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .icon-btn { width: var(--mh) !important; height: var(--mh) !important; min-width: var(--mh); border-radius: 12px !important; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 var(--mh); }

  /* Barras de acciones: 2 por fila, y el impar ocupa todo el ancho */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .panel-head { display: flex !important; flex-direction: column; align-items: stretch !important; gap: var(--mgap); margin-bottom: var(--mgap); }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sch-top-actions,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .panel-head > div:not(:first-child),
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .days-bar { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; align-items: stretch; width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sch-top-actions > .btn:first-child { grid-column: 1 / -1; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sch-sep, body[class*="mui-"] #editorCol:not([data-sec="home"]) .day-sep { display: none !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .panel-head > .btn { width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .days-bar .day-pill { max-width: none; flex: none; height: var(--mh); min-height: var(--mh); border-radius: 12px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .days-bar > .btn { height: var(--mh); }

  /* Selector segmentado (alineación, modos) */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-seg,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-icon-bar,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-3pos-bar { display: grid !important; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; padding: 5px !important; height: auto !important; min-height: calc(var(--mh) + 10px); border-radius: 14px !important; width: 100% !important; max-width: none !important; box-sizing: border-box; align-items: stretch !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-3pos-track { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; padding: 0 !important; background: none !important; border: 0 !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-seg > button,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-icon-btn,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-3pos-dot { height: var(--mh) !important; min-height: var(--mh) !important; border-radius: 10px !important; width: auto !important; max-width: none !important; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; padding: 0 8px; }

  /* Deslizadores: etiqueta + valor arriba, barra completa abajo */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .visual-slider-row { display: grid !important; grid-template-columns: 1fr auto; grid-template-areas: "l v" "s s"; align-items: center; column-gap: 10px; row-gap: 8px; height: auto !important; min-height: 0 !important; padding: 12px 14px !important; border-radius: 12px !important; width: 100%; box-sizing: border-box; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .visual-slider-row .slider-lbl { grid-area: l; font-size: 14px !important; white-space: normal !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .visual-slider-row .slider-val { grid-area: v; font-size: 14px; min-width: 0; text-align: right; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .visual-slider-row input[type=range] { grid-area: s; width: 100% !important; min-width: 0 !important; height: 32px; margin: 0; }

  /* Checks */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .check-pill { min-height: var(--mh); height: var(--mh); display: inline-flex; align-items: center; gap: 10px; padding: 0 14px; border-radius: 12px; font-size: 15px; box-sizing: border-box; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .check-pill input, body[class*="mui-"] #editorCol:not([data-sec="home"]) input[type=checkbox] { width: 22px; height: 22px; flex: 0 0 22px; }

  /* Tipos de actividad: una tarjeta por tipo */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row { display: grid !important; grid-template-columns: auto 1fr auto !important; gap: 10px !important; padding: 12px; border: 1px solid var(--border-strong, #24324f); border-radius: 14px; align-items: center !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > input[data-type-field=label],
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > select { grid-column: 1 / -1; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > .type-color { order: 3; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > label { order: 4; display: flex; font-size: 15px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > .icon-btn, body[class*="mui-"] #editorCol:not([data-sec="home"]) .type-row > span { order: 5; }

  /* Filas con varios campos: apiladas */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-line { display: grid !important; grid-template-columns: 1fr !important; gap: var(--mgap) !important; align-items: stretch !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-line > .field, body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-line > * { width: 100% !important; max-width: none !important; flex: none !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-line .check-pill { width: 100%; }

  /* Cabeceras de grupo de sponsors */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head { display: grid !important; grid-template-columns: 1fr; gap: 10px; align-items: stretch !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head > div { display: flex !important; flex-wrap: wrap; gap: 10px; min-width: 0 !important; width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head > div:first-child > input.input { flex: 1 1 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head .btn { flex: 1 1 auto; width: auto; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head .sgrp-showtitle { flex: 1 1 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sgrp-head .sgrp-kind-badge { height: 36px !important; min-height: 36px !important; }

  /* Variante B: deslizador en una línea, botones 2 en 2 */
  body.mui-b #editorCol:not([data-sec="home"]) .visual-slider-row { grid-template-columns: auto 1fr auto; grid-template-areas: "l s v"; padding: 6px 14px !important; min-height: var(--mh) !important; }
  body.mui-b #editorCol:not([data-sec="home"]) .visual-slider-row .slider-lbl { max-width: 112px; }
  body.mui-b #editorCol:not([data-sec="home"]) .visual-slider-row input[type=range] { height: 28px; }

  /* Botones-icono dentro de tarjetas compactas: tamaño táctil sin romper el contenido */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sess-item .icon-btn,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-tile .icon-btn { width: 40px !important; height: 40px !important; min-width: 40px; flex: 0 0 40px; border-radius: 10px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sess-actions { gap: 4px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-tile .btn { height: 44px !important; min-height: 44px !important; font-size: 13px !important; padding: 0 6px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard-title { margin-bottom: 4px; }
}
@media (max-width: 860px) {
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-tile .sp-del { width: 34px !important; height: 34px !important; min-width: 34px; flex: 0 0 34px; top: 6px; right: 6px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-tile .sp-del svg { width: 16px; height: 16px; }
}
@media (max-width: 860px) {
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .align-seg > button { font-size: 13px; padding: 0 4px; white-space: nowrap; }
}

/* ---- Ronda 2: pares de botones en una línea, más aire, Inicio compacto ---- */
@media (max-width: 860px) {
  /* Cualquier contenedor que tenga SOLO botones .btn → grilla de 2 columnas */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) div:has(> .btn):not(:has(> :not(.btn))) { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) div:has(> .btn):not(:has(> :not(.btn))) > .btn { height: auto !important; min-height: var(--mh) !important; padding: 8px 10px !important; white-space: normal !important; line-height: 1.2; font-size: 14px !important; text-align: center; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) div:has(> .btn):not(:has(> :not(.btn))) > .btn:only-child,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) div:has(> .btn):not(:has(> :not(.btn))) > .btn:nth-child(odd):last-child { grid-column: 1 / -1; }

  /* Más aire entre el título de cada herramienta y su contenido */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard { gap: 18px !important; padding: 18px 16px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .ecard-title { margin-bottom: 8px; padding-bottom: 2px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .field > label { margin-bottom: 8px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .field > small, body[class*="mui-"] #editorCol:not([data-sec="home"]) .field label small { display: block; margin-top: 2px; opacity: .8; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .fgrid { gap: 18px !important; }

  /* Campos nunca cortados: apilados y con el texto a lo ancho */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .fb-line,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .evl-line,
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-color-line { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; align-items: stretch !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .evl-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .sp-color-line .btn { width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .row, body[class*="mui-"] #editorCol:not([data-sec="home"]) .inline-row { flex-wrap: wrap; gap: 12px; }

  /* ===== Inicio compacto ===== */
  body[class*="mui-"] #editorCol[data-sec="home"] .home-wrap { padding: 8px 8px 0; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-container { padding: 16px 14px 14px !important; gap: 14px !important; margin: 0 auto 10px !important; border-radius: 20px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-head { display: flex; align-items: center; gap: 12px; text-align: left; }
  body[class*="mui-"] #editorCol[data-sec="home"] .welcome-badge-icon { flex: 0 0 48px; width: 48px !important; height: 48px !important; border-radius: 14px; margin: 0 !important; display: flex; align-items: center; justify-content: center; }
  body[class*="mui-"] #editorCol[data-sec="home"] .welcome-badge-icon svg { width: 24px !important; height: 24px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-title { font-size: 17px !important; line-height: 1.2; margin: 0 0 3px !important; text-align: left; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-subtitle { font-size: 12.5px !important; text-align: left; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-actions-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-act-card { flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; text-align: left; gap: 10px !important; min-height: 60px !important; height: 60px; padding: 8px 12px !important; border-radius: 14px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-act-card .home-act-txt { text-align: left; min-width: 0; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-act-card h3 { font-size: 13px !important; line-height: 1.2; text-align: left; margin: 0; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-act-card p { display: none !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-act-ic { flex: 0 0 36px; width: 36px !important; height: 36px !important; border-radius: 11px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-section { margin-top: 4px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-head { gap: 8px !important; margin-bottom: 10px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-head h2, body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-head h3 { font-size: 15px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-head p { font-size: 12px !important; margin: 2px 0 0; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-proj-screen { height: 48px !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-proj-body { padding: 10px 12px 12px !important; gap: 6px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-proj-actions .btn { height: 44px; min-height: 44px; border-radius: 12px; font-size: 14px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-recents-section .input { height: 44px; border-radius: 12px; font-size: 15px; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-org-footer { padding-top: 12px !important; }
}
@media (max-width: 860px) {
  body[class*="mui-"] #editorCol[data-sec="home"] .home-head { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 12px !important; text-align: left !important; }
  body[class*="mui-"] #editorCol[data-sec="home"] .home-head > div:last-child { min-width: 0; }
}
@media (max-width: 860px) {
  /* Filas con texto + selector: el selector va debajo, a lo ancho */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .switch-row { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; padding: 14px 0 !important; align-items: stretch !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .switch-row .select, body[class*="mui-"] #editorCol:not([data-sec="home"]) .switch-row select { width: 100% !important; max-width: none !important; }
  /* Fecha y lugar: campo a lo ancho y el check debajo */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-f-date > div { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-f-date .input { width: 100% !important; flex: none !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .hdr-f-date .check-pill { width: 100%; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) textarea.input, body[class*="mui-"] #editorCol:not([data-sec="home"]) .multiline-inp { height: auto !important; min-height: 64px !important; padding: 12px 14px !important; line-height: 1.35; }
}
@media (max-width: 860px) {
  /* Tarjeta de orador: foto + datos + botón Editar compacto */
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .person-card { display: flex !important; align-items: center; gap: 12px; padding: 12px 14px !important; flex-wrap: nowrap; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .person-card > .btn { width: auto !important; flex: 0 0 auto; height: 44px !important; min-height: 44px !important; padding: 0 16px !important; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .person-card .person-av { flex: 0 0 48px; width: 48px; height: 48px; }
  body[class*="mui-"] #editorCol:not([data-sec="home"]) .person-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
}

/* ---- Ronda 3: barra superior con ícono, selector Portada/Programa, aire bajo el encabezado ---- */
@media (max-width: 860px) {
  /* Sin campo de nombre: solo el ícono de la app + acciones */
  body[class*="mui-"] .tb-title-input { display: none !important; }
  body[class*="mui-"] .tb-brand { display: block !important; flex: 0 0 44px !important; width: 44px !important; height: 44px !important; border-radius: 12px; background: url('../recursos/app-icon.svg') center / contain no-repeat !important; overflow: hidden; }
  body[class*="mui-"] .tb-brand .tb-logo-img { display: none !important; }
  body[class*="mui-"] .topbar .tb-left { justify-content: space-between; gap: 10px; }

  /* Selector Portada / Programa: el segmento activo ocupa todo el alto de la pastilla */
  body[class*="mui-"] .workspace.mv-live .pv-toolbar { padding: 0 !important; overflow: hidden; border-radius: 999px; }
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg { padding: 0 !important; gap: 0 !important; display: flex; align-items: stretch; border: 0; background: transparent; }
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg button,
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg button.m-pv-ic { height: 48px !important; min-height: 48px !important; width: 64px !important; border-radius: 0 !important; margin: 0 !important; display: inline-flex; align-items: center; justify-content: center; }
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg button svg { width: 22px; height: 22px; }

  /* Aire entre el título de la sección y el contenido */
  body[class*="mui-"] .m-head-row { padding-bottom: 8px; }
  body[class*="mui-"] .workspace.mv-live .editor-col { padding-top: 20px !important; }
}
@media (max-width: 860px) {
  body[class*="mui-"] .tb-brand { flex: 0 0 48px !important; width: 48px !important; height: 48px !important; border-radius: 13px; }
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg button,
  body[class*="mui-"] .workspace.mv-live .pv-toolbar .pv-seg button.m-pv-ic { height: 42px !important; min-height: 42px !important; width: 56px !important; }
}
@media (max-width: 860px) {
  body[class*="mui-"] .topbar .tb-left { justify-content: flex-start; }
  body[class*="mui-"] .topbar .m-publish { margin-left: auto; }
}

/* ---- Ronda 4: logo de la app sin contenedor en la barra superior ---- */
@media (max-width: 860px) {
  body[class*="mui-"] .tb-brand { flex: 0 0 150px !important; width: 150px !important; height: 40px !important; border-radius: 0 !important;
    background: url('../recursos/logo-app-dark.svg') left center / contain no-repeat !important; }
}