/* CRMS · Identidad visual: rosa #E77190 y negro. Colores en RGB separado por espacios.
   2026-11-02: creación inicial. El texto sobre rosa siempre es negro (contraste AA). */
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Regular.woff") format("woff"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Medium.woff") format("woff"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-SemiBold.woff") format("woff"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Lora"; src: url("../fonts/Lora-Medium.woff") format("woff"); font-weight: 500; font-display: swap; }

:root, [data-bs-theme="light"] {
  --crms-fondo: 251 248 249;
  --crms-superficie: 255 255 255;
  --crms-elevada: 255 255 255;
  --crms-borde: 237 228 232;
  --crms-texto: 20 16 18;
  --crms-texto-suave: 107 95 100;
  --crms-primario: 231 113 144;
  --crms-primario-hover: 217 88 122;
  --crms-primario-suave: 253 240 244;
  --crms-enlace: 184 62 94;
  --crms-negro: 20 16 18;
  --crms-error-fondo: 253 240 244;
}
[data-bs-theme="dark"] {
  --crms-fondo: 14 11 12;
  --crms-superficie: 26 21 23;
  --crms-elevada: 36 29 32;
  --crms-borde: 51 41 45;
  --crms-texto: 245 238 241;
  --crms-texto-suave: 169 156 161;
  --crms-primario: 231 113 144;
  --crms-primario-hover: 242 154 176;
  --crms-primario-suave: 58 30 40;
  --crms-enlace: 242 154 176;
  --crms-negro: 0 0 0;
  --crms-error-fondo: 58 30 40;
}

