/*
 * Tema visual unificado de ADTECH ERP.
 * Esta capa se carga al final para que los modulos conserven su estructura
 * y consuman una sola identidad visual sin duplicar reglas en templates.
 */
:root {
    --adtech-primary: #1E5A9C;
    --adtech-primary-hover: #184A80;
    --adtech-primary-soft: #EAF2FA;
    --adtech-primary-soft-hover: #DCEAF7;
    --adtech-page-bg: #FFFFFF;
    --adtech-surface: #FFFFFF;
    --adtech-surface-soft: #F8FAFC;
    --adtech-border: #E5E7EB;
    --adtech-border-strong: #D1D5DB;
    --adtech-text: #1F2937;
    --adtech-text-muted: #6B7280;
    --adtech-focus-ring: rgba(30, 90, 156, 0.22);
    --adtech-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    --adtech-radius: 10px;

    /* Alias de compatibilidad para los estilos de los modulos existentes. */
    --adtech-purple: var(--adtech-primary);
    --adtech-purple-hover: var(--adtech-primary-hover);
    --adtech-cyan: var(--adtech-primary);
    --adtech-cyan-hover: var(--adtech-primary-hover);
    --adtech-cyan-bg-card: var(--adtech-primary-soft);
    --adtech-cyan-light: var(--adtech-primary-soft-hover);
    --sidebar-bg: var(--adtech-surface);
    --navy-dark: var(--adtech-text);
    --card-bg: var(--adtech-surface);
    --bg-body: var(--adtech-page-bg);
    --body-bg: var(--adtech-page-bg);

    --ferias-navy: var(--adtech-text);
    --ferias-purple: var(--adtech-primary);
    --ferias-cyan: var(--adtech-primary);
    --ferias-soft: var(--adtech-primary-soft);
    --ferias-border: var(--adtech-border);
    --ferias-muted: var(--adtech-text-muted);

    --client-bg: var(--adtech-page-bg);
    --client-sidebar: var(--adtech-surface);
    --client-text: var(--adtech-text);
    --client-muted: var(--adtech-text-muted);
    --client-purple: var(--adtech-primary);
    --client-purple-hover: var(--adtech-primary-hover);
    --client-aqua: var(--adtech-primary);
    --client-border: var(--adtech-border);
    --client-card: var(--adtech-surface);

    --adtech-btn-primary-bg: var(--adtech-primary);
    --adtech-btn-primary-bg-hover: var(--adtech-primary-hover);
    --adtech-btn-accent-bg: var(--adtech-primary);
    --adtech-btn-accent-bg-hover: var(--adtech-primary-hover);
    --adtech-btn-accent-text: #FFFFFF;
    --adtech-btn-secondary-bg: var(--adtech-surface);
    --adtech-btn-secondary-bg-hover: var(--adtech-surface-soft);
    --adtech-btn-secondary-border: var(--adtech-border);
    --adtech-btn-secondary-text: var(--adtech-text);
    --adtech-btn-focus: var(--adtech-focus-ring);

    --adtech-form-border: var(--adtech-border);
    --adtech-form-border-strong: var(--adtech-border-strong);
    --adtech-form-focus: var(--adtech-primary);
    --adtech-form-focus-soft: var(--adtech-focus-ring);
    --adtech-form-text: var(--adtech-text);
    --adtech-form-muted: var(--adtech-text-muted);
    --adtech-form-bg: var(--adtech-surface);
    --adtech-form-bg-soft: var(--adtech-surface-soft);

    --adtech-modal-bg: var(--adtech-surface);
    --adtech-modal-border: var(--adtech-border);
    --adtech-modal-border-strong: var(--adtech-border-strong);
    --adtech-modal-title: var(--adtech-text);
    --adtech-modal-text: var(--adtech-text);
    --adtech-modal-muted: var(--adtech-text-muted);
    --adtech-modal-soft: var(--adtech-surface-soft);
    --adtech-modal-soft-2: var(--adtech-primary-soft);
    --adtech-modal-shadow: 0 18px 42px rgba(15, 23, 42, 0.12);
    --adtech-modal-shadow-soft: var(--adtech-shadow);

    --bs-primary: var(--adtech-primary);
    --bs-primary-rgb: 30, 90, 156;
    --bs-link-color: var(--adtech-primary);
    --bs-link-hover-color: var(--adtech-primary-hover);
    --bs-focus-ring-color: var(--adtech-focus-ring);
}

