/* ==========================================================================================================
   PRICING TOOL EN MÓVIL  ·  [PT MÓVIL OCT 2026]  14/10/2026
   Todo va dentro de @media (max-width: 760px): en escritorio y tablet no cambia nada.
   Se carga después de styles.css, dashboard-pt.css y seguimiento-canal.css. Lo acompaña movil.js
   (barra inferior con «Más», barra de aprobación, chip de filtros del historial y avisos arriba).
   Plan y capturas: PLAN_MOVIL_OCT2026.md · pruebas: scripts/pruebas-movil/test-movil.js
   ========================================================================================================== */
/* Elementos que solo existen en móvil (los crea movil.js): ocultos en escritorio */
.side-link.mv-mas, .mv-velo, .mv-hoja, .mv-aprob, .mv-chip-filtros { display: none; }

@media (max-width: 760px) {
  .side-nav.mv-on .side-link.mv-mas { display: flex; }
  .mv-velo, .mv-hoja { display: block; }
  :root {
    --mv-tab-h: 58px;
    --mv-safe-b: env(safe-area-inset-bottom, 0px);
    --mv-bg: #f2f3f5;
    --mv-radius: 16px;
    --mv-sombra: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px -16px rgba(15, 23, 42, .28);
    --app-header-h: 56px;
  }

  /* ── 0. Base: fuera el ancho mínimo de 1200 px y el scroll dentro del body ─────────────────────────── */
  html, body { min-width: 0 !important; height: auto; overflow-x: visible; }
  html { overflow-x: clip; }
  body { min-height: 100%; background: var(--mv-bg); padding-bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 12px); }
  .container, .main-content, .app-container { min-width: 0 !important; }
  table { min-width: 0; }
  /* iOS hace zoom al enfocar un campo con letra < 16 px */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea { font-size: 16px !important; }
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select { min-height: 44px; }
  .layout { padding: 0 12px; margin-bottom: 0; }
  .app-footer { display: none; }

  /* ── 1. Cabecera compacta ───────────────────────────────────────────────────────────────────────────── */
  .app-header { padding: 8px 12px; padding-top: max(8px, env(safe-area-inset-top)); min-height: 56px; }
  .brand { gap: 8px; min-width: 0; }
  .brand-logo { height: 30px; }
  .brand h1 { font-size: 18px; white-space: nowrap; }
  #userName { display: none; }
  .user-box, #sessionInfo { gap: 6px; }
  #sessionInfo:not(.hidden) { display: flex; align-items: center; }
  #logoutBtn { display: none; }                 /* va al menú «Más» */
  .notifications-dropdown { position: fixed !important; left: 8px !important; right: 8px !important; top: 60px !important; width: auto !important; max-height: 70vh; }

  /* ── 2. Navegación: barra inferior tipo app ─────────────────────────────────────────────────────────── */
  .sidebar {
    position: fixed; top: auto; left: 0; right: 0; bottom: 0; z-index: 950;
    margin: 0; padding: 0 6px var(--mv-safe-b);
    background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: saturate(180%) blur(18px); backdrop-filter: saturate(180%) blur(18px);
    border-top: 1px solid rgba(0, 0, 0, .08); border-bottom: 0;
  }
  .side-nav { overflow: visible; gap: 0; justify-content: space-around; }
  .side-nav.mv-on .side-link:not(.mv-prim):not(.mv-mas) { display: none; }
  .side-nav.mv-on .side-link {
    position: relative; flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: center; gap: 1px;
    min-height: var(--mv-tab-h); padding: 6px 2px 4px; border: 0; border-radius: 0; box-shadow: none;
    font-size: 10.5px; font-weight: 600; letter-spacing: .01em; color: #8e8e93; background: transparent !important;
  }
  .side-nav.mv-on .side-link > span:not(.side-icon):not(.sc-badge) { display: none; }
  .side-nav.mv-on .side-link::after { content: attr(data-corto); white-space: nowrap; }
  .side-nav.mv-on .side-link .side-icon { width: auto; height: 26px; font-size: 22px; filter: grayscale(1) opacity(.7); transition: filter .15s; }
  .side-nav.mv-on .side-link.active, .side-nav.mv-on .side-link.mv-activo { color: var(--brand-600); }
  .side-nav.mv-on .side-link.active .side-icon, .side-nav.mv-on .side-link.mv-activo .side-icon { filter: none; }
  .side-nav.mv-on .side-link .sc-badge:not(.hidden) { position: absolute; top: 4px; left: calc(50% + 6px); margin: 0; min-width: 18px; height: 18px; font-size: 10.5px; line-height: 18px; padding: 0 5px; }
  .side-nav.mv-on .side-link.hidden { display: none !important; }

  /* Hoja «Más» (la crea movil.js) */
  .mv-velo { position: fixed; inset: 0; z-index: 1200; background: rgba(0, 0, 0, .35); opacity: 0; pointer-events: none; transition: opacity .2s; }
  .mv-velo.on { opacity: 1; pointer-events: auto; }
  .mv-hoja {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1201; background: #fff; border-radius: 22px 22px 0 0;
    padding: 8px 16px calc(16px + var(--mv-safe-b)); transform: translateY(105%); transition: transform .25s cubic-bezier(.2, .8, .2, 1);
    box-shadow: 0 -10px 40px rgba(0, 0, 0, .18); max-height: 85vh; overflow-y: auto;
  }
  .mv-hoja.on { transform: none; }
  .mv-asa { width: 38px; height: 5px; border-radius: 3px; background: #d1d1d6; margin: 2px auto 12px; }
  .mv-yo { display: flex; align-items: center; gap: 12px; padding: 4px 4px 14px; border-bottom: 1px solid #ececf0; margin-bottom: 12px; }
  .mv-avatar { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--brand-400), var(--brand-600)); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
  .mv-yo b { display: block; font-size: 16px; } .mv-yo small { color: #6e6e73; font-size: 13px; }
  .mv-items { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .mv-items button, .mv-salir {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 84px; padding: 10px 6px;
    background: #f5f5f7; color: #1d1d1f; border: 0; border-radius: 14px; box-shadow: none; font-size: 12.5px; font-weight: 600; white-space: normal; text-align: center; line-height: 1.2;
  }
  .mv-items button:hover, .mv-salir:hover { background: #ececf0; transform: none; box-shadow: none; }
  .mv-items button span:first-child { font-size: 24px; }
  .mv-items button.activo { background: var(--brand-50); color: var(--brand-700); }
  .mv-salir { width: 100%; min-height: 48px; flex-direction: row; margin-top: 12px; color: #d70015; font-size: 15px; }

  /* ── 3. Tarjetas y formularios ──────────────────────────────────────────────────────────────────────── */
  .card { padding: 14px; border-radius: var(--mv-radius); margin-bottom: 12px; box-shadow: var(--mv-sombra); }
  .card:hover { box-shadow: var(--mv-sombra); }
  .card-header { margin-bottom: 12px; padding-bottom: 10px; }
  .card-title { font-size: 16px; display: flex; align-items: center; gap: 6px; }
  .card-title .collapse-icon { margin-left: auto; font-size: 12px; }
  .card-header > div { flex: 1; min-width: 0; }
  .card-subtitle { font-size: 12.5px; line-height: 1.35; }
  .quote-section { gap: 12px; }
  .form-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .form-row > .form-group, .form-row > .form-group-lg { flex: none; min-width: 0; }
  .form-actions { width: 100%; flex-wrap: wrap; }
  .form-actions > button { flex: 1 1 auto; min-height: 46px; }
  .grid-config { grid-template-columns: 1fr 1fr; gap: 10px; }
  .grid-config > * { grid-column: auto; min-width: 0; }
  .grid-config select, .grid-config input { width: 100%; }
  .card-actions { flex-wrap: wrap; }
  .card-actions > button { flex: 1 1 auto; min-height: 46px; }
  #card-search .form-row { display: grid; grid-template-columns: 1fr 1fr; }
  #card-search .form-row .form-actions { grid-column: 1 / -1; }
  .smart-search-hint { font-size: 12px; }
  .coterm-row { flex-direction: column; align-items: stretch; }
  .offer-badge { font-size: 13px; }
  .locked-notice { font-size: 13px; }
  .status-info-card .status-current { flex-wrap: wrap; gap: 8px; }
  .status-info-card .status-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .status-info-card .status-actions > button { flex: 1 1 auto; min-height: 40px; }

  /* ── 4. Ítems de la oferta: una tarjeta por línea ───────────────────────────────────────────────────── */
  #itemsList.items { padding: 0; border: 0; background: transparent; overflow: visible; min-height: 0; }
  #itemsList .item-row.item-row-header { display: none; }
  #itemsList .item-row {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas: "prod prod vend" "qty pvp dto" "pvd ini fin" "tot tot acc";
    gap: 12px 10px; padding: 12px 12px 10px 14px; margin: 0 0 10px; position: relative;
    background: #fff; border: 1px solid #e8e8ed; border-left: 4px solid #d1d1d6; border-radius: 14px;
  }
  #itemsList .item-row.margin-good { border-left-color: #10b981; background: linear-gradient(180deg, rgba(16, 185, 129, .06), #fff 60%); }
  #itemsList .item-row.margin-warning { border-left-color: #f59e0b; background: linear-gradient(180deg, rgba(245, 158, 11, .07), #fff 60%); }
  #itemsList .item-row.margin-danger { border-left-color: #ef4444; background: linear-gradient(180deg, rgba(239, 68, 68, .07), #fff 60%); }
  #itemsList .item-row > div {
    display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 4px; row-gap: 3px;
    padding: 0; border: 0; min-height: 0; min-width: 0; text-align: left;
  }
  #itemsList .item-row > div::before { flex-basis: 100%; min-width: 0; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: #8e8e93; }
  #itemsList .item-row .col-producto { grid-area: prod; flex-direction: column; align-items: flex-start; font-size: 15px; font-weight: 600; line-height: 1.3; }
  #itemsList .item-row .col-producto small { font-family: var(--font-mono); font-size: 11.5px; font-weight: 400; color: #8e8e93; }
  #itemsList .item-row .col-producto::before { content: none; }
  #itemsList .item-row .col-vendor { grid-area: vend; justify-content: flex-end; align-self: start; font-size: 11.5px; font-weight: 600; color: #3a3a3c; }
  #itemsList .item-row .col-vendor::before { content: none; }
  #itemsList .item-row .col-qty { grid-area: qty; } #itemsList .item-row .col-qty::before { content: 'Cantidad'; }
  #itemsList .item-row .col-pvp { grid-area: pvp; } #itemsList .item-row .col-pvp::before { content: 'PVP unit.'; }
  #itemsList .item-row .col-dto { grid-area: dto; } #itemsList .item-row .col-dto::before { content: 'Dto. línea'; }
  #itemsList .item-row .col-pvd { grid-area: pvd; } #itemsList .item-row .col-pvd::before { content: 'PVD unit.'; }
  #itemsList .item-row .col-inicio { grid-area: ini; font-size: 13px; } #itemsList .item-row .col-inicio::before { content: 'Inicio'; }
  #itemsList .item-row .col-fin { grid-area: fin; font-size: 13px; } #itemsList .item-row .col-fin::before { content: 'Fin'; }
  #itemsList .item-row .col-total { grid-area: tot; font-family: var(--font-display); font-size: 18px; font-weight: 700; align-self: end; }
  #itemsList .item-row .col-total::before { content: 'PVP total'; font-family: var(--font-body); }
  #itemsList .item-row .col-actions { grid-area: acc; justify-content: flex-end; align-self: end; border: 0; margin: 0; padding: 0; gap: 6px; flex-wrap: nowrap; }
  #itemsList .item-row .col-actions::before { content: none; }
  #itemsList .item-row .col-actions .icon-btn { width: 38px; height: 38px; padding: 0 !important; font-size: 15px !important; border-radius: 10px; }
  #itemsList .item-row .col-pvd, #itemsList .item-row .col-inicio, #itemsList .item-row .col-fin, #itemsList .item-row .col-vendor { display: flex; }
  #itemsList .item-row .col-qty { flex-wrap: wrap; }
  #itemsList .item-row .inline-qty { width: 52px; max-width: none; min-width: 0; min-height: 40px; padding: 6px 6px; }
  #itemsList .item-row .pct-group { display: flex; align-items: center; width: 100%; border-radius: 8px; }
  #itemsList .item-row .pct-group .pct-input { flex: 1 1 auto; width: 100% !important; min-width: 0; padding: 6px 4px 6px 8px !important; }
  #itemsList .item-row .pct-group .pct-suffix { flex: 0 0 auto; padding: 0 8px 0 2px; }
  #itemsList .item-row .inline-price, #itemsList .item-row .pct-input { width: 100%; max-width: none; min-width: 0; min-height: 40px; padding: 6px 8px; text-align: left; }
  #itemsList .item-row .price-period-select { min-height: 32px; padding: 2px 6px; width: 100%; }
  #itemsList .item-row .qty-suffix { font-size: 12px; }
  #itemsList .item-row .mult-badge { font-size: 11px; }

  /* Oferta bloqueada (aprobación, aprobada, en Dynamics): las líneas se leen como texto, sin cajas ni botones */
  body:has(#offer-editor.offer-locked) #itemsList .item-row input, body:has(#offer-editor.offer-locked) #itemsList .item-row select {
    border-color: transparent !important; background: transparent !important; box-shadow: none !important; pointer-events: none; padding-left: 0 !important; min-height: 0; -webkit-appearance: none; appearance: none; font-weight: 600; color: #1d1d1f;
  }
  body:has(#offer-editor.offer-locked) #itemsList .item-row .pct-group { border: 0; background: transparent; }
  body:has(#offer-editor.offer-locked) #itemsList .item-row .price-period-select { font-weight: 400; color: #6e6e73; padding: 0 !important; }
  body:has(#offer-editor.offer-locked) #itemsList .item-row .col-actions { visibility: hidden; }

  /* ── 5. Resumen financiero: barra fija sobre la navegación + hoja inferior ─────────────────────────── */
  .finance-fab:not(.hidden) {
    left: 10px; right: 10px; bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 8px);
    border-radius: 16px !important; padding: 9px 14px !important; gap: 12px; justify-content: space-between;
  }
  .finance-fab .finance-fab-kpis { display: flex !important; flex: 1; justify-content: space-around; }
  .finance-fab .finance-fab-icon { font-size: 20px; }
  .finance-fab .finance-fab-value { font-size: 15px; }
  .finance-fab .finance-fab-label { font-size: 9.5px; }
  .finance-fab::after { content: '›'; font-size: 24px; line-height: 1; opacity: .7; }
  body:has(#financeFab:not(.hidden)) { padding-bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 80px); }
  .finance-modal-overlay, #historyFiltersModal { padding: 0 !important; align-items: flex-end !important; }
  .finance-modal {
    max-width: 100% !important; width: 100%; max-height: 88vh; border-radius: 22px 22px 0 0 !important; align-self: flex-end;
    padding-bottom: var(--mv-safe-b); animation: mvSubir .25s cubic-bezier(.2, .8, .2, 1);
  }
  .finance-modal-header { position: sticky; top: 0; z-index: 2; background: #fff; padding: 18px 16px 12px; border-radius: 22px 22px 0 0; }
  .finance-modal-header::before { content: ''; position: absolute; top: 7px; left: 50%; width: 38px; height: 5px; margin-left: -19px; border-radius: 3px; background: #d1d1d6; }
  .finance-modal-body { padding: 14px 16px 20px; }
  .finance-modal-body .kpi-grid { grid-template-columns: 1fr 1fr !important; gap: 8px; }
  .finance-modal-body .kpi { padding: 12px; border-radius: 12px; }
  .finance-modal-body .grid-filters { grid-template-columns: 1fr 1fr; }
  @keyframes mvSubir { from { transform: translateY(40px); opacity: .4; } to { transform: none; opacity: 1; } }

  /* Barra de aprobación (movil.js): sustituye a la del resumen cuando la oferta espera mi aprobación */
  body.mv-aprob-on .finance-fab { display: none !important; }
  body.mv-aprob-on .mv-aprob {
    display: block; position: fixed; left: 10px; right: 10px; bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 8px); z-index: 940;
    background: #1d1d1f; color: #fff; border-radius: 18px; padding: 10px; box-shadow: 0 12px 30px -8px rgba(0, 0, 0, .45);
  }
  body.mv-aprob-on { padding-bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 128px); }
  .mv-aprob-kpis { display: flex; width: 100%; justify-content: space-around; background: transparent; box-shadow: none; padding: 2px 4px 10px; color: #fff; }
  .mv-aprob-kpis:hover { background: transparent; transform: none; box-shadow: none; }
  .mv-aprob-kpis span { display: flex; flex-direction: column; align-items: center; gap: 1px; }
  .mv-aprob-kpis small { font-size: 9.5px; text-transform: uppercase; letter-spacing: .05em; opacity: .6; font-weight: 600; }
  .mv-aprob-kpis b { font-size: 15px; }
  .mv-aprob-kpis b.margin-good { color: #34d399; } .mv-aprob-kpis b.margin-warning { color: #fbbf24; } .mv-aprob-kpis b.margin-danger { color: #f87171; }
  .mv-aprob-acc { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; }
  .mv-aprob-acc button { min-height: 48px; font-size: 16px; border-radius: 12px; }
  .mv-aprob-acc button.danger { background: #3a3a3c; color: #ff6961; border: 0; box-shadow: none; }
  .mv-aprob-acc button[data-a="ap"] { background: linear-gradient(180deg, #34c759, #248a3d); box-shadow: none; }

  /* ── 6. Acciones de la oferta ───────────────────────────────────────────────────────────────────────── */
  .actions-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .actions-grid button { min-height: 48px; padding: 10px 12px; font-size: 14px; white-space: normal; justify-content: flex-start; text-align: left; line-height: 1.2; }
  .actions-grid #approveBtn:not(.hidden), .actions-grid #rejectBtn:not(.hidden) { justify-content: center; font-size: 15px; }
  .approval-status, .ap-estado { font-size: 13px; }
  .consolidations-header { flex-wrap: wrap; gap: 8px; }

  /* ── 7. Historial: tarjetas ─────────────────────────────────────────────────────────────────────────── */
  #section-history > .card { padding: 4px 0 0; background: transparent; border: 0; box-shadow: none; }
  #section-history > .card > .card-header { padding: 4px 2px 8px; margin: 0; border: 0; }
  #section-history > .card > .card-header .card-subtitle { display: none; }
  .history-quick-filters { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 8px; margin: 0 -12px 10px; padding: 2px 12px 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .history-quick-filters::-webkit-scrollbar { display: none; }
  .history-quick-filters > * { flex: 0 0 auto; }
  .history-quick-filters .status-chip { padding: 7px 12px; font-size: 13px; background: #fff; }
  .history-quick-filters select { min-height: 36px; padding: 4px 8px; }
  #historyList.history-table { overflow: visible; }
  .history-table .history-row, .history-table .history-group { min-width: 0 !important; }
  .history-table .history-row.head { display: none !important; }
  .history-table .history-row,
  .layout--fullwidth .history-table .history-row {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    grid-template-areas: "cli cli pvp" "ofr ofr ofr" "est est est" "asg asg asg" "fec cre acc";
    gap: 6px 10px !important; padding: 14px !important; margin: 0 0 10px;
    background: #fff !important; border: 0; border-radius: var(--mv-radius); box-shadow: var(--mv-sombra);
  }
  .history-table .history-row > div { overflow: visible; min-width: 0; }
  .history-table .history-row > div:nth-child(1) { grid-area: fec; font-size: 12.5px; color: #6e6e73; align-self: center; }
  .history-table .history-row > div:nth-child(2) { grid-area: cli; font-size: 15.5px; font-weight: 700; line-height: 1.3; }
  .history-table .history-row > div:nth-child(2) .hist-canal { display: inline-flex; margin: 4px 0 0; font-weight: 600; }
  .history-table .history-row > div:nth-child(3) { grid-area: cre; font-size: 12.5px; color: #6e6e73; align-self: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .history-table .history-row > div:nth-child(3)::before { content: '· '; }
  .history-table .history-row > div:nth-child(4) { grid-area: ofr; font-size: 12px; }
  .history-table .history-row > div:nth-child(4) .mono { font-size: 12px; color: var(--brand-700); }
  .history-table .history-row > div:nth-child(5) { grid-area: pvp; text-align: right !important; font-family: var(--font-display); font-size: 16px; font-weight: 700 !important; white-space: nowrap; }
  .history-table .history-row > div:nth-child(6) { grid-area: est; display: flex; flex-wrap: wrap; gap: 6px; }
  .history-table .history-row > div:nth-child(6) .status-badge { font-size: 12px; padding: 3px 10px; }
  .history-table .history-row > div:nth-child(7) { grid-area: asg; font-size: 12.5px; color: #3a3a3c; }
  .history-table .history-row > div:nth-child(7)::before { content: '👤 '; }
  .history-table .history-row > div:nth-child(7).mv-vacio { display: none; }
  .history-table .history-row > div.actions { grid-area: acc; justify-content: flex-end; gap: 4px; flex-wrap: nowrap; }
  .history-table .history-row > div.actions .icon-btn { width: 36px; height: 36px; padding: 0; border-radius: 10px; background: #f5f5f7; }
  .history-group { background: transparent; box-shadow: none; border: 0; margin: 0; }
  .history-group .history-row { box-shadow: inset 4px 0 0 #6366f1, var(--mv-sombra); }
  .history-filter-fab { display: none !important; }      /* en su lugar, el chip «🔍 Filtros» (movil.js) */
  .history-quick-filters .mv-chip-filtros { display: inline-flex; background: #1d1d1f; color: #fff; border-color: #1d1d1f; }
  /* Avisos (toast): arriba y a lo ancho para que no tapen la barra inferior (movil.js añade .pt-toast) */
  .pt-toast { top: calc(env(safe-area-inset-top, 0px) + 64px) !important; bottom: auto !important; left: 12px !important; right: 12px !important; text-align: center; border-radius: 14px !important; padding: 12px 14px !important; }

  /* ── 8. Dashboard ───────────────────────────────────────────────────────────────────────────────────── */
  .ptd-head { flex-direction: column; align-items: stretch; gap: 10px; }
  .ptd-controls { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 8px; margin: 0 -12px; padding: 0 12px 4px; scrollbar-width: none; }
  .ptd-controls::-webkit-scrollbar { display: none; }
  .ptd-controls > * { flex: 0 0 auto; }
  .ptd-kpis { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .ptd-kpi { min-width: 0; padding: 12px !important; }
  .ptd-kpi-value { font-size: 24px !important; }
  .ptd-kpi-sub { font-size: 11.5px !important; }
  .ptd-card { padding: 14px !important; border-radius: var(--mv-radius) !important; }
  .ptd-chart { margin: 0 -4px; }

  /* ── 9. Modales: hoja inferior a todo el ancho ──────────────────────────────────────────────────────── */
  .modal-container {
    top: auto !important; bottom: 0; left: 0 !important; right: 0; transform: none !important;
    width: 100% !important; max-width: 100% !important; max-height: 92vh; border-radius: 22px 22px 0 0;
    padding-bottom: var(--mv-safe-b); animation: mvSubir .25s cubic-bezier(.2, .8, .2, 1);
  }
  .modal-header { position: sticky; top: 0; background: #fff; z-index: 2; padding: 18px 16px 12px; }
  .modal-body { padding: 14px 16px; }
  .modal-footer { position: sticky; bottom: 0; padding: 12px 16px; border-radius: 0; }
  .modal-footer > button { flex: 1; min-height: 46px; }

  /* ── 10. Seguimiento canal ──────────────────────────────────────────────────────────────────────────── */
  .sc { gap: 12px; }
  .sc-head { padding: 16px 16px 14px; border-radius: 18px; align-items: stretch; gap: 12px; }
  .sc-title { font-size: 22px; }
  .sc-sub { font-size: 12.5px; }
  .sc-eyebrow { display: none; }
  .sc-head-acc { width: 100%; gap: 6px; }
  .sc-seg { width: 100%; }
  .sc .sc-seg button { flex: 1; justify-content: center; text-align: center; padding: 9px 6px; font-size: 13px; }
  .sc-head .sc-btn { justify-content: center; min-height: 40px; font-size: 13px; }
  .sc-head .sc-outlook { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .sc-head .sc-btn-icon { flex: 0 0 40px; height: 40px; }
  .sc-kpis { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin: 0 -12px; padding: 2px 12px 6px; scrollbar-width: none; }
  .sc-kpis::-webkit-scrollbar { display: none; }
  .sc .sc-kpi { flex: 0 0 148px; scroll-snap-align: start; padding: 12px 14px; }
  .sc-kpi-val { font-size: 26px; }
  .sc-filtros { flex-direction: column; flex-wrap: nowrap; align-items: stretch; padding: 10px; gap: 8px; }
  .sc-filtros > * { min-width: 0; }
  .sc-chips { flex-wrap: nowrap; overflow-x: auto; min-width: 0; margin: 0 -10px; padding: 0 10px 2px; scrollbar-width: none; }
  .sc-chips::-webkit-scrollbar { display: none; }
  .sc .sc-chip { padding: 8px 12px; flex: 0 0 auto; }
  .sc-filtros-der { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
  .sc .sc-sel, .sc .sc-busca { flex: 1 1 140px; width: auto; min-width: 0; padding: 10px 12px; }
  .sc .sc-busca { flex-basis: 100%; order: -1; }
  .sc-check { flex-basis: 100%; font-size: 14px; }
  .sc-banda { font-size: 13px; padding: 10px 12px; }
  .sc-banda .sc-btn { width: 100%; justify-content: center; }
  .sc-tabla-wrap { background: transparent; box-shadow: none; overflow: visible; border: 0; }
  .sc .sc-tabla, .sc .sc-tabla tbody { display: block; min-width: 0; width: 100%; }
  .sc .sc-tabla thead { display: none; }
  .sc .sc-tabla tr.sc-tr {
    display: grid; grid-template-columns: 1fr auto; grid-template-areas: "canal dyn" "cli cli" "fase pvp" "accion accion" "envio resp" "btn btn";
    gap: 6px 10px; background: #fff; border-radius: var(--mv-radius); padding: 14px; margin-bottom: 10px; box-shadow: var(--mv-sombra);
  }
  .sc .sc-tabla tr.sc-tr td { display: block; padding: 0; border: 0; min-width: 0; max-width: none; }
  .sc .sc-tabla tr td:nth-child(1) { grid-area: canal; }
  .sc .sc-tabla tr td:nth-child(2) { grid-area: cli; }
  .sc .sc-tabla tr td:nth-child(3) { grid-area: pvp; text-align: right; align-self: center; }
  .sc .sc-tabla tr td:nth-child(4) { grid-area: fase; align-self: center; }
  .sc .sc-tabla tr td:nth-child(5) { grid-area: envio; font-size: 12.5px; color: var(--sc-text2); }
  .sc .sc-tabla tr td:nth-child(5) > div:first-child::before { content: 'Enviada '; }
  .sc .sc-tabla tr td:nth-child(6) { grid-area: accion; background: #f7f8fa; border-radius: 12px; padding: 10px 12px; }
  .sc .sc-tabla tr td:nth-child(7) { display: none; }
  .sc .sc-tabla tr td:nth-child(8) { grid-area: resp; text-align: right; font-size: 12.5px; color: var(--sc-text2); }
  .sc .sc-tabla tr td:nth-child(8) br { display: none; }
  .sc .sc-tabla tr td:nth-child(9) { grid-area: dyn; text-align: right; }
  .sc .sc-tabla tr td:nth-child(10) { grid-area: btn; }
  .sc .sc-tabla tr td:nth-child(10) .sc-btn { width: 100%; justify-content: center; min-height: 44px; font-size: 14px; }
  .sc-cli { font-size: 16px; }
  .sc-accion { -webkit-line-clamp: 3; }
  .sc .sc-tr:hover { background: #fff; }
  .sc-pie { text-align: center; }
  .sc-drawer { width: 100vw; border-radius: 0; }
  .sc-dh { position: sticky; top: 0; z-index: 3; padding: 14px 16px 12px; }
  .sc-dh h3 { font-size: 18px; }
  .sc-ds { margin: 10px 10px 0; }
  .sc-overlay .sc-fbtn { flex: 1 1 calc(33% - 6px); justify-content: center; text-align: center; padding: 10px 6px; font-size: 13px; }
  .sc-dacc-fija {
    margin: 12px 0 0; padding: 10px 12px calc(10px + var(--mv-safe-b)); gap: 10px;
    background: #fff; border-top: 1px solid #e5e5ea; box-shadow: 0 -8px 20px -12px rgba(0, 0, 0, .2);
  }
  .sc-dacc-fija .sc-btn { flex: 1; justify-content: center; min-height: 46px; font-size: 15px; }
  .sc-menu { width: calc(100vw - 24px) !important; left: 12px !important; }

  /* ── 11. Resto de secciones (catálogo, auditoría, usuarios…): que nada se salga de la pantalla ─────── */
  .tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs .tab { flex: 0 0 auto; }
  .grid-filters { grid-template-columns: 1fr 1fr; }
  .grid-filters > *, .form-group { min-width: 0; }
  .grid-filters input, .grid-filters select { width: 100%; min-width: 0; }

  /* ── 12. Botones flotantes que no deben tapar la barra ─────────────────────────────────────────────── */
  .admin-floating-panel { bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 80px) !important; }
  .aria-fab, #ariaFab { bottom: calc(var(--mv-tab-h) + var(--mv-safe-b) + 80px) !important; }
  .login-screen .login-card { width: calc(100vw - 32px); max-width: 420px; }
}