:root, [data-bs-theme] {
  --bs-body-bg: rgb(var(--crms-fondo));
  --bs-body-color: rgb(var(--crms-texto));
  --bs-secondary-color: rgb(var(--crms-texto-suave));
  --bs-border-color: rgb(var(--crms-borde));
  --bs-link-color: rgb(var(--crms-enlace));
  --bs-link-hover-color: rgb(var(--crms-enlace));
  --bs-link-color-rgb: var(--crms-enlace);
  --bs-heading-color: inherit;
  --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { background: rgb(var(--crms-fondo)); color: rgb(var(--crms-texto)); font-family: var(--bs-body-font-family); font-size: 1rem; line-height: 1.5; overflow-x: hidden; }
:focus-visible { outline: 2px solid rgb(var(--crms-enlace)); outline-offset: 2px; }

/* Marco general */
.crms-marco { display: flex; min-height: 100vh; min-height: 100dvh; }
.crms-principal { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.crms-barra { display: flex; align-items: center; gap: .75rem; padding: .875rem 1rem; border-bottom: 1px solid rgb(var(--crms-borde)); background: rgb(var(--crms-superficie)); position: sticky; top: 0; z-index: 10; }
.crms-titulo { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.375rem; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.crms-contenido { padding: 1.25rem 1rem 2.5rem; width: 100%; max-width: 72rem; }
.crms-saltar { position: absolute; z-index: 2000; background: rgb(var(--crms-primario)); color: #141012; padding: .5rem 1rem; }
@media (min-width: 768px) {
  .crms-barra { padding: 1rem 1.75rem; }
  .crms-contenido { padding: 1.75rem 1.75rem 3rem; }
}

/* Barra lateral */
/* !important: offcanvas-lg de Bootstrap fuerza fondo transparente en escritorio. */
.crms-lateral { --bs-offcanvas-width: 16.5rem; --bs-offcanvas-bg: #141012; --bs-offcanvas-color: #F5EEF1; background: #141012 !important; color: #F5EEF1; display: flex; flex-direction: column; }
[data-bs-theme="dark"] .crms-lateral { --bs-offcanvas-bg: #000000; background: #000000 !important; }
@media (min-width: 992px) {
  .crms-lateral { flex: 0 0 16.5rem; width: 16.5rem; position: sticky; top: 0; height: 100vh; height: 100dvh; }
  .crms-lateral.offcanvas-lg { display: flex; flex-direction: column; }
}
.crms-marca { display: flex; align-items: center; gap: .75rem; padding: 1.25rem 1.25rem 1.5rem; }
.crms-marca-sello { flex: none; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; background: rgb(var(--crms-primario)); color: #141012; border-radius: 47% 53% 51% 49% / 52% 46% 54% 48%; font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.25rem; }
.crms-marca-texto { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.125rem; line-height: 1.2; }
.crms-marca-texto small { display: block; font-family: "Inter", sans-serif; font-weight: 400; font-size: .8125rem; color: #A99CA1; margin-top: .125rem; }
.crms-nav { display: flex; flex-direction: column; gap: .125rem; padding: 0 .75rem; }
.crms-lateral-pie { margin-top: auto; padding: 1rem .75rem; display: flex; flex-direction: column; gap: .125rem; border-top: 1px solid #33292D; }
.crms-nav-enlace { display: flex; align-items: center; gap: .75rem; width: 100%; min-height: 2.75rem; padding: .5rem .75rem; color: #F5EEF1; background: none; border: 0; border-left: 3px solid transparent; border-radius: 0 .375rem .375rem 0; text-decoration: none; text-align: left; font: inherit; }
.crms-nav-enlace i { width: 1.25rem; text-align: center; color: #A99CA1; }
.crms-nav-enlace:hover { background: #241D20; color: #FFFFFF; }
.crms-nav-enlace.es-activo { border-left-color: rgb(var(--crms-primario)); background: #241D20; font-weight: 500; }
.crms-nav-enlace.es-activo i { color: #F29AB0; }
.crms-nav-enlace:focus-visible { outline-color: #F29AB0; }
.crms-version { color: #A99CA1; font-size: .8125rem; margin: .5rem .75rem 0; }

/* Botones */
.btn { min-height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: .375rem; font-weight: 500; background-image: none; text-shadow: none; box-shadow: none; }
.crms-btn-primario, .crms-btn-primario:focus { background: rgb(var(--crms-primario)); border: 1px solid rgb(var(--crms-primario)); color: #141012; }
.crms-btn-primario:hover, .crms-btn-primario:active { background: rgb(var(--crms-primario-hover)) !important; border-color: rgb(var(--crms-primario-hover)) !important; color: #141012 !important; }
.crms-btn-primario:disabled { background: rgb(var(--crms-primario)); color: #141012; opacity: .65; }
.crms-btn-suave, .crms-btn-suave:focus { background: transparent; border: 1px solid rgb(var(--crms-borde)); color: rgb(var(--crms-texto)); }
.crms-btn-suave:hover, .crms-btn-suave:active { background: rgb(var(--crms-primario-suave)) !important; border-color: rgb(var(--crms-primario)) !important; color: rgb(var(--crms-texto)) !important; }
.crms-btn-icono, .crms-btn-icono:focus { width: 2.75rem; height: 2.75rem; padding: 0; background: transparent; border: 1px solid rgb(var(--crms-borde)); color: rgb(var(--crms-texto)); flex: none; }
.crms-btn-icono:hover { background: rgb(var(--crms-primario-suave)) !important; color: rgb(var(--crms-texto)) !important; }

/* Contenido */
.crms-panel { background: rgb(var(--crms-superficie)); border: 1px solid rgb(var(--crms-borde)); border-radius: .5rem; padding: 1.25rem; }
.crms-panel-angosto { width: 100%; max-width: 28rem; }
.crms-saludo { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.75rem; line-height: 1.25; margin-bottom: .375rem; overflow-wrap: anywhere; }
.crms-subtitulo { font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; }
.crms-titulo-marca { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.75rem; line-height: 1.25; margin-bottom: .5rem; }
.crms-texto-suave { color: rgb(var(--crms-texto-suave)); }
.crms-nota { font-size: .875rem; }
.crms-centrado { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.crms-aviso { padding: .75rem 1rem; border-radius: .375rem; border-left: 3px solid rgb(var(--crms-primario)); background: rgb(var(--crms-primario-suave)); margin-bottom: 1rem; }
.crms-insignia { display: inline-block; padding: .125rem .5rem; border-radius: 1rem; background: rgb(var(--crms-primario-suave)); font-size: .8125rem; }
.crms-insignia-apagada { background: transparent; border: 1px solid rgb(var(--crms-borde)); color: rgb(var(--crms-texto-suave)); }
.crms-cambio { overflow-wrap: anywhere; }

/* Formularios */
.form-label { font-weight: 500; margin-bottom: .25rem; }
.form-control, .form-select { min-height: 2.75rem; background-color: rgb(var(--crms-superficie)); border-color: rgb(var(--crms-borde)); color: rgb(var(--crms-texto)); border-radius: .375rem; }
.form-control:focus, .form-select:focus { border-color: rgb(var(--crms-primario)); box-shadow: 0 0 0 .2rem rgb(var(--crms-primario) / .25); background-color: rgb(var(--crms-superficie)); color: rgb(var(--crms-texto)); }
.form-control[readonly] { background-color: rgb(var(--crms-fondo)); color: rgb(var(--crms-texto-suave)); }
.form-text { color: rgb(var(--crms-texto-suave)); }
.invalid-feedback { color: rgb(var(--crms-enlace)); }
.modal-content { background: rgb(var(--crms-elevada)); color: rgb(var(--crms-texto)); border-color: rgb(var(--crms-borde)); }
.modal-header, .modal-footer { border-color: rgb(var(--crms-borde)); }

/* Tablas que se apilan en móvil */
.crms-tabla { width: 100%; border-collapse: collapse; }
.crms-tabla th { text-align: left; font-weight: 500; font-size: .875rem; color: rgb(var(--crms-texto-suave)); padding: .5rem .75rem; border-bottom: 1px solid rgb(var(--crms-borde)); }
.crms-tabla td { padding: .75rem; border-bottom: 1px solid rgb(var(--crms-borde)); vertical-align: top; overflow-wrap: anywhere; }
.crms-tabla tbody tr:last-child td { border-bottom: 0; }
.crms-tabla td[data-etiqueta="Rol"], .crms-tabla td[data-etiqueta="Estado"], .crms-tabla td[data-etiqueta="Último acceso"] { white-space: nowrap; }
.crms-acciones { display: flex; flex-wrap: wrap; gap: .375rem; justify-content: flex-end; max-width: 13rem; margin-left: auto; }
.crms-acciones .btn { font-size: .875rem; padding: .25rem .625rem; min-height: 2.5rem; }
@media (max-width: 991.98px) {
  .crms-tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .crms-tabla, .crms-tabla tbody, .crms-tabla tr, .crms-tabla td { display: block; width: 100%; }
  .crms-tabla tr { padding: .75rem 0; border-bottom: 1px solid rgb(var(--crms-borde)); }
  .crms-tabla tbody tr:last-child { border-bottom: 0; }
  .crms-tabla td { border: 0; padding: .25rem 0; }
  .crms-tabla td[data-etiqueta]::before { content: attr(data-etiqueta); display: block; font-size: .8125rem; color: rgb(var(--crms-texto-suave)); }
  .crms-acciones { justify-content: flex-start; padding-top: .375rem; max-width: none; margin-left: 0; }
}

/* Avisos emergentes: arriba a la derecha en escritorio, abajo al centro en móvil */
.crms-toasts { position: fixed; z-index: 2100; left: 1rem; right: 1rem; bottom: 1rem; display: flex; flex-direction: column; gap: .5rem; pointer-events: none; }
.crms-toast { pointer-events: auto; display: flex; gap: .625rem; align-items: flex-start; background: rgb(var(--crms-elevada)); color: rgb(var(--crms-texto)); border: 1px solid rgb(var(--crms-borde)); border-left: 3px solid rgb(var(--crms-primario)); border-radius: .375rem; padding: .75rem 1rem; box-shadow: 0 6px 20px rgb(20 16 18 / .18); }
@media (min-width: 768px) { .crms-toasts { left: auto; right: 1.5rem; top: 1.5rem; bottom: auto; width: 22rem; } }

/* Diálogos SweetAlert2 */
.crms-swal { background: rgb(var(--crms-elevada)) !important; color: rgb(var(--crms-texto)) !important; border-radius: .5rem !important; border: 1px solid rgb(var(--crms-borde)); }
.crms-swal-titulo { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.375rem; color: rgb(var(--crms-texto)) !important; }
.crms-clave-temporal { display: block; margin-top: .5rem; padding: .625rem .75rem; background: rgb(var(--crms-fondo)); border: 1px solid rgb(var(--crms-borde)); border-radius: .375rem; font-size: 1.0625rem; color: rgb(var(--crms-texto)); user-select: all; overflow-wrap: anywhere; }

/* Acceso: sello de lacre */
.crms-acceso { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.crms-acceso-marca { background: #141012; color: #F5EEF1; display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1rem; }
[data-bs-theme="dark"] .crms-acceso-marca { background: #000000; }
.crms-sello { width: 4.5rem; flex: none; }
.crms-sello-cera { fill: rgb(var(--crms-primario)); }
.crms-sello-aro { fill: none; stroke: #141012; stroke-opacity: .55; stroke-width: 1.5; }
.crms-sello-letra { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 68px; fill: #141012; }
.crms-acceso-lema { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.0625rem; line-height: 1.35; margin: 0; }
.crms-acceso-formulario { flex: 1; display: flex; align-items: center; justify-content: center; padding: 1.75rem 1rem; }
.crms-acceso-formulario form { width: 100%; max-width: 24rem; }
@media (min-width: 992px) {
  .crms-acceso { flex-direction: row; }
  .crms-acceso-marca { flex: 0 0 46%; flex-direction: column; justify-content: center; gap: 2.5rem; padding: 3rem; }
  .crms-sello { width: min(22rem, 70%); }
  .crms-acceso-lema { font-size: 1.5rem; max-width: 22rem; text-align: center; }
}

.crms-sin-conexion { position: sticky; top: 0; z-index: 1100; padding: .375rem .75rem; background: #141012; color: #F5EEF1; text-align: center; font-size: .875rem; }

/* Campana */
.crms-campana { position: relative; }
.crms-campana-contador { position: absolute; top: -.375rem; right: -.375rem; min-width: 1.25rem; height: 1.25rem; padding: 0 .25rem; display: grid; place-items: center; border-radius: 1rem; background: rgb(var(--crms-primario)); color: #141012; font-size: .75rem; font-weight: 600; }
.crms-campana-menu { width: min(23rem, calc(100vw - 2rem)); padding: 0; background: rgb(var(--crms-elevada)); border-color: rgb(var(--crms-borde)); color: rgb(var(--crms-texto)); box-shadow: 0 8px 24px rgb(20 16 18 / .2); }
.crms-campana-cabeza { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 3.25rem; padding: .375rem .75rem; border-bottom: 1px solid rgb(var(--crms-borde)); }
.crms-campana-cabeza .btn { min-height: 2.5rem; font-size: .875rem; padding: .25rem .625rem; }
#campanaLista { max-height: min(24rem, 60vh); overflow-y: auto; }
.crms-campana-vacia { margin: 0; padding: 1.25rem .75rem; text-align: center; }
.crms-campana-item { display: block; width: 100%; padding: .75rem; background: none; border: 0; border-bottom: 1px solid rgb(var(--crms-borde)); border-left: 3px solid transparent; color: rgb(var(--crms-texto)); text-align: left; font: inherit; overflow-wrap: anywhere; }
.crms-campana-item:hover { background: rgb(var(--crms-primario-suave)); }
.crms-campana-item.es-nueva { border-left-color: rgb(var(--crms-primario)); }
.crms-campana-item strong, .crms-campana-item span, .crms-campana-item small { display: block; }
.crms-campana-item strong { font-weight: 600; }
.crms-campana-item small { margin-top: .25rem; color: rgb(var(--crms-texto-suave)); }

/* Dispositivos y preferencias */
.crms-dispositivos { list-style: none; margin: 0; padding: 0; }
.crms-dispositivo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid rgb(var(--crms-borde)); overflow-wrap: anywhere; }
.crms-interruptor { min-height: 2.5rem; display: flex; align-items: center; margin: 0; padding-left: 2.75rem; }
.crms-interruptor .form-check-input { width: 2.5rem; height: 1.5rem; margin-left: -2.75rem; margin-top: 0; }
.form-check-input:checked { background-color: rgb(var(--crms-primario)); border-color: rgb(var(--crms-primario)); }
.form-check-input:focus { border-color: rgb(var(--crms-primario)); box-shadow: 0 0 0 .2rem rgb(var(--crms-primario) / .25); }

/* Instalador */
.crms-instalador { max-width: 42rem; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.crms-pasos { display: flex; flex-wrap: wrap; gap: .375rem; list-style: none; padding: 0; margin: 0 0 1.25rem; }
.crms-pasos li { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border: 1px solid rgb(var(--crms-borde)); border-radius: 50%; color: rgb(var(--crms-texto-suave)); font-size: .875rem; }
.crms-pasos li.es-hecho { background: rgb(var(--crms-primario-suave)); color: rgb(var(--crms-texto)); }
.crms-pasos li.es-actual { background: rgb(var(--crms-primario)); border-color: rgb(var(--crms-primario)); color: #141012; font-weight: 600; }
.crms-requisito { display: flex; gap: .625rem; padding: .375rem 0; overflow-wrap: anywhere; }
.crms-requisito i { margin-top: .25rem; }
.crms-ok { color: rgb(var(--crms-texto)); }
.crms-codigo { display: block; padding: .625rem .75rem; background: rgb(var(--crms-fondo)); border: 1px solid rgb(var(--crms-borde)); border-radius: .375rem; color: rgb(var(--crms-texto)); overflow-wrap: anywhere; font-size: .875rem; }
.crms-cron-campos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .5rem; text-align: center; font-size: .8125rem; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* Formularios en rejilla y catálogo. 2026-11-03: Fase 3. */
.crms-rejilla-form { display: grid; grid-template-columns: 1fr; gap: .875rem; }
.crms-rejilla-form > * { min-width: 0; }
.crms-rejilla-accion { align-self: end; }
@media (min-width: 768px) { .crms-rejilla-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.crms-casillas { display: grid; gap: .5rem; }
.crms-casillas label { display: flex; gap: .625rem; align-items: center; min-height: 2.5rem; }
.crms-casillas .form-check-input { margin: 0; width: 1.25rem; height: 1.25rem; flex: none; }
.crms-monoespacio { font-family: ui-monospace, Consolas, monospace; font-size: .875rem; }

/* Configurador. 2026-11-03: Fases 3 y 4. */
.crms-configurador { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.crms-config-form, .crms-config-propuesta { min-width: 0; }
@media (min-width: 1200px) {
  .crms-configurador { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: start; }
  .crms-config-propuesta { position: sticky; top: 5.5rem; max-height: calc(100vh - 7rem); overflow-y: auto; }
}
.crms-titulo-vivo { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.25rem; overflow-wrap: anywhere; }
.crms-etapa { font-size: 1rem; font-weight: 600; margin: 1rem 0 .5rem; }
.crms-tarjetas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
@media (min-width: 768px) { .crms-tarjetas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1440px) { .crms-tarjetas { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.crms-tarjeta { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; min-height: 6rem; padding: .75rem .5rem; background: rgb(var(--crms-superficie)); border: 1px solid rgb(var(--crms-borde)); border-radius: .5rem; color: rgb(var(--crms-texto)); font: inherit; text-align: center; overflow-wrap: anywhere; }
.crms-tarjeta i { font-size: 1.5rem; color: rgb(var(--crms-texto-suave)); }
.crms-tarjeta:hover { border-color: rgb(var(--crms-primario)); }
.crms-tarjeta.es-activa { background: rgb(var(--crms-primario-suave)); border: 2px solid rgb(var(--crms-primario)); font-weight: 500; }
.crms-tarjeta.es-activa i { color: rgb(var(--crms-enlace)); }
.crms-opcion-bloque + .crms-opcion-bloque { margin-top: 1.25rem; padding-top: .25rem; border-top: 1px solid rgb(var(--crms-borde)); }
.crms-config-acciones { display: flex; flex-wrap: wrap; gap: .75rem; }
.crms-linea { list-style: none; margin: .75rem 0 0; padding: 0; }
.crms-linea-item { display: grid; grid-template-columns: 5.75rem minmax(0, 1fr); gap: .5rem; padding: .5rem 0; border-bottom: 1px solid rgb(var(--crms-borde)); overflow-wrap: anywhere; }
.crms-linea-fecha { color: rgb(var(--crms-texto-suave)); font-size: .875rem; }
.crms-linea-item.es-control { font-weight: 500; }
.crms-linea-item.es-evento { border-bottom: 0; font-family: "Lora", Georgia, serif; font-weight: 500; }

/* Pedido e hitos. 2026-11-03: Fase 4. */
.crms-pedido-rejilla { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; margin-top: 1rem; }
.crms-pedido-rejilla > * { min-width: 0; }
@media (min-width: 1200px) { .crms-pedido-rejilla { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; } }
.crms-hitos { list-style: none; margin: 0; padding: 0; }
.crms-hito { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; padding: .75rem 0 .75rem .75rem; border-bottom: 1px solid rgb(var(--crms-borde)); border-left: 3px solid transparent; }
.crms-hito-cuerpo { flex: 1 1 14rem; min-width: 0; overflow-wrap: anywhere; }
.crms-hito strong { font-weight: 500; }
.crms-hito.es-control { border-left-color: rgb(var(--crms-primario)); }
.crms-hito.es-completado strong { text-decoration: line-through; color: rgb(var(--crms-texto-suave)); }
.crms-hito.es-omitido { opacity: .65; }
.crms-hito.es-vencido strong { color: rgb(var(--crms-enlace)); }
.crms-hito-entrada { width: 10.5rem; flex: none; }
.crms-hito-fecha { width: 10.5rem; flex: none; padding-left: .75rem; }
.crms-menu { background: rgb(var(--crms-elevada)); border-color: rgb(var(--crms-borde)); }
.crms-menu .dropdown-item { color: rgb(var(--crms-texto)); min-height: 2.5rem; }
.crms-menu .dropdown-item:hover, .crms-menu .dropdown-item:focus { background: rgb(var(--crms-primario-suave)); color: rgb(var(--crms-texto)); }
.crms-cambios { text-align: left; padding-left: 1.25rem; }

/* Pipeline */
.crms-tablero { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 1fr); gap: .875rem; overflow-x: auto; padding-bottom: .75rem; }
@media (max-width: 767.98px) { .crms-tablero { grid-auto-flow: row; grid-auto-columns: auto; overflow-x: visible; } }
.crms-columna { min-width: 0; background: rgb(var(--crms-superficie)); border: 1px solid rgb(var(--crms-borde)); border-radius: .5rem; padding: .75rem; }
.crms-columna-titulo { font-size: .9375rem; font-weight: 600; margin-bottom: .625rem; }
.crms-columna-lista { display: grid; gap: .5rem; min-height: 3rem; }
.crms-tarea { display: flex; gap: .625rem; padding: .625rem; background: rgb(var(--crms-fondo)); border: 1px solid rgb(var(--crms-borde)); border-radius: .375rem; cursor: grab; }
.crms-tarea-cuerpo { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.crms-tarea a { color: rgb(var(--crms-texto)); text-decoration: none; }
.crms-tarea a:hover { color: rgb(var(--crms-enlace)); text-decoration: underline; }
.crms-tarea.es-completado a { text-decoration: line-through; color: rgb(var(--crms-texto-suave)); }
.crms-tarea.es-vencido { border-left: 3px solid rgb(var(--crms-primario)); }
.crms-tarea-check { display: flex; align-items: flex-start; min-width: 1.5rem; min-height: 2.5rem; }
.crms-tarea-check .form-check-input { width: 1.25rem; height: 1.25rem; margin: 0; }
.crms-tarea-mover { margin-top: .375rem; min-height: 2.5rem; }

/* Semáforo y carga */
.crms-semaforo { display: inline-block; padding: .125rem .5rem; border-radius: 1rem; font-size: .8125rem; border: 1px solid rgb(var(--crms-borde)); }
.crms-semaforo::before { content: ""; display: inline-block; width: .625rem; height: .625rem; border-radius: 50%; margin-right: .375rem; }
.crms-semaforo-rojo::before { background: #C2243F; }
.crms-semaforo-ambar::before { background: #D99A1C; }
.crms-semaforo-verde::before { background: #2E8B57; }
.crms-carga { list-style: none; margin: 0; padding: 0; display: grid; gap: .375rem; }
.crms-carga li { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr) 3rem; align-items: center; gap: .5rem; font-size: .875rem; }
.crms-carga-barra { width: 100%; height: .75rem; border: 0; border-radius: .25rem; overflow: hidden; background: rgb(var(--crms-primario-suave)); appearance: none; }
.crms-carga-barra::-webkit-progress-bar { background: rgb(var(--crms-primario-suave)); }
.crms-carga-rojo::-webkit-progress-value { background: #C2243F; } .crms-carga-rojo::-moz-progress-bar { background: #C2243F; }
.crms-carga-ambar::-webkit-progress-value { background: #D99A1C; } .crms-carga-ambar::-moz-progress-bar { background: #D99A1C; }
.crms-carga-verde::-webkit-progress-value { background: #2E8B57; } .crms-carga-verde::-moz-progress-bar { background: #2E8B57; }
.crms-carga-num { text-align: right; }

/* El tablero se desplaza dentro de su espacio, sin ensanchar la página. 2026-11-03: Fase 4. */
.crms-contenido { min-width: 0; }
.crms-tablero { width: 100%; max-width: 100%; position: relative; }
@media (min-width: 992px) { .crms-principal { max-width: calc(100vw - 16.5rem); } }

/* Muestra, entrega y constancia. 2026-11-03: Fase 5. */
.crms-galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: .625rem; }
.crms-foto { margin: 0; display: grid; gap: .375rem; }
.crms-foto img { width: 100%; height: 8rem; object-fit: cover; border-radius: .375rem; border: 1px solid rgb(var(--crms-borde)); }
.crms-panel-medio { width: 100%; max-width: 40rem; }
.crms-centrado-alto { min-height: 100vh; display: flex; justify-content: center; align-items: flex-start; padding: 1.5rem 1rem; }
.crms-firma { display: block; width: 100%; max-width: 37.5rem; height: auto; aspect-ratio: 600 / 220; background: #FFFFFF; border: 1px solid rgb(var(--crms-borde)); border-radius: .375rem; touch-action: none; cursor: crosshair; }
.crms-constancia-pagina { max-width: 44rem; margin: 0 auto; padding: 1.5rem 1rem; }
.crms-constancia { background: rgb(var(--crms-superficie)); border: 1px solid rgb(var(--crms-borde)); border-radius: .5rem; padding: 1.5rem; overflow-wrap: anywhere; }
.crms-constancia-datos { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: .375rem .75rem; margin-bottom: 1.25rem; }
.crms-constancia-datos dt { font-weight: 500; }
.crms-constancia-datos dd { margin: 0; }
.crms-constancia-firma { display: block; max-width: 100%; width: 24rem; border-bottom: 1px solid #141012; background: #FFFFFF; }
.crms-constancia-foto { display: block; max-width: 100%; max-height: 18rem; border-radius: .25rem; }
@media print {
  .crms-no-imprimir, .crms-toasts { display: none !important; }
  body { background: #FFFFFF; color: #000000; }
  .crms-constancia { border: 0; padding: 0; background: #FFFFFF; }
}

/* Calendario y Google. 2026-11-03: Fase 6. */
.crms-conflicto { color: rgb(var(--crms-enlace)); font-weight: 500; }
.crms-calendario-fila { padding: .75rem 0; border-bottom: 1px solid rgb(var(--crms-borde)); }
.crms-ev-completado { opacity: .55; text-decoration: line-through; }
#calendario { --fc-border-color: rgb(var(--crms-borde)); --fc-page-bg-color: rgb(var(--crms-superficie)); --fc-neutral-bg-color: rgb(var(--crms-fondo)); --fc-list-event-hover-bg-color: rgb(var(--crms-primario-suave)); --fc-today-bg-color: rgb(var(--crms-primario-suave)); --fc-button-bg-color: transparent; --fc-button-border-color: rgb(var(--crms-borde)); --fc-button-text-color: rgb(var(--crms-texto)); --fc-button-hover-bg-color: rgb(var(--crms-primario-suave)); --fc-button-hover-border-color: rgb(var(--crms-primario)); --fc-button-active-bg-color: rgb(var(--crms-primario)); --fc-button-active-border-color: rgb(var(--crms-primario)); }
#calendario .fc-button { min-height: 2.5rem; color: rgb(var(--crms-texto)); }
#calendario .fc-button-active { color: #141012; }
#calendario .fc-toolbar { flex-wrap: wrap; gap: .5rem; }
#calendario .fc-toolbar-title { font-family: "Lora", Georgia, serif; font-weight: 500; font-size: 1.25rem; }
#calendario a { color: inherit; }

/* Editor de plantilla. 2026-11-03: Fase 8. */
.crms-codigo { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8125rem; line-height: 1.5; white-space: pre; overflow-x: auto; }