body {
    background: var(--adtech-page-bg);
    color: var(--adtech-text);
}

/* Radio compacto de referencia para superficies y controles. */
body :where(
    .card,
    [class$="-card"],
    [class*="-card "],
    .modal-content,
    [class*="modal-content"],
    [class*="modal-shell"],
    [class*="modal-dialog"],
    .table-responsive,
    [class*="table-wrap"],
    [class*="table-container"],
    [class*="table-wrapper"],
    .form-control,
    .form-select,
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea,
    .btn:not(.btn-close),
    button:not(.btn-close),
    [class*="-button"],
    [class*="-btn"]:not(.btn-close),
    .sidebar-item,
    .nav-pill-custom
) {
    border-radius: var(--adtech-radius) !important;
}

/* Estados compactos y elementos que siguen siendo intencionalmente circulares.
   Se excluyen los contenedores estructurales: al ser un selector por subcadena,
   tambien alcanzaba secciones y columnas de layout (p. ej.
   .mis-tareas-state-column.estado-pendiente), que quedaban dibujadas como un
   ovalo gigante detras de su contenido. */
body :where(.badge, [class*="badge"], [class*="status"], [class*="estado"], .chip, .pill):not(:where(
    section, article, aside, header, footer, main, nav,
    form, fieldset, table, thead, tbody, tfoot, tr, th, col, colgroup,
    ul, ol
)) {
    border-radius: 999px !important;
}

body :where(.avatar-circle, .profile-avatar, .rounded-circle, .btn-close) {
    border-radius: 50% !important;
}

body :where(.ventas-action-btn, .adtech-btn-action-sm, .btn-icono-operaciones, .soporte-icon-action, .encuestas-action-icon) {
    border-radius: 50% !important;
}

body :where(a:not(.btn):not(.sidebar-item):not(.nav-link)) {
    color: var(--adtech-primary);
}

body :where(a:not(.btn):not(.sidebar-item):not(.nav-link):hover) {
    color: var(--adtech-primary-hover);
}

/* Navegacion principal: blanca en reposo, azul solo al seleccionar. */
body .sidebar-slim {
    background: var(--adtech-surface);
    border-right-color: var(--adtech-border);
    box-shadow: 4px 0 14px rgba(15, 23, 42, 0.04);
}

body .sidebar-item,
body .toggle-btn {
    color: var(--adtech-text);
}

body .sidebar-item:hover {
    color: var(--adtech-primary);
    background: var(--adtech-primary-soft);
}

body .sidebar-item.active {
    background: var(--adtech-primary);
    color: #FFFFFF;
    box-shadow: none;
    border-radius: var(--adtech-radius);
}

/* Al cargar una página con el sidebar contraído no se anima la transición. */
html.sidebar-sin-animacion .sidebar-slim,
html.sidebar-sin-animacion .sidebar-slim *,
html.sidebar-sin-animacion .main-container {
    transition: none !important;
}

/* Escritorio: el menu queda visible y fijo hasta que se use la flecha superior. */
@media (min-width: 769px) {
    body .sidebar-slim {
        width: var(--sidebar-width-expanded);
    }

    body .sidebar-slim.collapsed {
        width: var(--sidebar-width-slim);
    }

    body .sidebar-slim .menu-text {
        opacity: 1;
        pointer-events: auto;
    }

    body .sidebar-slim.collapsed .menu-text {
        display: none !important;
        opacity: 0;
        pointer-events: none;
    }

    body .main-container {
        margin-left: var(--sidebar-width-expanded);
        width: calc(100% - var(--sidebar-width-expanded));
    }

    body .sidebar-slim.collapsed + .main-container {
        margin-left: var(--sidebar-width-slim);
        width: calc(100% - var(--sidebar-width-slim));
    }

    body .sidebar-slim:not(.collapsed) .sidebar-item.active {
        margin: 4px 10px;
        padding: 12px 18px;
        border-radius: var(--adtech-radius) !important;
    }

    body .sidebar-slim.collapsed .sidebar-item.active {
        margin: 4px 10px !important;
        padding: 12px 18px !important;
        border-radius: var(--adtech-radius) !important;
    }
}

/*
 * Refuerzo global del radio. Bootstrap (`rounded-pill`) y algunas hojas de
 * modulo usan !important, por lo que estas reglas se dejan al final y con
 * la misma prioridad para que todos los controles adopten 10 px.
 */
body .btn:not(.btn-close),
body button:not(.btn-close),
body a.btn,
body [class*="btn-"]:not(.btn-close),
body .rounded-pill,
body .input-group,
body .form-control,
body .form-select,
body input:not([type="checkbox"]):not([type="radio"]),
body select,
body textarea,
body .adtech-date-trigger,
body .adtech-datepicker-popover,
body .adtech-datepicker-month,
body .adtech-datepicker-day,
body .adtech-datepicker-nav button,
body .adtech-datepicker-footer button {
    border-radius: var(--adtech-radius) !important;
}

/* Los elementos que comunican estado o identidad siguen siendo circulares. */
body .avatar-circle,
body .profile-avatar,
body .rounded-circle,
body .btn-close,
body .ventas-action-btn,
body .adtech-btn-action-sm,
body .btn-icono-operaciones,
body .soporte-icon-action,
body .encuestas-action-icon {
    border-radius: 50% !important;
}

/* En modo contraído solo se ajusta el item activo; los demás conservan su layout. */
@media (min-width: 769px) {
    body .sidebar-slim.collapsed .sidebar-item,
    body .sidebar-slim.collapsed .logout-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: calc(100% - 16px);
        margin: 4px 8px !important;
        padding: 0 !important;
        flex: 0 0 48px !important;
    }

    body .sidebar-slim.collapsed .toggle-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        padding: 0 !important;
    }

    body .sidebar-slim.collapsed .sidebar-item.active {
        margin: 4px 8px !important;
        padding: 0 !important;
        flex: 0 0 48px !important;
        border-radius: var(--adtech-radius) !important;
    }

    body .sidebar-slim.collapsed .sidebar-item > i,
    body .sidebar-slim.collapsed .logout-button > i {
        position: static !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 25px !important;
        min-width: 25px !important;
        margin: 0 !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body .sidebar-slim.collapsed .sidebar-item.active > i {
        color: #FFFFFF !important;
    }
}

body .sidebar-item.active:hover,
body .sidebar-item.active:focus-visible {
    background: var(--adtech-primary-hover);
    color: #FFFFFF;
}

body .sidebar-item:focus-visible,
body .toggle-btn:focus-visible {
    outline: 3px solid var(--adtech-focus-ring);
    outline-offset: -2px;
}

/* Acciones principales, incluidas las variantes historicas cyan/moradas. */
body .btn-primary,
body .btn-adtech,
body .btn-adtech-cyan,
body .btn-info,
body .btn-info-light,
body .btn-outline-info:hover,
body .btn-nuevo-proyecto,
body .btn-guardar-operaciones,
body .btn-editar-detalle-operaciones,
body .btn-guardar-automatizacion,
body .adtech-btn-submit,
body .adtech-btn-save,
body .btn-adtech-save,
body .analisis-btn-filter,
body .analisis-btn-export,
body .analisis-export-submit,
body .encuestas-btn-primary,
body .encuestas-btn-secondary,
body .encuestas-btn-dark,
body .propuesta-submit-btn,
body .ventas-save-btn,
body .soporte-btn-primary,
body .adtech-nueva-encuesta-btn,
body .ventas-primary-action,
body .cliente-projects-new,
body .detalle-entregables-add-btn,
body .ferias-primary-button {
    background-color: var(--adtech-primary) !important;
    border-color: var(--adtech-primary) !important;
    color: #FFFFFF !important;
    box-shadow: none;
}

body .btn-primary:hover,
body .btn-adtech:hover,
body .btn-adtech-cyan:hover,
body .btn-info:hover,
body .btn-info-light:hover,
body .btn-outline-info:hover,
body .btn-nuevo-proyecto:hover,
body .btn-guardar-operaciones:hover,
body .btn-editar-detalle-operaciones:hover,
body .btn-guardar-automatizacion:hover,
body .adtech-btn-submit:hover,
body .adtech-btn-save:hover,
body .btn-adtech-save:hover,
body .analisis-btn-filter:hover,
body .analisis-btn-export:hover,
body .analisis-export-submit:hover,
body .encuestas-btn-primary:hover,
body .encuestas-btn-secondary:hover,
body .encuestas-btn-dark:hover,
body .propuesta-submit-btn:hover,
body .ventas-save-btn:hover,
body .soporte-btn-primary:hover,
body .adtech-nueva-encuesta-btn:hover,
body .ventas-primary-action:hover,
body .cliente-projects-new:hover,
body .detalle-entregables-add-btn:hover,
body .ferias-primary-button:hover {
    background-color: var(--adtech-primary-hover) !important;
    border-color: var(--adtech-primary-hover) !important;
    color: #FFFFFF !important;
    box-shadow: none;
}

/* Ferias: misma escala tipografica y lenguaje de acciones que los demas modulos. */
body .ferias-page {
    font-size: 14px;
    line-height: var(--adtech-line-normal, 1.45);
    color: var(--adtech-text);
}

body .ferias-page :where(.ferias-heading h1, .ferias-detail-header h1) {
    color: var(--adtech-text) !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
}

body .ferias-page :where(.ferias-heading p:not(.ferias-eyebrow), .ferias-detail-header p) {
    color: var(--adtech-text-muted) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
}

body .ferias-page :where(
    .ferias-section-heading h2,
    .ferias-summary-card h2,
    .ferias-finance-section h2,
    .ferias-close-record > h2,
    .ferias-close-form > h2,
    .ferias-financial-summary h2,
    .ferias-calendar-header h2,
    .ferias-journeys-heading h2
) {
    color: var(--adtech-text) !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
}

body .ferias-page :where(.ferias-primary-button, .ferias-secondary-button, .ferias-danger-button, .ferias-financial-summary-trigger) {
    min-height: 42px;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: var(--adtech-radius) !important;
    font-size: var(--adtech-text-md, 0.86rem) !important;
    font-weight: var(--adtech-weight-bold, 750) !important;
    line-height: 1.15;
    box-shadow: none !important;
}

body .ferias-page .ferias-secondary-button {
    background: var(--adtech-surface) !important;
    border-color: var(--adtech-border) !important;
    color: var(--adtech-text) !important;
}

body .ferias-page .ferias-secondary-button:hover {
    background: var(--adtech-surface-soft) !important;
    border-color: var(--adtech-border-strong) !important;
    color: var(--adtech-text) !important;
}

body .ferias-page .ferias-danger-button {
    background: #FFF5F5 !important;
    border-color: #FECACA !important;
    color: #B42318 !important;
}

body .ferias-page .ferias-danger-button:hover {
    background: #FEE2E2 !important;
    border-color: #FCA5A5 !important;
    color: #981B12 !important;
}

/* Ferias: todo control con fondo primario debe conservar contraste blanco. */
body .ferias-page :is(
    .ferias-primary-button,
    .ferias-financial-summary-trigger,
    .ferias-state-form button,
    .ferias-incident-state-form button,
    .ferias-attendance-form button
) {
    border-color: var(--adtech-primary) !important;
    background: var(--adtech-primary) !important;
    color: #FFFFFF !important;
}

body .ferias-page :is(
    .ferias-primary-button,
    .ferias-financial-summary-trigger,
    .ferias-state-form button,
    .ferias-incident-state-form button,
    .ferias-attendance-form button
):is(:hover, :focus-visible) {
    border-color: var(--adtech-primary-hover) !important;
    background: var(--adtech-primary-hover) !important;
    color: #FFFFFF !important;
}

body .ferias-page :is(
    .ferias-primary-button,
    .ferias-financial-summary-trigger,
    .ferias-state-form button,
    .ferias-incident-state-form button,
    .ferias-attendance-form button
) :is(i, span) {
    color: inherit !important;
}

body .ferias-page .ferias-row-actions :where(a, button),
body .ferias-page .ferias-icon-button:not(.ferias-icon-button--danger) {
    min-height: 34px;
    border: 1px solid var(--adtech-border) !important;
    border-radius: var(--adtech-radius) !important;
    background: var(--adtech-surface) !important;
    color: var(--adtech-primary) !important;
    box-shadow: none !important;
}

body .ferias-page .ferias-row-actions :where(a, button):hover,
body .ferias-page .ferias-icon-button:not(.ferias-icon-button--danger):hover {
    background: var(--adtech-primary-soft) !important;
    border-color: var(--adtech-primary) !important;
    color: var(--adtech-primary) !important;
}

body .ferias-page .ferias-icon-button--danger {
    border-color: #FECACA !important;
    background: #FFF5F5 !important;
    color: #B42318 !important;
}

body .btn:disabled,
body button:disabled,
body .btn.disabled,
body button.disabled {
    background: #F3F4F6 !important;
    border-color: #E5E7EB !important;
    color: #9CA3AF !important;
    opacity: 1;
    box-shadow: none !important;
}

body .btn:focus-visible,
body button:focus-visible,
body a.btn:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--adtech-focus-ring) !important;
}

/* Tabs, paginacion y elementos de seleccion. */
body .nav-tabs-custom .nav-link.active,
body .nav-pills .nav-link.active,
body .nav-tabs .nav-link.active,
body .tab-indicator,
body .operaciones-tab-indicator,
body .page-item.active .page-link,
body .adtech-page-btn.active,
body .btn-pagina-notificacion.active,
body .btn-pagina-notificacion.is-active,
body .btn-pagina-notificacion[aria-current="page"],
body .paginacion-botones > .active,
body .paginacion-botones > [aria-current="page"] {
    background-color: var(--adtech-primary) !important;
    border-color: var(--adtech-primary) !important;
    color: #FFFFFF !important;
}

body .nav-tabs-custom .nav-link.active,
body .nav-tabs .nav-link.active {
    background: transparent !important;
    color: var(--adtech-text) !important;
}

/* Todas las secciones de Marketing comparten el mismo tamaño en sus tabs. */
@media (min-width: 769px) {
    body .content-area .tabs-wrapper .nav-tabs-custom .nav-link {
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 1.5 !important;
    }
}

body [class*="tab-indicator"] {
    background-color: var(--adtech-primary) !important;
}

body .btn-outline-info {
    color: var(--adtech-primary) !important;
    border-color: var(--adtech-primary) !important;
}

body .nav-tabs-custom .nav-link:focus-visible,
body .nav-tabs .nav-link:focus-visible,
body .page-link:focus-visible {
    outline: 3px solid var(--adtech-focus-ring);
    outline-offset: 2px;
}

/* Superficies y cards: bordes limpios y sombra discreta. */
body :where(
    .card,
    .metric-card,
    .metric-card-operaciones,
    .analisis-card,
    .analisis-kpi-card,
    .encuestas-stat-card,
    .adtech-dashboard-table-wrap,
    .tabla-operaciones,
    .ferias-filter-card,
    .ferias-form-card,
    .ferias-summary-card,
    .marketing-filter-panel,
    .campaign-filter-card
) {
    background-color: var(--adtech-surface);
    border-color: var(--adtech-border);
    box-shadow: var(--adtech-shadow);
}

body :where(
    .metric-card,
    .metric-card-operaciones,
    .metric-card-detalle,
    .analisis-card,
    .analisis-kpi-card,
    .encuestas-stat-card
) :where(.metric-value, .metric-number, h2, h3, .kpi-value, .stat-value) {
    color: var(--adtech-primary);
}

body :where(.analisis-kpi-card, .encuestas-stat-card) strong {
    color: var(--adtech-primary);
}

/* Ventas y Operaciones comparten la base visual de Marketing: superficies
   blancas, borde sutil y tipografía oscura. Los badges de estado conservan
   sus colores semánticos en sus propias reglas. */
body .content-area :where(
    .ventas-stat-card,
    .ventas-table-card,
    .adtech-cliente-proto-card,
    .header-opportunity-card,
    .adtech-detail-card,
    .ventas-form-section-card,
    .closure-option-card,
    .propuesta-section-card,
    .propuesta-summary-card,
    .propuesta-detalle-card,
    .mis-tareas-project-card,
    .mis-tareas-task-card,
    .ticket-asignado-card,
    .metric-card-operaciones,
    .soporte-stat-card,
    .soporte-filtros-card,
    .soporte-table-card,
    .encuestas-stat-card,
    .encuestas-table-card,
    .detalle-equipo-owner-card,
    .detalle-equipo-distribution-card,
    .detalle-prototipo-side-card,
    .detalle-prototipo-metrica,
    .adtech-file-card,
    .adtech-services-card,
    .adtech-side-card,
    .crear-proyecto-side-card,
    .servicios-formset-card
) {
    background: var(--adtech-surface) !important;
    border-color: var(--adtech-border) !important;
    color: var(--adtech-text) !important;
    box-shadow: var(--adtech-shadow) !important;
}

body .content-area :where(
    .ventas-stat-card,
    .metric-card-operaciones,
    .soporte-stat-card,
    .encuestas-stat-card
) :where(p, span:not([class*="badge"]), strong, h1, h2, h3, h4, h5, h6, .metric-value, .metric-number, .kpi-value, .stat-value) {
    color: var(--adtech-text) !important;
}

/* ADTECH: tarjetas de tareas del kanban de proyecto en azul claro con texto oscuro,
   siguiendo la paleta del tema (antes quedaban en texto blanco ilegible). */
body .content-area .detalle-tareas-column-body .detalle-tarea-card {
    background: var(--adtech-primary-soft) !important;
    border: 1px solid var(--adtech-border) !important;
    color: var(--adtech-text) !important;
    box-shadow: var(--adtech-shadow) !important;
}

body .content-area .detalle-tareas-column-body .detalle-tarea-card :where(h4, p),
body .content-area .detalle-tareas-column-body .detalle-tarea-card .detalle-tarea-card-meta span,
body .content-area .detalle-tareas-column-body .detalle-tarea-card .detalle-tarea-card-meta strong,
body .content-area .detalle-tareas-column-body .detalle-tarea-card .detalle-tarea-card-actions button {
    color: var(--adtech-text) !important;
}

body .content-area .detalle-tareas-column-body .detalle-tarea-card .detalle-tarea-card-meta span {
    color: #5b6b82 !important;
}

body :where(.encuestas-template-card.active, .analisis-export-option.active) {
    background: var(--adtech-primary-soft) !important;
    border-color: var(--adtech-primary) !important;
    box-shadow: 0 0 0 1px var(--adtech-focus-ring) !important;
}

body :where(.encuestas-link-copy:not(:disabled), .adtech-cliente-prototype-pills span) {
    background: var(--adtech-primary-soft) !important;
    border-color: var(--adtech-primary) !important;
    color: var(--adtech-primary) !important;
}

body :where(.analisis-ferias-ranking li strong, .analisis-ferias-link) {
    color: var(--adtech-primary) !important;
}

body :where(
    .metric-icon,
    .metric-card-icon,
    .dashboard-icon,
    .analisis-metric-icon,
    .icon-purple,
    .avatar-circle,
    .profile-avatar
) {
    color: var(--adtech-primary);
}

body :where(.avatar-circle, .profile-avatar) {
    background: var(--adtech-primary);
    color: #FFFFFF;
    box-shadow: none;
}

/* Formularios y datepicker: foco azul suave, sin celestes saturados. */
body :where(input, select, textarea, .form-control, .form-select):focus {
    border-color: var(--adtech-primary) !important;
    box-shadow: 0 0 0 0.18rem var(--adtech-focus-ring) !important;
}

body .adtech-date-trigger:focus-visible,
body .adtech-date-trigger.is-open,
body .adtech-datepicker-year-control input:focus,
body .adtech-datepicker-month.is-selected,
body .adtech-datepicker-day.is-selected {
    border-color: var(--adtech-primary) !important;
    background-color: var(--adtech-primary) !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 0 0.18rem var(--adtech-focus-ring) !important;
}

body .adtech-datepicker-title:hover,
body .adtech-datepicker-nav button:hover,
body .adtech-datepicker-month:hover,
body .adtech-datepicker-day:hover,
body .adtech-datepicker-footer button:hover {
    background: var(--adtech-primary-soft) !important;
    color: var(--adtech-primary) !important;
}

/* Acciones secundarias y retornos conservan un tratamiento neutro. */
body .ferias-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 16px;
    border: 1px solid var(--adtech-border) !important;
    border-radius: var(--adtech-radius) !important;
    background: var(--adtech-surface) !important;
    color: var(--adtech-text) !important;
    font-size: var(--adtech-text-md, 0.86rem);
    font-weight: var(--adtech-weight-bold, 750);
    line-height: 1.15;
    text-decoration: none;
    box-shadow: 0 3px 8px rgba(15, 23, 42, 0.08) !important;
}

body .ferias-back-link:hover {
    background: var(--adtech-surface-soft) !important;
    border-color: var(--adtech-border-strong) !important;
    color: var(--adtech-text) !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.10) !important;
}

/* Ferias: nombres de registros en el color principal de texto y calendario
   sobrio; el azul queda reservado únicamente para el número del día actual. */
body .ferias-page :where(.ferias-event-link, .ferias-provider-link, .ferias-provider-link:hover) {
    color: var(--adtech-text) !important;
    text-decoration: none;
}

body .ferias-page .ferias-calendar-day.is-today {
    background: transparent !important;
    box-shadow: none !important;
}

body .ferias-page :where(
    .ferias-calendar-event,
    .ferias-calendar-event--en_progreso,
    .ferias-calendar-event--en_revision,
    .ferias-calendar-event--completada,
    .ferias-calendar-event.is-blocked,
    .ferias-global-calendar-event--agenda,
    .ferias-global-calendar-event--agenda:hover,
    .ferias-global-calendar-event--agenda:focus
) {
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--adtech-text) !important;
}

body .ferias-page .ferias-calendar-day.is-today .ferias-calendar-number {
    background: var(--adtech-primary) !important;
    color: #FFFFFF !important;
}

body :where(
    .btn-regresar-operaciones,
    .ferias-back-link,
    .btn-limpiar-operaciones,
    .adtech-back-btn,
    .adtech-back-soft,
    .marketing-back-btn,
    .campaign-detail-back-btn,
    .btn-back-pill
) {
    background: var(--adtech-surface-soft) !important;
    border-color: var(--adtech-border) !important;
    color: var(--adtech-text) !important;
    box-shadow: none !important;
}

body :where(
    .btn-regresar-operaciones,
    .ferias-back-link,
    .btn-limpiar-operaciones,
    .adtech-back-btn,
    .adtech-back-soft,
    .marketing-back-btn,
    .campaign-detail-back-btn,
    .btn-back-pill
):hover {
    background: var(--adtech-primary-soft) !important;
    color: var(--adtech-primary) !important;
}

/* El portal comparte la misma identidad sin alterar estados semanticos. */
body.client-portal-body {
    --client-bg: var(--adtech-page-bg);
    --client-sidebar: var(--adtech-surface);
    --client-purple: var(--adtech-primary);
    --client-purple-hover: var(--adtech-primary-hover);
    --client-aqua: var(--adtech-primary);
    --client-border: var(--adtech-border);
    --client-card: var(--adtech-surface);
    --client-text: var(--adtech-text);
    --client-muted: var(--adtech-text-muted);
}

body.client-portal-body .client-sidebar {
    background: var(--adtech-surface);
    border-color: var(--adtech-border);
}

body.client-portal-body .client-nav a {
    color: var(--adtech-text);
}

body.client-portal-body .client-nav a:hover {
    background: var(--adtech-primary-soft);
    color: var(--adtech-primary);
}

body.client-portal-body .client-nav a.active,
body.client-portal-body .client-logout button {
    background: var(--adtech-primary);
    color: #FFFFFF;
}

/* Los controles de acción del portal usan fondo primario tras aplicar el tema.
   Su texto debe conservar contraste blanco y no heredar el azul de los enlaces. */
body.client-portal-body :where(
    .client-page-head > a,
    .client-page-head > button,
    .client-section-head a,
    .client-row a,
    .client-card-footer a,
    .client-proposal-head a,
    .client-ticket-table td a,
    .client-file-action,
    .client-message-form button,
    .client-inline-form button,
    .client-ticket-form button
) {
    color: #FFFFFF;
}

body.client-portal-body :where(
    .client-page-head > a,
    .client-section-head a,
    .client-row a,
    .client-card-footer a,
    .client-proposal-head a,
    .client-ticket-table td a,
    .client-file-action
):hover {
    color: #FFFFFF;
}

/* Selector de modulos y acceso: mismos tokens, sin gradientes dominantes. */
body .adtech-header {
    background: var(--adtech-surface);
    color: var(--adtech-text);
    border-bottom: 1px solid var(--adtech-border);
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04) !important;
}

body .adtech-module-brand {
    color: var(--adtech-text);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.01em;
}

@media (max-width: 480px) {
    body .adtech-module-brand {
        max-width: 170px;
        font-size: 0.8rem;
    }
}

body .modulo-card {
    background: var(--adtech-surface);
    border-color: var(--adtech-border);
    box-shadow: var(--adtech-shadow) !important;
}

body .modulo-card:hover {
    border-left-color: var(--adtech-primary);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.10) !important;
}

body .login-container {
    border: 1px solid var(--adtech-border);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

body .input-group-custom {
    background: var(--adtech-surface-soft);
    border: 1px solid var(--adtech-border);
    color: var(--adtech-text);
}

body .input-group-custom:focus {
    box-shadow: 0 0 0 3px var(--adtech-focus-ring);
    border-color: var(--adtech-primary);
}

body .password-toggle:hover,
body .password-toggle:focus-visible {
    color: var(--adtech-primary);
    background: var(--adtech-primary-soft);
}

body .btn-ingresar {
    background: var(--adtech-primary);
}

body .btn-ingresar:hover {
    background: var(--adtech-primary-hover);
}

/* Resumen superior: superficie neutra, sin relleno celeste ni color de acento. */
body .metric-card {
    background: var(--adtech-surface) !important;
    border: 1px solid var(--adtech-border) !important;
    box-shadow: none !important;
}

body .metric-card :where(small, span, strong, h2, h3, .metric-value, .text-secondary, .text-info) {
    color: var(--adtech-text) !important;
}

/*
 * Tablas de Marketing: se priorizan las columnas finales para que responsable
 * y acciones no se compriman. Si el espacio disponible es menor, el contenedor
 * se desplaza horizontalmente en vez de deformar el contenido.
 */
@media (min-width: 769px) {
    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table-wrap {
        overflow-x: auto !important;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    /* Anchos en px calculados para el valor más largo de cada columna
       (p. ej. "Registro de evento", "Convertido"); suman el min-width. */
    body .marketing-leads-page .adtech-dashboard-table {
        min-width: 1450px;
        table-layout: fixed;
    }

    body .marketing-leads-page .adtech-col-lead-nombre { width: 160px; }
    body .marketing-leads-page .adtech-col-lead-empresa { width: 140px; }
    body .marketing-leads-page .adtech-col-lead-campana { width: 160px; }
    body .marketing-leads-page .adtech-col-lead-canal { width: 160px; }
    body .marketing-leads-page .adtech-col-lead-estado { width: 140px; }
    body .marketing-leads-page .adtech-col-lead-prioridad { width: 115px; }
    body .marketing-leads-page .adtech-col-lead-reunion { width: 135px; }
    body .marketing-leads-page .adtech-col-lead-responsable { width: 210px; }
    body .marketing-leads-page .adtech-col-lead-acciones { width: 130px; }

    body .marketing-campaigns-page .adtech-dashboard-table {
        min-width: 1210px;
        table-layout: fixed;
    }

    body .marketing-campaigns-page .campaign-col-name { width: 19%; }
    body .marketing-campaigns-page .campaign-col-status { width: 11%; }
    body .marketing-campaigns-page .campaign-col-date { width: 10%; }
    body .marketing-campaigns-page .campaign-col-count { width: 8%; }
    body .marketing-campaigns-page .campaign-col-owner { width: 12%; }
    body .marketing-campaigns-page .campaign-col-actions { width: 10%; }

    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table th:nth-child(8),
    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table td:nth-child(8),
    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table th:last-child,
    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table td:last-child {
        white-space: nowrap;
    }

    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table td:nth-child(8) .d-flex,
    body :where(.marketing-leads-page, .marketing-campaigns-page) .adtech-dashboard-table td:last-child .d-inline-flex {
        flex-wrap: nowrap;
    }
}

/* La tabla de leads ya se desplaza horizontalmente: las palabras solo pasan
   de línea entre espacios y las etiquetas/fechas no se parten. */
body .marketing-leads-page .adtech-dashboard-table :where(th, td, td *) {
    overflow-wrap: normal;
    word-break: normal;
}

body .marketing-leads-page .adtech-dashboard-table .adtech-badge,
body .marketing-leads-page .adtech-dashboard-table td:nth-child(7) small {
    white-space: nowrap;
}