diff --git a/Custom/CCopiaSec b/Custom/CCopiaSec
new file mode 100644
index 0000000..fc4610f
--- /dev/null
+++ b/Custom/CCopiaSec
@@ -0,0 +1,10899 @@
+/* . */
+/* -------------------GUIA DE INSTALACION---------------------------
+
+ARCHIVO: custom.css
+UBICACION: /srv/www/htdocs/agc/css/custom.css
+
+METODO DE INSTALACION (ORDEN DE PRIORIDAD):
+
+1. METODO PRINCIPAL (Recomendado - Cubre la mayoria de archivos):
+ Agregar al final de /srv/www/htdocs/vicidial/vicidial_stylesheet.php (linea ~881):
+
+ @import url('../agc/css/custom.css');
+
+ Este metodo cubre automaticamente todos los archivos que usan vicidial_stylesheet.php
+ (aproximadamente 101 archivos PHP).
+
+2. METODO SECUNDARIO (Para archivos que no usan vicidial_stylesheet.php):
+ Agregar en /srv/www/htdocs/vicidial/admin_header.php (linea ~1951, antes de ):
+
+ echo "\n";
+
+ Este metodo cubre archivos que usan admin_header.php pero no vicidial_stylesheet.php
+ (aproximadamente 142 archivos PHP).
+
+3. IMPORTACIONES DIRECTAS (Solo para archivos especiales):
+ Para archivos que NO usan ni vicidial_stylesheet.php ni admin_header.php,
+ agregar directamente en el del archivo:
+
+
+
+ Archivos conocidos que requieren importacion directa:
+ - /srv/www/htdocs/vicidial/realtime_report.php (linea ~2104)
+ - /srv/www/htdocs/vicidial/welcome.php (linea ~114)
+ - /srv/www/htdocs/vicidial/hci_screen.php (linea ~963)
+
+CONFIGURACIONES ADICIONALES:
+
+- Poner placeholder="Phone Login" en input - Linea 1737 vicidial.php
+- Poner placeholder="Phone Password" en input - Linea 1739 vicidial.php
+
+NOTA: Si un archivo usa tanto vicidial_stylesheet.php como admin_header.php,
+solo necesita el metodo 1 (@import en vicidial_stylesheet.php) para funcionar.
+
+ ------------------------------------------------------------*/
+
+/* Variables de colores globales - disponibles para todos los componentes */
+:root {
+ /* Colores principales - Paleta ViciDial (Teal/Verde Azulado) */
+ --color-primary-dark: #2E7D7D; /* Teal oscuro - forma curva izquierda */
+ --color-primary-light: #20B2AA; /* Teal claro brillante - forma curva derecha y punto */
+ --color-primary-medium: #008B8B; /* Teal medio - intermedio */
+ --color-primary-lightest: #48D1CC; /* Teal muy claro - acentos */
+ --color-text-dark: #2D2D2D; /* Gris oscuro/carbón - texto */
+ --color-text-light: #ffffff; /* Blanco - texto sobre fondos oscuros */
+ --color-bg-white: #ffffff; /* Blanco - fondo */
+ --color-bg-light: #B0E0E6; /* Teal muy claro - fondos suaves */
+ --color-bg-lighter: #E0F7FA; /* Teal casi blanco - fondos muy suaves */
+
+ /* Colores de sombras */
+ --shadow-light: rgba(45, 45, 45, 0.25);
+ --shadow-medium: rgba(45, 45, 45, 0.35);
+ --shadow-text: rgba(45, 45, 45, 0.2);
+ --shadow-primary: rgba(32, 178, 170, 0.3); /* Sombra con color teal */
+ --shadow-white: rgba(255, 255, 255, 0.4);
+
+ /* Colores de fondo decorativo */
+ --bg-decorative-1: rgba(32, 178, 170, 0.1); /* Teal claro transparente */
+ --bg-decorative-2: rgba(0, 139, 139, 0.1); /* Teal medio transparente */
+ --bg-white-transparent: rgba(255, 255, 255, 0.6);
+
+ /* Tamaños de fuente - Sistema de tipografía semántico */
+ --font-size-h1: 14px; /* H1 - Títulos principales (18-22px) */
+ --font-size-h2: 14px; /* H2 - Subtítulos (14-16px) */
+ --font-size-p1: 14px; /* P1 - Texto principal (12-13px) */
+ --font-size-p2: 14px; /* P2 - Texto secundario (9-11px) */
+
+ /* Familia de fuente - Unificada */
+ --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+}
+
+
+/* Reset de estilos - Prioridad máxima sobre otros CSS */
+html body * {
+ box-sizing: border-box !important;
+}
+
+/* Reset de enlaces - Eliminar color azul y decoración por defecto */
+html body a,
+html body a:link,
+html body a:visited {
+ text-decoration: none !important;
+ outline: none !important;
+}
+
+
+/* Asegurar que html y body ocupen toda la altura de manera responsive */
+html {
+ height: 100% !important;
+ overflow-x: hidden !important;
+ max-width: 100% !important;
+}
+
+body {
+ margin: 0 !important;
+ padding: 0 !important;
+ min-height: 100vh !important;
+ height: auto !important;
+ overflow-x: hidden !important;
+ max-width: 100% !important;
+ width: 100% !important;
+}
+
+
+/* WELCOME COMPONENT --------------------------------------------------------------------*/
+
+/* -------------------Guia de instalacion--------------------------- */
+/* *{
+ border: 1px solid red;
+} */
+
+
+/* Contenedor del componente - detecta automáticamente la tabla de bienvenida (NO dentro de formularios) */
+html body:has(> center > table[width="460px"] .sh_text_white):not(:has(form#vicidial_form)),
+html body:has(> center > table[width="460px"] .skb_text):not(:has(form#vicidial_form)) {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ min-height: 100vh !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ padding: 15px !important;
+ margin: 0 !important;
+ position: relative !important;
+}
+
+/* Ocultar tabla vacía solo cuando está relacionada con welcome-modern (NO dentro de formularios) */
+html body:has(> center > table[width="460px"] .sh_text_white):not(:has(form#vicidial_form)) > table[width="100%"],
+html body:has(> center > table[width="460px"] .skb_text):not(:has(form#vicidial_form)) > table[width="100%"] {
+ display: none !important;
+}
+
+/* Eliminar efectos de los br solo cuando están relacionados con welcome-modern (NO dentro de formularios) */
+html body:has(> center > table[width="460px"] .sh_text_white):not(:has(form#vicidial_form)) > br,
+html body:has(> center > table[width="460px"] .skb_text):not(:has(form#vicidial_form)) > br {
+ display: none !important;
+}
+
+/* Centrar el contenedor center solo cuando contiene welcome-modern (NO dentro de formularios) */
+html body:has(> center > table[width="460px"] .sh_text_white):not(:has(form#vicidial_form)) > center:has(table[width="460px"]),
+html body:has(> center > table[width="460px"] .skb_text):not(:has(form#vicidial_form)) > center:has(table[width="460px"]) {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 100% !important;
+ height: 100vh !important;
+ position: absolute !important;
+ top: 0 !important;
+ left: 0 !important;
+}
+
+/* Estilos para la tabla principal del componente - detecta automáticamente (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) {
+ background: var(--color-bg-white) !important;
+ border-radius: 16px !important;
+ box-shadow: 0 15px 40px var(--shadow-light) !important;
+ overflow: hidden !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ width: auto !important;
+ min-width: 380px !important;
+ max-width: 100% !important;
+ transition: transform 0.3s ease, box-shadow 0.3s ease !important;
+ margin: 0 auto !important;
+ display: block !important;
+ box-sizing: border-box !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text):hover {
+ transform: translateY(-3px) !important;
+ box-shadow: 0 18px 50px var(--shadow-medium) !important;
+}
+
+/* Header moderno - solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child {
+ display: block !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+ table-layout: auto !important;
+}
+
+/* Estilos generales para celdas del header - se sobrescriben con selectores específicos */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child td {
+ background: transparent !important;
+ padding: 16px !important;
+ border: none !important;
+ display: block !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ margin: 0 !important;
+ box-sizing: border-box !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child td:first-child {
+ border-radius: 0 !important;
+ padding: 16px 16px 8px 16px !important;
+ text-align: center !important;
+ display: block !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ background: var(--color-bg-white) !important;
+ overflow: visible !important;
+ float: none !important;
+ clear: both !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text):not(form center > table) tr:first-child td:last-child {
+ border-radius: 0 !important;
+ padding: 0 16px 16px 16px !important;
+ text-align: center !important;
+ display: block !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ background: var(--color-bg-white) !important;
+ float: none !important;
+ clear: both !important;
+}
+
+/* Logo y texto del header - solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child img {
+ border-radius: 6px !important;
+ transition: transform 0.3s ease !important;
+ height: 100px !important;
+ width: auto !important;
+ max-width: 180px !important;
+ display: block !important;
+ margin: 0 auto !important;
+ text-align: center !important;
+ box-sizing: border-box !important;
+ object-fit: contain !important;
+ visibility: visible !important;
+ opacity: 1 !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child img:hover {
+ transform: scale(1.03) !important;
+}
+
+/* Texto Welcome - verde, solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .sh_text_white {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-h1) !important;
+ font-weight: 600 !important;
+ letter-spacing: 0.5px !important;
+ text-align: center !important;
+ display: none !important;
+ width: none !important;
+ max-width: none !important;
+ box-sizing: border-box !important;
+ margin: 0 !important;
+ padding: 0 !important;
+
+}
+/* Ocultar la celda completa que contiene "Welcome" (solo en welcome, no en formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) td:has(.sh_text_white) {
+ display: none !important;
+}
+
+/* Espaciadores modernos - solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr td[colspan="2"] font[size="1"] {
+ display: none !important;
+}
+
+/* Contenedor para botones en horizontal (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tbody {
+ display: block !important;
+ padding: 12px !important;
+ text-align: center !important;
+}
+
+/* Filas de botones - hacer que se muestren en línea (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:not(:first-child) {
+ display: inline-block !important;
+ vertical-align: top !important;
+ margin: 0 !important;
+}
+
+/* Celdas con botones (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:not(:first-child) td[colspan="2"] {
+ display: block !important;
+}
+
+/* Enlaces de navegación modernos - solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text {
+ display: inline-block !important;
+ color: var(--color-text-light) !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 500 !important;
+ padding: 0 !important;
+ margin: 8px 6px !important;
+ background: var(--color-primary-light) !important;
+ border-radius: 10px !important;
+ border: 2px solid var(--color-primary-light) !important;
+ transition: all 0.3s ease !important;
+ cursor: pointer !important;
+ text-decoration: none !important;
+ position: relative !important;
+ overflow: hidden !important;
+ white-space: nowrap !important;
+ min-width: 100px !important;
+ text-align: center !important;
+}
+
+/* Hacer que los enlaces dentro de skb_text ocupen todo el espacio del botón (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text a {
+ display: block !important;
+ width: 100% !important;
+ color: var(--color-text-light) !important;
+ text-decoration: none !important;
+ padding: 10px 14px !important;
+ margin: 0 !important;
+ position: relative !important;
+ z-index: 1 !important;
+ box-sizing: border-box !important;
+ line-height: 1.4 !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text::before {
+ content: '' !important;
+ position: absolute !important;
+ top: 0 !important;
+ left: -100% !important;
+ width: 100% !important;
+ height: 100% !important;
+ background: var(--shadow-white) !important;
+ transition: left 0.5s ease !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text:hover {
+ background: var(--color-primary-medium) !important;
+ transform: translateY(-2px) !important;
+ box-shadow: 0 6px 16px var(--shadow-primary) !important;
+ border-color: var(--color-primary-medium) !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text):not(form center > table) .skb_text:hover a {
+ color: var(--color-text-light) !important;
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text:hover::before {
+ left: 100% !important;
+}
+
+/* Celdas de la tabla - solo dentro de welcome (NO dentro de formularios) */
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) td {
+ border: none !important;
+ box-sizing: border-box !important;
+}
+
+/* Responsive - solo para welcome-modern (NO dentro de formularios) */
+@media (max-width: 480px) {
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) {
+ width: 100% !important;
+ min-width: auto !important;
+ border-radius: 12px !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text {
+ font-size: var(--font-size-p1) !important;
+ padding: 0 !important;
+ margin: 6px 4px !important;
+ min-width: 80px !important;
+ display: block !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .skb_text a {
+ display: block !important;
+ width: 100% !important;
+ padding: 8px 12px !important;
+ line-height: 1.4 !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tbody {
+ flex-direction: column !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr td[colspan="2"] {
+ display: block !important;
+ width: 100% !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) .sh_text_white {
+ font-size: var(--font-size-h1) !important;
+ }
+
+ html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) tr:first-child td {
+ padding: 12px !important;
+ }
+}
+
+/* Animación de entrada - solo para welcome */
+@keyframes welcome-modern-fadeInUp {
+ from {
+ opacity: 0 !important;
+ transform: translateY(30px) !important;
+ }
+ to {
+ opacity: 1 !important;
+ transform: translateY(0) !important;
+ }
+}
+
+html body > center > table[width="460px"]:has(.sh_text_white):has(.skb_text) {
+ animation: welcome-modern-fadeInUp 0.6s ease-out !important;
+}
+
+/* Fondo decorativo - solo cuando existe welcome (NO dentro de formularios) */
+html body:has(> center > table[width="460px"] .sh_text_white):not(:has(form#vicidial_form))::before,
+html body:has(> center > table[width="460px"] .skb_text):not(:has(form#vicidial_form))::before {
+ content: '' !important;
+ position: fixed !important;
+ top: 0 !important;
+ left: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ background: transparent !important;
+ pointer-events: none !important;
+ z-index: -1 !important;
+}
+
+
+
+/* Phone Login Component --------------------------------------------------------------------*/
+
+
+
+/* ==========================================================================
+ CONTENEDOR PRINCIPAL
+ ========================================================================== */
+body:has(form#vicidial_form) {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 15px;
+ margin: 0;
+ position: relative;
+ width: 100%;
+ box-sizing: border-box;
+}
+
+/* ==========================================================================
+ ENLACE TIMECLOCK
+ ========================================================================== */
+body:has(form#vicidial_form) > a {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ text-decoration: none;
+ z-index: 10;
+}
+
+body:has(form#vicidial_form) .sb_text {
+ color: var(--color-primary-light) !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 500 !important;
+ transition: color 0.3s ease;
+}
+
+body:has(form#vicidial_form) > a:hover .sb_text {
+ color: var(--color-primary-medium) !important;
+}
+
+/* ==========================================================================
+ ELEMENTOS OCULTOS
+ ========================================================================== */
+body:has(form#vicidial_form) > table[width="100%"] {
+ display: none;
+}
+
+body:has(form#vicidial_form) > br {
+ display: none;
+}
+
+/* ==========================================================================
+ CONTENEDOR DEL FORMULARIO
+ ========================================================================== */
+body:has(form#vicidial_form) form {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ min-height: 100vh;
+ margin: 0;
+ padding: 0;
+}
+
+body:has(form#vicidial_form) form > center {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ min-height: 100vh;
+ position: relative;
+ margin: 0;
+ padding: 0;
+ padding-left: 15px;
+}
+
+/* ==========================================================================
+ TABLA PRINCIPAL
+ ========================================================================== */
+body:has(form#vicidial_form) form center > table[width="460px"] {
+ background: var(--color-bg-white) !important;
+ border-radius: 16px;
+ box-shadow: 0 15px 40px var(--shadow-light);
+ overflow: hidden;
+ border: none !important;
+ border-collapse: collapse !important;
+ width: 460px !important;
+ max-width: 100%;
+ margin-left: calc(50% - 230px + 15px) !important;
+ margin-right: auto !important;
+ display: table;
+ box-sizing: border-box;
+ position: relative;
+ animation: login-modern-fadeInUp 0.6s ease-out;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:not(:first-child) td {
+ text-align: center !important;
+}
+
+/* ==========================================================================
+ HEADER - LOGO Y TÍTULO
+ ========================================================================== */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child {
+ display: block;
+ width: 100%;
+ box-sizing: border-box;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child td {
+ background: transparent !important;
+ padding: 16px !important;
+ border: none !important;
+ display: block;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ margin: 0 !important;
+ box-sizing: border-box !important;
+}
+
+/* Contenedor del logo - mostrar nuevo logo como background */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child td:first-child {
+ border-radius: 0;
+ padding: 16px 16px 8px 16px !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ background-image: url('../../vicidial/images/vicidial_admin_web_logo.png?v=2') !important;
+ background-size: 140px auto !important;
+ background-repeat: no-repeat !important;
+ background-position: center !important;
+ min-height: 140px !important;
+ height: 140px !important;
+ position: relative !important;
+ margin-top: 10px !important;
+}
+/* Ocultar fila espaciadora td align="left" colspan="2" con font size="1" */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(td[align="left"][colspan="2"] font[size="1"]) {
+ display: none !important;
+}
+
+/* Ocultar imagen vieja del logo (vdc_tab_vicidial.gif) */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child td:first-child img {
+ display: none !important;
+ visibility: hidden !important;
+ opacity: 0 !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child td:last-child {
+ border-radius: 0;
+ padding: 0 16px 8px 16px !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child img {
+ border-radius: 6px;
+ transition: transform 0.3s ease;
+ height: auto !important;
+ max-height: 45px !important;
+ width: auto !important;
+ max-width: 180px !important;
+ display: block !important;
+ margin: 0 auto !important;
+ text-align: center !important;
+ box-sizing: border-box;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child img:hover {
+ transform: scale(1.03);
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] .sh_text_white {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-h1) !important;
+ font-weight: 600 !important;
+ letter-spacing: 0.5px;
+ text-transform: uppercase !important;
+ text-align: center !important;
+ display: block;
+ width: 100%;
+ max-width: 100%;
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+}
+
+/* ==========================================================================
+ FORMULARIO - INPUTS Y BOTONES
+ ========================================================================== */
+body:has(form#vicidial_form) form center > table[width="460px"] tr td[colspan="2"] font[size="1"] {
+ display: none;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:not(:first-child):not(:last-child) {
+ display: table-row;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:not(:first-child):not(:last-child) td {
+ padding: 12px 16px !important;
+ border: none !important;
+ box-sizing: border-box !important;
+ text-align: center !important;
+}
+
+/* Labels ocultos - Phone Login y Phone Password */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_login"]) td:first-child,
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_pass"]) td:first-child {
+ display: none !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_login"]),
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_pass"]) {
+ display: table-row;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_login"]) td:last-child,
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="phone_pass"]) td:last-child {
+ text-align: center !important;
+ width: 100% !important;
+ padding-left: 0 !important;
+ padding-right: 0 !important;
+}
+
+/* Labels ocultos - User Login y User Password (Campaign Login) */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_login"]) td:first-child,
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_pass"]) td:first-child {
+ display: none !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_login"]),
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_pass"]) {
+ display: table-row;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_login"]) td:last-child,
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(input[name="VD_pass"]) td:last-child {
+ text-align: center !important;
+ width: 100% !important;
+ padding-left: 0 !important;
+ padding-right: 0 !important;
+}
+
+/* Campaign select - ocultar label */
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(select[name="VD_campaign"]) td:first-child {
+ display: none !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr:has(select[name="VD_campaign"]) td:last-child {
+ text-align: center !important;
+ width: 100% !important;
+ padding-left: 0 !important;
+ padding-right: 0 !important;
+}
+
+/* Inputs - Phone Login y Campaign Login */
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="text"],
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="password"] {
+ padding: 10px 14px !important;
+ border: 2px solid var(--color-bg-light) !important;
+ border-radius: 8px !important;
+ font-size: var(--font-size-h2) !important;
+ font-family: inherit;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ transition: all 0.3s ease;
+ box-sizing: border-box !important;
+ width: 100%;
+ max-width: 250px;
+ display: block;
+ margin: 0 auto;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="text"]:focus,
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="password"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light) !important;
+ box-shadow: 0 0 0 3px var(--shadow-primary) !important;
+}
+
+/* Select Campaign */
+body:has(form#vicidial_form) form center > table[width="460px"] select[name="VD_campaign"] {
+ padding: 10px 14px !important;
+ border: 2px solid var(--color-bg-light) !important;
+ border-radius: 8px !important;
+ font-size: var(--font-size-h2) !important;
+ font-family: inherit;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ transition: all 0.3s ease;
+ box-sizing: border-box !important;
+ width: 100%;
+ max-width: 250px;
+ display: block;
+ margin: 0 auto;
+ cursor: pointer;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] select[name="VD_campaign"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light) !important;
+ box-shadow: 0 0 0 3px var(--shadow-primary) !important;
+}
+
+/* Botón Submit */
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="submit"] {
+ background: var(--color-primary-light) !important;
+ color: var(--color-text-light) !important;
+ border: 2px solid var(--color-primary-light) !important;
+ border-radius: 10px !important;
+ padding: 12px 24px !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 600 !important;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ font-family: inherit;
+ box-sizing: border-box !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="submit"]:hover {
+ background: var(--color-primary-medium) !important;
+ border-color: var(--color-primary-medium) !important;
+ transform: translateY(-2px);
+ box-shadow: 0 6px 16px var(--shadow-primary) !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="submit"]:active {
+ transform: translateY(0);
+}
+
+/* Botón Refresh Campaign List */
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="button"][value="Refresh Campaign List"] {
+ background: var(--color-bg-light) !important;
+ color: var(--color-text-dark) !important;
+ border: 2px solid var(--color-bg-light) !important;
+ border-radius: 10px !important;
+ padding: 10px 20px !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 500 !important;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ font-family: inherit;
+ box-sizing: border-box !important;
+ margin-left: 10px;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="button"][value="Refresh Campaign List"]:hover {
+ background: var(--color-primary-lightest) !important;
+ border-color: var(--color-primary-light) !important;
+ color: var(--color-primary-dark) !important;
+ transform: translateY(-2px);
+ box-shadow: 0 4px 12px var(--shadow-primary) !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] input[type="button"][value="Refresh Campaign List"]:active {
+ transform: translateY(0);
+}
+
+/* ==========================================================================
+ TEXTO DE VERSIÓN
+ ========================================================================== */
+body:has(form#vicidial_form) form center > table[width="460px"] .body_tiny {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p2) !important;
+ opacity: 0.7;
+ display: block;
+ padding: 8px 16px !important;
+}
+
+/* ==========================================================================
+ LOADING BOX
+ ========================================================================== */
+body:has(form#vicidial_form) #LoginLoadingBox {
+ text-align: center;
+ padding: 20px;
+}
+
+body:has(form#vicidial_form) #LoginLoadingBox .skb_text {
+ color: var(--color-primary-light) !important;
+ font-size: var(--font-size-h2) !important;
+ display: block;
+ margin-bottom: 15px;
+}
+
+body:has(form#vicidial_form) #LoginLoadingBox img {
+ display: block;
+ margin: 0 auto;
+}
+
+/* ==========================================================================
+ CELDAS Y FILAS DE LA TABLA
+ ========================================================================== */
+body:has(form#vicidial_form) form center > table[width="460px"] td {
+ border: none !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form#vicidial_form) form center > table[width="460px"] tr {
+ border: none !important;
+}
+
+/* ==========================================================================
+ RESPONSIVE
+ ========================================================================== */
+@media (max-width: 480px) {
+ body:has(form#vicidial_form) form center > table[width="460px"] {
+ width: 100% !important;
+ border-radius: 12px;
+ }
+
+ body:has(form#vicidial_form) form center > table[width="460px"] input[type="text"],
+ body:has(form#vicidial_form) form center > table[width="460px"] input[type="password"] {
+ max-width: 100% !important;
+ width: 100% !important;
+ }
+
+ body:has(form#vicidial_form) form center > table[width="460px"] tr:not(:first-child):not(:last-child) td {
+ display: block;
+ width: 100% !important;
+ text-align: left !important;
+ }
+
+ body:has(form#vicidial_form) form center > table[width="460px"] tr:not(:first-child):not(:last-child) td:first-child {
+ margin-bottom: 8px;
+ }
+
+ body:has(form#vicidial_form) form center > table[width="460px"] .sh_text_white {
+ font-size: var(--font-size-h1) !important;
+ }
+
+ body:has(form#vicidial_form) form center > table[width="460px"] tr:first-child td {
+ padding: 12px !important;
+ }
+}
+
+/* ==========================================================================
+ ANIMACIONES
+ ========================================================================== */
+@keyframes login-modern-fadeInUp {
+ from {
+ opacity: 0;
+ transform: translateY(30px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
+/* ==========================================================================
+ TIMECLOCK COMPONENT
+ ========================================================================== */
+
+/* Contenedor principal */
+body:has(form#vicidial_form[action*="timeclock"]) {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ min-height: 100vh !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ padding: 15px !important;
+ margin: 0 !important;
+ position: relative !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+/* Ocultar elementos innecesarios */
+body:has(form#vicidial_form[action*="timeclock"]) > table[width="100%"] {
+ display: none !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) > br {
+ display: none !important;
+}
+
+/* Contenedor del formulario */
+body:has(form#vicidial_form[action*="timeclock"]) form {
+ width: 100% !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ min-height: 100vh !important;
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form > center {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 100% !important;
+ min-height: 100vh !important;
+ position: relative !important;
+ margin: 0 auto !important;
+ padding: 0 !important;
+ text-align: center !important;
+ left: 0 !important;
+ right: 0 !important;
+}
+
+/* Tabla principal */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] {
+ background: var(--color-bg-white) !important;
+ border-radius: 16px !important;
+ box-shadow: 0 15px 40px var(--shadow-light) !important;
+ overflow: hidden !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ width: 460px !important;
+ max-width: 100% !important;
+ margin: 0 auto !important;
+ display: table !important;
+ box-sizing: border-box !important;
+ position: relative !important;
+ animation: login-modern-fadeInUp 0.6s ease-out !important;
+ left: 50% !important;
+ transform: translateX(-50%) !important;
+}
+
+/* Header - Logo y Título */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child {
+ display: block !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child td {
+ background: transparent !important;
+ padding: 16px !important;
+ border: none !important;
+ display: block !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ margin: 0 !important;
+ box-sizing: border-box !important;
+}
+
+/* Ocultar tabla con width 100% dentro del form center */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="100%"] {
+ display: none !important;
+ width: 0 !important;
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+/* Contenedor del logo - mostrar nuevo logo */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child td:first-child {
+ border-radius: 0 !important;
+ padding: 16px 16px 8px 16px !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ background-image: url('../../vicidial/images/vicidial_admin_web_logo.png?v=2') !important;
+ background-size: 140px auto !important;
+ background-repeat: no-repeat !important;
+ background-position: center !important;
+ min-height: 140px !important;
+ height: 140px !important;
+ position: relative !important;
+ margin-top: 10px !important;
+}
+
+/* Ocultar imagen vieja del logo */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child td:first-child img {
+ display: none !important;
+ visibility: hidden !important;
+ opacity: 0 !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child td:last-child {
+ border-radius: 0 !important;
+ padding: 0 16px 8px 16px !important;
+ text-align: center !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+/* Título Timeclock - mismo estilo que Agent login (teal, mayúsculas) */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:first-child .sh_text_white {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-h1) !important;
+ font-weight: 600 !important;
+ letter-spacing: 0.5px !important;
+ text-align: center !important;
+ text-transform: uppercase !important;
+ display: block !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+/* Espaciadores */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr td[colspan="2"] font[size="1"] {
+ display: none !important;
+}
+
+/* Filas del formulario */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:not(:first-child):not(:last-child) {
+ display: table-row !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:not(:first-child):not(:last-child) td {
+ padding: 12px 16px !important;
+ border: none !important;
+ box-sizing: border-box !important;
+ text-align: center !important;
+}
+
+/* Labels ocultos */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="user"]) td:first-child,
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="pass"]) td:first-child {
+ display: none !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="user"]),
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="pass"]) {
+ display: table-row !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="user"]) td:last-child,
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] tr:has(input[name="pass"]) td:last-child {
+ text-align: center !important;
+ width: 100% !important;
+ padding-left: 0 !important;
+ padding-right: 0 !important;
+}
+
+/* Inputs */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="text"],
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="password"] {
+ padding: 10px 14px !important;
+ border: 2px solid var(--color-bg-light) !important;
+ border-radius: 8px !important;
+ font-size: var(--font-size-h2) !important;
+ font-family: inherit !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ transition: all 0.3s ease !important;
+ box-sizing: border-box !important;
+ width: 100% !important;
+ max-width: 250px !important;
+ display: block !important;
+ margin: 0 auto !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="text"]:focus,
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="password"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light) !important;
+ box-shadow: 0 0 0 3px var(--shadow-primary) !important;
+}
+
+/* Botón Submit */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="submit"] {
+ background: var(--color-primary-light) !important;
+ color: var(--color-text-light) !important;
+ border: 2px solid var(--color-primary-light) !important;
+ border-radius: 10px !important;
+ padding: 10px 20px !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.3s ease !important;
+ font-family: inherit !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="submit"]:hover {
+ background: var(--color-primary-medium) !important;
+ border-color: var(--color-primary-medium) !important;
+ transform: translateY(-2px) !important;
+ box-shadow: 0 6px 16px var(--shadow-primary) !important;
+}
+
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="submit"]:active {
+ transform: translateY(0) !important;
+}
+
+/* Versión y Build */
+body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] .body_tiny {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p2) !important;
+ opacity: 0.7 !important;
+ text-align: center !important;
+ display: block !important;
+ width: 100% !important;
+ padding: 8px 0 !important;
+ margin: 0 !important;
+}
+
+/* Responsive */
+@media (max-width: 480px) {
+ body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] {
+ width: 100% !important;
+ border-radius: 12px !important;
+ }
+
+ body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="text"],
+ body:has(form#vicidial_form[action*="timeclock"]) form center > table[width="460px"] input[type="password"] {
+ max-width: 100% !important;
+ }
+}
+
+
+
+/* ==========================================================================
+ SIDEBAR - CONTENEDOR PRINCIPAL
+ Solo afecta al componente admin que tiene esta estructura específica
+ ========================================================================== */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) {
+ margin: 0 !important;
+ padding: 0 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) center {
+ margin: 0 auto !important;
+ padding: 0 !important;
+ width: 100% !important;
+ display: block !important;
+ text-align: center !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] {
+ margin: 0 auto !important;
+ padding: 0 !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ border-spacing: 0 !important;
+ min-height: 100vh !important;
+ display: table !important;
+ table-layout: fixed !important;
+}
+
+/* Fila principal que contiene sidebar y contenido */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tbody > tr:first-child {
+ height: auto !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] {
+ background: var(--color-bg-white) !important;
+ padding: 20px 5px !important;
+ vertical-align: top;
+ box-sizing: border-box;
+ width: 170px !important;
+ min-width: 170px !important;
+ max-width: 170px !important;
+ border-right: none !important;
+ margin: 0 !important;
+ position: relative;
+ left: 0 !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+/* Logo en sidebar */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] img {
+ border-radius: 8px;
+ margin-bottom: 15px;
+ transition: transform 0.3s ease;
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 100%;
+ height: auto;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] img:hover {
+ transform: scale(1.05);
+}
+
+/* Título ADMINISTRATION */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] b font {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 600 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ letter-spacing: 0.3px;
+ display: block;
+ text-align: center;
+
+}
+
+/* Tabla de navegación */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table {
+ background: transparent !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: collapse;
+ box-sizing: border-box !important;
+}
+
+/* Quitar fondo azul oscuro de las filas de navegación */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table tr[bgcolor="#015B91"] {
+ background: transparent !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table tr[bgcolor="#015B91"] td {
+ background: transparent !important;
+}
+
+/* ==========================================================================
+ ITEMS DE NAVEGACIÓN - ESTILO BOTÓN
+ ========================================================================== */
+/* Items normales - Botones verdes */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+ padding: 8px 6px !important;
+ border-radius: 8px;
+ transition: all 0.3s ease;
+ cursor: pointer;
+ margin: 3px 0;
+ border: 2px solid var(--color-primary-light) !important;
+ display: block;
+ width: 160px!important;
+ max-width: 160px !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+/* Sobrescribir estilos inline del HTML */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr .head_style {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr[bgcolor="#015B91"] .head_style {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr[bgcolor="#015B91"] .head_style td {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style:hover {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+ border-color: var(--color-primary-light) !important;
+ transform: translateY(-2px);
+ box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3) !important;
+}
+
+/* Sobrescribir hover inline del HTML */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr .head_style:hover {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style td {
+ padding: 0 !important;
+ border: none !important;
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style a {
+ text-decoration: none;
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style font {
+ color: var(--color-text-light) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ word-wrap: break-word !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ max-width: 100% !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style img {
+ filter: brightness(0) invert(1) !important;
+ margin: 0 !important;
+ width: 14px !important;
+ height: 14px !important;
+}
+
+/* Item seleccionado - Verde más oscuro */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected {
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+ padding: 8px 6px !important;
+ border-radius: 8px;
+ margin: 3px 0;
+ border: 2px solid var(--color-primary-medium) !important;
+ display: block;
+ box-shadow: 0 2px 8px rgba(56, 142, 60, 0.3) !important;
+ width: 160px!important;
+ max-width: 160px!important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+/* Sobrescribir estilos inline del HTML para seleccionado */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr .head_style_selected {
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr .head_style_selected:hover {
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr[bgcolor="#015B91"] .head_style_selected {
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] tr[bgcolor="#015B91"] .head_style_selected td {
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected td {
+ padding: 0 !important;
+ border: none !important;
+ background: var(--color-primary-medium) !important;
+ background-color: var(--color-primary-medium) !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected a {
+ text-decoration: none;
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected font {
+ color: var(--color-text-light) !important;
+ font-weight: 600 !important;
+ font-size: var(--font-size-p1) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ word-wrap: break-word !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ max-width: 100% !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected img {
+ filter: brightness(0) invert(1) !important;
+ margin: 0 !important;
+ width: 14px !important;
+ height: 14px !important;
+}
+
+/* Líneas horizontales - ocultas */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .horiz_line {
+ display: none !important;
+}
+
+/* ==========================================================================
+ ITEMS DESPLEGABLES DEL MENÚ (SUBMENÚ)
+ ========================================================================== */
+/* Items desplegables normales */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style {
+ background: transparent !important;
+ background-color: transparent !important;
+ padding: 6px 6px 6px 20px !important;
+ border-radius: 6px;
+ transition: all 0.2s ease;
+ cursor: pointer;
+ margin: 2px 0;
+ border-left: 3px solid transparent !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style:hover {
+ background: rgba(76, 175, 80, 0.1) !important;
+ background-color: rgba(76, 175, 80, 0.1) !important;
+ border-left-color: var(--color-primary-light) !important;
+ transform: translateX(3px);
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style td {
+ padding: 0 !important;
+ border: none !important;
+ background: transparent !important;
+ background-color: transparent !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style a {
+ text-decoration: none;
+ display: block;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style font {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p2) !important;
+ font-weight: 400 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ word-wrap: break-word !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ max-width: 100% !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style a font {
+ color: var(--color-text-dark) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style:hover font {
+ color: var(--color-primary-light) !important;
+ font-weight: 500 !important;
+}
+
+/* Item desplegable seleccionado */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected {
+ background: rgba(76, 175, 80, 0.15) !important;
+ background-color: rgba(76, 175, 80, 0.15) !important;
+ padding: 6px 6px 6px 20px !important;
+ border-radius: 6px;
+ margin: 2px 0;
+ border-left: 3px solid var(--color-primary-light) !important;
+ box-shadow: 0 1px 4px rgba(76, 175, 80, 0.2) !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected:hover {
+ background: rgba(76, 175, 80, 0.2) !important;
+ background-color: rgba(76, 175, 80, 0.2) !important;
+ border-left-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected td {
+ padding: 0 !important;
+ border: none !important;
+ background: transparent !important;
+ background-color: transparent !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected a {
+ text-decoration: none;
+ display: block;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected font {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-p2) !important;
+ font-weight: 600 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ word-wrap: break-word !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ max-width: 100% !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected a font {
+ color: var(--color-primary-medium) !important;
+}
+
+/* ==========================================================================
+ ICONOS EN ITEMS DESPLEGABLES DEL MENÚ
+ ========================================================================== */
+/* Iconos en items desplegables normales */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style img {
+ margin-right: 6px !important;
+ vertical-align: middle !important;
+ display: inline-block !important;
+ transition: transform 0.2s ease;
+ filter: opacity(0.7);
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style:hover img {
+ transform: scale(1.1);
+ filter: opacity(1);
+}
+
+/* Iconos en items desplegables seleccionados */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected img {
+ margin-right: 6px !important;
+ vertical-align: middle !important;
+ display: inline-block !important;
+ filter: opacity(1);
+}
+
+/* Ocultar iconos blank.gif (espacios en blanco) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style img[src*="blank.gif"],
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .subhead_style_selected img[src*="blank.gif"] {
+ display: none !important;
+}
+
+/* Item de menú admin seleccionado */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected {
+ background: rgba(76, 175, 80, 0.15) !important;
+ background-color: rgba(76, 175, 80, 0.15) !important;
+ padding: 6px 6px 6px 20px !important;
+ border-radius: 6px;
+ margin: 2px 0;
+ border-left: 3px solid var(--color-primary-light) !important;
+ transition: all 0.2s ease;
+ cursor: pointer;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected:hover {
+ background: rgba(76, 175, 80, 0.2) !important;
+ background-color: rgba(76, 175, 80, 0.2) !important;
+ border-left-color: var(--color-primary-medium) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected td {
+ padding: 0 !important;
+ border: none !important;
+ background: transparent !important;
+ background-color: transparent !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected a {
+ text-decoration: none;
+ display: block;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected font {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-p2) !important;
+ font-weight: 600 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .adminmenu_style_selected a font {
+ color: var(--color-primary-medium) !important;
+}
+
+/* ==========================================================================
+ CONTENIDO PRINCIPAL
+ ========================================================================== */
+/* Celda de contenido principal - se ajusta al contenido y mantiene centrado */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="870"][bgcolor="#D9E6FE"],
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="770"][bgcolor="#D9E6FE"] {
+ vertical-align: top !important;
+ padding: 0 !important;
+ width: auto !important;
+ min-width: 0 !important;
+}
+
+/* Tabla de navegación superior dentro del contenido - siempre centrada */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="#D9E6FE"][cellpadding="2"] {
+ margin: 0 auto !important;
+ width: 100% !important;
+ max-width: 100% !important;
+}
+
+/* Asegurar que las tablas internas también estén centradas */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"] center {
+ text-align: center !important;
+ margin: 0 auto !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"] table {
+ margin: 0 auto !important;
+}
+
+/* ==========================================================================
+ ICONOS EN CONTENIDO PRINCIPAL
+ ========================================================================== */
+/* Iconos grandes en tarjetas de menú (42x42) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] img[width="42"][height="42"] {
+ border-radius: 8px;
+ padding: 4px;
+ background: rgba(76, 175, 80, 0.1);
+ transition: all 0.3s ease;
+ display: inline-block;
+ vertical-align: middle;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected:hover img[width="42"][height="42"] {
+ background: rgba(76, 175, 80, 0.2);
+ transform: scale(1.05);
+ box-shadow: 0 2px 8px rgba(76, 175, 80, 0.3);
+}
+
+/* Iconos pequeños en items de menú (11x11) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected img[width="11"][height="11"] {
+ margin-right: 6px !important;
+ vertical-align: middle !important;
+ display: inline-block !important;
+ transition: transform 0.2s ease;
+ filter: opacity(0.8);
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected:hover img[width="11"][height="11"] {
+ transform: scale(1.15);
+ filter: opacity(1);
+}
+
+/* Ocultar iconos blank.gif en contenido principal */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected img[src*="blank.gif"] {
+ display: none !important;
+}
+
+/* Estilos para tarjetas de menú con iconos */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected {
+ border-radius: 8px;
+ padding: 12px !important;
+ margin: 8px 0 !important;
+ background: var(--bg-white-transparent) !important;
+ background-color: var(--bg-white-transparent) !important;
+ border: 1px solid rgba(76, 175, 80, 0.2) !important;
+ transition: all 0.3s ease;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected:hover {
+ background: rgba(76, 175, 80, 0.1) !important;
+ background-color: rgba(76, 175, 80, 0.1) !important;
+ border-color: rgba(76, 175, 80, 0.4) !important;
+ transform: translateY(-2px);
+ box-shadow: 0 4px 12px rgba(76, 175, 80, 0.2);
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected td {
+ padding: 4px 8px !important;
+ vertical-align: middle !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected a {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ text-decoration: none;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected span {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[width="870"][bgcolor="#D9E6FE"] .adminmenu_style_selected font {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p2) !important;
+ color: var(--color-text-dark) !important;
+}
+
+/* ==========================================================================
+ FILAS DE TABLAS EN CONTENIDO PRINCIPAL
+ ========================================================================== */
+/* Filas de tabla - variante Y (alternadas) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y {
+ background: #f8f9fa !important;
+ background-color: #f8f9fa !important;
+ transition: all 0.2s ease;
+ cursor: pointer;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y:hover {
+ background: rgba(76, 175, 80, 0.1) !important;
+ background-color: rgba(76, 175, 80, 0.1) !important;
+ transform: translateX(2px);
+ box-shadow: 0 2px 6px rgba(76, 175, 80, 0.15) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y td {
+ padding: 10px 8px !important;
+ border-bottom: 1px solid #e0e0e0 !important;
+ vertical-align: middle !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y font {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p1) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y a {
+ color: var(--color-primary-light) !important;
+ text-decoration: none;
+ font-weight: 500;
+ transition: color 0.2s ease;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y a:hover {
+ color: var(--color-primary-medium) !important;
+ text-decoration: underline;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y a font {
+ color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_y a:hover font {
+ color: var(--color-primary-medium) !important;
+}
+
+/* Filas de tabla - variante X */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x {
+ background: var(--color-bg-white) !important;
+ background-color: var(--color-bg-white) !important;
+ transition: all 0.2s ease;
+ cursor: pointer;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x:hover {
+ background: rgba(76, 175, 80, 0.08) !important;
+ background-color: rgba(76, 175, 80, 0.08) !important;
+ transform: translateX(2px);
+ box-shadow: 0 2px 6px rgba(76, 175, 80, 0.12) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x td {
+ padding: 10px 8px !important;
+ border-bottom: 1px solid #e0e0e0 !important;
+ vertical-align: middle !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x font {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p1) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x a {
+ color: var(--color-primary-light) !important;
+ text-decoration: none;
+ font-weight: 500;
+ transition: color 0.2s ease;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x a:hover {
+ color: var(--color-primary-medium) !important;
+ text-decoration: underline;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x a font {
+ color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) .records_list_x a:hover font {
+ color: var(--color-primary-light) !important;
+}
+
+/* Estilos para encabezados de tabla en contenido principal */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] {
+ border-radius: 8px 8px 0 0 !important;
+ overflow: hidden;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] td {
+ padding: 12px 8px !important;
+ background: var(--color-text-dark) !important;
+ background-color: var(--color-text-dark) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] font {
+ color: var(--color-text-light) !important;
+ font-weight: 600 !important;
+ font-size: var(--font-size-p2) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ text-transform: uppercase;
+ letter-spacing: 0.5px;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] a {
+ color: var(--color-text-light) !important;
+ text-decoration: none;
+ transition: color 0.2s ease;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] a:hover {
+ color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] a font {
+ color: var(--color-text-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="black"] a:hover font {
+ color: var(--color-primary-light) !important;
+}
+
+/* ==========================================================================
+ FOOTER DEL SIDEBAR
+ ========================================================================== */
+/* Footer con versión y copyright */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tr:last-child td[bgcolor="#015B91"] {
+ background: var(--color-bg-white) !important;
+ background-color: var(--color-bg-white) !important;
+ padding: 0px 10px 1px 10px !important;
+ text-align: center;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tr:last-child td[bgcolor="#015B91"] font {
+ color: var(--color-primary-light) !important;
+ font-size: var(--font-size-p2) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tr:last-child td[bgcolor="#015B91"] a {
+ color: var(--color-primary-light) !important;
+ text-decoration: none;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tr:last-child td[bgcolor="#015B91"] a font {
+ color: var(--color-primary-light) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] tr:last-child td[bgcolor="#015B91"] a:hover {
+ color: var(--color-primary-medium) !important;
+ text-decoration: underline;
+}
+
+/* ==========================================================================
+ SERVER STATS AND REPORTS (página Reports - admin.php?ADD=999999)
+ ========================================================================== */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) td[align="LEFT"][colspan="2"] {
+ padding: 12px 16px !important;
+ max-width: 1200px !important;
+ margin: 0 auto !important;
+ box-sizing: border-box !important;
+}
+
+/* Contenedor principal de la página Reports */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) td[align="LEFT"][colspan="2"] > table {
+ width: 100% !important;
+ max-width: 100% !important;
+}
+
+/* Cabecera: icono + título "Server Stats and Reports" */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) img[alt="Reports"][src*="icon_black_reports"] {
+ margin-right: 8px !important;
+ vertical-align: middle !important;
+ border-radius: 6px !important;
+}
+
+/* Reducir espacio vertical de
en la página Reports */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] br {
+ display: block !important;
+ margin: 2px 0 !important;
+ line-height: 0.2 !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) td[align="LEFT"][colspan="2"] font[size="4"] b {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+ font-size: 1.2rem !important;
+ color: var(--color-primary-dark) !important;
+ display: inline-block !important;
+ margin-bottom: 2px !important;
+}
+
+/* Tabla de columnas (Real-Time | Inbound/Outbound | Agent Reports) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 0 0 !important;
+ margin: 8px 0 !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] td[valign="TOP"] {
+ padding: 8px 12px !important;
+ vertical-align: top !important;
+ width: 33.33% !important;
+ max-width: 380px !important;
+}
+
+/* Columnas espaciadoras vacías (solo ) – colapsar para que no ocupen espacio */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] td[valign="TOP"]:nth-child(1),
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] td[valign="TOP"]:nth-child(3) {
+ width: 0 !important;
+ min-width: 0 !important;
+ max-width: 0 !important;
+ padding: 0 !important;
+ overflow: hidden !important;
+ border: none !important;
+ visibility: hidden !important;
+}
+
+/* Columnas con contenido: repartir el espacio al 50 % cada una */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] td[valign="TOP"]:nth-child(2),
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"][cellspacing="0"] td[valign="TOP"]:nth-child(4) {
+ width: 50% !important;
+ max-width: none !important;
+}
+
+/* Títulos de sección (Real-Time Reports, Agent Reports, etc.) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] b {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+ font-size: var(--font-size-p2) !important;
+ color: var(--color-primary-dark) !important;
+ display: block !important;
+ margin: 6px 0 3px 0 !important;
+ padding-bottom: 2px !important;
+ border-bottom: 1px solid var(--color-bg-lighter) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] b:first-of-type {
+ margin-top: 0 !important;
+}
+
+/* Listas de enlaces */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul {
+ list-style: none !important;
+ margin: 0 0 6px 0 !important;
+ padding: 0 !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul li {
+ margin: 1px 0 !important;
+ padding: 0 !important;
+ line-height: 1.3 !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul li a,
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul li a font {
+ color: var(--color-text-dark) !important;
+ text-decoration: none !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+ font-size: var(--font-size-p2) !important;
+ transition: color 0.2s ease !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul li a:hover,
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) table[cellpadding="5"] ul li a:hover font {
+ color: var(--color-primary-medium) !important;
+ text-decoration: underline !important;
+}
+
+/* Tabla de servidores (SERVER | DESCRIPTION | IP | ...) */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre {
+ margin: 10px 0 !important;
+ padding: 0 !important;
+ overflow-x: auto !important;
+ font-family: inherit !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: collapse !important;
+ border-radius: 8px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] td,
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] th {
+ padding: 5px 8px !important;
+ border: 1px solid var(--color-bg-lighter) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+ font-size: var(--font-size-p2) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] tr[bgcolor="#B6D3FC"] td {
+ background: var(--color-bg-lighter) !important;
+ background-color: var(--color-bg-lighter) !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] tr[bgcolor="#B1E4BB"] td {
+ background: var(--color-bg-white) !important;
+ background-color: var(--color-bg-white) !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] a,
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] a font {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre table[border="1"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Enlace Admin Utilities al final */
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) pre + font a[href*="ADD=999994"],
+body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"]:has(img[src*="icon_black_reports"]) a[href*="ADD=999994"] font {
+ color: var(--color-primary-medium) !important;
+ font-size: var(--font-size-p2) !important;
+}
+
+/* ==========================================================================
+ RESPONSIVE
+ ========================================================================== */
+@media (max-width: 768px) {
+ /* Tabla principal - mantener como tabla pero ajustar anchos */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ table-layout: auto !important;
+ }
+
+ /* Sidebar - reducir ancho para que quepa junto al contenido */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] {
+ width: 140px !important;
+ min-width: 140px !important;
+ max-width: 140px !important;
+ padding: 15px 5px !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+ }
+
+ /* Tabla de navegación dentro del sidebar - ajustar ancho */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table {
+ width: 100% !important;
+ max-width: 100% !important;
+ }
+
+ /* Contenido principal - ajustar ancho para que quepa junto al sidebar */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="870"][bgcolor="#D9E6FE"],
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="770"][bgcolor="#D9E6FE"] {
+ width: calc(100% - 140px) !important;
+ min-width: 0 !important;
+ max-width: calc(100% - 140px) !important;
+ padding: 5px !important;
+ box-sizing: border-box !important;
+ }
+
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table {
+ margin-top: 10px;
+ }
+
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style,
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] .head_style_selected {
+ padding: 6px 8px !important;
+ font-size: var(--font-size-p2) !important;
+ }
+
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] b font {
+ font-size: var(--font-size-p1) !important;
+ }
+}
+
+/* ==========================================================================
+ ESTILOS MODERNOS PARA BARRA DE NAVEGACIÓN SUPERIOR
+ ========================================================================== */
+
+/* Tabla con fondo azul #D9E6FE - cambiar a blanco (selector general con máxima prioridad) */
+table[bgcolor="#D9E6FE"] {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Tabla específica con height="15" */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"][height="15"] {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Celdas dentro de tablas con bgcolor="#D9E6FE" */
+table[bgcolor="#D9E6FE"] td {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Celdas td individuales con bgcolor="#D9E6FE" - cambiar a blanco */
+td[bgcolor="#D9E6FE"],
+td[bgcolor="#d9e6fe"] {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Tabla con fondo azul #d3e0f7 - cambiar a blanco */
+table[bgcolor="#d3e0f7"],
+table[bgcolor="#D3E0F7"] {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Celdas con fondo azul #d3e0f7 - cambiar a blanco */
+td[bgcolor="#d3e0f7"],
+td[bgcolor="#D3E0F7"],
+table[bgcolor="#d3e0f7"] td,
+table[bgcolor="#D3E0F7"] td {
+ background: #ffffff !important;
+ background-color: #ffffff !important;
+}
+
+/* Estilos para la barra de navegación superior (HOME | Timeclock | Chat | Logout) */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] {
+ background: var(--color-bg-white) !important;
+ box-shadow: none !important;
+ border-bottom: none !important;
+ border-left: none !important;
+ padding: 16px 24px !important;
+ height: auto !important;
+ min-height: 60px !important;
+ position: relative !important;
+ overflow: hidden !important;
+}
+
+/* Efecto decorativo de brillo sutil - ajustado para fondo blanco */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"]::before {
+ content: '' !important;
+ position: absolute !important;
+ top: 0 !important;
+ left: -100% !important;
+ width: 100% !important;
+ height: 100% !important;
+ background: linear-gradient(90deg, transparent, var(--bg-decorative-1), transparent) !important;
+ animation: shimmer 3s infinite !important;
+}
+
+@keyframes shimmer {
+ 0% { left: -100%; }
+ 100% { left: 100%; }
+}
+
+/* Estilos para las celdas de la barra de navegación */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td {
+ background: transparent !important;
+ padding: 1px 20px !important;
+ vertical-align: middle !important;
+ position: relative !important;
+ z-index: 1 !important;
+}
+
+/* Estilos para el texto de navegación (HOME, Timeclock, etc.) */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] font[face="ARIAL,HELVETICA"][color="WHITE"] {
+ color: var(--color-primary-medium) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 700 !important;
+ text-shadow: none !important;
+ letter-spacing: 0.5px !important;
+ font-size: var(--font-size-p1) !important;
+}
+
+/* Separador "|" con estilo moderno - todos los font dentro del td izquierdo */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] {
+ color: var(--color-primary-medium) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 700 !important;
+ text-shadow: none !important;
+ opacity: 1 !important;
+ margin: 0 6px !important;
+}
+
+/* Asegurar que el nombre de usuario (6666) tenga el mismo color */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] {
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+ opacity: 1 !important;
+}
+
+/* Estilos para la fecha/hora en la derecha */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] {
+ text-align: right !important;
+ position: relative !important;
+ z-index: 1 !important;
+}
+
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] font {
+ color: var(--color-primary-medium) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 600 !important;
+ text-shadow: none !important;
+ letter-spacing: 0.8px !important;
+ font-size: var(--font-size-p1) !important;
+ background: var(--bg-decorative-1) !important;
+ padding: 6px 12px !important;
+ border-radius: 20px !important;
+ display: inline-block !important;
+ border: 1px solid var(--color-primary-lightest) !important;
+}
+
+/* Ocultar los dos tr vacíos siguientes */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:nth-child(2)[bgcolor="#015B91"] {
+ display: none !important;
+ visibility: hidden !important;
+ height: 0 !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ line-height: 0 !important;
+}
+
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:nth-child(3)[bgcolor="#E6E6E6"] {
+ display: none !important;
+ visibility: hidden !important;
+ height: 0 !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ line-height: 0 !important;
+}
+
+/* Ocultar la barra verde (td con colspan="2" height="2" bgcolor="#015B91") */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr td[align="LEFT"][colspan="2"][height="2"][bgcolor="#015B91"],
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr td[colspan="2"][height="2"][bgcolor="#015B91"] {
+ display: none !important;
+ visibility: hidden !important;
+ height: 0 !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ line-height: 0 !important;
+ border: none !important;
+}
+
+/* Ocultar el tr que contiene la barra verde */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:has(td[colspan="2"][height="2"][bgcolor="#015B91"]),
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:has(td[align="LEFT"][colspan="2"][height="2"][bgcolor="#015B91"]) {
+ display: none !important;
+ visibility: hidden !important;
+ height: 0 !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ line-height: 0 !important;
+}
+
+/* Mejora adicional: hover effect en los elementos de navegación (si fueran clicables) */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] {
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
+}
+
+/* Efecto hover moderno para los elementos de texto de navegación */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] {
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
+ position: relative !important;
+ display: inline-block !important;
+}
+
+/* Efecto de resaltado sutil al pasar el mouse (si fuera interactivo) */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"]:hover {
+ color: var(--color-primary-medium) !important;
+ transform: translateY(-1px) !important;
+}
+
+/* ==========================================================================
+ RESPONSIVE - BARRA DE NAVEGACIÓN SUPERIOR
+ ========================================================================== */
+
+/* Prevenir que la fecha/hora se apile y mantener altura fija */
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] {
+ white-space: nowrap !important;
+ overflow: hidden !important;
+}
+
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] {
+ white-space: nowrap !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+}
+
+table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] font {
+ white-space: nowrap !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ max-width: 100% !important;
+ display: inline-block !important;
+}
+
+/* Media queries para pantallas pequeñas */
+@media (max-width: 768px) {
+ /* Mantener altura fija y reducir padding */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] {
+ min-height: 50px !important;
+ max-height: 50px !important;
+ height: 50px !important;
+ padding: 8px 12px !important;
+ }
+
+ /* Reducir tamaño de fuente de fecha/hora */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] font {
+ font-size: var(--font-size-p2) !important;
+ padding: 4px 8px !important;
+ letter-spacing: 0.3px !important;
+ }
+
+ /* Reducir tamaño de fuente de navegación */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] {
+ font-size: var(--font-size-p2) !important;
+ }
+}
+
+@media (max-width: 480px) {
+ /* Altura aún más pequeña en móviles */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] {
+ min-height: 45px !important;
+ max-height: 45px !important;
+ height: 45px !important;
+ padding: 6px 10px !important;
+ }
+
+ /* Ocultar fecha completa, mostrar solo hora si es necesario */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="RIGHT"] font {
+ font-size: var(--font-size-p2) !important;
+ padding: 3px 6px !important;
+ }
+
+ /* Reducir más el texto de navegación */
+ table[bgcolor="#D9E6FE"][cellpadding="2"][cellspacing="0"][width="870"] tbody > tr:first-child[bgcolor="#015B91"] td[align="LEFT"] font[face="ARIAL,HELVETICA"][color="WHITE"][size="1"] {
+ font-size: var(--font-size-p2) !important;
+ margin: 0 3px !important;
+ }
+}
+
+/* ==========================================================================
+ ESTILOS MODERNOS PARA COMPONENTE DE ESTADÍSTICAS
+ ========================================================================== */
+
+/* Tabla principal de estadísticas (Agents Logged In, etc.) */
+table[width="700"][cellpadding="6"][cellspacing="0"] {
+ background: var(--color-bg-white) !important;
+ border-radius: 8px !important;
+ box-shadow: 0 2px 8px var(--shadow-light) !important;
+ overflow: hidden !important;
+ margin: 10px auto !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ width: 100% !important;
+ max-width: 800px !important;
+ table-layout: fixed !important;
+}
+
+/* Celdas de la tabla de estadísticas principales - Recuadro unificado */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] {
+ background: transparent !important;
+ border: none !important;
+ border-radius: 8px !important;
+ padding: 12px 8px !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+
+ width: auto !important;
+ min-width: 0 !important;
+ max-width: 25% !important;
+ box-shadow: 0 1px 4px var(--shadow-light) !important;
+ position: relative !important;
+}
+
+/* Celdas con iconos (rowspan="2") - recuadro unificado completo */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] {
+ width: 33.33% !important;
+ min-width: 0 !important;
+ max-width: 33.33% !important;
+ padding: 12px 6px !important;
+ vertical-align: center !important;
+ border-radius: 8px 0 0 8px !important;
+}
+
+/* Celdas con texto (primera fila, sin rowspan) - unificar con el recuadro */
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:first-child td[bgcolor="#015B91"]:not([rowspan]) {
+ padding: 12px 6px 4px !important;
+ vertical-align: top !important;
+ border-left: none !important;
+ border-right: none !important;
+ border-top: none !important;
+ border-bottom: none !important;
+ box-shadow: none !important;
+ border-radius: 0 8px 0 0 !important;
+ background: transparent !important;
+ width: 66.67% !important;
+ max-width: 66.67% !important;
+}
+
+/* Celdas con números (segunda fila) - unificar con el recuadro */
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"] {
+ padding: 4px 6px 12px !important;
+ vertical-align: top !important;
+ border-left: none !important;
+ border-right: none !important;
+ border-top: none !important;
+ box-shadow: none !important;
+ border-bottom: none !important;
+ border-radius: 0 0 8px 0 !important;
+ background: transparent !important;
+ width: 66.67% !important;
+ max-width: 66.67% !important;
+}
+
+/* Unificar bordes - el recuadro completo tiene bordes solo en las celdas con rowspan */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] + td[bgcolor="#015B91"] {
+ border-left: none !important;
+}
+
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] ~ td[bgcolor="#015B91"]:not([rowspan]) {
+ border-left: none !important;
+}
+
+/* Asegurar que el número esté en la misma columna que el texto - sin bordes separados */
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"]:nth-child(2),
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"]:nth-child(4),
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"]:nth-child(6),
+table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"]:nth-child(8) {
+ border-left: none !important;
+}
+
+/* Texto de las estadísticas principales - mucho más grande - selectores más específicos y directos */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="HELVETICA"][style*="color:white"],
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][align="center"] font[style*="font-size:11"],
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="font-size:11"][style*="color:white"],
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:first-child td[bgcolor="#015B91"]:not([rowspan]) font,
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][valign="middle"] font {
+ color: var(--color-primary-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 700 !important;
+ text-shadow: none !important;
+ font-size: var(--font-size-h1) !important;
+ display: block !important;
+ margin-top: 0 !important;
+ line-height: 1.3 !important;
+ text-align: center !important;
+}
+
+/* Selector universal para cualquier font dentro de las celdas de estadísticas (primera fila) */
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody > tr:first-child > td[bgcolor="#015B91"]:not([rowspan]) > font {
+ color: var(--color-primary-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 700 !important;
+ text-shadow: none !important;
+ font-size: var(--font-size-h1) !important;
+ display: block !important;
+ margin-top: 4px !important;
+ line-height: 1.3 !important;
+ text-align: center !important;
+ letter-spacing: 0.2px !important;
+ position: relative !important;
+ z-index: 1 !important;
+}
+
+/* Selector adicional con todos los atributos para máxima especificidad */
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:first-child td[align="center"][valign="middle"][bgcolor="#015B91"]:not([rowspan]) font[style*="font-family:HELVETICA"][style*="font-size:11"][style*="color:white"][style*="font-weight:bold"] {
+ font-size: var(--font-size-h1) !important;
+ color: var(--color-primary-dark) !important;
+ font-weight: 700 !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ display: block !important;
+ text-align: center !important;
+ margin-top: 8px !important;
+ letter-spacing: 0.3px !important;
+ position: relative !important;
+ z-index: 1 !important;
+}
+
+/* Números grandes de estadísticas - tamaño razonable */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="font-size:18"],
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="font-size:18"][style*="color:white"],
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font,
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font[style*="font-size:18"],
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font[style*="color:white"] {
+ font-size: var(--font-size-h1) !important;
+ font-weight: 700 !important;
+ color: var(--color-primary-dark) !important;
+ letter-spacing: 0px !important;
+ display: block !important;
+ line-height: 1.2 !important;
+ text-align: center !important;
+ margin-top: 2px !important;
+ background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-medium) 100%) !important;
+ -webkit-background-clip: text !important;
+ -webkit-text-fill-color: transparent !important;
+ background-clip: text !important;
+ position: relative !important;
+ z-index: 1 !important;
+}
+
+/* Imágenes de iconos - estilo simple sin efectos */
+/* Eliminar fondo de iconos de 42x42 en tabla de estadísticas */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] img[width="42"][height="42"] {
+ background: transparent !important;
+ background-color: transparent !important;
+ padding: 0 !important;
+ border-radius: 0 !important;
+ box-shadow: none !important;
+}
+
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] img {
+ filter: brightness(0) saturate(100%) invert(37%) sepia(89%) saturate(1000%) hue-rotate(140deg) brightness(0.7) !important;
+ opacity: 1 !important;
+ margin-bottom: 4px !important;
+ display: block !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ width: 40px !important;
+ height: 40px !important;
+ background: transparent !important;
+ background-color: transparent !important;
+ padding: 0 !important;
+ border-radius: 0 !important;
+}
+
+table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] img {
+ filter: brightness(0) saturate(100%) invert(37%) sepia(89%) saturate(1000%) hue-rotate(140deg) brightness(0.7) !important;
+ opacity: 1 !important;
+ margin-bottom: 4px !important;
+ display: block !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ width: 28px !important;
+ height: 28px !important;
+ background: transparent !important;
+ background-color: transparent !important;
+ padding: 0 !important;
+ border-radius: 0 !important;
+}
+
+/* Espaciadores entre tarjetas */
+table[width="700"][cellpadding="6"][cellspacing="0"] td[width="10"] {
+ width: 4px !important;
+ padding: 0 !important;
+ background: transparent !important;
+ border: none !important;
+}
+
+/* Tabla System Summary */
+table[width="700"][cellspacing="2"] {
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 2px 12px var(--shadow-light) !important;
+ overflow: visible !important;
+ margin: 20px auto !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ width: 100% !important;
+ max-width: 700px !important;
+}
+
+/* Eliminar scrollbar adicional en contenedores de System Summary */
+body:has(table[width="700"][cellspacing="2"]) {
+ overflow-x: visible !important;
+ overflow-y: visible !important;
+}
+
+/* Contenedor principal - eliminar scrollbars */
+body:has(table[width="700"][cellspacing="2"]) td[width="870"][bgcolor="#D9E6FE"],
+body:has(table[width="700"][cellspacing="2"]) td[bgcolor="#D9E6FE"],
+body:has(table[width="700"][cellspacing="0"][cellpadding="1"]) td[width="870"][bgcolor="#D9E6FE"],
+body:has(table[width="700"][cellspacing="0"][cellpadding="1"]) td[bgcolor="#D9E6FE"] {
+ overflow: visible !important;
+ overflow-x: visible !important;
+ overflow-y: visible !important;
+}
+
+/* Eliminar scrollbar en elementos PRE dentro de System Summary */
+body:has(table[width="700"][cellspacing="2"]) pre,
+body:has(table[width="700"][cellspacing="0"][cellpadding="1"]) pre {
+ overflow: visible !important;
+ overflow-x: visible !important;
+ overflow-y: visible !important;
+}
+
+/* Eliminar scrollbar en tablas contenedoras */
+body:has(table[width="700"][cellspacing="2"]) table,
+body:has(table[width="700"][cellspacing="0"][cellpadding="1"]) table {
+ overflow: visible !important;
+}
+
+/* Título System Summary */
+table[width="700"][cellspacing="2"] tr:first-child td {
+ background: transparent !important;
+ padding: 16px 20px 12px !important;
+ border-bottom: 2px solid var(--color-primary-lightest) !important;
+}
+
+table[width="700"][cellspacing="2"] tr:first-child font[style*="HELVETICA"][style*="color:black"] {
+ color: var(--color-primary-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-size: var(--font-size-h1) !important;
+ font-weight: 700 !important;
+ letter-spacing: 0.5px !important;
+}
+
+/* Encabezado de System Summary (Records, Active, etc.) */
+table[width="700"][cellspacing="2"] tr[bgcolor="black"] {
+ background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-medium) 100%) !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="black"] td {
+ background: transparent !important;
+ padding: 12px 16px !important;
+ border: none !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="black"] font[style*="HELVETICA"][style*="color:white"] {
+ color: var(--color-text-light) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 600 !important;
+ font-size: var(--font-size-h2) !important;
+ letter-spacing: 0.3px !important;
+}
+
+/* Filas de datos System Summary */
+table[width="700"][cellspacing="2"] tr[bgcolor="#B6D3FC"] {
+ background: var(--color-bg-white) !important;
+ border-bottom: 1px solid var(--bg-decorative-1) !important;
+ transition: background-color 0.2s ease !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="#B6D3FC"]:hover {
+ background: var(--bg-decorative-1) !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="#B6D3FC"] td {
+ background: transparent !important;
+ padding: 12px 16px !important;
+ border: none !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="#B6D3FC"] font[color="black"] {
+ color: var(--color-text-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 500 !important;
+ font-size: var(--font-size-h2) !important;
+}
+
+table[width="700"][cellspacing="2"] tr[bgcolor="#B6D3FC"] b {
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+ font-size: var(--font-size-h2) !important;
+}
+
+/* Tablas Total Stats (Today y Yesterday) */
+table[width="700"][cellspacing="0"][cellpadding="1"] {
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 2px 12px var(--shadow-light) !important;
+ overflow: visible !important;
+ margin: 20px auto !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ width: 100% !important;
+ max-width: 700px !important;
+}
+
+/* Título Total Stats */
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child td[align="left"] {
+ background: transparent !important;
+ padding: 16px 20px 12px !important;
+ border-bottom: 2px solid var(--color-primary-lightest) !important;
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child font[style*="HELVETICA"][style*="color:black"] {
+ color: var(--color-primary-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-size: var(--font-size-h1) !important;
+ font-weight: 700 !important;
+ letter-spacing: 0.3px !important;
+}
+
+/* Enlace view max stats - estilo mejorado */
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child td[align="right"] font[size="1"],
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child td[align="right"] font[size="1"] a {
+ color: var(--color-primary-medium) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 600 !important;
+ text-decoration: none !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+ transition: all 0.3s ease !important;
+ display: inline-block !important;
+
+}
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child td[align="right"] font[size="1"] a{
+ background: rgba(0, 139, 139, 0.2) !important;
+
+ border-color: var(--color-primary-medium) !important;
+
+
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr:first-child td[align="right"] font[size="1"] a:hover {
+ background: rgba(0, 139, 139, 0.2) !important;
+ color: var(--color-primary-dark) !important;
+ border-color: var(--color-primary-medium) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 6px rgba(0, 139, 139, 0.2) !important;
+}
+
+/* Encabezado Total Stats */
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="black"] {
+ background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-medium) 100%) !important;
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="black"] td {
+ background: transparent !important;
+ padding: 10px 12px !important;
+ border: none !important;
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="black"] font[color="white"] {
+ color: var(--color-text-light) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-weight: 600 !important;
+ font-size: var(--font-size-p1) !important;
+ letter-spacing: 0.3px !important;
+}
+
+/* Fila de datos Total Stats */
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="#B9CBFD"] {
+ background: var(--bg-decorative-1) !important;
+ border-bottom: 1px solid var(--color-primary-lightest) !important;
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="#B9CBFD"] td {
+ background: transparent !important;
+ padding: 12px 16px !important;
+ border: none !important;
+}
+
+table[width="700"][cellspacing="0"][cellpadding="1"] tr[bgcolor="#B9CBFD"] font[size="1"] {
+ color: var(--color-text-dark) !important;
+ font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 500 !important;
+ font-style: italic !important;
+}
+
+/* ==========================================================================
+ SELECTORES DE MÁXIMA PRIORIDAD PARA ESTADÍSTICAS
+ ========================================================================== */
+
+/* Forzar tamaño de fuente para texto de etiquetas - tamaño razonable */
+table[width="700"][cellpadding="6"][cellspacing="0"] font[style*="font-size:11"] {
+ font-size: var(--font-size-h1) !important;
+}
+
+/* Forzar tamaño de fuente para números - tamaño razonable */
+table[width="700"][cellpadding="6"][cellspacing="0"] font[style*="font-size:18"] {
+ font-size: var(--font-size-h1) !important;
+}
+
+/* Selector directo para cualquier font dentro de td con bgcolor específico - solo para números */
+table[width="700"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font {
+ font-size: var(--font-size-h1) !important;
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+}
+
+/* Selector para números en segunda fila */
+table[width="700"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font {
+ font-size: var(--font-size-h1) !important;
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+}
+
+/* Selectores adicionales con mayor especificidad - apuntar directamente a los elementos */
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font[style] {
+ font-size: var(--font-size-h1) !important;
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+}
+
+/* Asegurar que los números (0) debajo también tengan el tamaño correcto - máxima prioridad */
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font[style*="font-size:18"],
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font[style*="color:white"],
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[align="center"][valign="middle"][bgcolor="#015B91"] font,
+table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[align="center"][valign="middle"][bgcolor="#015B91"] font[style*="font-size:18"][style*="color:white"][style*="font-weight:bold"] {
+ font-size: var(--font-size-h1) !important;
+ color: var(--color-primary-medium) !important;
+ font-weight: 700 !important;
+ display: block !important;
+ line-height: 1.2 !important;
+}
+
+/* ==========================================================================
+ RESPONSIVE - TABLA DE ESTADÍSTICAS (769px y menos)
+ ========================================================================== */
+@media (max-width: 769px) {
+ /* Tabla principal de estadísticas - ajustar ancho */
+ table[width="700"][cellpadding="6"][cellspacing="0"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ table-layout: auto !important;
+ padding: 0 10px !important;
+ box-sizing: border-box !important;
+ }
+
+ /* Celdas con iconos - ajustar ancho */
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] {
+ width: auto !important;
+ min-width: 60px !important;
+ max-width: 30% !important;
+ padding: 10px 4px !important;
+
+ }
+
+ /* Celdas con texto - ajustar ancho */
+ table[width="700"][cellpadding="6"][cellspacing="0"] tr:first-child td[bgcolor="#015B91"]:not([rowspan]) {
+ width: auto !important;
+ max-width: 70% !important;
+ padding: 10px 4px 4px !important;
+ }
+
+ /* Celdas con números - ajustar ancho */
+ table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"] {
+ width: auto !important;
+ max-width: 70% !important;
+ padding: 4px 4px 10px !important;
+ }
+
+ /* Reducir tamaño de iconos en pantallas pequeñas */
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] img {
+ width: 32px !important;
+ height: 32px !important;
+ }
+
+ /* Reducir tamaño de fuente en pantallas pequeñas */
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="font-size:11"],
+ table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:first-child td[bgcolor="#015B91"]:not([rowspan]) font {
+ font-size: var(--font-size-h2) !important;
+ }
+
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"] font[style*="font-size:18"],
+ table[width="700"][cellpadding="6"][cellspacing="0"] tbody tr:nth-child(2) td[bgcolor="#015B91"] font {
+ font-size: var(--font-size-h1) !important;
+ }
+
+ /* Espaciadores - reducir ancho */
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[width="10"] {
+ width: 2px !important;
+ }
+
+ /* Tablas System Summary y Total Stats - ajustar ancho */
+ table[width="700"][cellspacing="2"],
+ table[width="700"][cellspacing="0"][cellpadding="1"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ margin: 15px auto !important;
+ padding: 0 10px !important;
+ box-sizing: border-box !important;
+ }
+}
+
+/* Media query específica para el rango 770px - 900px */
+@media (min-width: 770px) and (max-width: 900px) {
+ /* Contenedor principal - ajustar ancho */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="870"][bgcolor="#D9E6FE"],
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="770"][bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ }
+
+ /* Tabla principal de estadísticas - ajustar ancho máximo */
+ table[width="700"][cellpadding="6"][cellspacing="0"] {
+ max-width: 95% !important;
+ table-layout: auto !important;
+ }
+
+ /* Ajustar porcentajes de celdas para evitar desbordamiento */
+ table[width="700"][cellpadding="6"][cellspacing="0"] td[bgcolor="#015B91"][rowspan="2"] {
+ max-width: 28% !important;
+ }
+
+ table[width="700"][cellpadding="6"][cellspacing="0"] tr:first-child td[bgcolor="#015B91"]:not([rowspan]),
+ table[width="700"][cellpadding="6"][cellspacing="0"] tr:nth-child(2) td[bgcolor="#015B91"] {
+ max-width: 72% !important;
+ }
+
+ /* Tablas System Summary y Total Stats */
+ table[width="700"][cellspacing="2"],
+ table[width="700"][cellspacing="0"][cellpadding="1"] {
+ max-width: 95% !important;
+ }
+}
+
+/* Media query para pantallas de 769px y menos - contenedor principal */
+@media (max-width: 769px) {
+ /* Tabla principal - mantener como tabla, ajustar anchos */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] {
+ width: 100% !important;
+ max-width: 100% !important;
+ table-layout: auto !important;
+ }
+
+ /* Sidebar - reducir ancho */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] {
+ width: 140px !important;
+ min-width: 140px !important;
+ max-width: 140px !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+ }
+
+ /* Tabla de navegación dentro del sidebar - ajustar ancho */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"] table {
+ width: 100% !important;
+ max-width: 100% !important;
+ }
+
+ /* Contenedor principal - ajustar ancho para que quepa junto al sidebar */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="870"][bgcolor="#D9E6FE"],
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) table[bgcolor="white"][cellpadding="0"] td[width="770"][bgcolor="#D9E6FE"] {
+ width: calc(100% - 140px) !important;
+ min-width: 0 !important;
+ max-width: calc(100% - 140px) !important;
+ box-sizing: border-box !important;
+ padding: 5px !important;
+ }
+
+ /* Tablas dentro del contenedor - ajustar para que no se desborden */
+ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B91"]) td[bgcolor="#D9E6FE"] table {
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ }
+}
+
+/* ==========================================================================
+ SIDEBAR VERTICAL - REAL-TIME REPORT
+ Convertir la barra de navegación horizontal en sidebar vertical
+ PRIORIDAD MÁXIMA - Sobrescribir cualquier estilo inline
+ ========================================================================== */
+
+/* Contenedor principal - estructura para sidebar + contenido lado a lado */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) {
+ margin: 0 !important;
+ padding: 0 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ display: flex !important;
+ flex-direction: row !important;
+ align-items: flex-start !important;
+}
+
+/* SIDEBAR - Contenedor principal - posicionar a la izquierda */
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] {
+ width: 170px !important;
+ min-width: 170px !important;
+ max-width: 170px !important;
+ background: var(--color-bg-white) !important;
+ background-color: var(--color-bg-white) !important;
+ padding: 20px 5px !important;
+ vertical-align: top !important;
+ box-sizing: border-box !important;
+ border-right: none !important;
+ margin: 0 !important;
+ position: relative !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+ flex-shrink: 0 !important;
+ float: left !important;
+}
+
+/* Fila del sidebar - convertir de horizontal a vertical */
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] tbody tr {
+ display: block !important;
+ width: 100% !important;
+}
+
+/* Celdas del sidebar - cada una en su propia fila vertical */
+body table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td,
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] tbody tr td,
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td[style] {
+ display: block !important;
+ width: 100% !important;
+ background: transparent !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+ line-height: normal !important;
+ height: auto !important;
+ min-height: auto !important;
+}
+
+/* Logo en la primera celda */
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:first-child {
+ text-align: center !important;
+ padding: 10px 5px 15px 5px !important;
+ margin-bottom: 30px !important;
+
+}
+
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:first-child img {
+ filter: none !important;
+ width: auto !important;
+ height: auto !important;
+ max-width: 100% !important;
+ max-height: 300px !important;
+ display: block !important;
+ margin: 0 auto !important;
+ border-radius: 8px !important;
+ transition: transform 0.3s ease !important;
+}
+
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:first-child img:hover {
+ transform: scale(1.05) !important;
+}
+
+/* Enlaces de navegación - estilo botón vertical igual al sidebar principal */
+/* Aumentar especificidad para sobrescribir cualquier estilo inline */
+body table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child),
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] tbody tr td:not(:first-child),
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child)[style] {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+ padding: 8px 6px !important;
+ border-radius: 8px !important;
+ transition: all 0.3s ease !important;
+ cursor: pointer !important;
+ border: 2px solid var(--color-primary-light) !important;
+ margin: 10px 0 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: flex-start !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ word-wrap: break-word !important;
+ line-height: 1 !important;
+ height: auto !important;
+ min-height: 35px !important;
+ max-height: 35px !important;
+}
+
+/* Efecto hover en los enlaces */
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child):hover {
+ background: var(--color-primary-light) !important;
+ background-color: var(--color-primary-light) !important;
+ border-color: var(--color-primary-light) !important;
+ transform: translateY(-2px) !important;
+ box-shadow: 0 4px 12px rgba(32, 178, 170, 0.3) !important;
+}
+
+/* Enlaces dentro de las celdas */
+body table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a,
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a[style],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a {
+ text-decoration: none !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: flex-start !important;
+ gap: 6px !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ overflow: hidden !important;
+ height: 100% !important;
+ min-height: 100% !important;
+ line-height: 1 !important;
+ vertical-align: middle !important;
+ padding: 0 !important;
+ margin: 0 !important;
+}
+
+/* Texto dentro de los enlaces */
+body table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font,
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font[style],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font[face],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font[color],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font[size] {
+ color: var(--color-text-light) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ word-wrap: break-word !important;
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ max-width: 100% !important;
+ line-height: 1 !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ height: auto !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ vertical-align: middle !important;
+}
+
+/* Texto en negrita */
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font b {
+ font-weight: 600 !important;
+ color: var(--color-text-light) !important;
+}
+
+/* Iconos dentro de los enlaces */
+body table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a img,
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a img[style],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a img[width],
+table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a img[height] {
+
+ width: 14px !important;
+ height: 14px !important;
+ flex-shrink: 0 !important;
+ max-width: 14px !important;
+ max-height: 14px !important;
+ display: inline-block !important;
+ vertical-align: middle !important;
+ align-self: center !important;
+}
+
+/* Contenido principal - posicionar a la derecha del sidebar */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] {
+ flex: 1 !important;
+ width: auto !important;
+ margin-left: 0 !important;
+ padding: 0 !important;
+ display: table !important;
+ vertical-align: top !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody > tr > td {
+ padding: 10px !important;
+ vertical-align: top !important;
+}
+
+/* VERM Custom Report: contenido principal a la derecha del sidebar */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) .verm_custom_report_main {
+ flex: 1 !important;
+ min-width: 0 !important;
+ padding: 1rem 1.5rem !important;
+ box-sizing: border-box !important;
+}
+
+/* ========== VERM Custom Report - formulario (distribución y diseño) ========== */
+.verm_custom_report_main {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 960px !important;
+}
+
+.verm_custom_report_main .admin_header {
+ font-size: 1.35rem !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ margin: 0 0 1rem 0 !important;
+ padding-bottom: 0.5rem !important;
+ border-bottom: 2px solid var(--color-primary-light) !important;
+}
+
+/* Tabla principal: card con botones arriba y abajo */
+.verm_custom_report_main form[name="VERM_custom_report"] #admin_table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+
+ overflow: hidden !important;
+}
+
+/* Fila de botones superior e inferior */
+.verm_custom_report_main #admin_table > tbody > tr:first-child th,
+.verm_custom_report_main #admin_table > tbody > tr:last-child th {
+
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+}
+
+.verm_custom_report_main #admin_table > tbody > tr:last-child th {
+ border-bottom: none !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+.verm_custom_report_main #admin_table > tbody > tr:first-child .actButton,
+.verm_custom_report_main #admin_table > tbody > tr:first-child .refreshButton,
+.verm_custom_report_main #admin_table > tbody > tr:last-child .actButton,
+.verm_custom_report_main #admin_table > tbody > tr:last-child .refreshButton {
+ min-width: 0 !important;
+ width: 100% !important;
+ max-width: 180px !important;
+}
+
+/* Celda que contiene el formulario interno */
+.verm_custom_report_main #admin_table td[colspan="4"] {
+
+ background: var(--color-bg-white) !important;
+ vertical-align: top !important;
+}
+
+/* Tabla interna del formulario (secciones) */
+.verm_custom_report_main #admin_table table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: collapse !important;
+ border-spacing: 0 !important;
+}
+
+/* Encabezados de sección: Report Details, Preferences, Call filtering criteria, Non-contiguous time */
+.verm_custom_report_main .admin_sub_header {
+ font-size: 1rem !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ margin: 0 !important;
+
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ background: transparent !important;
+}
+
+.verm_custom_report_main form table tbody tr:has(.admin_sub_header) th {
+
+ border: none !important;
+ background: transparent !important;
+ vertical-align: bottom !important;
+}
+
+.verm_custom_report_main form table tbody tr:has(.admin_sub_header) th:first-child {
+ text-align: left !important;
+}
+
+/* Primera sección: menos margen arriba */
+.verm_custom_report_main form table tbody tr:first-child:has(.admin_sub_header) th {
+ padding-top: 0 !important;
+}
+
+/* Filas de campos: label + input */
+.verm_custom_report_main form table tbody tr:not(:has(.admin_sub_header)) td {
+
+ vertical-align: middle !important;
+ border: none !important;
+ border-bottom: 1px solid rgba(0, 139, 139, 0.12) !important;
+}
+
+.verm_custom_report_main form table tbody tr:not(:has(.admin_sub_header)) td:first-child {
+ width: 1% !important;
+ white-space: nowrap !important;
+ padding-right: 16px !important;
+ font-size: 13px !important;
+ font-weight: 500 !important;
+ color: #374151 !important;
+ text-align: right !important;
+}
+
+.verm_custom_report_main form table tbody tr:not(:has(.admin_sub_header)) td:last-child {
+ text-align: left !important;
+}
+
+/* Inputs y selects dentro del custom report */
+.verm_custom_report_main .VERM_form_field {
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 6px !important;
+ min-width: 120px !important;
+ max-width: 100% !important;
+}
+
+.verm_custom_report_main select.VERM_form_field {
+ min-width: 100px !important;
+ cursor: pointer !important;
+}
+
+.verm_custom_report_main select.VERM_form_field[size] {
+ min-height: 6em !important;
+}
+
+/* Icono de ayuda alineado con el campo */
+.verm_custom_report_main form table td img[alt="HELP"],
+.verm_custom_report_main form table td img[onclick*="FillAndShowHelpDiv"] {
+ width: 18px !important;
+ height: 18px !important;
+ vertical-align: middle !important;
+ margin-left: 8px !important;
+ cursor: pointer !important;
+ opacity: 0.85 !important;
+}
+
+.verm_custom_report_main form table td img[alt="HELP"]:hover,
+.verm_custom_report_main form table td img[onclick*="FillAndShowHelpDiv"]:hover {
+ opacity: 1 !important;
+}
+
+/* Agrupar input + ayuda en línea */
+.verm_custom_report_main form table tbody tr:not(:has(.admin_sub_header)) td:last-child {
+ display: table-cell !important;
+}
+
+/* Campos de rango (Between X and Y) */
+.verm_custom_report_main form table td .VERM_form_field.VERM_numeric_field {
+ min-width: 60px !important;
+ width: 60px !important;
+ text-align: center !important;
+}
+
+/* Responsive - mantener sidebar y contenido lado a lado */
+@media (max-width: 768px) {
+ body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) {
+ flex-direction: row !important;
+ }
+
+ table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] {
+ width: 140px !important;
+ min-width: 140px !important;
+ max-width: 140px !important;
+ }
+
+ table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) {
+ padding: 8px 6px !important;
+ margin: 3px 0 !important;
+ }
+
+ table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a font {
+ font-size: var(--font-size-p2) !important;
+ }
+
+ table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"] td:not(:first-child) a img {
+ width: 12px !important;
+ height: 12px !important;
+ }
+
+ body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody > tr > td {
+ padding: 8px !important;
+ }
+}
+/* ==========================================================================
+ CONTENIDO PRINCIPAL - REAL-TIME REPORT
+ Estilos simples para el área de contenido principal
+ ========================================================================== */
+
+/* Contenedor principal del formulario - con scroll horizontal cuando sea necesario */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] {
+ background: var(--color-bg-white) !important;
+ overflow-x: auto !important;
+ overflow-y: visible !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ display: block !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody {
+ display: table !important;
+ width: 100% !important;
+ min-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody > tr {
+ display: table-row !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody > tr > td {
+ background: var(--color-bg-white) !important;
+ padding: 10px !important;
+ display: table-cell !important;
+ white-space: normal !important;
+}
+
+/* Título principal */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) font.top_head_key {
+ color: var(--color-text-dark) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-h2) !important;
+ font-weight: 600 !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ line-height: 1.2 !important;
+}
+
+/* Enlaces de acción (RELOAD NOW, MODIFY, SUMMARY) */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables('form_submit'\")"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[href*="admin.php?ADD=10"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[href*="AST_timeonVDADallSUMMARY"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ font-weight: 500 !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: all 0.2s ease !important;
+ margin: 0 2px !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables('form_submit'\")"]:hover,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[href*="admin.php?ADD=10"]:hover,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[href*="AST_timeonVDADallSUMMARY"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Enlaces de toggle (VIEW MORE, VIEW USER GROUP, etc.) - Estilo botón */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables(\'"] {
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: var(--color-primary-light) !important;
+ color: var(--color-text-light) !important;
+ text-decoration: none !important;
+ font-weight: 500 !important;
+ padding: 4px 8px !important;
+ border-radius: 4px !important;
+ border: 2px solid var(--color-primary-light) !important;
+ transition: all 0.2s ease !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ margin: 1px 2px !important;
+ cursor: pointer !important;
+ line-height: 1 !important;
+ vertical-align: middle !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables('"]:hover {
+ background: var(--color-primary-medium) !important;
+ border-color: var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 6px rgba(0, 139, 139, 0.3) !important;
+}
+
+/* Texto dentro de los botones de toggle */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables('"] font.top_settings_val,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) a[onclick*="update_variables('"] span {
+ color: var(--color-text-light) !important;
+ font-weight: 500 !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ line-height: 1 !important;
+ display: inline !important;
+ vertical-align: middle !important;
+}
+
+/* Texto de configuración */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) font.top_settings_val {
+ color: var(--color-text-dark) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ line-height: 1.3 !important;
+ margin: 0 !important;
+}
+
+/* Reducir espacios verticales en el contenido principal */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] br {
+ line-height: 0.5 !important;
+ margin: 0 !important;
+ display: block !important;
+ content: "" !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) > table[cellpadding="4"][cellspacing="0"] > tbody > tr > td > br {
+ margin: 2px 0 !important;
+ line-height: 0.5 !important;
+}
+
+/* Panel de opciones (campaign_select_list_link) */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list_link {
+ position: relative !important;
+ left: auto !important;
+ right: auto !important;
+ top: auto !important;
+ bottom: auto !important;
+ z-index: auto !important;
+ display: inline-block !important;
+ margin: 5px 0 !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list_link table[bgcolor="#D9E6FE"] {
+ background: var(--bg-decorative-1) !important;
+ border-radius: 4px !important;
+ padding: 4px 6px !important;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list_link a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ font-weight: 500 !important;
+}
+
+/* Panel de configuración - centrado en pantalla, ancho compacto */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list {
+ position: fixed !important;
+ left: 50% !important;
+ top: 50% !important;
+ transform: translate(-50%, -50%) !important;
+ max-width: min(680px, 92vw) !important;
+ width: min(680px, 92vw) !important;
+ max-height: 88vh !important;
+ overflow: auto !important;
+}
+
+/* Cuando el panel está visible (z-index > 0), asegurar que esté centrado y visible */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list[style*="z-index: 21"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list[style*="z-index:21"] {
+ z-index: 1000 !important;
+ visibility: visible !important;
+}
+
+/* Desenfoque del fondo cuando el panel de opciones está abierto */
+body:has(#campaign_select_list[style*="z-index: 21"])::before,
+body:has(#campaign_select_list[style*="z-index:21"])::before {
+ content: "" !important;
+ position: fixed !important;
+ inset: 0 !important;
+ backdrop-filter: blur(6px) !important;
+ -webkit-backdrop-filter: blur(6px) !important;
+ background: rgba(0, 0, 0, 0.12) !important;
+ z-index: 999 !important;
+ pointer-events: none !important;
+}
+
+/* Cuando el panel está oculto (z-index < 0), respetar el estado hidden */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list[style*="z-index: -1"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list[style*="z-index:-1"] {
+ visibility: hidden !important;
+ z-index: -1 !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list table.realtime_settings_table {
+ background: var(--color-bg-white) !important;
+ border-radius: 8px !important;
+ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
+ border: 1px solid var(--color-bg-light) !important;
+ margin: 0 auto !important;
+ max-width: 100% !important;
+ width: auto !important;
+ table-layout: auto !important;
+}
+
+/* Panel más compacto: menos padding en celdas */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list table.realtime_settings_table td {
+ padding: 6px 8px !important;
+}
+
+/* Botón Close Panel */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[align="CENTER"] a[onclick*="hideDiv('campaign_select_list')"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[align="CENTER"] a[onclick*="hideDiv"],
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[valign="TOP"][align="CENTER"] a {
+ display: inline-block !important;
+ background: var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+ padding: 6px 12px !important;
+ border-radius: 4px !important;
+ text-decoration: none !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+ border: none !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+ margin-bottom: 6px !important;
+ pointer-events: auto !important;
+ position: relative !important;
+ z-index: 1001 !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[align="CENTER"] a[onclick*="hideDiv('campaign_select_list')"]:hover,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[align="CENTER"] a[onclick*="hideDiv"]:hover,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) #campaign_select_list td[valign="TOP"][align="CENTER"] a:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 6px rgba(0, 139, 139, 0.3) !important;
+}
+
+/* Selectores y campos de formulario */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) select,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) input[type="text"] {
+ padding: 4px 8px !important;
+ border: 1px solid var(--color-bg-light) !important;
+ border-radius: 4px !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ background: var(--color-bg-white) !important;
+ transition: border-color 0.2s ease !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) select:focus,
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) input[type="text"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium) !important;
+ box-shadow: 0 0 0 2px var(--bg-decorative-1) !important;
+}
+
+/* Botón SUBMIT */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) input[type="button"][value="SUBMIT"] {
+ background: var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+ border: none !important;
+ padding: 6px 12px !important;
+ border-radius: 4px !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) input[type="button"][value="SUBMIT"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 6px rgba(0, 139, 139, 0.3) !important;
+}
+
+/* Tablas de estadísticas - Estilo mejorado - con scroll horizontal cuando sea necesario */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) {
+ background: var(--color-bg-white) !important;
+ border-collapse: collapse !important;
+ margin: 8px 0 !important;
+ border-radius: 8px !important;
+ overflow-x: auto !important;
+ overflow-y: visible !important;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
+ border: 1px solid var(--color-bg-lighter) !important;
+ display: block !important;
+ width: 100% !important;
+ max-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) tbody {
+ display: table !important;
+ width: 100% !important;
+ min-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) tbody tr {
+ display: table-row !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) td {
+ padding: 8px 12px !important;
+ border-bottom: 1px solid var(--color-bg-lighter) !important;
+ transition: background-color 0.2s ease !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) tr:hover td {
+ background: var(--bg-decorative-1) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table[cellpadding="0"][cellspacing="0"]:not([bgcolor="#015B91"]) tr:last-child td {
+ border-bottom: none !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) font.top_settings_key {
+ color: var(--color-primary-dark) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 600 !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) font.top_settings_val {
+ color: var(--color-text-dark) !important;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+}
+
+/* Tabla de llamadas en tiempo real - con scroll horizontal cuando sea necesario */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_calls_table {
+ background: var(--color-bg-white) !important;
+ border-radius: 4px !important;
+ overflow-x: auto !important;
+ overflow-y: visible !important;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
+ margin: 5px 0 !important;
+ display: block !important;
+ width: 100% !important;
+ max-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_calls_table tbody {
+ display: table !important;
+ width: 100% !important;
+ min-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_calls_table tbody tr {
+ display: table-row !important;
+}
+
+/* Tabla principal de agentes - Estilo mejorado - con scroll horizontal cuando sea necesario */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table {
+ background: var(--color-bg-white) !important;
+ border-radius: 8px !important;
+ overflow-x: auto !important;
+ overflow-y: visible !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
+ margin: 10px 0 !important;
+ border: 1px solid var(--color-bg-lighter) !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ display: block !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tbody {
+ display: table !important;
+ width: 100% !important;
+ min-width: 100% !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tbody tr {
+ display: table-row !important;
+}
+
+/* Encabezado de la tabla */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr[bgcolor="#C6C6C6"] {
+ background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-medium) 100%) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr[bgcolor="#C6C6C6"] td {
+ padding: 10px 12px !important;
+ font-weight: 600 !important;
+ border-bottom: 2px solid var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr[bgcolor="#C6C6C6"] font.top_head_key {
+ color: var(--color-text-light) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 600 !important;
+}
+
+/* Filas de datos */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr:not([bgcolor="#C6C6C6"]) {
+ background: var(--color-bg-white) !important;
+ transition: background-color 0.2s ease !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr:not([bgcolor="#C6C6C6"]):hover {
+ background: var(--bg-decorative-1) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr:not([bgcolor="#C6C6C6"]) td {
+ padding: 8px 12px !important;
+ border-bottom: 1px solid var(--color-bg-lighter) !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table tr:not([bgcolor="#C6C6C6"]):last-child td {
+ border-bottom: none !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table font.top_head_key {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table font.top_head_val {
+ color: var(--color-text-dark) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 500 !important;
+}
+
+/* Enlaces dentro de la tabla */
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ transition: color 0.2s ease !important;
+}
+
+body:has(table[cellpadding="0"][cellspacing="0"][bgcolor="#015B91"]) table.realtime_table a:hover {
+ color: var(--color-primary-dark) !important;
+ text-decoration: underline !important;
+}
+
+/* ========== VERM Admin (form action VERM_main_report_page.php, #admin_table) ========== */
+form[action*="VERM_main_report_page"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1000px !important;
+ margin: 0 !important;
+}
+
+/* Página de reportes (con #nav_table): usar todo el ancho */
+form[action*="VERM_main_report_page"]:has(#nav_table) {
+ max-width: none !important;
+ width: 100% !important;
+}
+
+form[action*="VERM_main_report_page"] #admin_table {
+ width: 100% !important;
+ max-width: 1000px !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+/* Fila superior: usuario + enlaces (RELOAD | PRINT | NEW REPORT | LOG OUT) */
+form[action*="VERM_main_report_page"] .standard_font_small {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: #374151 !important;
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+form[action*="VERM_main_report_page"] .standard_font_small b {
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="VERM_main_report_page"] .header_link {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 8px !important;
+ border-radius: 6px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] .header_link:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="VERM_main_report_page"] .header_link img {
+ vertical-align: middle !important;
+}
+
+/* Fila de filtros: Queue, Report, botones */
+form[action*="VERM_main_report_page"] .export_row {
+ background: var(--color-bg-white) !important;
+ border-bottom: 1px solid var(--shadow-text) !important;
+}
+
+form[action*="VERM_main_report_page"] .export_row td {
+ padding: 10px 12px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: #4b5563 !important;
+}
+
+form[action*="VERM_main_report_page"] .VERM_form_field {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 6px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] .VERM_form_field:focus {
+ outline: none !important;
+ border-color: var(--color-primary-dark) !important;
+ box-shadow: 0 0 0 2px var(--bg-decorative-1) !important;
+}
+
+form[action*="VERM_main_report_page"] .actButton {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 8px 16px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="VERM_main_report_page"] .actButton:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="VERM_main_report_page"] .refreshButton {
+ font-family: var(--font-family) !important;
+ font-size: 16px !important;
+ padding: 8px 12px !important;
+ color: var(--color-primary-medium) !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] .refreshButton:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Columnas de contenido (Agent report | Real-time | Settings) */
+form[action*="VERM_main_report_page"] .admin_column {
+ padding: 16px 20px !important;
+ vertical-align: top !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: #1f2937 !important;
+ border-right: 1px solid var(--shadow-text) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="VERM_main_report_page"] .admin_column:last-child {
+ border-right: none !important;
+}
+
+form[action*="VERM_main_report_page"] .rpt_header {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ display: block !important;
+}
+
+form[action*="VERM_main_report_page"] .rpt_header img {
+ vertical-align: middle !important;
+ margin-left: 4px !important;
+}
+
+form[action*="VERM_main_report_page"] .report_link {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ display: inline-block !important;
+ border-radius: 4px !important;
+ transition: color 0.2s ease, background 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] .report_link:hover {
+ color: var(--color-primary-dark) !important;
+ background: var(--bg-decorative-1) !important;
+}
+
+form[action*="VERM_main_report_page"] .admin_column ul {
+ list-style: none !important;
+ padding-left: 0 !important;
+ margin: 8px 0 !important;
+}
+
+form[action*="VERM_main_report_page"] .admin_column ul li {
+ padding: 4px 0 !important;
+ margin: 0 !important;
+}
+
+form[action*="VERM_main_report_page"] .admin_column ul ul {
+ margin-left: 12px !important;
+ padding-left: 12px !important;
+ border-left: 2px solid var(--color-primary-light) !important;
+}
+
+/* ========== VERM Report Page - #nav_table (logo, user, links, report type buttons) ========== */
+form[action*="VERM_main_report_page"] #nav_table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-bottom: 1px solid var(--shadow-text) !important;
+ margin-bottom: 0 !important;
+ table-layout: auto !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell {
+ padding: 12px 16px !important;
+ vertical-align: middle !important;
+ font-family: var(--font-family) !important;
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell:first-child {
+ width: 1% !important;
+ white-space: nowrap !important;
+}
+
+/* Celda usuario + enlaces: mantener RELOAD | PRINT | NEW REPORT | LOG OUT en una sola línea */
+form[action*="VERM_main_report_page"] #nav_table tr:first-child .title_cell:last-child {
+ white-space: nowrap !important;
+ min-width: 420px !important;
+ overflow: visible !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table tr:first-child .title_cell:last-child .header_link,
+form[action*="VERM_main_report_page"] #nav_table tr:first-child .title_cell:last-child .header_link img {
+ display: inline !important;
+ vertical-align: middle !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell:first-child a img {
+ max-height: 70px !important;
+ width: auto !important;
+ display: block !important;
+ border: 0 !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell:last-child a img {
+ display: inline !important;
+ vertical-align: middle !important;
+ max-height: 15px !important;
+ width: auto !important;
+ border: 0 !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell b {
+ color: var(--color-primary-dark) !important;
+ font-size: 13px !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell .header_link {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 8px !important;
+ border-radius: 6px !important;
+ font-size: 13px !important;
+ display: inline !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell .header_link:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .title_cell .header_link img {
+ vertical-align: middle !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .nav_header {
+ background: var(--color-primary-dark) !important;
+ padding: 0 !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .nav_header td {
+ padding: 8px 12px !important;
+ border: none !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .navigation_list {
+ list-style: none !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ display: flex !important;
+ flex-wrap: wrap !important;
+ gap: 6px !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .navigation_list li {
+ display: inline-block !important;
+ margin: 0 !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .transparent_button {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ padding: 6px 12px !important;
+ color: var(--color-text-light) !important;
+ background: transparent !important;
+ border: 1px solid rgba(255,255,255,0.5) !important;
+ border-radius: 6px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .transparent_button:hover {
+ background: rgba(255,255,255,0.15) !important;
+ border-color: var(--color-text-light) !important;
+}
+
+form[action*="VERM_main_report_page"] #nav_table .transparent_button.current_report {
+ background: var(--color-primary-light) !important;
+ border-color: var(--color-primary-light) !important;
+ color: var(--color-text-dark) !important;
+ font-weight: 600 !important;
+}
+
+/* ========== VERM Wallboard (VERM_wallboards.php) ========== */
+body:has(.wallboard_title_row) {
+ font-family: var(--font-family) !important;
+ background: var(--color-bg-white) !important;
+ margin: 0 !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_title_row {
+ background: var(--color-primary-dark) !important;
+ color: var(--color-text-light) !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ height: 28px !important;
+ border: none !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_title_cell {
+ padding: 0 6px !important;
+ vertical-align: middle !important;
+}
+
+body:has(.wallboard_title_row) .view_button {
+ accent-color: var(--color-primary-light) !important;
+ cursor: pointer !important;
+}
+
+body:has(.wallboard_title_row) input.play_button {
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 4px !important;
+ color: var(--color-text-light) !important;
+ cursor: pointer !important;
+ width: 20px !important;
+ height: 20px !important;
+ font-size: 10px !important;
+}
+
+body:has(.wallboard_title_row) input.stop_button {
+ background: #c53030 !important;
+ border: none !important;
+ border-radius: 4px !important;
+ color: var(--color-text-light) !important;
+ cursor: pointer !important;
+ width: 20px !important;
+ height: 20px !important;
+ font-size: 10px !important;
+}
+
+body:has(.wallboard_title_row) .header_link {
+ color: var(--color-primary-lightest) !important;
+ text-decoration: none !important;
+ padding: 2px 5px !important;
+ border-radius: 3px !important;
+ font-size: 12px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(.wallboard_title_row) .header_link:hover {
+ background: rgba(255,255,255,0.2) !important;
+ color: var(--color-text-light) !important;
+}
+
+body:has(.wallboard_title_row) td.widget_cell {
+ border: 1px solid var(--shadow-text) !important;
+ background: var(--color-bg-white) !important;
+ vertical-align: top !important;
+ height: 100px !important;
+ max-height: 100px !important;
+ min-height: 80px !important;
+}
+
+/* Sobrescribir altura inline de las celdas */
+body:has(.wallboard_title_row) td.widget_cell[style] {
+ height: 100px !important;
+ max-height: 100px !important;
+}
+
+/* Filas de una sola celda (Live Campaigns, Live Agents): más altura */
+body:has(.wallboard_title_row) td.widget_cell[colspan="8"],
+body:has(.wallboard_title_row) td.widget_cell[colspan="7"] {
+ height: 200px !important;
+ max-height: 200px !important;
+}
+
+body:has(.wallboard_title_row) td.widget_cell table.widget_contents {
+ height: 100% !important;
+ max-height: 100% !important;
+}
+
+body:has(.wallboard_title_row) td.widget_cell:hover {
+ border-color: var(--color-primary-light) !important;
+}
+
+body:has(.wallboard_title_row) table.widget_contents {
+ border-collapse: collapse !important;
+ border-radius: 4px !important;
+ overflow: hidden !important;
+ background: var(--color-bg-white) !important;
+ box-shadow: 0 1px 2px var(--shadow-light) !important;
+}
+
+body:has(.wallboard_title_row) tr.widget_cell_title_bar {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ height: 22px !important;
+}
+
+body:has(.wallboard_title_row) tr.widget_cell_title_bar th,
+body:has(.wallboard_title_row) tr.widget_cell_title_bar td {
+ padding: 1px 4px !important;
+}
+
+body:has(.wallboard_title_row) tr.widget_cell_title_bar:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(.wallboard_title_row) .widget_edit_button {
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ padding: 1px 4px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 3px !important;
+ background: var(--color-bg-white) !important;
+ color: var(--color-primary-medium) !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(.wallboard_title_row) .widget_edit_button:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(.wallboard_title_row) td.widget_contents {
+ padding: 4px 6px !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(.wallboard_title_row) table.shaded {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(.wallboard_title_row) #widget_table {
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ border-collapse: collapse !important;
+ width: 100% !important;
+}
+
+body:has(.wallboard_title_row) #widget_table tr.widget_table_header {
+ background: var(--color-primary-dark) !important;
+ color: var(--color-text-light) !important;
+ font-weight: 600 !important;
+ font-size: 11px !important;
+}
+
+body:has(.wallboard_title_row) #widget_table td,
+body:has(.wallboard_title_row) #widget_table th {
+ border: 1px solid var(--shadow-text) !important;
+ padding: 3px 4px !important;
+}
+
+body:has(.wallboard_title_row) #widget_table tr:nth-child(even) {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_extra_large_text {
+ color: var(--color-text-dark) !important;
+ font-family: var(--font-family) !important;
+ font-size: 1.5rem !important;
+ line-height: 1.2 !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_large_text {
+ color: var(--color-text-dark) !important;
+ font-family: var(--font-family) !important;
+ font-size: 1.25rem !important;
+ line-height: 1.2 !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_medium_text {
+ color: #4b5563 !important;
+ font-family: var(--font-family) !important;
+ font-size: 1rem !important;
+}
+
+body:has(.wallboard_title_row) .wallboard_small_text,
+body:has(.wallboard_title_row) .wallboard_tiny_text {
+ color: #4b5563 !important;
+ font-family: var(--font-family) !important;
+ font-size: 0.85rem !important;
+}
+
+body:has(.wallboard_title_row) div.widget_settings {
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 6px !important;
+ box-shadow: 0 2px 10px var(--shadow-medium) !important;
+ padding: 6px !important;
+}
+
+body:has(.wallboard_title_row) .widget_settings_title_cell,
+body:has(.wallboard_title_row) .widget_settings_cell {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ font-size: 11px !important;
+ padding: 1px 3px !important;
+}
+
+body:has(.wallboard_title_row) .widget_settings_form_field {
+ font-family: var(--font-family) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 3px !important;
+ padding: 3px 4px !important;
+ font-size: 11px !important;
+}
+
+body:has(.wallboard_title_row) .widget_form_button {
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ padding: 3px 8px !important;
+ border-radius: 3px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ background: var(--color-bg-lighter) !important;
+ color: var(--color-primary-dark) !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease !important;
+}
+
+body:has(.wallboard_title_row) .widget_form_button:hover {
+ background: var(--bg-decorative-1) !important;
+}
+
+/* Logo centrado y al 50% */
+body:has(.wallboard_title_row) .total_center {
+ display: flex !important;
+ justify-content: center !important;
+ align-items: center !important;
+ width: 100% !important;
+ height: 100% !important;
+ min-height: 100% !important;
+}
+
+body:has(.wallboard_title_row) .total_center img,
+body:has(.wallboard_title_row) .widget_contents img[src*="vicidial_admin_web_logo"] {
+ max-height: 50% !important;
+ max-width: 50% !important;
+ width: auto !important;
+ height: auto !important;
+ object-fit: contain !important;
+ display: block !important;
+}
+
+/* Gauges/knobs (pureknob): reducir a la mitad y centrar */
+body:has(.wallboard_title_row) .widget_contents div[style*="211px"] {
+ width: 106px !important;
+ height: 106px !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ display: block !important;
+}
+
+body:has(.wallboard_title_row) .widget_contents div[style*="211px"] canvas {
+ width: 100% !important;
+ height: 100% !important;
+}
+
+body:has(.wallboard_title_row) .widget_contents div[style*="241px"] {
+ width: 121px !important;
+ height: 121px !important;
+ margin-left: auto !important;
+ margin-right: auto !important;
+ display: block !important;
+}
+
+body:has(.wallboard_title_row) .widget_contents div[style*="241px"] canvas {
+ width: 100% !important;
+ height: 100% !important;
+}
+
+/* Centrar celdas que contienen el gauge (horizontal y vertical) */
+body:has(.wallboard_title_row) td.widget_contents:has(div[style*="211px"]),
+body:has(.wallboard_title_row) td.widget_contents:has(div[style*="241px"]) {
+ text-align: center !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Real-Time Campaign Summary (AST_timeonVDADallSUMMARY.php) ========== */
+form[action*="AST_timeonVDADallSUMMARY.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: var(--vdc-shadow, 0 2px 8px rgba(0,0,0,0.08)) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] > tbody > tr > td {
+ padding: 16px 20px !important;
+ vertical-align: top !important;
+ border-bottom: 1px solid var(--shadow-text) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] > tbody > tr > td:first-child {
+ font-size: 14px !important;
+ line-height: 1.5 !important;
+}
+
+/* Título y barra de controles */
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td > b:first-of-type {
+ font-family: var(--font-family) !important;
+ font-size: 18px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ display: inline !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td img[alt="HELP"] {
+ vertical-align: middle !important;
+ margin-left: 6px !important;
+ opacity: 0.85 !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td > a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 8px !important;
+ border-radius: 6px !important;
+ font-size: 13px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td > a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td > a[href*="realtime_report"],
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="4"] td b > a {
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Select y botón SUBMIT */
+form[action*="AST_timeonVDADallSUMMARY.php"] select[name="types"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 12px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ margin: 0 8px 0 0 !important;
+ min-width: 180px !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] input[type="submit"][name="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 8px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] input[type="submit"][name="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+/* Tabla de estadísticas por campaña (cellpadding=0) */
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ margin: 8px 0 16px 0 !important;
+ font-size: 13px !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 8px !important;
+ overflow: hidden !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] tr {
+ border-bottom: 1px solid rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] tr:last-child {
+ border-bottom: none !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] td {
+ padding: 8px 12px !important;
+ font-family: var(--font-family) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] td[align="RIGHT"] {
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ width: 1% !important;
+ white-space: nowrap !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] td[align="LEFT"] {
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_timeonVDADallSUMMARY.php"] table[cellpadding="0"][cellspacing="0"] font[size="2"] {
+ font-size: 13px !important;
+ font-family: var(--font-family) !important;
+}
+
+/* Enlace Modify por campaña */
+form[action*="AST_timeonVDADallSUMMARY.php"] a[href*="admin.php?ADD=34"] {
+ font-size: 13px !important;
+}
+
+/* ========== Real-Time Whiteboard Report (AST_rt_whiteboard_rpt.php) ========== */
+form[action*="AST_rt_whiteboard_rpt.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] > b:first-of-type {
+ font-size: 18px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ display: inline-block !important;
+ margin-bottom: 12px !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] img[alt="HELP"] {
+ vertical-align: middle !important;
+ margin-left: 4px !important;
+ opacity: 0.85 !important;
+}
+
+/* Panel de control: tabla principal */
+form[action*="AST_rt_whiteboard_rpt.php"] #report_control_panel table.question_td {
+ width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 12px !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ padding: 16px !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
+ border: 1px solid var(--shadow-text) !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] #report_control_panel table.question_td td {
+ padding: 8px 0 !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+}
+
+/* Etiquetas embossed */
+form[action*="AST_rt_whiteboard_rpt.php"] .embossed {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 400 !important;
+ color: var(--color-text-dark) !important;
+ text-shadow: none !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .embossed br + select,
+form[action*="AST_rt_whiteboard_rpt.php"] .embossed br + input {
+ margin-top: 6px !important;
+}
+
+/* Selects e inputs del formulario */
+form[action*="AST_rt_whiteboard_rpt.php"] .form_field {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ box-sizing: border-box !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .form_field:focus {
+ outline: none !important;
+ border-color: var(--color-primary-dark) !important;
+ box-shadow: 0 0 0 2px var(--bg-decorative-1) !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] select.form_field {
+ min-height: 28px !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] select.form_field[size] {
+ min-height: 100px !important;
+}
+
+/* Panel Target per unit / Target gross (panel_td) */
+form[action*="AST_rt_whiteboard_rpt.php"] .panel_td {
+ padding: 6px 10px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .panel_td[align="right"] {
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Tabla Target per unit / Target gross sales: bordes redondos */
+form[action*="AST_rt_whiteboard_rpt.php"] table:has(.panel_td) {
+ border-radius: 10px !important;
+ overflow: hidden !important;
+ border: 1px solid var(--shadow-text) !important;
+ background: var(--color-bg-lighter) !important;
+}
+
+/* Botones RUN REPORT (verde) y REPORTS (rojo) */
+form[action*="AST_rt_whiteboard_rpt.php"] .green_btn {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .green_btn:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .red_btn {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: #c53030 !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] .red_btn:hover {
+ background: #9b2c2c !important;
+ transform: translateY(-1px) !important;
+}
+
+/* Panel de visualización del reporte (cuando está visible) */
+form[action*="AST_rt_whiteboard_rpt.php"] #report_display_panel table.question_td {
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ padding: 16px !important;
+ border: 1px solid var(--shadow-text) !important;
+}
+
+form[action*="AST_rt_whiteboard_rpt.php"] #report_display_panel .embossed.border2px {
+ font-family: var(--font-family) !important;
+ padding: 10px 12px !important;
+ border-radius: 8px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ background: var(--color-bg-white) !important;
+}
+
+/* ========== Recuadros de ayuda (HelpDisplayDiv / help_info) ========== */
+#HelpDisplayDiv.help_info {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
+ z-index: 10000 !important;
+ overflow: hidden !important;
+}
+
+#HelpDisplayDiv.help_info table.help_td {
+ width: 100% !important;
+ max-width: 320px !important;
+ border-collapse: collapse !important;
+ border-spacing: 0 !important;
+ margin: 0 !important;
+}
+
+#HelpDisplayDiv.help_info table.help_td td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ border: none !important;
+}
+
+#HelpDisplayDiv.help_info table.help_td tr:first-child td {
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ padding: 10px 14px !important;
+}
+
+#HelpDisplayDiv.help_info .help_bold {
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+#HelpDisplayDiv.help_info td[onclick*="ClearAndHideHelpDiv"] {
+ cursor: pointer !important;
+ font-size: 14px !important;
+ color: var(--color-text-dark) !important;
+ transition: color 0.2s ease, background 0.2s ease !important;
+}
+
+#HelpDisplayDiv.help_info td[onclick*="ClearAndHideHelpDiv"]:hover {
+ color: var(--color-primary-dark) !important;
+}
+
+#HelpDisplayDiv.help_info td[onclick*="ClearAndHideHelpDiv"] b {
+ font-weight: 600 !important;
+}
+
+#HelpDisplayDiv.help_info ul {
+ margin: 8px 0 0 0 !important;
+ padding-left: 20px !important;
+ line-height: 1.5 !important;
+}
+
+#HelpDisplayDiv.help_info li {
+ margin: 6px 0 !important;
+ padding: 0 !important;
+}
+
+/* ========== Popup Color chooser / Audio chooser (#audio_chooser_span) ========== */
+#audio_chooser_span {
+ font-family: var(--font-family) !important;
+ box-sizing: border-box !important;
+}
+
+#audio_chooser_span span[id^="color_chooser_frame"],
+#audio_chooser_span span[name="color_chooser_frame"] {
+ display: block !important;
+ width: 740px !important;
+ max-width: 96vw !important;
+ min-height: 440px !important;
+ max-height: 85vh !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
+ overflow: auto !important;
+ padding: 16px 20px !important;
+ z-index: 10001 !important;
+}
+
+#audio_chooser_span span[id^="color_chooser_frame"] a[href*="close_chooser"],
+#audio_chooser_span span[name="color_chooser_frame"] a[href*="close_chooser"] {
+ display: inline-block !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ padding: 8px 16px !important;
+ border-radius: 8px !important;
+ text-decoration: none !important;
+ margin-bottom: 12px !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+#audio_chooser_span span[id^="color_chooser_frame"] a[href*="close_chooser"]:hover,
+#audio_chooser_span span[name="color_chooser_frame"] a[href*="close_chooser"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+#audio_chooser_span #select_color_frame {
+ height: auto !important;
+ max-height: 70vh !important;
+ width: 100% !important;
+ max-width: 420px !important;
+ overflow: auto !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 10px !important;
+ padding: 8px !important;
+}
+
+#audio_chooser_span #select_color_frame table {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ border-spacing: 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+}
+
+#audio_chooser_span #select_color_frame tr[bgcolor="#F6F6F6"] {
+ background: var(--color-bg-white) !important;
+}
+
+#audio_chooser_span #select_color_frame tr[bgcolor="#E6E6E6"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+#audio_chooser_span #select_color_frame td {
+ padding: 6px 10px !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ vertical-align: middle !important;
+ color: var(--color-text-dark) !important;
+}
+
+#audio_chooser_span #select_color_frame td[bgcolor] {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
+ min-width: 48px !important;
+}
+
+#audio_chooser_span #select_color_frame a[href^="javascript:choose_color"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ font-weight: 500 !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+#audio_chooser_span #select_color_frame a[href^="javascript:choose_color"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+#audio_chooser_span #select_color_frame font {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+}
+
+/* iframe dentro de audio_chooser_span (audio/moh/ingroup choosers) */
+#audio_chooser_span iframe {
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
+ background: var(--color-bg-white) !important;
+}
+
+/* ========== Inbound Call Stats / Closer Stats (AST_CLOSERstats.php) ========== */
+form[action*="AST_CLOSERstats.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Tabla de filtros (bgcolor #D9E6FE) */
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_CLOSERstats.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+/* Contenedor del reporte (tabla exterior + pre) */
+body:has(form[action*="AST_CLOSERstats.php"]) table[cellpadding="3"]:first-of-type {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--shadow-text) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) pre a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) pre a:hover {
+ text-decoration: underline !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound Report (AST_CLOSERstats): título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_CLOSERstats.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_CLOSERstats.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 160px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Inbound Report v2 (AST_CLOSERstats_v2.php) - estilos completos ========== */
+form[action*="AST_CLOSERstats_v2.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_CLOSERstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) table[cellpadding="3"]:first-of-type {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--shadow-text) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) pre a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) pre a:hover {
+ text-decoration: underline !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound Report v2: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_CLOSERstats_v2.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_CLOSERstats_v2.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 160px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* Popup de ayuda: abrir hacia arriba en páginas con barra fija abajo */
+body:has(form[action*="AST_CLOSERstats.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_CLOSERstats_v2.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_CLOSER_service_level"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_inbound_daily_report.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_DIDstats.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_DIDstats_v2.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="AST_IVRstats.php"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="inbound_forecasting"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="Erlang_report"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="VDADstats"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="OUTBOUNDsummary_interval"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="CMstats"]) #HelpDisplayDiv.help_info,
+body:has(form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"])) #HelpDisplayDiv.help_info,
+body:has(form[action*="agent_time_detail"]) #HelpDisplayDiv.help_info {
+ position: fixed !important;
+ top: auto !important;
+ bottom: 56px !important;
+ left: 20px !important;
+ max-height: 70vh !important;
+ overflow-y: auto !important;
+}
+
+/* ========== Inbound Summary Hourly Report (AST_CLOSERsummary_hourly.php) ========== */
+form[action*="AST_CLOSERsummary_hourly.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_CLOSERsummary_hourly.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) table[cellpadding="3"]:first-of-type {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--shadow-text) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) pre a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) pre a:hover {
+ text-decoration: underline !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound Summary Hourly Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_CLOSERsummary_hourly.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 280px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* Inbound Daily Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_inbound_daily_report.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Inbound Daily Report (AST_inbound_daily_report.php) - estilos del formulario y reporte ========== */
+form[action*="AST_inbound_daily_report.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_inbound_daily_report.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces DOWNLOAD | MODIFY | REPORTS (fuera de la tabla #D9E6FE pero en la misma página) */
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"],
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="MODIFY"],
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="REPORTS"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"]:hover,
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="MODIFY"]:hover,
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] a[href*="REPORTS"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) table[cellpadding="3"] td {
+ padding: 8px 0 !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_inbound_daily_report.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound DID Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_DIDstats.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Inbound DID Report (AST_DIDstats.php) - estilos del formulario y reporte ========== */
+form[action*="AST_DIDstats.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_DIDstats.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"],
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="MODIFY"],
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="REPORTS"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"]:hover,
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="MODIFY"]:hover,
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] a[href*="REPORTS"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) table[cellpadding="3"] td {
+ padding: 8px 0 !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_DIDstats.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound DID Summary Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_DIDstats_v2.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 260px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Inbound DID Summary Report (AST_DIDstats_v2.php) - estilos del formulario y reporte ========== */
+form[action*="AST_DIDstats_v2.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_DIDstats_v2.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"],
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="MODIFY"],
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="REPORTS"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"]:hover,
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="MODIFY"]:hover,
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] a[href*="REPORTS"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) table[cellpadding="3"] td {
+ padding: 8px 0 !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_DIDstats_v2.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound IVR Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_IVRstats.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="IVRstats"]) > table[bgcolor="#015B91"] + b,
+body:has(form[action*="IVRstats"]) > table[bgcolor="015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Inbound IVR Report (AST_IVRstats.php) - estilos del formulario y reporte ========== */
+form[action*="IVRstats"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="IVRstats"] > table {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+form[action*="IVRstats"] > table td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="IVRstats"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="IVRstats"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"],
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="button"][value="SUBMIT"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover,
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="button"][value="SUBMIT"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="IVRstats"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="IVRstats"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+form[action*="AST_IVRstats.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"],
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="MODIFY"],
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="REPORTS"],
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="AST_CLOSERstats"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="DOWNLOAD"]:hover,
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="MODIFY"]:hover,
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="REPORTS"]:hover,
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] a[href*="AST_CLOSERstats"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) table[cellpadding="3"] td {
+ padding: 8px 0 !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_IVRstats.php"]) pre font[size="2"],
+body:has(form[action*="AST_IVRstats.php"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Inbound Forecasting Report: barra fija, formulario y reporte ========== */
+body:has(form[action*="inbound_forecasting"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="inbound_forecasting"]) form > b,
+body:has(form[action*="inbound_forecasting"]) > table[bgcolor="#015B91"] + form > b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="inbound_forecasting"]) form > b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+form[action*="inbound_forecasting"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="inbound_forecasting"] table[bgcolor="#D9E6FE"],
+form[action*="inbound_forecasting"] table[cellpadding="3"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+form[action*="inbound_forecasting"] table[bgcolor="#D9E6FE"] td,
+form[action*="inbound_forecasting"] table[cellpadding="3"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="inbound_forecasting"] input[type="TEXT"],
+form[action*="inbound_forecasting"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="inbound_forecasting"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="inbound_forecasting"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="inbound_forecasting"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="inbound_forecasting"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="inbound_forecasting"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="inbound_forecasting"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="inbound_forecasting"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="inbound_forecasting"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="inbound_forecasting"]) pre font[size="2"],
+body:has(form[action*="inbound_forecasting"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Advanced Forecasting Report (Erlang_report.php): barra fija, formulario y reporte ========== */
+body:has(form[action*="Erlang_report"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="Erlang_report"]) form > b,
+body:has(form[action*="Erlang_report"]) > table[bgcolor="#015B91"] + form > b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="Erlang_report"]) form > b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+form[action*="Erlang_report"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="Erlang_report"] table[bgcolor="#D9E6FE"],
+form[action*="Erlang_report"] table[cellpadding="3"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+form[action*="Erlang_report"] table[bgcolor="#D9E6FE"] td,
+form[action*="Erlang_report"] table[cellpadding="3"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="Erlang_report"] input[type="TEXT"],
+form[action*="Erlang_report"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="Erlang_report"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="Erlang_report"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="Erlang_report"] input[type="radio"] {
+ cursor: pointer !important;
+ margin-right: 6px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="Erlang_report"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="Erlang_report"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="Erlang_report"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="Erlang_report"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="Erlang_report"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="Erlang_report"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="Erlang_report"]) pre font[size="2"],
+body:has(form[action*="Erlang_report"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Outbound Calling Report (AST_VDADstats.php): barra fija, formulario y reporte ========== */
+body:has(form[action*="VDADstats"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="VDADstats"]) > table[bgcolor="#015B91"] + b,
+body:has(form[action*="VDADstats"]) > table[bgcolor="015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="VDADstats"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"],
+body:has(form[action*="VDADstats"]) > table[bgcolor="015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+form[action*="VDADstats"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form[action*="VDADstats"]) table[bgcolor="#D9E6FE"],
+body:has(form[action*="VDADstats"]) table[cellpadding="3"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+body:has(form[action*="VDADstats"]) table[bgcolor="#D9E6FE"] td,
+body:has(form[action*="VDADstats"]) table[cellpadding="3"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="VDADstats"] input[type="TEXT"],
+form[action*="VDADstats"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="VDADstats"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="VDADstats"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="VDADstats"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="VDADstats"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="VDADstats"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="VDADstats"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="VDADstats"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="VDADstats"]) table[cellpadding="3"] font,
+form[action*="VDADstats"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="VDADstats"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="VDADstats"]) pre font[size="2"],
+body:has(form[action*="VDADstats"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Outbound Summary Interval Report (AST_OUTBOUNDsummary_interval.php) ========== */
+body:has(form[action*="OUTBOUNDsummary_interval"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) > table[bgcolor="#015B91"] + b,
+body:has(form[action*="OUTBOUNDsummary_interval"]) > table[bgcolor="015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"],
+body:has(form[action*="OUTBOUNDsummary_interval"]) > table[bgcolor="015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) table[bgcolor="#D9E6FE"],
+body:has(form[action*="OUTBOUNDsummary_interval"]) table[cellpadding="3"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) table[bgcolor="#D9E6FE"] td,
+body:has(form[action*="OUTBOUNDsummary_interval"]) table[cellpadding="3"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] input[type="TEXT"],
+form[action*="OUTBOUNDsummary_interval"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="OUTBOUNDsummary_interval"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) table[cellpadding="3"] font,
+form[action*="OUTBOUNDsummary_interval"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="OUTBOUNDsummary_interval"]) pre font[size="2"],
+body:has(form[action*="OUTBOUNDsummary_interval"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Callmenu Survey Report (AST_CMstats.php) ========== */
+body:has(form[action*="CMstats"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="CMstats"]) > table[bgcolor="#015B91"] + b,
+body:has(form[action*="CMstats"]) > table[bgcolor="015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form[action*="CMstats"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"],
+body:has(form[action*="CMstats"]) > table[bgcolor="015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 200px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+form[action*="CMstats"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form[action*="CMstats"]) table[bgcolor="#D9E6FE"],
+body:has(form[action*="CMstats"]) table[cellpadding="3"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+body:has(form[action*="CMstats"]) table[bgcolor="#D9E6FE"] td,
+body:has(form[action*="CMstats"]) table[cellpadding="3"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="CMstats"] input[type="TEXT"],
+form[action*="CMstats"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="CMstats"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="CMstats"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="CMstats"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="CMstats"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="CMstats"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="CMstats"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="CMstats"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="CMstats"]) table[cellpadding="3"] font,
+form[action*="CMstats"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="CMstats"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="CMstats"]) pre font[size="2"],
+body:has(form[action*="CMstats"]) pre font[size="0"] {
+ font-size: 12px !important;
+}
+
+/* ========== Export Calls Report IVR (call_report_export.php with ivr_export=YES) ========== */
+body:has(form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"])) center {
+ text-align: left !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ margin: 0 !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
+ padding: 0 !important;
+ width: fit-content !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ display: block !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) table {
+ border-collapse: collapse !important;
+ background: transparent !important;
+ border: none !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) td {
+ padding: 10px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="TEXT"],
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) select[size] {
+ min-height: 120px !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="radio"] {
+ cursor: pointer !important;
+ margin-right: 6px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 24px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) font,
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) .select_bold,
+form[action*="call_report_export"]:has(input[name="ivr_export"][value="YES"]) b {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+/* ========== ADMINISTRATION: DIDs (INBOUND DID LISTINGS, ADD=1300) ========== */
+body:has(#adminDIDdisplay) #adminDIDdisplay {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+#adminDIDdisplay form table[width="850"] {
+ width: 100% !important;
+ max-width: 850px !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 10px rgba(0,0,0,0.06) !important;
+}
+
+#adminDIDdisplay form table[width="850"] td {
+ padding: 10px 12px !important;
+ font-size: 13px !important;
+ vertical-align: middle !important;
+}
+
+#adminDIDdisplay form table[width="850"] tr[bgcolor="#e6e6e6"],
+#adminDIDdisplay form table[width="850"] tr[bgcolor="#E6E6E6"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+#adminDIDdisplay form table[width="850"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+#adminDIDdisplay form table[width="850"] input[type="submit"].blue_btn,
+#adminDIDdisplay form table[width="850"] input[type="submit"][value="FILTER DIDS"] {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ padding: 8px 16px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease !important;
+}
+
+#adminDIDdisplay form table[width="850"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+}
+
+#adminDIDdisplay form table[width="850"] tr[bgcolor="BLACK"],
+#adminDIDdisplay form table[width="850"] tr[bgcolor="black"] {
+ background: var(--color-primary-dark) !important;
+}
+
+#adminDIDdisplay form table[width="850"] tr[bgcolor="BLACK"] td,
+#adminDIDdisplay form table[width="850"] tr[bgcolor="black"] td,
+#adminDIDdisplay form table[width="850"] tr[bgcolor="BLACK"] a,
+#adminDIDdisplay form table[width="850"] tr[bgcolor="black"] a {
+ color: var(--color-text-light) !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+}
+
+#adminDIDdisplay form table[width="850"] tr[bgcolor="BLACK"] a:hover,
+#adminDIDdisplay form table[width="850"] tr[bgcolor="black"] a:hover {
+ text-decoration: underline !important;
+}
+
+#adminDIDdisplay .records_list_y,
+#adminDIDdisplay .records_list_x {
+ background: var(--color-bg-lighter) !important;
+ transition: background 0.15s ease !important;
+}
+
+#adminDIDdisplay .records_list_y:hover,
+#adminDIDdisplay .records_list_x:hover {
+ background: var(--bg-decorative-1) !important;
+}
+
+#adminDIDdisplay .records_list_y td,
+#adminDIDdisplay .records_list_x td,
+#adminDIDdisplay .records_list_y font,
+#adminDIDdisplay .records_list_x font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+#adminDIDdisplay .records_list_y a,
+#adminDIDdisplay .records_list_x a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+#adminDIDdisplay .records_list_y a:hover,
+#adminDIDdisplay .records_list_x a:hover {
+ color: var(--color-primary-dark) !important;
+ text-decoration: underline !important;
+}
+
+body:has(#adminDIDdisplay) td font[color="BLACK"]:first-of-type,
+body:has(#adminDIDdisplay) td font[color="black"]:first-of-type {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+}
+
+/* ========== Administration: Maximum System Stats (admin.php ADD=999992) ========== */
+body:has(a[href*="download_max_system_stats_metric_name"]) {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) center {
+ text-align: left !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="TEXT"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ padding: 8px 16px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) a[href*="download_max_system_stats_metric_name"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) a[href*="download_max_system_stats_metric_name"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[width="850"] {
+ width: 100% !important;
+ max-width: 850px !important;
+ border-collapse: collapse !important;
+ margin: 16px 0 !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) tr[bgcolor="#B6D3FC"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) tr[bgcolor="#B6D3FC"] td {
+ padding: 16px !important;
+ vertical-align: top !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] {
+ font-family: var(--font-family) !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ overflow: hidden !important;
+ border: 1px solid var(--color-primary-light) !important;
+ margin: 12px 0 !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] caption {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+ padding: 10px 12px !important;
+ text-align: left !important;
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] th {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+ padding: 8px 12px !important;
+ text-align: left !important;
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) .chart_td {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+ padding: 6px 12px !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] .chart_td font {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) font[color="BLACK"],
+body:has(a[href*="download_max_system_stats_metric_name"]) font[color="black"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) b:first-of-type {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* ========== Administration: Maximum System Stats (admin.php ADD=999992) ========== */
+body:has(a[href*="download_max_system_stats_metric_name"]) {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) center {
+ text-align: left !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="TEXT"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ padding: 8px 16px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) form[name="vicidial_report"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) a[href*="download_max_system_stats_metric_name"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) a[href*="download_max_system_stats_metric_name"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[width="850"] {
+ width: 100% !important;
+ max-width: 850px !important;
+ border-collapse: collapse !important;
+ margin: 16px 0 !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) tr[bgcolor="#B6D3FC"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) tr[bgcolor="#B6D3FC"] td {
+ padding: 16px !important;
+ vertical-align: top !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] {
+ font-family: var(--font-family) !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 10px !important;
+ overflow: hidden !important;
+ border: 1px solid var(--color-primary-light) !important;
+ margin: 12px 0 !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] caption {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+ padding: 10px 12px !important;
+ text-align: left !important;
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] th {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ color: var(--color-text-dark) !important;
+ padding: 8px 12px !important;
+ text-align: left !important;
+ background: var(--color-bg-lighter) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) .chart_td {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+ padding: 6px 12px !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) table[summary*="day total"] .chart_td font {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) font[color="BLACK"],
+body:has(a[href*="download_max_system_stats_metric_name"]) font[color="black"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(a[href*="download_max_system_stats_metric_name"]) b:first-of-type {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* ========== Agent Time Detail (AST_agent_time_detail.php): quitar position absolute y estilos ========== */
+body:has(form[action*="agent_time_detail"]) {
+ text-align: left !important;
+}
+
+body:has(form[action*="agent_time_detail"]) center {
+ text-align: left !important;
+ display: block !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #admin_header,
+body:has(form[action*="agent_time_detail"]) #agent_status_stats,
+body:has(form[action*="agent_time_detail"]) #agent_status_bars {
+ position: static !important;
+ left: auto !important;
+ top: auto !important;
+ right: auto !important;
+ z-index: auto !important;
+ display: block !important;
+ float: none !important;
+ transform: none !important;
+}
+
+/* Anular estilo en línea del span (position:absolute; left:3px; top:30px) */
+body:has(form[action*="agent_time_detail"]) span#agent_status_stats,
+span#agent_status_stats:has(form[action*="agent_time_detail"]) {
+ position: static !important;
+ left: 0 !important;
+ top: auto !important;
+ right: auto !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
+ float: left !important;
+ clear: left !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #admin_header {
+ width: 100% !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #agent_status_stats {
+ text-align: left !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ margin-left: 0 !important;
+ margin-right: 0 !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #admin_header table[bgcolor="#015B91"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #admin_header a {
+ color: var(--color-text-light) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #admin_header a:hover {
+ text-decoration: underline !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #agent_status_stats b {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="agent_time_detail"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ margin: 0 !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
+ padding: 20px 0 !important;
+ display: block !important;
+ width: fit-content !important;
+ max-width: 100% !important;
+ text-align: left !important;
+}
+
+form[action*="agent_time_detail"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ max-width: 1000px !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+form[action*="agent_time_detail"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+}
+
+form[action*="agent_time_detail"] input[type="TEXT"],
+form[action*="agent_time_detail"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="agent_time_detail"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="agent_time_detail"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="agent_time_detail"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+form[action*="agent_time_detail"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+form[action*="agent_time_detail"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="agent_time_detail"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="agent_time_detail"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="agent_time_detail"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="agent_time_detail"]) #agent_status_stats pre {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark) !important;
+ background: transparent !important;
+ padding: 12px 0 !important;
+ margin: 0 0 12px 0 !important;
+ white-space: pre-wrap !important;
+}
+
+/* Agent DID Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_agentDIDstats.php"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) > table:first-of-type + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) > table:first-of-type + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 180px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* Agent DID Report: estilos del formulario, tabla de filtros y pre */
+form[action*="AST_agentDIDstats.php"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+form[action*="AST_agentDIDstats.php"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) table[cellpadding="3"] {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) pre {
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--shadow-text) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ margin: 16px 0 0 0 !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) pre a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) pre a:hover {
+ text-decoration: underline !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_agentDIDstats.php"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* ========== Inbound Service Level Report (AST_CLOSER_service_level.php) - estilos completos ========== */
+form[action*="AST_CLOSER_service_level"] {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ max-width: 1200px !important;
+ margin: 0 !important;
+ padding: 20px !important;
+ box-sizing: border-box !important;
+}
+
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background: var(--color-bg-lighter) !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] td {
+ padding: 12px 14px !important;
+ vertical-align: top !important;
+ font-size: 13px !important;
+ border: none !important;
+}
+
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] input[type="TEXT"],
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] select[size] {
+ min-height: 80px !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] input[type="submit"],
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 20px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] input[type="submit"]:hover,
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
+}
+
+/* DOWNLOAD | MODIFY | REPORTS y Search archived data (también con body:has porque el form está dentro de la table) */
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] a,
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] a:hover,
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] font,
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] font {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[bgcolor="#D9E6FE"] input[type="checkbox"],
+form[action*="AST_CLOSER_service_level"] table[bgcolor="#D9E6FE"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) table[cellpadding="3"]:first-of-type {
+ width: 100% !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) pre {
+ display: block !important;
+ clear: both !important;
+ margin-top: 16px !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+ font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace !important;
+ font-size: 12px !important;
+ line-height: 1.45 !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ border: 1px solid var(--shadow-text) !important;
+ border-radius: 10px !important;
+ padding: 16px 20px !important;
+ overflow-x: auto !important;
+ white-space: pre !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) pre a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) pre a:hover {
+ text-decoration: underline !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) pre font[size="2"] {
+ font-size: 12px !important;
+}
+
+/* Inbound Service Level Report: título e icono ayuda fijados abajo (flotantes) */
+body:has(form[action*="AST_CLOSER_service_level"]) {
+ padding-bottom: 56px !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) > table[bgcolor="#015B91"] + b {
+ position: fixed !important;
+ bottom: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 9998 !important;
+ margin: 0 !important;
+ padding: 12px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark) !important;
+ background: var(--color-bg-lighter) !important;
+ border-top: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form[action*="AST_CLOSER_service_level"]) > table[bgcolor="#015B91"] + b + img[alt="HELP"] {
+ position: fixed !important;
+ bottom: 12px !important;
+ left: 240px !important;
+ z-index: 9999 !important;
+ vertical-align: middle !important;
+}
+
+/* ========== Modify In-Group (admin.php?ADD=3111) ========== */
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] {
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
+ border: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#B6D3FC"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#B6D3FC"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+
+ vertical-align: middle !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#BDFFBD"] {
+ background: var(--bg-decorative-1) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#BDFFBD"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#99FFCC"] {
+ background: rgba(153, 255, 204, 0.25) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#99FFCC"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#CCFFFF"] {
+ background: rgba(204, 255, 255, 0.3) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#CCFFFF"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#8EBCFD"] {
+ background: rgba(142, 188, 253, 0.2) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] tr[bgcolor="#8EBCFD"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 24px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+ box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 3px 8px rgba(0,0,0,0.15) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] input[type="checkbox"] {
+ cursor: pointer !important;
+ margin-right: 8px !important;
+ width: 16px !important;
+ height: 16px !important;
+ accent-color: var(--color-primary-medium) !important;
+ vertical-align: middle !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] font {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) form#admin_form table[width="900"] font[color="red"] {
+ color: var(--color-error, #c62828) !important;
+}
+
+/* Título "MODIFY A GROUPS RECORD" y enlaces inferiores en la misma zona */
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] font:has(+ form#admin_form),
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td > font[face="ARIAL,HELVETICA"] {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="AST_CLOSERstats"],
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="AST_VICIDIAL_ingrouplist"],
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="admin.php?ADD=5111"],
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="ADD=720000000000000"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 4px 8px !important;
+ border-radius: 4px !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="AST_CLOSERstats"]:hover,
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="AST_VICIDIAL_ingrouplist"]:hover,
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="admin.php?ADD=5111"]:hover,
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] a[href*="ADD=720000000000000"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Tabla AGENT RANKS y tablas DIDs / CALL MENUS / CAMPAIGNS */
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] {
+ border-collapse: collapse !important;
+ border-radius: 10px !important;
+ overflow: hidden !important;
+ border: 1px solid var(--color-primary-light) !important;
+ box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] tr:first-child td {
+ background: var(--color-bg-lighter) !important;
+ font-family: var(--font-family) !important;
+ font-weight: 600 !important;
+ font-size: 13px !important;
+ color: var(--color-primary-dark) !important;
+ padding: 10px 12px !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] tr[bgcolor="#B9CBFD"] td,
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] tr[bgcolor="#9BB9FB"] td {
+ padding: 8px 12px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] tr[bgcolor="#B9CBFD"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] tr[bgcolor="#9BB9FB"] {
+ background: rgba(155, 185, 251, 0.25) !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form#admin_form input[name="ADD"][value="4111"]) td[bgcolor="#D9E6FE"] table[width="800"] a:hover {
+ color: var(--color-primary-dark) !important;
+ text-decoration: underline !important;
+}
+
+/* ========== Modify DID (admin.php?ADD=4311) ========== */
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] {
+ border-collapse: collapse !important;
+ background: var(--color-bg-white) !important;
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#B6D3FC"] {
+ background: var(--color-bg-lighter) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#B6D3FC"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#99FFCC"] {
+ background: rgba(153, 255, 204, 0.25) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#99FFCC"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#CCFFFF"] {
+ background: rgba(204, 255, 255, 0.3) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#CCFFFF"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#8EBCFD"] {
+ background: rgba(142, 188, 253, 0.2) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] tr[bgcolor="#8EBCFD"] td {
+ padding: 10px 14px !important;
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+ border-bottom: 1px solid var(--color-primary-light) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] input[type="text"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] select {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ padding: 8px 10px !important;
+ border: 1px solid var(--color-primary-light) !important;
+ border-radius: 8px !important;
+ color: var(--color-text-dark) !important;
+ background: var(--color-bg-white) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] select[size] {
+ min-height: 60px !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] input[type="submit"] {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ padding: 10px 24px !important;
+ color: var(--color-text-light) !important;
+ background: var(--color-primary-medium) !important;
+ border: none !important;
+ border-radius: 8px !important;
+ cursor: pointer !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] input[type="submit"]:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] img[alt="HELP"] {
+ vertical-align: middle !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) form table[width="850"] font {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark) !important;
+}
+
+/* Título "MODIFY A DID RECORD" y secciones inferiores (misma columna #D9E6FE) */
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td > font[face="ARIAL,HELVETICA"],
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td > b {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="admin.php?ADD="],
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="AST_DIDstats"],
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="user_stats"],
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="ADD=5311"],
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="ADD=720000000000000"] {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="admin.php?ADD="]:hover,
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="AST_DIDstats"]:hover,
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="user_stats"]:hover,
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="ADD=5311"]:hover,
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] a[href*="ADD=720000000000000"]:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark) !important;
+}
+
+/* Tablas de sección (IN-GROUPS USING THIS DID, LISTS USING THIS DID, etc.) */
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td table {
+ border-collapse: collapse !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td table td {
+ padding: 6px 10px !important;
+ color: var(--color-text-dark) !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td table a {
+ color: var(--color-primary-medium) !important;
+ text-decoration: none !important;
+}
+
+body:has(form input[name="ADD"][value="4311"]) td[bgcolor="#D9E6FE"] > table > tbody > tr > td table a:hover {
+ color: var(--color-primary-dark) !important;
+ text-decoration: underline !important;
+}
+
+/*
+ * =============================================================================
+ * =============================================================================
+ * FIN ESTILOS DE ADMINISTRACIÓN
+ * (Wallboards, VERM Custom Report, reportes, estadísticas, realtime, etc.)
+ * =============================================================================
+ * =============================================================================
+ *
+ * INICIO COMPONENTE DE AGENTE (Agent web client)
+ * Pantalla del agente ViciDial: #vicidial_form, LoadingBox, tabs, overlays,
+ * transfer, disposition, alertas, footer, enlaces de acción, etc.
+ *
+ * =============================================================================
+ * =============================================================================
+ */
+
+
+/* AGENT_AREA */
+/* ========== Estilos visuales modernos (agente VICIDIAL) ========== */
+/* SCOPE: Solo dentro de #vicidial_form. Colores solo desde :root (sin modificar root). */
+#vicidial_form {
+ --vdc-radius: 8px;
+ --vdc-radius-sm: 6px;
+ --vdc-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+ --vdc-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
+ --vdc-transition: 0.2s ease;
+ --vdc-btn-width: 160px;
+ --vdc-content-max-width: 1200px; /* Ancho máximo del contenido (Tabs + panel + footer) */
+}
+
+/* ========== Override de colores inline del HTML (solo variables :root existentes) ========== */
+/* ========== LoadingBox (pantalla de carga del agente) - estilo moderno ========== */
+#vicidial_form #LoadingBox {
+ display: flex !important;
+ align-items: center;
+ justify-content: center;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ background: var(--color-bg-white, #fff) !important;
+ z-index: 2147483647 !important;
+}
+#vicidial_form #LoadingBox table {
+ width: auto !important;
+ max-width: 320px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 20px;
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: 16px;
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
+ border: none !important;
+}
+#vicidial_form #LoadingBox td {
+ padding: 32px 40px !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+}
+#vicidial_form #LoadingBox .loading_text {
+ font-family: var(--font-family) !important;
+ font-size: 16px !important;
+ font-weight: 500 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ letter-spacing: 0.02em;
+ margin-bottom: 8px;
+ display: block;
+}
+#vicidial_form #LoadingBox img {
+ display: block !important;
+ margin: 12px auto 0 !important;
+ max-width: 100%;
+ height: auto;
+}
+#vicidial_form #Header table { background-color: var(--color-primary-medium) !important; }
+/* Tabs y contenido: responsive, alineado a la izquierda */
+#vicidial_form #Tabs {
+ max-width: var(--vdc-content-max-width) !important;
+ width: 1180px!important;
+ left: 0 !important;
+ margin-top: 30px !important;
+ box-sizing: border-box;
+}
+#vicidial_form #Tabs table {
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box;
+}
+#vicidial_form #Tabs table,
+#vicidial_form #Tabs table td[bgcolor] { background-color: var(--color-bg-white) !important; }
+#vicidial_form #WelcomeBoxA table { background-color: var(--color-bg-white) !important; }
+#vicidial_form #MainTable { background-color: var(--color-bg-lighter) !important; }
+#vicidial_form #MainStatuSSpan { background: var(--color-bg-lighter) !important; }
+#vicidial_form #post_phone_time_diff_span font,
+#vicidial_form #post_phone_time_diff_span .loading_text,
+#vicidial_form #blind_monitor_notice_span font { color: var(--color-text-dark) !important; }
+#vicidial_form #DiaLControl { background-color: transparent !important; }
+#vicidial_form #DiaLControl:hover { background-color: transparent !important; }
+#vicidial_form #RecorDControl { background-color: transparent !important; }
+#vicidial_form #RecorDControl:hover { background-color: transparent !important; }
+#vicidial_form #RecorDMute,
+#vicidial_form #StRecorDControl,
+#vicidial_form #ParkControl,
+#vicidial_form #XferControl,
+#vicidial_form #SendDTMF,
+#vicidial_form #ivrParkControl { background-color: transparent !important; }
+#vicidial_form #WebFormSpan,
+#vicidial_form #WebFormSpanTwo { background-color: transparent !important; }
+#vicidial_form #HangupControl { background-color: transparent !important; }
+#vicidial_form #MaiNfooter { background-color: var(--color-bg-white) !important; }
+#vicidial_form #callsinqueuedisplay,
+#vicidial_form #AgentViewSpan,
+#vicidial_form #webphoneSpan { background-color: var(--color-bg-lighter) !important; }
+#vicidial_form #ScriptPanel table,
+#vicidial_form #Script2Panel table,
+#vicidial_form #FormPanel table,
+#vicidial_form #EmailPanel table,
+#vicidial_form #CustomerChatPanel table,
+#vicidial_form #InternalChatPanel table { background-color: var(--color-bg-white) !important; }
+
+/* Ocultar imagen solo en estos botones (texto con ::before); los logos (Tabs, LoadingBox) se mantienen */
+#vicidial_form #DiaLControl > a > img,
+#vicidial_form #DiaLControl > img,
+#vicidial_form #RecorDControl > a > img,
+#vicidial_form #RecorDControl > img,
+#vicidial_form #StRecorDControl > img,
+#vicidial_form #WebFormSpan > img,
+#vicidial_form #WebFormSpan > a > img,
+#vicidial_form #WebFormSpanTwo > img,
+#vicidial_form #WebFormSpanTwo > a > img,
+#vicidial_form #ParkControl > img,
+#vicidial_form #ParkControl > a > img,
+#vicidial_form #XferControl > img,
+#vicidial_form #HangupControl > a > img,
+#vicidial_form #HangupControl > img,
+#vicidial_form #SendDTMF > a > img {
+ display: none !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ position: absolute !important;
+ left: -9999px !important;
+}
+/* Texto en lugar de imagen solo en estos botones (logos NO) */
+#vicidial_form #DiaLControl > a::before { content: "Dial Next Number"; }
+#vicidial_form #DiaLControl > a:has(img[alt="You are paused"])::before { content: "YOU ARE PAUSED"; }
+#vicidial_form #DiaLControl > a:has(img[alt="You are active"])::before { content: "YOU ARE ACTIVE"; }
+/* Cuando DiaLControl solo tiene img (sin ): mostrar texto para no ver la imagen */
+#vicidial_form #DiaLControl:not(:has(> a))::before { content: "Dial Next Number"; }
+#vicidial_form #RecorDControl > a:not(:has(img[alt="Stop Recording"]))::before { content: "Start Recording"; }
+#vicidial_form #RecorDControl > a:has(img[alt="Stop Recording"])::before { content: "Stop Recording"; }
+#vicidial_form #StRecorDControl::before { content: "Start Stereo Recording"; }
+#vicidial_form #WebFormSpan::before { content: "Web Form"; }
+#vicidial_form #WebFormSpanTwo::before { content: "Web Form 2"; }
+#vicidial_form #ParkControl::before { content: "Park Call"; }
+#vicidial_form #ParkControl:has(> a)::before { content: "Grab Parked Call"; }
+#vicidial_form #XferControl::before { content: "Transfer - Conference"; }
+#vicidial_form #HangupControl::before { content: "Hangup Customer"; }
+#vicidial_form #SendDTMF > a::before { content: "Send DTMF"; }
+/* Contenedores de botones con texto: display para que se vea el ::before */
+#vicidial_form #DiaLControl > a,
+#vicidial_form #DiaLControl:not(:has(> a)),
+#vicidial_form #RecorDControl > a,
+#vicidial_form #SendDTMF > a { display: inline-block !important; }
+#vicidial_form #StRecorDControl,
+#vicidial_form #WebFormSpan,
+#vicidial_form #WebFormSpanTwo,
+#vicidial_form #ParkControl,
+#vicidial_form #XferControl,
+#vicidial_form #HangupControl { display: inline-block !important; }
+/* Estilo del texto (::before) solo en estos botones */
+#vicidial_form #DiaLControl > a::before,
+#vicidial_form #DiaLControl:not(:has(> a))::before,
+#vicidial_form #RecorDControl > a::before,
+#vicidial_form #SendDTMF a::before,
+#vicidial_form #StRecorDControl::before,
+#vicidial_form #WebFormSpan::before,
+#vicidial_form #WebFormSpanTwo::before,
+#vicidial_form #ParkControl::before,
+#vicidial_form #XferControl::before,
+#vicidial_form #HangupControl::before {
+ display: inline-block;
+ font-family: var(--font-family);
+ font-size: var(--font-size-p2);
+ font-weight: 500;
+ padding: 6px 10px;
+ border-radius: var(--vdc-radius-sm);
+ background: transparent;
+ color: var(--color-primary-dark);
+ white-space: nowrap;
+}
+
+/* Ocultar texto del span cuando hay (evitar duplicado con el texto del enlace) */
+#vicidial_form #RecorDControl:has(> a)::before {
+ content: none !important;
+ display: none !important;
+}
+/* Cuando JS deja solo ![]()
(sin ): "Start" desactivado = verde, "Stop" desactivado = rojo. */
+#vicidial_form #RecorDControl:not(:has(> a))::before {
+ display: inline-block !important;
+ font-family: var(--font-family);
+ font-size: var(--font-size-p2);
+ font-weight: 500;
+ padding: 8px 12px;
+ border-radius: var(--vdc-radius-sm);
+ background: transparent;
+ color: #fff !important;
+ white-space: nowrap;
+ line-height: 1.3;
+ position: relative;
+ z-index: 1;
+}
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Start Recording"])::before {
+ content: "Start Recording";
+}
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Stop Recording"])::before {
+ content: "Stop Recording";
+}
+#vicidial_form #RecorDControl:not(:has(> a)) {
+ display: inline-block !important;
+ width: 100%;
+ min-height: 36px;
+ box-sizing: border-box;
+ padding: 6px 12px;
+ border-radius: var(--vdc-radius-sm);
+ color: #fff !important;
+ text-align: center;
+ line-height: 1.3;
+}
+/* Sin enlace: estado Start (verde) */
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Start Recording"]) {
+ border: 1px solid #2e7d32;
+ background: #43a047 !important;
+ background-color: #43a047 !important;
+}
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Start Recording"]):hover {
+ background: #1b5e20 !important;
+ background-color: #1b5e20 !important;
+ border-color: #1b5e20;
+}
+/* Sin enlace: estado Stop (rojo) */
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Stop Recording"]) {
+ border: 1px solid #b71c1c;
+ background: #d32f2f !important;
+ background-color: #d32f2f !important;
+}
+#vicidial_form #RecorDControl:not(:has(> a)):has(img[alt="Stop Recording"]):hover {
+ background: #b71c1c !important;
+ background-color: #b71c1c !important;
+ border-color: #b71c1c;
+}
+#vicidial_form #RecorDControl:not(:has(> a)):hover::before {
+ color: #fff !important;
+}
+
+/* Header del agente (solo dentro del formulario vicidial) */
+
+#vicidial_form #Header table {
+ width: 1190px !important;
+}
+
+#vicidial_form #Header table {
+ background: var(--color-primary-medium) !important;
+ border-radius: 0 0 var(--vdc-radius) var(--vdc-radius);
+ box-shadow: var(--vdc-shadow);
+ padding: 10px 16px !important;
+}
+#vicidial_form #Header .queue_text,
+#vicidial_form #Header .body_text {
+ color: var(--color-text-light, #fff) !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-md) !important;
+}
+#vicidial_form #Header a {
+ color: var(--color-text-light, #fff) !important;
+ padding: 6px 12px;
+ border-radius: var(--vdc-radius-sm);
+ transition: background var(--vdc-transition);
+}
+#vicidial_form #Header a:hover {
+ background: rgba(255, 255, 255, 0.2);
+}
+
+/* Tabs del agente: permitir dos líneas (fecha + Calls in Queue) sin recorte */
+#vicidial_form #Tabs table {
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius);
+ box-shadow: var(--vdc-shadow);
+ margin: 0 8px;
+ padding: 4px 12px 6px !important;
+ height: auto !important;
+ min-height: 44px !important;
+ overflow: visible !important;
+}
+#vicidial_form #Tabs table tbody tr td:nth-child(3) {
+ width: auto !important;
+ min-width: 0 !important;
+}
+#vicidial_form #Tabs table tbody tr td {
+ height: auto !important;
+ padding: 2px 8px !important;
+ vertical-align: middle !important;
+ overflow: visible !important;
+}
+#vicidial_form #Tabs .body_tiny,
+#vicidial_form #Tabs .body_text {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ font-size: var(--font-size-p2) !important;
+ line-height: 1.35 !important;
+}
+#vicidial_form #Tabs a img {
+ border-radius: var(--vdc-radius-sm);
+}
+/* Logo del agente (pestaña MAIN): evitar que se estire, mantener proporción */
+#vicidial_form #Tabs table tbody tr td:first-child img {
+ object-fit: contain !important;
+ object-position: center !important;
+ width: 115px !important;
+ height: 30px !important;
+}
+
+/* Panel principal: responsive, alineado a la izquierda */
+#vicidial_form #MainPanel {
+ top: 105px !important;
+ padding: 0 8px 8px !important;
+ max-width: var(--vdc-content-max-width) !important;
+ width: 100% !important;
+ left: 0 !important;
+ box-sizing: border-box;
+}
+#vicidial_form #MainTable {
+ background: var(--color-bg-lighter, #E0F7FA) !important;
+ border-radius: var(--vdc-radius);
+ box-shadow: var(--vdc-shadow);
+ overflow: hidden;
+ border: 1px solid rgba(0, 139, 139, 0.15) !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ min-width: 0 !important;
+ box-sizing: border-box;
+}
+#vicidial_form #MainTable tbody {
+ min-width: 0 !important;
+ width: 100% !important;
+}
+#vicidial_form #MainTable .body_text {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ font-size: var(--font-size-md) !important;
+}
+
+/* Columna izquierda de controles (Dial, Record, Hangup, etc.) */
+#vicidial_form #MainTable > tbody > tr > td:first-child {
+ background: var(--color-bg-white, #fff) !important;
+ padding: 16px !important;
+ border-radius: var(--vdc-radius) 0 0 var(--vdc-radius);
+ box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);
+}
+#vicidial_form #DiaLControl > a,
+#vicidial_form #DiaLControl:not(:has(> a)),
+#vicidial_form #RecorDControl > a,
+#vicidial_form #SendDTMF > a {
+ display: block;
+ width: 100%;
+ box-sizing: border-box;
+ padding: 1px 12px;
+ border-radius: var(--vdc-radius-sm);
+ border: 1px solid var(--color-primary-light);
+ background: var(--color-bg-lighter);
+ color: var(--color-primary-dark);
+ transition: transform var(--vdc-transition), box-shadow var(--vdc-transition), background var(--vdc-transition), color var(--vdc-transition);
+ text-align: center;
+}
+#vicidial_form #HangupControl,
+#vicidial_form #ParkControl,
+#vicidial_form #XferControl,
+#vicidial_form #WebFormSpan,
+#vicidial_form #WebFormSpanTwo {
+ display: inline-block;
+ min-width: var(--vdc-btn-width);
+ width: var(--vdc-btn-width);
+ box-sizing: border-box;
+ padding: 1px 5px;
+ border-radius: var(--vdc-radius-sm);
+ border: 1px solid var(--color-primary-light);
+ background: var(--color-bg-lighter);
+ color: var(--color-primary-dark);
+ transition: transform var(--vdc-transition), box-shadow var(--vdc-transition), background var(--vdc-transition), color var(--vdc-transition);
+ text-align: center;
+}
+#vicidial_form #WebFormSpan,
+#vicidial_form #WebFormSpanTwo {
+ margin-bottom: 3px;
+}
+#vicidial_form #SendDTMF {
+ margin-bottom: 12px;
+}
+#vicidial_form #DiaLControl > a:hover {
+ background: var(--color-primary-light);
+ color: var(--color-text-light);
+ transform: translateY(-1px);
+ box-shadow: var(--vdc-shadow);
+}
+/* DiaLControl: amarillo cuando paused, verde cuando active; texto en mayúsculas */
+#vicidial_form #DiaLControl > a:has(img[alt="You are paused"]) {
+ background: #FDD835 !important;
+ border-color: #F9A825 !important;
+ color: #1a1a1a !important;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are paused"])::before {
+ color: #1a1a1a !important;
+ text-transform: uppercase;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are paused"]):hover {
+ background: #F9A825 !important;
+ border-color: #F57F17 !important;
+ color: #1a1a1a !important;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are paused"]):hover::before {
+ color: #1a1a1a !important;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are active"]) {
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-color: var(--color-primary-dark, #2E7D7D) !important;
+ color: #fff !important;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are active"])::before {
+ color: #fff !important;
+ text-transform: uppercase;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are active"]):hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ border-color: #1a5a5a !important;
+ color: #fff !important;
+}
+#vicidial_form #DiaLControl > a:has(img[alt="You are active"]):hover::before {
+ color: #fff !important;
+}
+#vicidial_form #RecorDControl > a:hover {
+ background: #1b5e20;
+ border-color: #1b5e20;
+ color: #fff;
+ transform: translateY(-1px);
+ box-shadow: var(--vdc-shadow);
+}
+#vicidial_form #RecorDControl > a:hover::before {
+ color: #fff;
+}
+/* Start Recording: botón verde (override del bloque compartido) */
+#vicidial_form #RecorDControl > a:not(:has(img[alt="Stop Recording"])) {
+ border-color: #2e7d32;
+ background: #43a047 !important;
+ background-color: #43a047 !important;
+ color: #fff;
+}
+#vicidial_form #RecorDControl > a:not(:has(img[alt="Stop Recording"]))::before {
+ color: #fff;
+}
+/* Stop Recording: botón rojo */
+#vicidial_form #RecorDControl > a:has(img[alt="Stop Recording"]) {
+ border-color: #b71c1c;
+ background: #d32f2f !important;
+ background-color: #d32f2f !important;
+ color: #fff;
+}
+#vicidial_form #RecorDControl > a:has(img[alt="Stop Recording"])::before {
+ color: #fff;
+}
+#vicidial_form #RecorDControl > a:has(img[alt="Stop Recording"]):hover {
+ background: #b71c1c !important;
+ background-color: #b71c1c !important;
+ border-color: #b71c1c;
+ color: #fff;
+}
+#vicidial_form #RecorDControl > a:has(img[alt="Stop Recording"]):hover::before {
+ color: #fff;
+}
+/* Send DTMF: estilo rosado */
+#vicidial_form #SendDTMF > a {
+ border-color: #e91e63;
+ background: #fce4ec;
+ color: #ad1457;
+}
+#vicidial_form #SendDTMF > a::before {
+ color: #ad1457;
+}
+#vicidial_form #SendDTMF > a:hover {
+ background: #e91e63;
+ color: var(--color-text-light);
+ transform: translateY(-1px);
+ box-shadow: var(--vdc-shadow);
+}
+#vicidial_form #SendDTMF > a:hover::before {
+ color: var(--color-text-light);
+}
+/* Hover en botones que son span (sin dentro) */
+#vicidial_form #RecorDMute:hover,
+#vicidial_form #StRecorDControl:hover,
+#vicidial_form #ParkControl:hover,
+#vicidial_form #XferControl:hover,
+#vicidial_form #WebFormSpan:hover,
+#vicidial_form #WebFormSpanTwo:hover,
+#vicidial_form #HangupControl:hover,
+#vicidial_form #ivrParkControl:hover {
+ background-color: var(--color-primary-light) !important;
+ color: var(--color-text-light) !important;
+ border-radius: var(--vdc-radius-sm);
+ transition: background-color var(--vdc-transition), color var(--vdc-transition);
+}
+#vicidial_form #RecorDMute:hover::before,
+#vicidial_form #StRecorDControl:hover::before,
+#vicidial_form #ParkControl:hover::before,
+#vicidial_form #XferControl:hover::before,
+#vicidial_form #WebFormSpan:hover::before,
+#vicidial_form #WebFormSpanTwo:hover::before,
+#vicidial_form #HangupControl:hover::before {
+ color: var(--color-text-light) !important;
+}
+/* Hangup Customer en rojo cuando hay llamada activa (tiene ) */
+#vicidial_form #HangupControl:has(> a) {
+ position: relative !important;
+ background: #c62828 !important;
+ border-color: #b71c1c !important;
+ color: #fff !important;
+}
+/* El ocupa todo el botón para que el clic funcione (la img está oculta y el enlace colapsaría) */
+#vicidial_form #HangupControl > a {
+ position: absolute !important;
+ top: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ bottom: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ display: block !important;
+ z-index: 1 !important;
+ pointer-events: auto !important;
+ cursor: pointer !important;
+}
+#vicidial_form #HangupControl:has(> a)::before {
+ color: #fff !important;
+ pointer-events: none !important; /* que el clic llegue al */
+}
+#vicidial_form #HangupControl:has(> a):hover {
+ background: #b71c1c !important;
+ border-color: #8e0000 !important;
+ color: #fff !important;
+}
+#vicidial_form #HangupControl:has(> a):hover::before {
+ color: #fff !important;
+}
+/* Park Call / Grab Parked Call: cuando tiene , el enlace debe ocupar todo el botón para que el clic funcione */
+#vicidial_form #ParkControl:has(> a) {
+ position: relative !important;
+}
+#vicidial_form #ParkControl > a {
+ position: absolute !important;
+ top: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ bottom: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ display: block !important;
+ z-index: 1 !important;
+ pointer-events: auto !important;
+ cursor: pointer !important;
+}
+#vicidial_form #ParkControl:has(> a)::before {
+ pointer-events: none !important;
+}
+#vicidial_form #DiaLControl,
+#vicidial_form #RecorDControl,
+#vicidial_form #RecorDMute,
+#vicidial_form #StRecorDControl,
+#vicidial_form #WebFormSpan,
+#vicidial_form #WebFormSpanTwo,
+#vicidial_form #ParkControl,
+#vicidial_form #XferControl,
+#vicidial_form #HangupControl,
+#vicidial_form #SendDTMF,
+#vicidial_form #ivrParkControl {
+ display: inline-block;
+ min-width: var(--vdc-btn-width);
+ width: var(--vdc-btn-width);
+ box-sizing: border-box;
+ text-align: center;
+}
+#vicidial_form #DiaLControl { background: transparent !important; border-radius: var(--vdc-radius-sm); padding: 4px !important; }
+#vicidial_form #RecorDControl { background: transparent !important; border-radius: var(--vdc-radius-sm); padding: 4px !important; }
+/* Separar Park Call y Transfer - Conference */
+
+#vicidial_form #XferControl { margin-top: 4px !important; }
+/* Cuando Recording no tiene (solo img): color por estado (Start=verde, Stop=rojo) en reglas anteriores. */
+#vicidial_form #HangupControl { border-radius: var(--vdc-radius-sm); }
+#vicidial_form #SendDTMF input.cust_form {
+ width: var(--vdc-btn-width) !important;
+ min-width: var(--vdc-btn-width) !important;
+ max-width: var(--vdc-btn-width) !important;
+ box-sizing: border-box;
+ min-height: 36px;
+ border-radius: var(--vdc-radius-sm);
+ border: 1px solid rgba(0, 0, 0, 0.12);
+ padding: 6px 10px;
+ font-family: var(--font-family);
+ font-size: var(--font-size-p2) !important;
+}
+
+/* Área de información del cliente (solo dentro del formulario) */
+#vicidial_form #MainPanelCustInfo {
+ padding: 16px !important;
+}
+#vicidial_form #MainPanelCustInfo table {
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius);
+ padding: 16px !important;
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
+}
+/* Tabla interna de Customer Information (Title, First, Address, etc.): un poco más ancha */
+#vicidial_form #MainPanelCustInfo table table,
+#vicidial_form #MainPanelCustInfo table table tbody {
+ width: 680px !important;
+ min-width: 680px !important;
+}
+#vicidial_form #MainPanelCustInfo .body_text {
+ font-size: var(--font-size-p2) !important;
+}
+#vicidial_form #MainPanelCustInfo input.cust_form,
+#vicidial_form #MainPanelCustInfo .cust_form_text {
+ border: 1px solid rgba(0, 0, 0, 0.12) !important;
+ border-radius: var(--vdc-radius-sm) !important;
+ padding: 6px 10px !important;
+ font-family: var(--font-family) !important;
+ transition: border-color var(--vdc-transition), box-shadow var(--vdc-transition);
+
+}
+#vicidial_form #MainPanelCustInfo #comments {
+ border: 1px solid rgba(0, 0, 0, 0.12) !important;
+ border-radius: var(--vdc-radius-sm) !important;
+ padding: 6px 10px !important;
+ font-family: var(--font-family) !important;
+ transition: border-color var(--vdc-transition), box-shadow var(--vdc-transition);
+ width: 100% !important;
+ height: 280px !important;
+}
+#vicidial_form #MainPanelCustInfo input.cust_form:focus,
+#vicidial_form #MainPanelCustInfo .cust_form_text:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light, #20B2AA) !important;
+ box-shadow: 0 0 0 3px rgba(32, 178, 170, 0.15);
+
+}
+#vicidial_form #MainPanelCustInfo select.cust_form {
+ border-radius: var(--vdc-radius-sm);
+ border: 1px solid rgba(0, 0, 0, 0.12);
+ padding: 6px 8px;
+ font-family: var(--font-family);
+}
+
+/* Commit, seconds:, Manual/Fast dial y enlaces relacionados: alineados al área de contenido */
+#vicidial_form #MainCommit {
+ left: calc(var(--vdc-content-max-width) - 100px) !important;
+ top: 100px !important;
+ margin-right: 150px !important;
+}
+#vicidial_form #SecondSspan {
+ left: calc(var(--vdc-content-max-width) - 100px) !important;
+ top: 80px !important;
+ font-family: var(--font-family) !important;
+
+}
+#vicidial_form #DiaLlOgButtonspan {
+ left: 20px !important;
+ top: 790px !important;
+}
+#vicidial_form #ScriptRefresH,
+#vicidial_form #Script2RefresH,
+#vicidial_form #EmailRefresH {
+ left: calc(var(--vdc-content-max-width) - 70px) !important;
+ top: 69px !important;
+}
+#vicidial_form #FormRefresH {
+ left: calc(var(--vdc-content-max-width) - 85px) !important;
+ top: 69px !important;
+}
+#vicidial_form #AgentViewLinkSpan {
+ left: calc(var(--vdc-content-max-width) - 110px) !important;
+ top: 793px !important;
+
+}
+#vicidial_form #AgentViewLinkSpan table {
+ margin-left: -50px !important;
+ margin-top: -10px !important;
+ width: 150px; /* o el ancho que quieras */
+ border-collapse: collapse;
+ border-spacing: 0;
+ /* border, background, border-radius, etc. */
+}
+#vicidial_form #AgentViewLinkSpan table td {
+
+ padding: 4px 8px;
+ text-align: right;
+ vertical-align: middle;
+ margin-right: 300px !important;
+}
+
+/* Footer del agente: flotando abajo a la derecha (como Dialable Leads a la izquierda) */
+#vicidial_form #MaiNfooterspan {
+ z-index: 99 !important;
+ position: fixed !important;
+ left: auto !important;
+ right: 16px !important;
+ top: auto !important;
+ bottom: 16px !important;
+ width: auto !important;
+ max-width: calc(100vw - 32px) !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ background: transparent !important;
+}
+#vicidial_form #MaiNfooter {
+ background: var(--color-bg-lighter, #E0F7FA) !important;
+ padding: 8px 14px !important;
+ margin: 0 !important;
+ width: auto !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ border: 1px solid var(--color-primary-light, #20B2AA) !important;
+ border-radius: var(--vdc-radius-sm, 6px) !important;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
+}
+#vicidial_form #MaiNfooter font,
+#vicidial_form #MaiNfooter .body_small {
+ font-family: var(--font-family) !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ font-size: var(--font-size-p2) !important;
+}
+#vicidial_form #MaiNfooter a {
+ color: var(--color-primary-medium, #008B8B) !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ transition: background var(--vdc-transition) !important;
+}
+#vicidial_form #MaiNfooter a:hover {
+ background: var(--bg-decorative-1) !important;
+}
+/* Ocultar fila de debug (busycallsdebug) debajo de STATUS en el panel principal */
+#vicidial_form #MainTable tr:has(#busycallsdebug),
+#busycallsdebug {
+ display: none !important;
+}
+
+/* Dialable Leads (contador en pantalla del agente) */
+/* Dialable Leads: fixed para que se vea igual en todas las resoluciones (sin depender de left/top en px) */
+#vicidial_form #dialableleadsspan {
+ position: fixed !important;
+ left: 16px !important;
+ bottom: 16px !important;
+ top: auto !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2) !important;
+ font-weight: 500;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ background: var(--color-bg-lighter, #E0F7FA) !important;
+ border: 1px solid var(--color-primary-light, #20B2AA);
+ border-radius: var(--vdc-radius-sm, 6px);
+ padding: 6px 12px !important;
+ line-height: 1.3;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
+ display: inline-block;
+ z-index: 99;
+}
+
+/* Enlaces de acción del agente (MANUAL DIAL, FAST DIAL, commit, refresh, etc.) */
+#vicidial_form #DiaLlOgButtonspan .body_text a,
+#vicidial_form #AgentTimeSpan a,
+#vicidial_form #CallLogLinkSpan a,
+#vicidial_form #MainCommit a,
+#vicidial_form #ScriptRefresH a,
+#vicidial_form #Script2RefresH a,
+#vicidial_form #FormRefresH a,
+#vicidial_form #EmailRefresH a,
+#vicidial_form #AgentViewLink a {
+ display: inline-block;
+ padding: 8px 14px;
+ margin: 15px 4px 2px 0;
+ background: var(--color-primary-medium, #008B8B) !important;
+ color: var(--color-text-light, #fff) !important;
+ border-radius: var(--vdc-radius-sm);
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2) !important;
+ font-weight: 500;
+ transition: background var(--vdc-transition), transform var(--vdc-transition);
+}
+#vicidial_form #DiaLlOgButtonspan .body_text a:hover,
+#vicidial_form #AgentTimeSpan a:hover,
+#vicidial_form #MainCommit a:hover,
+#vicidial_form #ScriptRefresH a:hover,
+#vicidial_form #FormRefresH a:hover,
+#vicidial_form #EmailRefresH a:hover,
+#vicidial_form #AgentViewLink a:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+
+/* Paneles secundarios del agente (Script, Form, Email, Chat) */
+#vicidial_form #ScriptPanel table,
+#vicidial_form #Script2Panel table,
+#vicidial_form #FormPanel table,
+#vicidial_form #EmailPanel table,
+#vicidial_form #CustomerChatPanel table,
+#vicidial_form #InternalChatPanel table {
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius);
+ box-shadow: var(--vdc-shadow);
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+}
+
+/* ========== ScriptPanel: contenedor e iframe de notas (solo dentro del formulario agente) ========== */
+#vicidial_form #ScriptPanel {
+ display: block !important;
+}
+#vicidial_form #ScriptPanel > table {
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius, 10px);
+ box-shadow: var(--vdc-shadow, 0 4px 16px rgba(0, 0, 0, 0.08));
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ border-collapse: collapse !important;
+ overflow: hidden !important;
+}
+#vicidial_form #ScriptPanel > table > tbody > tr > td {
+ padding: 0 !important;
+ vertical-align: top !important;
+ border: none !important;
+}
+#vicidial_form #ScriptPanel .sb_text {
+ font-family: var(--font-family, Arial, Helvetica, sans-serif) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ color: var(--color-text, #333) !important;
+ margin: 0 !important;
+ padding: 0 !important;
+}
+#vicidial_form #ScriptPanel #ScriptContents,
+#vicidial_form #ScriptPanel .noscroll_script {
+ background-color: var(--color-bg-white, #fff) !important;
+ border-radius: 0 0 var(--vdc-radius, 10px) var(--vdc-radius, 10px);
+ overflow: hidden !important;
+}
+#vicidial_form #ScriptPanel #ScriptContents > table,
+#vicidial_form #ScriptPanel .noscroll_script > table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ margin: 0 !important;
+}
+#vicidial_form #ScriptPanel #ScriptContents > table > tbody > tr > td,
+#vicidial_form #ScriptPanel .noscroll_script > table > tbody > tr > td {
+ padding: 0 !important;
+ border: none !important;
+ vertical-align: top !important;
+}
+#vicidial_form #ScriptPanel #ScriptContents center,
+#vicidial_form #ScriptPanel .noscroll_script center {
+ padding: 10px 12px 8px !important;
+ margin: 0 !important;
+ background: var(--color-bg-lighter, #f5f5f5) !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
+}
+#vicidial_form #ScriptPanel #ScriptContents center b,
+#vicidial_form #ScriptPanel .noscroll_script center b {
+ font-family: var(--font-family, Arial, Helvetica, sans-serif) !important;
+ font-size: var(--font-size-p1, 14px) !important;
+ font-weight: 600 !important;
+ color: var(--color-text, #333) !important;
+}
+#vicidial_form #ScriptPanel iframe#popupFrame {
+ display: block !important;
+ border: none !important;
+ background-color: transparent !important;
+ border-radius: 0 !important;
+}
+
+/* Utilidades: solo cuando body tiene clase de JS Y dentro del formulario agente */
+body.vdc-modern #vicidial_form {
+ font-family: var(--font-family) !important;
+}
+body.vdc-compact #vicidial_form #MainTable > tbody > tr > td:first-child {
+ padding: 10px !important;
+}
+body.vdc-compact #vicidial_form #MainPanelCustInfo {
+ padding: 0px !important;
+}
+
+#vicidial_form #MainPanelCustInfo table {
+ border-collapse: collapse;
+ border-spacing: 0;
+ margin-top: -15px !important;
+ height: 100% !important;
+ display: flex !important;
+}
+
+
+/* Tema oscuro: solo dentro del formulario agente cuando body tiene data-vdc-theme="dark" */
+body[data-vdc-theme="dark"] #vicidial_form #Header table {
+ background: linear-gradient(135deg, #1a4d4d 0%, #0d3d3d 100%) !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #Tabs table {
+ background: #2d2d2d !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #Tabs .body_tiny,
+body[data-vdc-theme="dark"] #vicidial_form #Tabs .body_text {
+ color: #e0e0e0 !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MainTable {
+ background: #252525 !important;
+ border-color: rgba(255,255,255,0.08) !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MainTable .body_text {
+ color: #e0e0e0 !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MainTable > tbody > tr > td:first-child {
+ background: #1e1e1e !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MainPanelCustInfo table {
+ background: #1e1e1e !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MainPanelCustInfo input.cust_form,
+body[data-vdc-theme="dark"] #vicidial_form #MainPanelCustInfo .cust_form_text {
+ background: #2d2d2d !important;
+ border-color: rgba(255,255,255,0.12) !important;
+ color: #e0e0e0 !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MaiNfooter {
+ background: #2d2d2d !important;
+ border-color: rgba(255,255,255,0.06) !important;
+}
+body[data-vdc-theme="dark"] #vicidial_form #MaiNfooter font,
+body[data-vdc-theme="dark"] #vicidial_form #MaiNfooter .body_small {
+ color: #b0b0b0 !important;
+}
+
+/* ========== Estilos de la caja de alerta (Agent Alert) ========== */
+/* Solo el contenedor #AlertBox: tabla exterior */
+#alert_form #AlertBox > table {
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px);
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
+ overflow: hidden;
+ background: var(--color-bg-white) !important;
+ border-collapse: collapse;
+}
+#alert_form #AlertBox > table > tbody > tr:first-child > td {
+ background: var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p1) !important;
+ font-weight: 600;
+ padding: 12px 16px !important;
+ border: none !important;
+}
+#alert_form #AlertBox > table > tbody > tr:last-child > td {
+ background: var(--color-bg-lighter) !important;
+ padding: 0 !important;
+ border: none !important;
+}
+/* Tabla interior (icono + texto + botón) */
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table {
+ background: var(--color-bg-white) !important;
+ border-radius: 0 0 var(--vdc-radius, 8px) var(--vdc-radius, 8px);
+ margin: 0;
+ width: 100% !important;
+ max-width: 400px;
+}
+/* Fila del icono + texto: apilar en columna (icono arriba, texto abajo), poco espacio entre ellos */
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child {
+ display: flex !important;
+ flex-direction: column !important;
+ align-items: center !important;
+ gap: 0 !important;
+}
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child > td {
+ display: block !important;
+ width: 100% !important;
+ box-sizing: border-box;
+ text-align: center !important;
+}
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child > td:first-child {
+ padding: 6px 16px 0 16px !important;
+}
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child > td:first-child > img {
+ display: block !important;
+ margin: 0 auto !important;
+}
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child > td:last-child {
+ padding: 4px 16px 8px 16px !important;
+}
+/* Quitar
del HTML: no añadir espacio extra en la celda del texto */
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr:first-child > td:last-child br {
+ display: none !important;
+}
+/* Celdas de la tabla interior de la alerta */
+#alert_form #AlertBox > table > tbody > tr:last-child > td > table > tbody > tr > td {
+ background: transparent !important;
+ border: none !important;
+ padding: 16px !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2) !important;
+ color: var(--color-text-dark) !important;
+}
+/* La fila icono+texto ya tiene padding en las reglas de td:first-child y td:last-child */
+#alert_form #AlertBox #AlertBoxContent {
+ display: block;
+ margin: 0 0 4px;
+ line-height: 1.5;
+ text-align: center !important;
+}
+#alert_form #AlertBox #alert_button {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2) !important;
+ padding: 8px 20px !important;
+ background: var(--color-primary-medium) !important;
+ color: var(--color-text-light) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius-sm, 6px);
+ cursor: pointer;
+ font-weight: 500;
+ transition: background 0.2s ease, transform 0.2s ease;
+}
+#alert_form #AlertBox #alert_button:hover {
+ background: var(--color-primary-dark) !important;
+ transform: translateY(-1px);
+}
+
+/* ========== Overlay "Your session has been disabled" (AgenTDisablEBoX) ========== */
+body:has(#AgenTDisablEBoX[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#AgenTDisablEBoX {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px);
+ overflow: hidden;
+
+}
+#AgenTDisablEBoX > table {
+ width: auto !important;
+ max-height: 210px !important;
+ max-width: 420px !important;
+ margin: 0 auto !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px);
+ box-shadow: 0 8px 32px rgba(255, 255, 255, 0.812);
+ background: white !important;
+ overflow: hidden;
+}
+
+#AgenTDisablEBoX > table > tbody > tr > td {
+ padding: 24px 32px !important;
+ text-align: center !important;
+ border: none !important;
+ background: transparent !important;
+}
+#AgenTDisablEBoX .sd_text,
+#AgenTDisablEBoX font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p1, 14px) !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#AgenTDisablEBoX .sd_text a,
+#AgenTDisablEBoX font.sd_text a {
+ display: inline-block !important;
+ margin-top: 12px !important;
+ padding: 10px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ font-weight: 600 !important;
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-radius: var(--vdc-radius-sm, 6px);
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.2s ease;
+}
+#AgenTDisablEBoX .sd_text a:hover,
+#AgenTDisablEBoX font.sd_text a:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+
+/* ========== Overlay "Logout process complete" (LogouTBox) ========== */
+#LogouTBox {
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(0, 0, 0, 0.4) !important;
+ backdrop-filter: blur(4px);
+}
+#LogouTBox > table {
+ width: auto !important;
+ max-width: 480px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 0 auto !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px);
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
+ background: var(--color-bg-white, #fff) !important;
+ overflow: hidden;
+}
+#LogouTBox > table > tbody > tr > td {
+ padding: 28px 32px !important;
+ text-align: center !important;
+ border: none !important;
+ background: transparent !important;
+}
+#LogouTBox #LogouTProcess,
+#LogouTBox #LogouTProcess .loading_text,
+#LogouTBox #LogouTProcess font.loading_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p1, 14px) !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#LogouTBox #LogouTProcess img {
+ display: block !important;
+ margin: 16px auto 8px !important;
+ max-width: 100%;
+ height: auto !important;
+}
+#LogouTBox #LogouTBoxLink .loading_text,
+#LogouTBox #LogouTBoxLink font.loading_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+}
+#LogouTBox #LogouTBoxLink a {
+ display: inline-block !important;
+ margin-top: 16px !important;
+ padding: 10px 20px !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ font-weight: 600 !important;
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-radius: var(--vdc-radius-sm, 6px);
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.2s ease;
+}
+#LogouTBox #LogouTBoxLink a:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+
+/* ========== Notificación "No one is in your session" (NoneInSessionBox) ========== */
+/* Desactivar scroll solo cuando esta alerta está visible (visibility: visible en el span) */
+body:has(#NoneInSessionBox[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#NoneInSessionBox {
+ display: flex !important;
+ position: fixed !important;
+ align-items: center;
+ justify-content: center;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px);
+ z-index: 9999 !important;
+}
+#NoneInSessionBox table {
+ width: auto !important;
+ max-width: 420px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 20px;
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius, 12px);
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06);
+ border: none !important;
+}
+#NoneInSessionBox td {
+ padding: 28px 32px !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+}
+#NoneInSessionBox .sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#NoneInSessionBox .sd_text br {
+ margin: 2px 0;
+ line-height: 0.4;
+}
+#NoneInSessionBox a {
+ display: inline-block;
+ margin: 4px 8px 2px;
+ padding: 10px 20px;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 500;
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-radius: var(--vdc-radius-sm, 6px);
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.2s ease;
+}
+#NoneInSessionBox a:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+#NoneInSessionBox .sd_text > a {
+ margin-bottom: 0;
+}
+#NoneInSessionBox #NoneInSessionID {
+ font-weight: 600;
+ color: var(--color-primary-dark, #2E7D7D);
+}
+
+/* ========== Notificación "Another live agent session was open" (DeactivateDOlDSessioNSpan) ========== */
+body:has(#DeactivateDOlDSessioNSpan[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#DeactivateDOlDSessioNSpan {
+ display: flex !important;
+ position: fixed !important;
+ align-items: center;
+ justify-content: center;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px);
+ z-index: 9999 !important;
+}
+#DeactivateDOlDSessioNSpan table {
+ width: auto !important;
+ max-width: 440px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 20px;
+ background: var(--color-bg-white, #fff) !important;
+ border-radius: var(--vdc-radius, 12px);
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06);
+ border: none !important;
+}
+#DeactivateDOlDSessioNSpan td {
+ padding: 28px 32px !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+}
+#DeactivateDOlDSessioNSpan .sh_text {
+ position: relative;
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+/* Ocultar solo el texto " -->" (cuadro estrecho a la derecha para no tapar el botón OK) */
+#DeactivateDOlDSessioNSpan .sh_text::after {
+ content: "";
+ position: absolute;
+ right: 0;
+ bottom: 0.35em;
+ width: 1.75em;
+ height: 1.3em;
+ background: var(--color-bg-white, #fff);
+}
+#DeactivateDOlDSessioNSpan .sh_text br {
+ margin: 6px 0;
+}
+#DeactivateDOlDSessioNSpan .sh_text a {
+ display: inline-block;
+ margin-top: 12px;
+ padding: 10px 24px;
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 500;
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-radius: var(--vdc-radius-sm, 6px);
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.2s ease;
+}
+#DeactivateDOlDSessioNSpan .sh_text a:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+
+/* ========== Overlays: fijar al viewport para que no se corten al hacer scroll ========== */
+#NeWManuaLDiaLBox,
+#DispoSelectBox,
+#CallBackSelectBox,
+#SearcHForMDisplaYBox,
+#PauseCodeSelectBox,
+#GroupAliasSelectBox,
+#PresetsSelectBox,
+#AlertBox,
+#NoneInSessionBox,
+#DeactivateDOlDSessioNSpan,
+#AgenTDisablEBoX {
+ position: fixed !important;
+}
+/* Overlays de pantalla completa (centrado o cobertura) */
+#NeWManuaLDiaLBox,
+#CallBackSelectBox,
+#SearcHForMDisplaYBox,
+#PauseCodeSelectBox,
+#GroupAliasSelectBox {
+ top: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ bottom: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ overflow: auto !important;
+}
+
+/* ========== New Manual Dial overlay (NeWManuaLDiaLBox) ========== */
+body:has(#NeWManuaLDiaLBox[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#NeWManuaLDiaLBox {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px);
+ z-index: 65 !important;
+}
+#NeWManuaLDiaLBox > table {
+ width: auto !important;
+ max-width: 480px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px);
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06);
+ overflow: hidden;
+}
+#NeWManuaLDiaLBox > table > tbody > tr > td {
+ padding: 12px 16px !important;
+ text-align: left !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#NeWManuaLDiaLBox .sd_text,
+#NeWManuaLDiaLBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ line-height: 1.3 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ display: block !important;
+ margin-bottom: 4px !important;
+}
+#NeWManuaLDiaLBox .sh_text,
+#NeWManuaLDiaLBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ line-height: 1.35 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#NeWManuaLDiaLBox .sh_text br {
+ margin: 2px 0;
+}
+#NeWManuaLDiaLBox .body_text,
+#NeWManuaLDiaLBox font.body_text {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ line-height: 1.35 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+/* Form table: más compacto y distribución en grid (2 columnas label|input) */
+#NeWManuaLDiaLBox table table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse;
+ margin: 6px 0 !important;
+ display: table !important;
+}
+#NeWManuaLDiaLBox table table tr {
+ vertical-align: middle !important;
+}
+#NeWManuaLDiaLBox table table td {
+ padding: 4px 0 !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+#NeWManuaLDiaLBox table table td[align="right"] {
+ padding-right: 8px !important;
+ width: 1%;
+ white-space: nowrap;
+ font-weight: 500;
+ font-size: 11px !important;
+}
+/* Fila con Group Alias / In-Group / No-Call: distribución horizontal */
+#NeWManuaLDiaLBox .sh_text center {
+ display: flex !important;
+ flex-wrap: wrap !important;
+ gap: 6px 14px !important;
+ justify-content: center !important;
+ align-items: center !important;
+ margin: 6px 0 !important;
+ text-align: center !important;
+}
+#NeWManuaLDiaLBox .sh_text center br {
+ display: none !important;
+}
+#NeWManuaLDiaLBox .sh_text center span {
+ display: inline-block !important;
+}
+/* Inputs más compactos */
+#NeWManuaLDiaLBox input.cust_form {
+ padding: 5px 8px !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.18) !important;
+ border-radius: 4px;
+ background: var(--color-bg-white, #fff) !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease;
+}
+#NeWManuaLDiaLBox input.cust_form:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light, #20B2AA) !important;
+ box-shadow: 0 0 0 2px rgba(32, 178, 170, 0.2);
+}
+/* Checkbox row */
+#NeWManuaLDiaLBox input[type="checkbox"] {
+ margin: 0 4px 0 0 !important;
+ vertical-align: middle;
+}
+/* Action links: más compactos */
+#NeWManuaLDiaLBox .sh_text a,
+#NeWManuaLDiaLBox font.sh_text a {
+ display: inline-block !important;
+ margin: 4px 6px 4px 0 !important;
+ padding: 6px 14px !important;
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ font-weight: 600 !important;
+ border-radius: 4px;
+ text-decoration: none !important;
+ transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('NOW'"],
+#NeWManuaLDiaLBox font.sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('NOW'"] {
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('NOW'"]:hover,
+#NeWManuaLDiaLBox font.sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('NOW'"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px);
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('PREVIEW'"],
+#NeWManuaLDiaLBox font.sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('PREVIEW'"] {
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-light, #20B2AA) !important;
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('PREVIEW'"]:hover,
+#NeWManuaLDiaLBox font.sh_text a[onclick*="NeWManuaLDiaLCalLSubmiT('PREVIEW'"]:hover {
+ background: var(--color-primary-medium, #f6f8f8) !important;
+ transform: translateY(-1px);
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="ManualDialHide"],
+#NeWManuaLDiaLBox font.sh_text a[onclick*="ManualDialHide"] {
+ color: var(--color-primary-medium, #008B8B) !important;
+ background: transparent !important;
+ border: 1px solid var(--color-primary-medium, #008B8B);
+}
+#NeWManuaLDiaLBox .sh_text a[onclick*="ManualDialHide"]:hover,
+#NeWManuaLDiaLBox font.sh_text a[onclick*="ManualDialHide"]:hover {
+ background: var(--bg-decorative-1) !important;
+ transform: translateY(-1px);
+}
+
+/* ========== Disposition Call (DispoSelectBox) ========== */
+#DispoSelectBox > table {
+ background: var(--color-bg-lighter, #E0F7FA) !important;
+ border: 1px solid var(--color-primary-lightest, #48D1CC) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 8px 24px var(--shadow-medium, rgba(45, 45, 45, 0.35)) !important;
+ padding: 16px 20px !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+}
+#DispoSelectBox > table > tbody > tr > td {
+ background: transparent !important;
+ padding: 12px 16px !important;
+ text-align: center !important;
+ vertical-align: top !important;
+ border: none !important;
+}
+#DispoSelectBox .sd_text,
+#DispoSelectBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ line-height: 1.3 !important;
+}
+#DispoSelectBox .sh_text,
+#DispoSelectBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.4 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#DispoSelectBox #DispoSelectHAspan a,
+#DispoSelectBox #DispoSelectMaxMin a {
+ display: inline-block !important;
+ margin: 0 6px !important;
+ padding: 6px 12px !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ color: var(--color-primary-medium, #008B8B) !important;
+ background: transparent !important;
+ border: 1px solid var(--color-primary-medium, #008B8B) !important;
+ border-radius: 6px !important;
+ text-decoration: none !important;
+ transition: all 0.2s ease !important;
+}
+#DispoSelectBox #DispoSelectHAspan a:hover,
+#DispoSelectBox #DispoSelectMaxMin a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+}
+/* Contenedor y tabla de disposiciones */
+#DispoSelectBox #DispoSelectContent {
+ display: block !important;
+ margin: 12px auto !important;
+ text-align: center !important;
+}
+#DispoSelectBox #DispoSelectContent table {
+ width: auto !important;
+ max-width: 780px !important;
+ margin: 12px auto !important;
+ border-collapse: separate !important;
+ border-spacing: 8px !important;
+ border: none !important;
+}
+#DispoSelectBox #DispoSelectContent table tr:first-child td {
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ padding-bottom: 8px !important;
+ border: none !important;
+}
+#DispoSelectBox #DispoSelectContent table td[valign="top"] {
+ background: var(--color-bg-white, #fff) !important;
+ border: 1px solid var(--color-primary-lightest, #48D1CC) !important;
+ border-radius: 8px !important;
+ padding: 12px 14px !important;
+ height: auto !important;
+ min-height: 120px !important;
+ width: 240px !important;
+ vertical-align: top !important;
+ box-shadow: 0 2px 8px var(--shadow-text, rgba(45, 45, 45, 0.2)) !important;
+}
+#DispoSelectBox #DispoSelectContent .log_text a,
+#DispoSelectBox #DispoSelectContent font.log_text a,
+#DispoSelectBox #DispoSelectContent span a,
+#DispoSelectBox #DispoSelectContent font a {
+ display: block !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ padding: 6px 8px !important;
+ margin: 4px 0 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ background: transparent !important;
+ border-radius: 4px !important;
+ text-decoration: none !important;
+ transition: background 0.15s ease, color 0.15s ease !important;
+}
+#DispoSelectBox #DispoSelectContent .log_text a:hover,
+#DispoSelectBox #DispoSelectContent font.log_text a:hover,
+#DispoSelectBox #DispoSelectContent span a:hover,
+#DispoSelectBox #DispoSelectContent font a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+}
+#DispoSelectBox #DispoSelectContent font[style*="BACKGROUND-COLOR"] a,
+#DispoSelectBox #DispoSelectContent b a {
+ background: var(--color-primary-lightest, #48D1CC) !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ font-weight: 600 !important;
+}
+#DispoSelectBox #DispoSelectContent font[style*="BACKGROUND-COLOR"] a:hover,
+#DispoSelectBox #DispoSelectContent b a:hover {
+ background: var(--color-primary-light, #20B2AA) !important;
+ color: var(--color-text-light, #fff) !important;
+}
+/* Checkbox y acciones inferiores */
+#DispoSelectBox input[type="checkbox"] {
+ margin: 0 6px 0 0 !important;
+ vertical-align: middle !important;
+ accent-color: var(--color-primary-medium, #008B8B) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="DispoSelectContent_create('','ReSET'"],
+#DispoSelectBox .sh_text > a[onclick*="DispoSelect_submit"],
+#DispoSelectBox .sh_text > a[onclick*="WeBForMDispoSelect_submit"] {
+ display: inline-block !important;
+ margin: 6px 8px 6px 0 !important;
+ padding: 8px 16px !important;
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ border-radius: 6px !important;
+ text-decoration: none !important;
+ transition: all 0.2s ease !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="DispoSelectContent_create('','ReSET'"] {
+ color: var(--color-primary-medium, #008B8B) !important;
+ background: transparent !important;
+ border: 1px solid var(--color-primary-medium, #008B8B) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="DispoSelectContent_create('','ReSET'"]:hover {
+ background: var(--bg-decorative-1) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="DispoSelect_submit"] {
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border: 1px solid var(--color-primary-dark, #2E7D7D) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="DispoSelect_submit"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="WeBForMDispoSelect_submit"] {
+ color: var(--color-text-light, #fff) !important;
+ background: var(--color-primary-light, #20B2AA) !important;
+ border: 1px solid var(--color-primary-medium, #008B8B) !important;
+}
+#DispoSelectBox .sh_text > a[onclick*="WeBForMDispoSelect_submit"]:hover {
+ background: var(--color-primary-medium, #008B8B) !important;
+ transform: translateY(-1px) !important;
+}
+
+/* ========== Panel Transfer - Conference (TransferMain) ========== */
+#TransferMain {
+ max-width: 100%;
+ box-sizing: border-box;
+ transform: translateY(-100px);
+ transform: translateX(45px);
+}
+/* Ocultar imágenes y mostrar texto (mismo truco que sidebar / botones AGC) */
+#TransferMain .body_text > img[alt="Transfer - Conference"],
+#TransferMain #LocalCloser img,
+#TransferMain #HangupXferLine img,
+#TransferMain #ParkXferLine img,
+#TransferMain #HangupBothLines img,
+#TransferMain #Leave3WayCall img,
+#TransferMain #DialBlindTransfer img,
+#TransferMain #DialWithCustomer img,
+#TransferMain #ParkCustomerDial img,
+#TransferMain #DialBlindVMail img,
+#TransferMain #PresetPullDown img,
+#TransferMain #ContactPullDown img,
+#TransferMain img[alt="seconds"],
+#TransferMain img[alt="channel"],
+#TransferMain img[alt="Number to call"] {
+ display: none !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+}
+/* Texto en lugar de imagen: cabecera */
+#TransferMain .body_text::before {
+ content: "Transfer - Conference";
+ font-family: var(--font-family) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ margin-right: 0.5em;
+}
+/* Texto en lugar de imagen: botones por id */
+#TransferMain #LocalCloser::before { content: "LOCAL CLOSER"; }
+#TransferMain #HangupXferLine::before { content: "Hangup Xfer Line"; }
+#TransferMain #ParkXferLine::before { content: "Park Xfer Line"; }
+#TransferMain #HangupBothLines::before { content: "Hangup Both Lines"; }
+#TransferMain #Leave3WayCall::before { content: "Leave 3-Way Call"; }
+#TransferMain #DialBlindTransfer::before { content: "Blind Transfer"; }
+#TransferMain #DialWithCustomer::before { content: "Dial With Customer"; }
+#TransferMain #ParkCustomerDial::before { content: "Park Customer Dial"; }
+#TransferMain #DialBlindVMail::before { content: "Transfer VMail"; }
+#TransferMain #PresetPullDown::before { content: "Presets"; }
+#TransferMain #ContactPullDown::before { content: "Contacts"; }
+/* Estilo común del ::before en botones */
+#TransferMain #LocalCloser::before,
+#TransferMain #HangupXferLine::before,
+#TransferMain #ParkXferLine::before,
+#TransferMain #HangupBothLines::before,
+#TransferMain #Leave3WayCall::before,
+#TransferMain #DialBlindTransfer::before,
+#TransferMain #DialWithCustomer::before,
+#TransferMain #ParkCustomerDial::before,
+#TransferMain #DialBlindVMail::before,
+#TransferMain #PresetPullDown::before,
+#TransferMain #ContactPullDown::before {
+ display: inline-block !important;
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ font-weight: 500 !important;
+ white-space: nowrap !important;
+ pointer-events: none !important;
+}
+/* Fila seconds + channel: solo texto como etiquetas */
+#TransferMain table table tbody tr:nth-child(2) td:first-child {
+ display: flex !important;
+ flex-wrap: wrap !important;
+ align-items: center !important;
+ gap: 0.25em 0.5em !important;
+}
+#TransferMain table table tbody tr:nth-child(2) td:first-child::before {
+ content: "seconds";
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ order: 0;
+}
+#TransferMain table table tbody tr:nth-child(2) td:first-child input#xferlength {
+ order: 1;
+}
+#TransferMain table table tbody tr:nth-child(2) td:first-child::after {
+ content: "channel";
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ margin-left: 0.5em;
+ order: 2;
+}
+#TransferMain table table tbody tr:nth-child(2) td:first-child input#xferchannel {
+ order: 3;
+}
+/* Fila Number to call: solo texto */
+#TransferMain table table tbody tr:nth-child(3) td:first-child::before {
+ content: "Number to call";
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ margin-right: 0.5em;
+}
+#TransferMain > table {
+ background: var(--color-bg-lighter, #E0F7FA) !important;
+ border: 1px solid var(--color-primary-lightest, #48D1CC) !important;
+ border-radius: 10px !important;
+ box-shadow: 0 4px 16px var(--shadow-text, rgba(45, 45, 45, 0.2)) !important;
+ padding: 12px 16px !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+}
+#TransferMain > table > tbody > tr > td {
+ padding: 10px 12px !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+ height: auto !important;
+}
+#TransferMain .body_text,
+#TransferMain font.body_text {
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.4 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#TransferMain .body_tiny,
+#TransferMain font.body_tiny {
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#TransferMain .body_small_bold,
+#TransferMain font.body_small_bold {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+}
+#TransferMain #XfeRDiaLGrouPSelecteD,
+#TransferMain #XfeRCID {
+ font-weight: 500;
+ color: var(--color-primary-dark, #2E7D7D);
+}
+/* Tabla interna */
+#TransferMain table table {
+ border-collapse: separate !important;
+ border-spacing: 6px 8px !important;
+ border: none !important;
+}
+#TransferMain table table td {
+ padding: 4px 6px !important;
+ vertical-align: middle !important;
+ border: none !important;
+}
+/* Select grupo */
+#TransferMain #XfeRGrouPLisT select,
+#TransferMain select#XfeRGrouP {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ padding: 6px 10px !important;
+ border: 1px solid rgba(0, 0, 0, 0.18) !important;
+ border-radius: 6px !important;
+ background: var(--color-bg-white, #fff) !important;
+ min-width: 200px !important;
+ max-width: 100% !important;
+}
+#TransferMain select#XfeRGrouP:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light, #20B2AA) !important;
+ box-shadow: 0 0 0 2px rgba(32, 178, 170, 0.2);
+}
+/* Inputs readonly y número */
+#TransferMain input.cust_form {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ padding: 5px 8px !important;
+ border: 1px solid rgba(0, 0, 0, 0.15) !important;
+ border-radius: 6px !important;
+ background: var(--color-bg-white, #fff) !important;
+}
+#TransferMain input#xferlength { width: 3em !important; }
+#TransferMain input#xferchannel { width: 10em !important; min-width: 100px !important; }
+#TransferMain input#xfernumber { width: 14em !important; min-width: 120px !important; }
+#TransferMain input.cust_form:focus {
+ outline: none !important;
+ border-color: var(--color-primary-light, #20B2AA) !important;
+}
+/* Botones del panel (spans con img o enlace) */
+#TransferMain #LocalCloser,
+#TransferMain #HangupXferLine,
+#TransferMain #ParkXferLine,
+#TransferMain #HangupBothLines,
+#TransferMain #Leave3WayCall,
+#TransferMain #DialBlindTransfer,
+#TransferMain #DialWithCustomer,
+#TransferMain #ParkCustomerDial,
+#TransferMain #DialBlindVMail,
+#TransferMain #PresetPullDown,
+#TransferMain #ContactPullDown {
+ display: inline-block !important;
+ position: relative !important;
+ padding: 6px 8px !important;
+ margin: 0 2px !important;
+ background: var(--color-primary-lightest, #48D1CC) !important;
+ border: 1px solid var(--color-primary-medium, #008B8B) !important;
+ border-radius: 6px !important;
+ vertical-align: middle !important;
+ transition: background 0.2s ease, transform 0.15s ease !important;
+}
+/* Enlaces que rellenan el botón para que el clic funcione (img oculta) */
+#TransferMain #HangupBothLines > a,
+#TransferMain #Leave3WayCall > a,
+#TransferMain #DialWithCustomer > a,
+#TransferMain #ParkCustomerDial > a,
+#TransferMain #PresetPullDown > a,
+#TransferMain #ContactPullDown > a {
+ position: absolute !important;
+ top: 0 !important;
+ left: 0 !important;
+ right: 0 !important;
+ bottom: 0 !important;
+ width: 100% !important;
+ height: 100% !important;
+ display: block !important;
+ z-index: 1 !important;
+ pointer-events: auto !important;
+ cursor: pointer !important;
+}
+#TransferMain #LocalCloser:hover,
+#TransferMain #HangupXferLine:hover,
+#TransferMain #ParkXferLine:hover,
+#TransferMain #HangupBothLines:hover,
+#TransferMain #Leave3WayCall:hover,
+#TransferMain #DialBlindTransfer:hover,
+#TransferMain #DialWithCustomer:hover,
+#TransferMain #ParkCustomerDial:hover,
+#TransferMain #DialBlindVMail:hover,
+#TransferMain #PresetPullDown:hover,
+#TransferMain #ContactPullDown:hover {
+ background: var(--color-primary-light, #20B2AA) !important;
+ transform: translateY(-1px);
+}
+/* (Imágenes de botones ya ocultas arriba; enlaces rellenan el span para clic) */
+#TransferMain #HangupBothLines a,
+#TransferMain #Leave3WayCall a,
+#TransferMain #DialWithCustomer a,
+#TransferMain #ParkCustomerDial a,
+#TransferMain #PresetPullDown a,
+#TransferMain #ContactPullDown a {
+ text-decoration: none !important;
+ color: inherit !important;
+}
+/* Checkboxes */
+#TransferMain input[type="checkbox"] {
+ margin: 0 4px 0 0 !important;
+ vertical-align: middle !important;
+ accent-color: var(--color-primary-medium, #008B8B) !important;
+}
+/* Enlaces D1-D5 y AGENTS */
+#TransferMain .body_tiny a,
+#TransferMain font.body_tiny a,
+#TransferMain #agentdirectlink a,
+#TransferMain .body_small_bold a {
+ display: inline-block !important;
+ padding: 4px 10px !important;
+ margin: 0 2px !important;
+ font-family: var(--font-family) !important;
+ font-size: 11px !important;
+ font-weight: 500 !important;
+ color: var(--color-primary-medium, #008B8B) !important;
+ background: transparent !important;
+ border: 1px solid var(--color-primary-medium, #008B8B) !important;
+ border-radius: 4px !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+#TransferMain .body_tiny a:hover,
+#TransferMain font.body_tiny a:hover,
+#TransferMain #agentdirectlink a:hover,
+#TransferMain .body_small_bold a:hover {
+ background: var(--bg-decorative-1) !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+}
+
+/* ========== Closer Inbound Group Selection (CloserSelectBox) - Panel de agente ========== */
+/* Overlay a pantalla completa con fondo desenfocado; tabla centrada con position + transform (sin flex). */
+#CloserSelectBox {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(6px) !important;
+ -webkit-backdrop-filter: blur(6px) !important;
+}
+#CloserSelectBox > table {
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15) !important;
+ background: var(--color-bg-white, #fff) !important;
+ max-width: 560px !important;
+ max-height: 560px !important;
+ position: relative !important;
+ left: 50% !important;
+ top: 50% !important;
+ transform: translate(-50%, -50%) !important;
+ margin: 0 !important;
+}
+#CloserSelectBox > table > tbody > tr > td {
+ padding: 24px 28px !important;
+ text-align: center !important;
+ border: none !important;
+ background: transparent !important;
+}
+#CloserSelectBox .sd_text,
+#CloserSelectBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p1, 14px) !important;
+ font-weight: 600 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ letter-spacing: 0.02em;
+ margin-bottom: 0.5em !important;
+ display: block !important;
+}
+#CloserSelectBox .sh_text,
+#CloserSelectBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ line-height: 1.5 !important;
+}
+#CloserSelectBox #CloserSelectContent {
+ display: block !important;
+ margin-bottom: 0 !important;
+}
+#CloserSelectBox #CloserSelectContent table {
+ border-collapse: separate !important;
+ border-spacing: 12px !important;
+ margin: 16px auto 8px auto !important;
+}
+/* Fila de títulos: mismo ancho que las columnas de abajo (240px), sin caja */
+#CloserSelectBox #CloserSelectContent table tbody tr:first-child td {
+ width: 240px !important;
+ max-width: 240px !important;
+ min-width: 240px !important;
+ padding: 0 0 8px !important;
+ background: transparent !important;
+ border: none !important;
+ vertical-align: bottom !important;
+}
+/* Fila de contenido: cajas de listas */
+#CloserSelectBox #CloserSelectContent table tbody tr:nth-child(2) td {
+ background: var(--bg-decorative-1, #E8F5F5) !important;
+ border-radius: var(--vdc-radius-sm, 6px) !important;
+ padding: 12px 16px !important;
+ border: 1px solid rgba(0, 139, 139, 0.12) !important;
+}
+#CloserSelectBox #CloserSelectContent .log_text,
+#CloserSelectBox #CloserSelectContent font.log_text {
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ line-height: 1.6 !important;
+}
+#CloserSelectBox #CloserSelectContent a {
+ display: block !important;
+ padding: 6px 10px !important;
+ margin: 2px 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ font-weight: 500 !important;
+ color: #ffffff !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ text-decoration: none !important;
+ border-radius: 4px !important;
+}
+#CloserSelectBox #CloserSelectContent a:hover {
+ color: #ffffff !important;
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+#CloserSelectBox .sh_text input[type="checkbox"] {
+ margin: 0 6px 0 0 !important;
+ vertical-align: middle !important;
+ accent-color: var(--color-primary-medium, #008B8B) !important;
+}
+#CloserSelectBox .sh_text a {
+ padding: 8px 16px !important;
+ margin: 20px 4px 0 4px !important;
+ margin-bottom: 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: var(--font-size-p2, 12px) !important;
+ font-weight: 600 !important;
+ color: #ffffff !important;
+ background: var(--color-primary-medium, #008B8B) !important;
+ border-radius: var(--vdc-radius-sm, 6px) !important;
+ text-decoration: none !important;
+}
+#CloserSelectBox .sh_text a:hover {
+ color: #ffffff !important;
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+/* RESET y SUBMIT más abajo */
+#CloserSelectBox .sh_text a[onclick*="CloserSelectContent_create"],
+#CloserSelectBox .sh_text a[onclick*="CloserSelect_submit"] {
+ margin-top: 36px !important;
+ display: inline-block !important;
+}
+
+/* ========== vdc_script_notes.php (iframe notas, solo cuando existe form#vsn) ========== */
+body:has(form#vsn) {
+ background: transparent !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 14px !important;
+ margin: 0;
+ padding: 8px 0;
+}
+body:has(form#vsn) > table {
+ width: 100% !important;
+ max-width: 480px !important;
+ margin: 0 auto !important;
+ border-collapse: collapse !important;
+ background: #fff !important;
+ border-radius: 10px !important;
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+body:has(form#vsn) > table tr[bgcolor="#E6E6E6"],
+body:has(form#vsn) > table tr {
+ background: #f5f5f5 !important;
+}
+body:has(form#vsn) > table tr[bgcolor="white"] {
+ background: #fff !important;
+}
+body:has(form#vsn) > table td {
+ padding: 8px 12px !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+body:has(form#vsn) > table td font {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-weight: 600 !important;
+ color: #333 !important;
+}
+body:has(form#vsn) form#vsn input[type="text"],
+body:has(form#vsn) form#vsn select,
+body:has(form#vsn) form#vsn textarea {
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ border-radius: 6px !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+ padding: 6px 10px !important;
+ font-size: 14px !important;
+}
+body:has(form#vsn) form#vsn input[type="text"]:focus,
+body:has(form#vsn) form#vsn select:focus,
+body:has(form#vsn) form#vsn textarea:focus {
+ outline: none !important;
+ border-color: #008b8b !important;
+ box-shadow: 0 0 0 2px rgba(0, 139, 139, 0.2) !important;
+}
+body:has(form#vsn) form#vsn input[type="button"]#smt {
+ display: inline-block !important;
+ padding: 10px 24px !important;
+ border-radius: 8px !important;
+ border: none !important;
+ background: linear-gradient(180deg, #009a9a 0%, #008b8b 50%, #007a7a 100%) !important;
+ color: #fff !important;
+ font-weight: 600 !important;
+ font-size: 15px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 8px rgba(0, 139, 139, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
+ text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
+ transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease !important;
+}
+body:has(form#vsn) form#vsn input[type="button"]#smt:hover {
+ background: linear-gradient(180deg, #00a8a8 0%, #009090 50%, #008080 100%) !important;
+ box-shadow: 0 4px 12px rgba(0, 139, 139, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
+ transform: translateY(-1px) !important;
+}
+body:has(form#vsn) form#vsn input[type="button"]#smt:active {
+ background: linear-gradient(180deg, #007070 0%, #006060 100%) !important;
+ box-shadow: 0 1px 4px rgba(0, 139, 139, 0.3), inset 0 2px 4px rgba(0, 0, 0, 0.15) !important;
+ transform: translateY(0) !important;
+}
+body:has(form#vsn) form#vsn textarea#call_notes {
+ min-height: 80px !important;
+ resize: vertical !important;
+}
+
+/* ========== Solo #SearcHForMDisplaYBox (Search for a lead) - estilos únicos para este componente ========== */
+#SearcHForMDisplaYBox {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px) !important;
+ z-index: 73 !important;
+}
+#SearcHForMDisplaYBox > table {
+ width: auto !important;
+ max-width: 520px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#SearcHForMDisplaYBox > table > tbody > tr > td {
+ padding: 16px 20px !important;
+ text-align: left !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#SearcHForMDisplaYBox .sd_text,
+#SearcHForMDisplaYBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 700 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ display: block !important;
+ margin-bottom: 8px !important;
+}
+#SearcHForMDisplaYBox .sh_text,
+#SearcHForMDisplaYBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ line-height: 1.4 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeaDSearcHVieWClose"] {
+ display: inline-block !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ color: var(--color-text-dark, #333) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeaDSearcHVieWClose"]:hover {
+ background: rgba(0, 0, 0, 0.1) !important;
+}
+#SearcHForMDisplaYBox table table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ margin: 10px 0 !important;
+}
+#SearcHForMDisplaYBox table table tr {
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td {
+ padding: 6px 0 !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td[align="right"] {
+ padding-right: 12px !important;
+ width: 1% !important;
+ white-space: nowrap !important;
+ font-weight: 500 !important;
+ font-size: 12px !important;
+}
+#SearcHForMDisplaYBox table table input[type="text"] {
+ width: 100% !important;
+ max-width: 220px !important;
+ box-sizing: border-box !important;
+ padding: 6px 10px !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+ border-radius: 6px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+}
+#SearcHForMDisplaYBox table table input[type="text"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 2px rgba(0, 139, 139, 0.2) !important;
+}
+#SearcHForMDisplaYBox table table input[type="checkbox"] {
+ width: auto !important;
+ margin-right: 6px !important;
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td[align="center"][colspan="2"] {
+ padding-top: 16px !important;
+ padding-bottom: 0 !important;
+ text-align: center !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchSubmit"] {
+ display: inline-block !important;
+ padding: 8px 18px !important;
+ border-radius: 6px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchSubmit"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px) !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchReset"] {
+ display: inline-block !important;
+ padding: 6px 12px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ color: var(--color-text-dark, #333) !important;
+ font-size: 12px !important;
+ text-decoration: none !important;
+ margin-left: 8px !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchReset"]:hover {
+ background: rgba(0, 0, 0, 0.1) !important;
+}
+
+/* ========== SearcHResultSDisplaYBox (Search Results) - bloque nuevo ========== */
+#SearcHResultSDisplaYBox {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px) !important;
+ z-index: 74 !important;
+}
+#SearcHResultSDisplaYBox > table {
+ width: auto !important;
+ max-width: 520px !important;
+ max-height: 85vh !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#SearcHResultSDisplaYBox > table > tbody > tr > td {
+ padding: 16px 20px !important;
+ text-align: left !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#SearcHResultSDisplaYBox .sd_text,
+#SearcHResultSDisplaYBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 700 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ display: block !important;
+ margin-bottom: 8px !important;
+}
+#SearcHResultSDisplaYBox .sh_text,
+#SearcHResultSDisplaYBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ line-height: 1.4 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#SearcHResultSDisplaYBox a[onclick*="hideDiv('SearcHResultSDisplaYBox')"] {
+ display: inline-block !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ color: var(--color-text-dark, #333) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+}
+#SearcHResultSDisplaYBox a[onclick*="hideDiv('SearcHResultSDisplaYBox')"]:hover {
+ background: rgba(0, 0, 0, 0.1) !important;
+}
+#SearcHResultSDisplaYBox #SearcHResultSSpan,
+#SearcHResultSDisplaYBox .scroll_calllog {
+ display: block !important;
+ max-height: 55vh !important;
+ overflow-y: auto !important;
+ padding: 12px 0 !important;
+ margin: 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#SearcHResultSDisplaYBox #SearcHResultSSpan a[href="#"][onclick*="hideDiv"],
+#SearcHResultSDisplaYBox .scroll_calllog a[href="#"][onclick*="hideDiv"] {
+ display: inline-block !important;
+ padding: 8px 16px !important;
+ margin-top: 12px !important;
+ border-radius: 6px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 13px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#SearcHResultSDisplaYBox #SearcHResultSSpan a[href="#"][onclick*="hideDiv"]:hover,
+#SearcHResultSDisplaYBox .scroll_calllog a[href="#"][onclick*="hideDiv"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+/* Refinamientos solo #SearcHResultSDisplaYBox: caja más compacta y visibilidad */
+
+#SearcHResultSDisplaYBox > table {
+ max-width: 380px !important;
+}
+#SearcHResultSDisplaYBox #SearcHResultSSpan,
+#SearcHResultSDisplaYBox .scroll_calllog {
+ max-height: 55vh !important;
+ -webkit-overflow-scrolling: touch !important;
+}
+
+/* ========== Solo #AgentTimeDisplayBox (Agent Time Report) - estilos exclusivos ========== */
+body:has(#AgentTimeDisplayBox[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#AgentTimeDisplayBox {
+ position: fixed !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px) !important;
+ z-index: 70 !important;
+}
+#AgentTimeDisplayBox > table {
+ width: auto !important;
+ max-width: 520px !important;
+ max-height: 85vh !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#AgentTimeDisplayBox > table > tbody > tr > td {
+ padding: 16px 20px !important;
+ text-align: center !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan,
+#AgentTimeDisplayBox .scroll_calllog {
+ display: block !important;
+ max-height: 55vh !important;
+ overflow-y: auto !important;
+ padding: 12px 0 !important;
+ margin: 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ -webkit-overflow-scrolling: touch !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan b,
+#AgentTimeDisplayBox .scroll_calllog b {
+ font-weight: 700 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan a[onclick*="AgentTimeReport"],
+#AgentTimeDisplayBox .scroll_calllog a[onclick*="AgentTimeReport"] {
+ display: inline-block !important;
+ padding: 8px 18px !important;
+ margin-top: 12px !important;
+ border-radius: 6px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 13px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan a[onclick*="AgentTimeReport"]:hover,
+#AgentTimeDisplayBox .scroll_calllog a[onclick*="AgentTimeReport"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+
+#AgentTimeSpan {
+ margin-top: -30px;
+ margin-left: 100px;
+
+}
+
+/* ========== Solo #VolumeControlSpan (controles de volumen) - estilos exclusivos ========== */
+/* Fuente Font Awesome 6 Solid solo para estos iconos (volume-up/down) */
+@font-face {
+ font-family: "Font Awesome 6 Free VDC";
+ font-style: normal;
+ font-weight: 900;
+ font-display: block;
+ src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/webfonts/fa-solid-900.woff2") format("woff2");
+}
+#VolumeControlSpan {
+
+ position: absolute !important;
+ left: 10px !important;
+ top: 848px !important;
+ z-index: 14 !important;
+ display: inline-flex !important;
+ flex-direction: column !important;
+ align-items: center !important;
+ gap: 1px !important;
+ padding: 5px 6px !important;
+ background: rgba(255, 255, 255, 0.95) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
+ backdrop-filter: blur(8px) !important;
+}
+#VolumeControlSpan br {
+ display: none !important;
+}
+#VolumeControlSpan #VolumeUpSpan,
+#VolumeControlSpan #VolumeDownSpan {
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 32px !important;
+ height: 32px !important;
+ line-height: 0 !important;
+ border-radius: 8px !important;
+ transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease !important;
+}
+#VolumeControlSpan #VolumeUpSpan img,
+#VolumeControlSpan #VolumeDownSpan img {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+#VolumeControlSpan #VolumeUpSpan::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ content: "\f028" !important; /* fa-volume-high */
+ font-size: 1.125rem !important;
+ color: #2D2D2D !important;
+}
+#VolumeControlSpan #VolumeDownSpan::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ content: "\f027" !important; /* fa-volume-low */
+ font-size: 1.125rem !important;
+ color: #2D2D2D !important;
+}
+#VolumeControlSpan #VolumeUpSpan:hover,
+#VolumeControlSpan #VolumeDownSpan:hover {
+ background: rgba(0, 139, 139, 0.08) !important;
+ transform: scale(1.06) !important;
+}
+#VolumeControlSpan #VolumeUpSpan:hover::before,
+#VolumeControlSpan #VolumeDownSpan:hover::before {
+ color: #008b8b !important;
+}
+
+/* ========== Solo #AgentStatusSpan (estado del agente) - estilos exclusivos ========== */
+#AgentStatusSpan {
+
+ left: 60px !important;
+ margin-top: 40px;
+ z-index: 15 !important;
+ display: inline-block !important;
+ padding: 10px 14px !important;
+ background: rgba(255, 255, 255, 0.95) !important;
+ border-radius: 10px !important;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
+ backdrop-filter: blur(8px) !important;
+}
+#AgentStatusSpan .body_text,
+#AgentStatusSpan font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: #2D2D2D !important;
+ font-weight: 400 !important;
+}
+#AgentStatusSpan #AgentStatusStatus {
+ display: inline-block !important;
+ padding: 2px 8px !important;
+ margin-left: 2px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 139, 139, 0.12) !important;
+ color: #008b8b !important;
+ font-weight: 600 !important;
+ font-size: 12px !important;
+ letter-spacing: 0.02em !important;
+}
+#AgentStatusSpan br {
+ display: block !important;
+ margin: 4px 0 0 0 !important;
+}
+#AgentStatusSpan #AgentStatusDiaLs {
+ font-weight: 600 !important;
+ color: #2D2D2D !important;
+}
+
+/* ========== Solo #callsinqueuedisplay (Calls In Queue) - estilos exclusivos ========== */
+#callsinqueuedisplay {
+ position: absolute !important;
+ left: 13px !important;
+ top: 912px !important;
+ width: 1176px !important;
+ z-index: 17 !important;
+
+ overflow-x: auto !important;
+ overflow-y: hidden !important;
+ padding: 10px 16px !important;
+ background: rgba(255, 255, 255, 0.98) !important;
+ border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.03) !important;
+}
+#callsinqueuedisplay > table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#callsinqueuedisplay > table td {
+ padding: 4px 8px !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+#callsinqueuedisplay > table td:first-child {
+ width: 5px !important;
+ padding-left: 0 !important;
+}
+#callsinqueuedisplay .body_text,
+#callsinqueuedisplay font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ color: #2D2D2D !important;
+ font-weight: 500 !important;
+}
+#callsinqueuedisplay #callsinqueuelist {
+ font-size: 13px !important;
+ color: #2D2D2D !important;
+ line-height: 1.4 !important;
+}
+
+/* ========== Solo #AgentViewSpan (Other Agents Status) - estilos exclusivos ========== */
+#AgentViewSpan {
+ position: absolute !important;
+ right: 12px !important;
+ left: auto !important;
+ top: 20px !important;
+ width: 260px !important;
+ height: 500px !important;
+ max-height: 75vh !important;
+ z-index: 21 !important;
+ overflow: auto !important;
+ padding: 12px 14px !important;
+ background: #fafafa !important;
+ border: 1px solid #eee !important;
+ border-radius: 8px !important;
+ box-shadow: 0 2px 10px rgba(0,0,0,0.04) !important;
+}
+#AgentViewSpan > table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#AgentViewSpan > table td {
+ padding: 4px 0 !important;
+ border: none !important;
+ vertical-align: top !important;
+}
+#AgentViewSpan > table td:first-child {
+ width: 5px !important;
+ padding-right: 6px !important;
+}
+#AgentViewSpan .body_text,
+#AgentViewSpan font.body_text,
+#vicidial_form #AgentViewSpan .body_text,
+#vicidial_form #AgentViewSpan font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: #1a1a1a !important;
+}
+#AgentViewSpan #AgentViewStatus {
+ display: block !important;
+ margin-top: 6px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 12px !important;
+ color: #333 !important;
+ line-height: 1.45 !important;
+}
+#AgentViewSpan #AgentViewStatus > table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#AgentViewSpan #AgentViewStatus > table td {
+ padding: 6px 8px !important;
+ border: none !important;
+ border-radius: 4px !important;
+ font-size: 12px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ background: transparent !important;
+}
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#ADD8E6"] td { background: #e3f2fd !important; }
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#D8BFD8"] td { background: #f3e5f5 !important; }
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#F0E68C"] td { background: #fff9c4 !important; }
+#AgentViewSpan #AgentViewStatus br {
+ display: block !important;
+ margin: 8px 0 0 0 !important;
+}
+#AgentViewSpan #AgentViewStatus font[style*="font-size:10px"] {
+ font-size: 11px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ color: #666 !important;
+}
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#ADD8E6"],
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#D8BFD8"],
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#F0E68C"] {
+ display: inline-block !important;
+ width: 10px !important;
+ height: 10px !important;
+ border-radius: 2px !important;
+ vertical-align: middle !important;
+ margin-right: 2px !important;
+}
+
diff --git a/Custom/backvicibox/README.txt b/Custom/backvicibox/README.txt
new file mode 100644
index 0000000..2d0334d
--- /dev/null
+++ b/Custom/backvicibox/README.txt
@@ -0,0 +1,78 @@
+==========================================
+BACKUP DE VICIBOX - AMBIENTE DE CONFIGURACIÓN
+==========================================
+
+Fecha de creación: Fri Feb 6 04:46:49 PM UTC 2026
+
+ARCHIVOS INCLUIDOS:
+-------------------
+1. vicibox-scripts.tar.gz
+ - Todos los scripts de instalación y configuración de Vicibox
+ - Ubicación original: /usr/share/vicibox/
+
+2. astguiclient-trunk.tar.gz
+ - Código fuente completo de ViciDial
+ - Ubicación original: /usr/src/astguiclient/trunk/
+
+3. restore.sh
+ - Script para restaurar los archivos en el servidor destino
+
+4. install-vicibox.sh (NUEVO)
+ - Instalación completa en orden: Perl → MariaDB → PHP → Apache
+ - Configura Apache para apuntar a /vicidial/welcome.php
+ - Ejecuta restore.sh, aplica parches a vicibox-install.pl y lanza --vicibox-express
+ - Uso: sudo ./install-vicibox.sh
+
+5. apply-vicibox-patches.sh (NUEVO)
+ - Aplica parches a vicibox-install.pl (socket MySQL, random_pass, DBI)
+ - Se usa automáticamente desde install-vicibox.sh si no existe patches/vicibox-install.pl
+
+6. create-admin-sapian.sh (NUEVO)
+ - Crea usuario administrador en ViciDial: sapian / sap64adm (user_level 9).
+ - Se ejecuta al final de install-vicibox.sh. También se puede ejecutar a mano: sudo ./create-admin-sapian.sh
+
+7. patches/
+ - vicibox-install.pl: copia del instalador con parches ya aplicados (recomendado)
+ - README.txt: descripción de los parches
+
+8. version-info.txt
+ - Información de versiones y sistema
+
+INSTRUCCIONES RÁPIDAS (instalación automática):
+----------------------------------------------
+1. Copiar este directorio al servidor destino (ej. /home/backvicibox).
+
+2. Ejecutar el instalador (instala dependencias, restore, parches y express):
+ cd /home/backvicibox
+ sudo chmod +x install-vicibox.sh restore.sh apply-vicibox-patches.sh
+ sudo ./install-vicibox.sh
+
+3. Revisar el log si algo falla: install-vicibox.log
+
+INSTRUCCIONES MANUALES (paso a paso):
+------------------------------------
+1. Instalar dependencias: Perl (y DBI, DBD-mysql, LWP::Simple), Subversion,
+ MariaDB, PHP 8 (y apache2-mod_php8, php8-mysql), Apache2.
+2. Configurar Apache para que la URL principal sirva /vicidial/welcome.php.
+3. Ejecutar: sudo ./restore.sh
+4. Aplicar parches (copiar patches/vicibox-install.pl a /usr/share/vicibox/
+ o ejecutar apply-vicibox-patches.sh).
+5. Ejecutar: echo y | sudo /usr/share/vicibox/vicibox-install.pl --vicibox-express
+6. En /etc/astguiclient.conf poner VARDB_server => 127.0.0.1 para la web.
+
+REQUISITOS DEL SERVIDOR DESTINO:
+--------------------------------
+- Sistema operativo: openSUSE Leap / SUSE Linux Enterprise (SLE 15 SP6)
+- install-vicibox.sh instala: Perl, DBI, DBD-mysql, libwww-perl, subversion,
+ MariaDB, PHP 8, Apache2. Asterisk se gestiona por el instalador ViciBox.
+- Acceso a internet (recomendado para repos y actualizaciones).
+
+NOTAS:
+------
+- El tamaño total comprimido es aproximadamente 50-70 MB.
+- Log de install-vicibox.sh: install-vicibox.log en este directorio.
+- Log del instalador ViciBox: /var/log/vicibox.log.
+- Acceso web tras instalación: http:///vicidial/welcome.php
+- Usuario administrador ViciDial (creado al final): sapian / sap64adm (admin.php)
+
+==========================================
diff --git a/Custom/backvicibox/apply-vicibox-patches.sh b/Custom/backvicibox/apply-vicibox-patches.sh
new file mode 100644
index 0000000..48a4052
--- /dev/null
+++ b/Custom/backvicibox/apply-vicibox-patches.sh
@@ -0,0 +1,56 @@
+#!/bin/bash
+#
+# Aplica los parches necesarios a /usr/share/vicibox/vicibox-install.pl
+# (detección socket MySQL/MariaDB, random_pass sin pwgen, DBI con socket)
+#
+# Uso: sudo ./apply-vicibox-patches.sh
+#
+
+set -e
+
+INSTALL_PL="/usr/share/vicibox/vicibox-install.pl"
+
+if [ "$EUID" -ne 0 ]; then
+ echo "Ejecutar como root."
+ exit 1
+fi
+if [ ! -f "$INSTALL_PL" ]; then
+ echo "No se encuentra $INSTALL_PL. Ejecuta primero restore.sh."
+ exit 1
+fi
+
+# Si ya tiene los parches (socket y random_pass), no hacer nada
+if grep -q 'mysql_socket' "$INSTALL_PL" && grep -q 'sub random_pass' "$INSTALL_PL"; then
+ echo "vicibox-install.pl ya tiene los parches aplicados."
+ exit 0
+fi
+
+BACKUP="${INSTALL_PL}.bak.$(date +%Y%m%d%H%M%S)"
+cp -a "$INSTALL_PL" "$BACKUP"
+echo "Copia de seguridad: $BACKUP"
+
+# 1) Insertar detección de socket después de "$VICIport = 3306;"
+perl -i -0pe 's/(\$VICIport = 3306;\n)(\$VICIuser = "cron";)/$1# Detect MySQL\/MariaDB socket (openSUSE uses \/var\/run\/mysql\/mysql.sock, others may use \/run\/mysql\/mysql.sock)\n\$mysql_socket = "";\nforeach my \$sock ("\/var\/run\/mysql\/mysql.sock", "\/run\/mysql\/mysql.sock", "\/var\/lib\/mysql\/mysql.sock", "\/tmp\/mysql.sock") {\n\tif (-S \$sock) { \$mysql_socket = \$sock; last; }\n}\n$2/s' "$INSTALL_PL"
+
+# 2) Insertar sub random_pass después de "return \$string;\n}\n\n# Get the admin"
+perl -i -0pe 's/(return \$string;\n\}\n\n)(# Get the admin\.php build)/$1# Generate random password string; use pwgen if available, else openssl, else Perl fallback\nsub random_pass {\n\tmy \$len = \$_\[0\] \|\| 15;\n\tif (-x \"\/usr\/bin\/pwgen\") {\n\t\tmy \$s = trim(\`\/usr\/bin\/pwgen -cns \$len 1\`);\n\t\treturn \$s if \$s;\n\t}\n\tif (-x \"\/usr\/bin\/openssl\") {\n\t\tmy \$s = trim(\`\/usr\/bin\/openssl rand -base64 \$len\`);\n\t\t\$s =~ s\/\[^a-zA-Z0-9\]\/\/g;\n\t\treturn substr(\$s, 0, \$len) if length(\$s) >= \$len;\n\t}\n\tmy \@c = (\x27a\x27..\x27z\x27, \x27A\x27..\x27Z\x27, 0..9);\n\treturn join(\x27\x27, map { \$c[rand \@c] } 1..\$len);\n}\n\n$2/s' "$INSTALL_PL"
+
+# 3) Primera conexión DBI (root) -> usar dsn_root
+perl -i -0pe 's/\t\t\$dbhVDnew = DBI->connect\("DBI:mysql::localhost:\$VICIport", "root", ""\) or die "Couldn\x27t connect to MySQL to create database: " \. DBI->errstr;\n\t\tif \(\$DBS==0\)/\t\tmy \$dsn_root = "DBI:mysql::localhost:\$VICIport" \. (\$mysql_socket ? ";mysql_socket=\$mysql_socket" : "");\n\t\t\$dbhVDnew = DBI->connect(\$dsn_root, "root", "") or die "Couldn\x27t connect to MySQL to create database: " \. DBI->errstr;\n\t\tif (\$DBS==0)/s' "$INSTALL_PL"
+
+# 4) Reconnect to new database -> dsn_db
+perl -i -0pe 's/\t\t# Reconnect to the new database\n\t\t\$dbhVDnew->disconnect;\n\t\t\$dbhVDnew = DBI->connect\("DBI:mysql:\$VICIdatabase:localhost:\$VICIport", "root", ""\) or die "Couldn\x27t reconnect to MySQL to create database tables: " \. DBI->errstr;/# Reconnect to the new database\n\t\t\$dbhVDnew->disconnect;\n\t\tmy \$dsn_db = "DBI:mysql:\$VICIdatabase:localhost:\$VICIport" \. (\$mysql_socket ? ";mysql_socket=\$mysql_socket" : "");\n\t\t\$dbhVDnew = DBI->connect(\$dsn_db, "root", "") or die "Couldn\x27t reconnect to MySQL to create database tables: " \. DBI->errstr;/s' "$INSTALL_PL"
+
+# 5) Slave reconnect -> dsn_root2
+perl -i -0pe 's/\t\t\t# release and reconnect since we restarted the server\n\t\t\t\$dbhVDnew->disconnect;\n\t\t\t\$dbhVDnew = DBI->connect\("DBI:mysql::localhost:\$VICIport", "root", ""\) or die "Couldn\x27t connect to MySQL to create database: " \. DBI->errstr;\n\t\t\t# Reset the slave/\t\t\t# release and reconnect since we restarted the server\n\t\t\t\$dbhVDnew->disconnect;\n\t\t\tmy \$dsn_root2 = "DBI:mysql::localhost:\$VICIport" \. (\$mysql_socket ? ";mysql_socket=\$mysql_socket" : "");\n\t\t\t\$dbhVDnew = DBI->connect(\$dsn_root2, "root", "") or die "Couldn\x27t connect to MySQL to create database: " \. DBI->errstr;\n\t\t\t# Reset the slave/s' "$INSTALL_PL"
+
+# 6) pwgen -> random_pass (dos líneas de passwords)
+perl -i -pe 's/my \$randomstring1=trim\(`\/usr\/bin\/pwgen -cns 15 1`\);/my \$randomstring1=random_pass(15);/; s/my \$randomstring2=trim\(`\/usr\/bin\/pwgen -cns 15 1`\);/my \$randomstring2=random_pass(15);/' "$INSTALL_PL"
+
+# 7) Conexión cron (dbhVD) -> dsn_cron
+perl -i -0pe 's/\t\t\t\t# At this point the primary should be up and good, so we set-up our normal DBI connection for later processes\n\t\t\t\t# Also a good double-check procedure that stuff works\n\t\t\t\t\$dbhVD = DBI->connect\("DBI:mysql:\$VICIdatabase:localhost:\$VICIport", "\$VICIuser", "\$VICIpass"\) or die "Couldn\x27t connect to ViciDial database: " \. DBI->errstr;/# At this point the primary should be up and good, so we set-up our normal DBI connection for later processes\n\t\t\t\t# Also a good double-check procedure that stuff works\n\t\t\t\tmy \$dsn_cron = "DBI:mysql:\$VICIdatabase:localhost:\$VICIport" \. (\$mysql_socket ? ";mysql_socket=\$mysql_socket" : "");\n\t\t\t\t\$dbhVD = DBI->connect(\$dsn_cron, "\$VICIuser", "\$VICIpass") or die "Couldn\x27t connect to ViciDial database: " \. DBI->errstr;/s' "$INSTALL_PL"
+
+# 8) Más pwgen -> random_pass
+perl -i -pe 's/\$randomstring=trim\(`pwgen -cns 32 1`\);/\$randomstring=random_pass(32);/; s/\$randomstring=trim\(`\/usr\/bin\/pwgen -cns 15 1`\);/\$randomstring=random_pass(15);/g' "$INSTALL_PL"
+
+echo "Parches aplicados correctamente a $INSTALL_PL"
diff --git a/Custom/backvicibox/astguiclient-trunk.tar.gz b/Custom/backvicibox/astguiclient-trunk.tar.gz
new file mode 100644
index 0000000..c0b003b
Binary files /dev/null and b/Custom/backvicibox/astguiclient-trunk.tar.gz differ
diff --git a/Custom/backvicibox/create-admin-sapian.sh b/Custom/backvicibox/create-admin-sapian.sh
new file mode 100644
index 0000000..ab193fd
--- /dev/null
+++ b/Custom/backvicibox/create-admin-sapian.sh
@@ -0,0 +1,37 @@
+#!/bin/bash
+#
+# Crea el usuario administrador en ViciDial: sapian / sap64adm
+# Debe ejecutarse después de que la base de datos asterisk y la tabla vicidial_users existan.
+#
+# Uso: sudo ./create-admin-sapian.sh
+#
+
+set -e
+
+# Usar 127.0.0.1 para evitar problemas de socket con MariaDB
+MYSQL_OPTS="-h 127.0.0.1 -u root"
+DB="asterisk"
+USER="sapian"
+PASS="sap64adm"
+FULL_NAME="Sapian Admin"
+
+if [ "$EUID" -ne 0 ]; then
+ echo "Ejecutar como root."
+ exit 1
+fi
+
+if ! mariadb $MYSQL_OPTS -e "USE $DB" 2>/dev/null; then
+ echo "La base de datos $DB no existe o no hay acceso. Ejecutar después de la instalación Express."
+ exit 1
+fi
+
+# Crear usuario administrador (user_level 9 = admin). Si ya existe, actualizar contraseña.
+mariadb $MYSQL_OPTS "$DB" << EOF
+INSERT INTO vicidial_users (user, pass, full_name, user_level, user_group, load_leads, campaign_detail, ast_admin_access, modify_users, alter_agent_interface_options, active)
+VALUES ('$USER', '$PASS', '$FULL_NAME', '9', 'ADMIN', '1', '1', '1', '1', '1', 'Y')
+ON DUPLICATE KEY UPDATE pass = VALUES(pass), full_name = VALUES(full_name), user_level = 9, active = 'Y',
+ load_leads = '1', campaign_detail = '1', ast_admin_access = '1', modify_users = '1', alter_agent_interface_options = '1';
+EOF
+
+echo "Usuario administrador creado/actualizado: $USER (password: $PASS)"
+echo "Acceso: http:///vicidial/admin.php — iniciar sesión con $USER / $PASS"
diff --git a/Custom/backvicibox/install-vicibox.sh b/Custom/backvicibox/install-vicibox.sh
new file mode 100644
index 0000000..091c153
--- /dev/null
+++ b/Custom/backvicibox/install-vicibox.sh
@@ -0,0 +1,149 @@
+#!/bin/bash
+#
+# Script de instalación completa de ViciBox (ambiente de configuración)
+# Basado en la carpeta backvicibox.
+#
+# Orden: Perl → MariaDB → PHP → Apache (y apuntar a welcome.php)
+# → restore.sh → parches a vicibox-install.pl → vicibox-install --vicibox-express
+#
+# Uso: sudo ./install-vicibox.sh
+#
+
+set -e
+
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m'
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+LOG_FILE="${SCRIPT_DIR}/install-vicibox.log"
+
+info() { echo -e "${GREEN}[INFO]${NC} $1" | tee -a "$LOG_FILE"; }
+warn() { echo -e "${YELLOW}[WARN]${NC} $1" | tee -a "$LOG_FILE"; }
+error() { echo -e "${RED}[ERROR]${NC} $1" | tee -a "$LOG_FILE"; }
+
+if [ "$EUID" -ne 0 ]; then
+ error "Ejecutar como root: sudo $0"
+ exit 1
+fi
+
+# Comprobar que estamos en backvicibox y existen archivos
+if [ ! -f "${SCRIPT_DIR}/restore.sh" ]; then
+ error "No se encuentra restore.sh. Ejecutar desde el directorio backvicibox."
+ exit 1
+fi
+if [ ! -f "${SCRIPT_DIR}/vicibox-scripts.tar.gz" ] || [ ! -f "${SCRIPT_DIR}/astguiclient-trunk.tar.gz" ]; then
+ error "Faltan vicibox-scripts.tar.gz o astguiclient-trunk.tar.gz en ${SCRIPT_DIR}"
+ exit 1
+fi
+
+info "=========================================="
+info "Instalación ViciBox (dependencias + restore + express)"
+info "=========================================="
+echo ""
+
+# --- 1. Perl (versión del sistema) y módulos ---
+info "1. Instalando Perl, Subversion y módulos (DBI, DBD-mysql, LWP::Simple)..."
+zypper -n install -y perl perl-DBI perl-DBD-mysql libwww-perl subversion >> "$LOG_FILE" 2>&1 || true
+info " Perl: $(perl -v 2>&1 | head -1)"
+echo ""
+
+# --- 2. MariaDB ---
+info "2. Instalando MariaDB..."
+zypper -n install -y mariadb mariadb-client >> "$LOG_FILE" 2>&1
+systemctl enable mariadb >> "$LOG_FILE" 2>&1
+systemctl start mariadb >> "$LOG_FILE" 2>&1
+info " MariaDB instalado y en ejecución"
+echo ""
+
+# --- 3. PHP 8 y módulo Apache ---
+info "3. Instalando PHP 8 y módulo Apache..."
+if ! zypper lr | grep -q "devel_languages_php_php80"; then
+ zypper -n addrepo https://download.opensuse.org/repositories/devel:languages:php:php80/SLE_15_SP6/devel:languages:php:php80.repo
+fi
+zypper --no-gpg-checks -n refresh >> "$LOG_FILE" 2>&1
+zypper -n install -y php8 apache2-mod_php8 php8-mysql >> "$LOG_FILE" 2>&1
+info " PHP $(php8 -v 2>/dev/null | head -1 || true) instalado"
+echo ""
+
+# --- 4. Apache ---
+info "4. Instalando Apache y configurando welcome.php..."
+zypper -n install -y apache2 apache2-prefork >> "$LOG_FILE" 2>&1
+# Configurar que la raíz y /vicidial apunten a welcome.php
+cat > /etc/apache2/conf.d/vicidial-welcome.conf << 'APACHECONF'
+# ViciDial: URL principal -> vicidial/welcome.php
+
+ DirectoryIndex welcome.php
+ Options None
+
+ Require all granted
+
+
+RedirectMatch ^/$ /vicidial/welcome.php
+APACHECONF
+systemctl enable apache2 >> "$LOG_FILE" 2>&1
+systemctl start apache2 >> "$LOG_FILE" 2>&1
+info " Apache instalado y apuntando a /vicidial/welcome.php"
+echo ""
+
+# --- 5. Restore (scripts y código fuente) ---
+info "5. Ejecutando restore.sh..."
+cd "$SCRIPT_DIR"
+./restore.sh >> "$LOG_FILE" 2>&1
+echo ""
+
+# --- 6. Aplicar parches a vicibox-install.pl ---
+info "6. Aplicando parches a vicibox-install.pl (socket MySQL, random_pass, etc.)..."
+if [ -f "${SCRIPT_DIR}/patches/vicibox-install.pl" ]; then
+ cp "${SCRIPT_DIR}/patches/vicibox-install.pl" /usr/share/vicibox/vicibox-install.pl
+ chmod +x /usr/share/vicibox/vicibox-install.pl
+ info " Copiado vicibox-install.pl con parches desde patches/"
+elif [ -f "${SCRIPT_DIR}/apply-vicibox-patches.sh" ]; then
+ "${SCRIPT_DIR}/apply-vicibox-patches.sh" >> "$LOG_FILE" 2>&1
+ info " Parches aplicados con apply-vicibox-patches.sh"
+else
+ warn " No se encontró patches/vicibox-install.pl ni apply-vicibox-patches.sh."
+ warn " Se usará vicibox-install.pl sin parches (puede fallar socket MySQL/pwgen)."
+fi
+echo ""
+
+# --- 7. Ejecutar instalación Express ---
+info "7. Ejecutando vicibox-install --vicibox-express (confirmación automática 'y')..."
+info " Esto puede tardar varios minutos..."
+echo "y" | /usr/share/vicibox/vicibox-install.pl --vicibox-express >> "$LOG_FILE" 2>&1 || true
+echo ""
+
+# --- 8. Ajustar conexión web (127.0.0.1 para evitar error socket) ---
+if [ -f /etc/astguiclient.conf ]; then
+ if grep -q 'VARDB_server => localhost' /etc/astguiclient.conf; then
+ sed -i 's/VARDB_server => localhost/VARDB_server => 127.0.0.1/' /etc/astguiclient.conf
+ info "8. Configuración: VARDB_server => 127.0.0.1 en /etc/astguiclient.conf (para la web)"
+ fi
+else
+ info "8. /etc/astguiclient.conf no existe aún (normal si la instalación Express falló antes de crearlo)."
+fi
+echo ""
+
+# --- 9. Crear usuario administrador sapian / sap64adm ---
+info "9. Creando usuario administrador sapian en ViciDial..."
+if [ -f "${SCRIPT_DIR}/create-admin-sapian.sh" ]; then
+ chmod +x "${SCRIPT_DIR}/create-admin-sapian.sh"
+ if "${SCRIPT_DIR}/create-admin-sapian.sh" >> "$LOG_FILE" 2>&1; then
+ info " Usuario administrador: sapian / sap64adm creado correctamente"
+ else
+ warn " No se pudo crear el usuario (¿base de datos ya instalada?). Puedes ejecutar después: sudo ${SCRIPT_DIR}/create-admin-sapian.sh"
+ fi
+else
+ warn " No se encuentra create-admin-sapian.sh. Crear usuario sapian manualmente en admin.php si lo necesitas."
+fi
+echo ""
+
+info "=========================================="
+info "Proceso de instalación finalizado"
+info "=========================================="
+info "Log guardado en: $LOG_FILE"
+info "Comprueba el estado de servicios: systemctl status mariadb apache2"
+info "Acceso web: http:///vicidial/welcome.php"
+info "Admin ViciDial: usuario sapian, password sap64adm (admin.php)"
+echo ""
diff --git a/Custom/backvicibox/patches/README.txt b/Custom/backvicibox/patches/README.txt
new file mode 100644
index 0000000..2868ae5
--- /dev/null
+++ b/Custom/backvicibox/patches/README.txt
@@ -0,0 +1,14 @@
+Parches para vicibox-install.pl
+================================
+
+- vicibox-install.pl (si existe): copia del script con modificaciones aplicadas para:
+ * Detección automática del socket MySQL/MariaDB (/var/run/mysql, /run/mysql, etc.)
+ * Función random_pass() cuando pwgen no está instalado
+ * Conexiones DBI usando el socket detectado (evita "No such file or directory")
+
+Si este directorio contiene vicibox-install.pl, install-vicibox.sh lo copiará
+a /usr/share/vicibox/ después de restore.sh. Si no, intentará aplicar
+apply-vicibox-patches.sh al script restaurado.
+
+Para regenerar vicibox-install.pl con parches desde un sistema ya parcheado:
+ cp /usr/share/vicibox/vicibox-install.pl /home/backvicibox/patches/
diff --git a/Custom/backvicibox/patches/vicibox-install.pl b/Custom/backvicibox/patches/vicibox-install.pl
new file mode 100644
index 0000000..c0423a7
--- /dev/null
+++ b/Custom/backvicibox/patches/vicibox-install.pl
@@ -0,0 +1,1695 @@
+#!/usr/bin/perl
+
+# vicibox-install.pl version 11.0
+#
+# Copyright (C) 2023 James Pearson LICENSE: AGPLv2
+#
+#
+# CHANGES
+# 230609-0007 - changed to be just 'vicibox installer'
+# 210713-1143 - RC1 build v.10.0
+# 190726-1806 - RC1 Build v.9.0
+# 180921-1540 - GB Build v.8.1.0
+# 180920-1914 - RC2 Build v.8.1
+# 180327-1818 - RC1 Build v.8.1
+#
+
+
+# This script looks for a table called 'vicibox' in the ViciDial Database server to pull in settings
+# If you don't have one you can create one. The schema is as follows as well as the field definitions.
+# If the script doesn't find one, or not one with correctly matching info, it will enable the proper
+# modes depending on what it doesn't like. Finding no table = legacy mode. Not finding the database
+# entry will enable expert mode. Try not to get this internal tracking database too far out of whack :)
+
+
+#Vicibox table schema:
+#CREATE TABLE IF NOT EXISTS `vicibox` (
+# `server_id` tinyint(3) unsigned NOT NULL AUTO_INCREMENT,
+# `server` varchar(32) NOT NULL,
+# `server_ip` varchar(32) NOT NULL,
+# `server_type` enum('Database','Web','Telephony','Archive') NOT NULL DEFAULT 'Telephony',
+# `field1` varchar(64) DEFAULT NULL,
+# `field2` varchar(64) DEFAULT NULL,
+# `field3` varchar(64) DEFAULT NULL,
+# `field4` varchar(64) DEFAULT NULL,
+# `field5` varchar(64) DEFAULT NULL,
+# `field6` varchar(64) DEFAULT NULL,
+# `field7` varchar(64) DEFAULT NULL,
+# `field8` varchar(64) DEFAULT NULL,
+# `field9` varchar(64) NOT NULL
+# PRIMARY KEY (`server_id`)
+#) ENGINE=MyISAM DEFAULT CHARSET=latin1;
+
+
+#DB field types:
+#field1 = mysql server ID, use 0 for Master, 1 for first slave, 2 for 2nd slave, etc, up to 9
+#field2 = DB name, default is asterisk
+#field3 = svn revision of DB
+#field4 = regular user
+#field5 = regular pass
+#field6 = custom user
+#field7 = custom pass
+#field8 = slave user, only relevant to primary DB
+#field9 = slave pass, same as above
+
+#Web field types:
+#field1 = external IP
+#field2 = audiostore directory
+
+#Telephony field type:
+#field1 = external IP
+
+#Archive field type: Auto-Configuration only works on a single archive server, other things have to be done manually
+#field1 = FTP user
+#field2 = FTP pass
+#field3 = FTP Port
+#field4 = FTP directory
+#field5 = URL Path
+
+
+
+# All my lovely little modules
+# I HATE STRICT! Suggesting I use strict will result in me
+# tracking you down and hitting you in the face with a hammer!
+# Feel free to submit a strict-friendly patch and/or other code
+# clean-up and optimization efforts you may have. If I test them
+# and they work I will put them in.
+use warnings;
+use LWP::Simple;
+use Sys::Hostname;
+use DBI;
+
+# A handy IPv4 validator for user input
+sub checkipv4 {
+my $ipaddr = $_[0];
+
+# Make sure we like the format
+if( $ipaddr =~ m/^(\d\d?\d?)\.(\d\d?\d?)\.(\d\d?\d?)\.(\d\d?\d?)$/ ) {
+
+ # Make sure we like the octets too
+ if($1 <= 255 && $2 <= 255 && $3 <= 255 && $4 <= 255) {
+ if ($debug==1) { print("IP Address checks good: $ipaddr\n"); }
+ return 0;
+
+ } else {
+ if ($debug==1) { print("IP address octet(s) out of range: $ipaddr \n"); }
+ return 1;
+ }
+
+ } else {
+ if ($debug==1) { print("IP address not in valid format: $ipaddr\n"); }
+ return 1;
+}
+}
+
+# Get the local IP of the machine by parsing ip command output
+sub getlocalip {
+ my $ip;
+ my @ipaddr = `/usr/sbin/ip addr show`;
+ my $line;
+ my $i=0;
+
+ foreach(@ipaddr) {
+ $line = $ipaddr[$i];
+ if ( $line =~ /inet (\d+\.\d+\.\d+\.\d+)\//) {
+ $ip = $1;
+ if ( $ip =~ /(^192\.168\.)|(^10\.)|(^172\.1[6-9]\.)|(^172\.2[0-9]\.)|(^172\.3[0-1]\.)/ && $ip !~ /^127\./) {
+ $ip = trim($ip);
+ return $ip;
+ }
+ }
+ $i++;
+ }
+ return "X";
+}
+
+# Get the External IP from the internets! Will also serv as a connectivity checker for feedback
+sub getextip {
+ my $extip=get("http://www.vicidial.org/yourip.php");
+ return "X" unless defined $extip;
+ $extip = trim($extip);
+ return $extip;
+}
+
+# Perl trim function to remove whitespace from the start and end of the string, stolen from google cause i'm lazy
+sub trim($) {
+ my $string = shift;
+ $string =~ s/^\s+//;
+ $string =~ s/\s+$//;
+ return $string;
+}
+
+# Generate random password string; use pwgen if available, else openssl, else Perl fallback
+sub random_pass {
+ my $len = $_[0] || 15;
+ if (-x '/usr/bin/pwgen') {
+ my $s = trim(`/usr/bin/pwgen -cns $len 1`);
+ return $s if $s;
+ }
+ if (-x '/usr/bin/openssl') {
+ my $s = trim(`/usr/bin/openssl rand -base64 $len`);
+ $s =~ s/[^a-zA-Z0-9]//g;
+ return substr($s, 0, $len) if length($s) >= $len;
+ }
+ my @c = ('a'..'z', 'A'..'Z', 0..9);
+ return join('', map { $c[rand @c] } 1..$len);
+}
+
+# Get the admin.php build and admin version. Threw it in a sub since it's ugly code :)
+sub adminphp {
+my $srce = "/usr/src/astguiclient/trunk/www/vicidial/admin.php";
+my $string1 = 'build = ';
+my $string2 = 'admin_version = ';
+my $adminver;
+my $buildver;
+my $line;
+
+open(FH, $srce);
+while(my $line = ) {
+ if($line =~ m/$string1/) {
+ $buildver = $line;
+ }
+ if($line =~ m/$string2/) {
+ $adminver = $line;
+ }
+}
+close FH;
+$buildver = substr $buildver, 10;
+$buildver = substr $buildver, 0, -3;
+if ($debug==1) { print "Build Version : $buildver\n"; }
+$adminver = substr $adminver, 18;
+$adminver = substr $adminver, 0, -3;
+if ($debug==1) { print "Admin Version : $adminver\n"; }
+
+return ($buildver, $adminver);
+
+}
+
+# Look for user to press a Y in the first character, return 1 if they do, 0 otherwise
+sub yesprompt {
+ my $manual = ;
+
+ if ( ($manual =~ /^[Y]$/i) ) {
+ return 1;
+ } else {
+ return 0;
+ }
+}
+
+# Look for user to press a N in the first character, return 1 if they do, 0 otherwise
+sub noprompt {
+ my $manual = ;
+
+ if ( ($manual =~ /^[N]$/i) ) {
+ return 1;
+ } else {
+ return 0;
+ }
+}
+
+# This nasty little thing below here does all the install work. We merely flip a bunch of flags and call this.
+# In theory, it should make maintaining things easier. I hope...
+sub dothedeed {
+ # And now we begin the installation madness! Whoot! Or something...
+ print "\n\nBeginning installation, expect lots of output...\n\n";
+
+ # Ensure SVN revision variables are set (e.g. express install when svn head/local unavailable)
+ if (!defined($localsvn) || $localsvn eq '') {
+ @svninfo = `/usr/bin/svn info /usr/src/astguiclient/trunk 2>/dev/null | grep Revision | sed -e 's/Revision: //'`;
+ $localsvn = defined($svninfo[0]) ? trim($svninfo[0]) : '0';
+ }
+ if (!defined($DBsvnrev) || $DBsvnrev eq '' || $DBsvnrev eq 'X') {
+ $DBsvnrev = $localsvn;
+ }
+
+ # Mangle the firewall appropriately
+ if ($disablefirewall!=0) {
+ print "Disabling firewall...\n";
+ system("/usr/bin/systemctl stop firewalld");
+ system("/usr/bin/systemctl disable firewalld");
+ }
+
+ # First we check our SVN and update as necessary
+ if ($localsvn != $DBsvnrev) {
+ print "\nUpdating to SVN revision $DBsvnrev...\n";
+ system("/usr/bin/svn", "-r", "$DBsvnrev", "up", "/usr/src/astguiclient/trunk/", ">> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ # Get the SVN version of our local copy
+ @svninfo = `/usr/bin/svn info /usr/src/astguiclient/trunk | grep Revision | sed -e 's/Revision: //'`;
+ $localsvn = trim($svninfo[0]);
+ if ($debug==1) { print "Local SVN Revision after update : $localsvn\n"; }
+ if ($localsvn != $DBsvnrev) { die "Could not update SVN to $DBsvnrev! Check your connectivity!\n"; }
+ } else {
+ print "Local SVN revision matches DB revision: $DBsvnrev\n";
+ }
+
+ # If we are a database, then we start mysql and create our database
+ if ($DB==1) {
+ print "Doing general DataBase requirements...\n";
+ my $dbsvc = (-e '/usr/lib/systemd/system/mariadb.service') ? 'mariadb' : 'mysql';
+ if (system("/usr/bin/systemctl enable $dbsvc >> /var/log/vicibox.log 2>> /var/log/vicibox.log")!=0) { die "Failed to enable MariaDB/MySQL ($dbsvc): $? Install the server package (e.g. zypper in mariadb)."; }
+ if (system("/usr/bin/systemctl start $dbsvc >> /var/log/vicibox.log 2>> /var/log/vicibox.log")!=0) { die "Failed to start MariaDB/MySQL ($dbsvc): $?"; }
+ my $dsn_root = "DBI:mysql::localhost:$VICIport" . ($mysql_socket ? ";mysql_socket=$mysql_socket" : "");
+ $dbhVDnew = DBI->connect($dsn_root, "root", "") or die "Couldn't connect to MySQL to create database: " . DBI->errstr;
+ if ($DBS==0) {
+ # See if there is already a database here. If so, bomb out, something is whacky. But only if it's a master DB, slaves can get wiped out
+ $stmtCHECKDB = "show databases like '$VICIdatabase';";
+ $sthCHECKDB = $dbhVDnew->prepare($stmtCHECKDB) or die "Preparing stmtCHECKDB: ",$dbhVDnew->errstr;
+ $sthCHECKDB->execute or die "Executing sthCHECKDB: ",$dbhVDnew->errstr;
+ $sthCHECKDBrows=$sthCHECKDB->rows;
+ if ($sthCHECKDBrows > 0) { die "Database already exists! Server was previously installed.\n"; }
+ $sthCHECKDB->finish;
+ }
+ # Create the new database
+ $stmtCREATE = "create database IF NOT EXISTS $VICIdatabase default character set utf8 collate utf8_unicode_ci;";
+ $sthCREATE = $dbhVDnew->prepare($stmtCREATE) or die "Preparing stmtCREATE: ",$dbhVDnew->errstr;
+ $sthCREATE->execute or die "Executing sthCREATE: ",$dbhVDnew->errstr;
+ $sthCREATE->finish;
+ # Reconnect to the new database
+ $dbhVDnew->disconnect;
+ my $dsn_db = "DBI:mysql:$VICIdatabase:localhost:$VICIport" . ($mysql_socket ? ";mysql_socket=$mysql_socket" : "");
+ $dbhVDnew = DBI->connect($dsn_db, "root", "") or die "Couldn't reconnect to MySQL to create database tables: " . DBI->errstr;
+ # Grant permissions to our database standard user
+ $stmtGRANT = "GRANT SELECT,INSERT,UPDATE,DELETE,LOCK TABLES on $VICIdatabase.* TO $VICIuser\@'%' IDENTIFIED BY '$VICIpass';";
+ $sthGRANT = $dbhVDnew->prepare($stmtGRANT) or die "Preparing stmtGRANT: ",$dbhVDnew->errstr;
+ $sthGRANT->execute or die "Executing sthGRANT: ",$dbhVDnew->errstr;
+ # Grant permissions to our database standard user
+ $stmtGRANT = "GRANT SELECT,INSERT,UPDATE,DELETE,LOCK TABLES on $VICIdatabase.* TO $VICIuser\@'localhost' IDENTIFIED BY '$VICIpass';";
+ $sthGRANT = $dbhVDnew->prepare($stmtGRANT) or die "Preparing stmtGRANT: ",$dbhVDnew->errstr;
+ $sthGRANT->execute or die "Executing sthGRANT: ",$dbhVDnew->errstr;
+ # Grant permissions to our database custom user
+ $stmtGRANT = "GRANT CREATE,ALTER on $VICIdatabase.* TO $VICIcustomuser\@'localhost' IDENTIFIED BY '$VICIcustompass';";
+ $sthGRANT = $dbhVDnew->prepare($stmtGRANT) or die "Preparing stmtGRANT: ",$dbhVDnew->errstr;
+ $sthGRANT->execute or die "Executing sthGRANT: ",$dbhVDnew->errstr;
+ # Grant permissions to our database custom user
+ $stmtGRANT = "GRANT CREATE,ALTER on $VICIdatabase.* TO $VICIcustomuser\@'%' IDENTIFIED BY '$VICIcustompass';";
+ $sthGRANT = $dbhVDnew->prepare($stmtGRANT) or die "Preparing stmtGRANT: ",$dbhVDnew->errstr;
+ $sthGRANT->execute or die "Executing sthGRANT: ",$dbhVDnew->errstr;
+
+ if ($DBS==1) {
+ # We are a slave, so we do slave-type things
+ print "Doing Slave-specific MySQL setup...\n";
+ if (system("/usr/bin/sed -i 's+server-id = 1+server-id = $DBmysqlid+g' /etc/my.cnf")!=0) { die "Could not modify my.cnf for slave: $?"; }
+ system("/usr/bin/systemctl stop $dbsvc >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ if (system("/usr/bin/systemctl start $dbsvc >> /var/log/vicibox.log 2>> /var/log/vicibox.log")!=0) { die "Failed to restart MySQL: $?"; }
+ # release and reconnect since we restarted the server
+ $dbhVDnew->disconnect;
+ my $dsn_root2 = "DBI:mysql::localhost:$VICIport" . ($mysql_socket ? ";mysql_socket=$mysql_socket" : "");
+ $dbhVDnew = DBI->connect($dsn_root2, "root", "") or die "Couldn't connect to MySQL to create database: " . DBI->errstr;
+ # Reset the slave so it can take fresh configs.
+ $stmtSQL="stop slave;";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ $stmtSQL="reset slave;";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ $stmtSQL="CHANGE MASTER TO MASTER_HOST='$VICIDBIP', MASTER_USER='$VICIslaveuser', MASTER_PASSWORD='$VICIslavepass', MASTER_PORT=$VICIport;";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ print "\nBeginning database dump from master, this may take a while...\n\n";
+ if (system("/usr/bin/mariadb --all-database --master-data -u $VICIslaveuser -p$VICIslavepass -h $VICIDBIP -P $VICIport > /tmp/vicimaster.sql")!=0) { die "Could not get database dump from master: $?"; }
+
+ # Load in our master data
+ print "Beginning database load into slave, this may take a while...\n";
+ if (system("/usr/bin/mariadb -u root -h localhost -f < /tmp/vicimaster.sql")!=0) { die "Could not load data into slave.\n"; }
+ # Just for fun, run the upgrade incase this SQL info came from an older version
+ system("/usr/bin/maraidb-upgrade -u root -h localhost -s");
+
+ # Insert ourselves into vicibox
+ if ($legacy==0) {
+ $stmtSQL="INSERT INTO `vicibox` (`server`, `server_ip`, `server_type`, `field1`, `field2`, `field3`, `field4`, `field5`, `field6`, `field7`, `field8`, `field9`) VALUES ('$myname', '$VICIDBIP', 'Database', '$DBmysqlid', '$VICIdatabase', '$DBsvnrev', '$VICIuser', '$VICIpass', '$VICIcustomuser', '$VICIcustompass', '$VICIslaveuser', '$VICIslavepass');";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ }
+
+ # Now start the slave
+ $stmtSQL="start slave;";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ print "Slave loaded and started. Verify by connecting to MySQL and running 'slave show status'\n";
+
+ } else {
+ print "Doing Master-specific MySQL setup...\n";
+
+ # Create our schema in the database
+ if (system("/usr/bin/mariadb $VICIdatabase -f < /usr/src/astguiclient/trunk/extras/MySQL_AST_CREATE_tables.sql")!=0) { die "Could not create database schema\n"; }
+
+ # Insert ourselves into the server table if we aren't also a dialer
+ if ($TEL==0) {
+ my $stmtSQL="insert into servers (server_id, server_description, server_ip, active, max_vicidial_trunks, active_asterisk_server, active_agent_login_server) values ('$myname', 'DataBase Only - DO NOT DELETE', '$VICIDBIP', 'Y', '0', 'N', 'N');";
+ my $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ }
+
+ # Give ourselves some more secure passwords then test!! Silly developer and users
+ my $randomstring1=random_pass(15);
+ my $randomstring2=random_pass(15);
+ my $stmtSQL="update system_settings set default_phone_registration_password='$randomstring1', default_server_password='$randomstring2';";
+ my $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+
+ # Now we create out vicibox table...
+ $stmtSQL="CREATE TABLE IF NOT EXISTS `vicibox` (`server_id` tinyint(3) unsigned NOT NULL AUTO_INCREMENT, `server` varchar(32) NOT NULL, `server_ip` varchar(32) NOT NULL, `server_type` enum('Database','Web','Telephony','Archive') NOT NULL DEFAULT 'Telephony',`field1` varchar(64) DEFAULT NULL,`field2` varchar(64) DEFAULT NULL,`field3` varchar(64) DEFAULT NULL,`field4` varchar(64) DEFAULT NULL,`field5` varchar(64) DEFAULT NULL,`field6` varchar(64) DEFAULT NULL,`field7` varchar(64) DEFAULT NULL,`field8` varchar(64) DEFAULT NULL,`field9` varchar(64) DEFAULT NULL, PRIMARY KEY (`server_id`)) ENGINE=MyISAM DEFAULT CHARSET=latin1;";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+
+ # and populate it if not legacy
+ if ($legacy==0) {
+ $stmtSQL="INSERT INTO `vicibox` (`server`, `server_ip`, `server_type`, `field1`, `field2`, `field3`, `field4`, `field5`, `field6`, `field7`, `field8`, `field9`) VALUES ('$myname', '$VICIDBIP', 'Database', '0', '$VICIdatabase', '$DBsvnrev', '$VICIuser', '$VICIpass', '$VICIcustomuser', '$VICIcustompass', '$VICIslaveuser', '$VICIslavepass');";
+ $sthSQL = $dbhVDnew->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVDnew->errstr;
+ $sthSQL->execute;
+ }
+
+ # Now insert the extra ViciBox stuff
+ $stmtSQL="INSERT INTO `vicidial_ip_lists` VALUES ('ViciWhite','White List for ViciBox firewall ACL','N','---ALL---'), ('ViciBlack','Black List for ViciBox firewall ACL','N','---ALL---');";
+ $dbhVDnew->do($stmtSQL);
+ $stmtSQL = "INSERT INTO `vicidial_conf_templates` (`template_id`, `template_name`, `template_contents`, `user_group`) VALUES ('VICIphoneSIP', 'VICIphoneSIP WebRTC', 'type=friend\r\nhost=dynamic\r\nencryption=yes\r\navpf=yes\r\nicesupport=yes\r\ndirectmedia=no\r\ntransport=wss\r\nforce_avp=yes\r\ndtlsenable=yes\r\ndtlsverify=no\r\ndtlscertfile=/etc/apache2/ssl.crt/vicibox.crt\r\ndtlsprivatekey=/etc/apache2/ssl.key/vicibox.key\r\ndtlssetup=actpass\r\nrtcp_mux=yes\r\n', '---ALL---');";
+ $dbhVDnew->do($stmtSQL);
+ $stmtSQL = "INSERT INTO `vicidial_conf_templates` (`template_id`, `template_name`, `template_contents`, `user_group`) VALUES ('VICIphonePJSIP', 'VICIphonePJSIP WebRTC', 'inbound_auth/nonce_lifetime = 32\r\naor/max_contacts = 1\r\naor/maximum_expiration = 3600\r\naor/minimum_expiration = 60\r\naor/default_expiration = 120\r\n\r\nendpoint/context = default\r\nendpoint/dtmf_mode = rfc4733\r\nendpoint/rtp_symmetric = yes\r\nendpoint/rewrite_contact = yes\r\nendpoint/rtp_timeout = 60\r\nendpoint/use_ptime = yes\r\nendpoint/moh_suggest = default\r\nendpoint/direct_media = no\r\nendpoint/trust_id_inbound = no\r\nendpoint/send_rpid = yes\r\nendpoint/inband_progress = no\r\nendpoint/tos_audio = ef\r\nendpoint/language = en\r\n\r\nendpoint/ice_support = yes\r\nendpoint/media_encryption = dtls\r\nendpoint/media_use_received_transport=yes\r\nendpoint/dtls_verify = no\r\nendpoint/dtls_cert_file = /etc/apache2/ssl.crt/vicibox.crt\r\nendpoint/dtls_private_key = /etc/apache2/ssl.key/vicibox.key\r\nendpoint/dtls_setup = actpass\r\nendpoint/transport=transport-wss\r\nendpoint/rtcp_mux=yes', '---ALL---');";
+ $dbhVDnew->do($stmtSQL);
+ $stmtSQL = "UPDATE system_settings set allowed_sip_stacks='SIP_and_PJSIP';";
+ $dbhVDnew->do($stmtSQL);
+ $stmtSQL = "UPDATE system_settings set webphone_url='https://phone.viciphone.com/v3.0/viciphone.php';";
+ $dbhVDnew->do($stmtSQL);
+
+ # Set-up the slave user stuff
+ $stmtGRANT = "GRANT REPLICATION SLAVE,REPLICATION CLIENT,SELECT,RELOAD,SHOW VIEW on *.* TO '$VICIslaveuser'\@'%' IDENTIFIED BY '$VICIslavepass';";
+ $sthGRANT = $dbhVDnew->prepare($stmtGRANT) or die "Preparing stmtGRANT: ",$dbhVDnew->errstr;
+ $sthGRANT->execute or die "Executing sthGRANT: ",$dbhVDnew->errstr;
+
+ # At this point the primary should be up and good, so we set-up our normal DBI connection for later processes
+ # Also a good double-check procedure that stuff works
+ my $dsn_cron = "DBI:mysql:$VICIdatabase:localhost:$VICIport" . ($mysql_socket ? ";mysql_socket=$mysql_socket" : "");
+ $dbhVD = DBI->connect($dsn_cron, "$VICIuser", "$VICIpass") or die "Couldn't connect to ViciDial database: " . DBI->errstr;
+
+ }
+
+ }
+
+ # Do web-type things
+ if ($WEB==1) {
+ print "Configuring Web Server...\n";
+
+ # See if we are the first webserver, left incase a restore is done it will auto-enable the audio store
+ $stmtFIRSTWEB="select * from system_settings where sounds_web_server='127.0.0.1';";
+ $sthFIRSTWEB = $dbhVD->prepare($stmtFIRSTWEB) or die "Preparing stmtFIRSTWEB: ",$dbhVD->errstr;
+ $sthFIRSTWEB->execute or die "Executing sthFIRSTWEB: ",$dbhVD->errstr;
+ $sthFIRSTWEBrows=$sthFIRSTWEB->rows;
+
+ if ($sthFIRSTWEBrows > 0) {
+ if ($debug==1) { print "First web server found, enabling audio store...\n"; }
+ # enable the audio store
+ $randomstring=random_pass(32);
+ $stmtWEB="update system_settings set sounds_web_server='$localip', sounds_web_directory='$randomstring', sounds_central_control_active='1';";
+ $sthWEB = $dbhVD->prepare($stmtWEB) or die "Preparing stmtWEB: ",$dbhVD->errstr;
+ $sthWEB->execute or die "Executing sthWEB: ",$dbhVD->errstr;
+ # Modify the apache configuration file for the audio store and create the directory
+ system("/usr/bin/sed -i 's/WEBDIR/$randomstring/g' /etc/apache2/conf.d/audiostore.conf");
+ system("/bin/mkdir /srv/www/htdocs/$randomstring");
+ system("chown -R wwwrun:www /srv/www/htdocs/$randomstring");
+ $audiostore=1;
+ } else {
+ $audiostore=0;
+ }
+
+ # If we are dedicated, enable bigger apache settings
+ if ($DB==0 && $TEL==0) {
+ if ($debug==1) { print "Dedicated Web Server Found, enabling large apache settings...\n"; }
+ system("cp /usr/share/vicibox/server-tuning.conf /etc/apache2/server-tuning.conf");
+ }
+
+ # Do the general stuff for apache from bash where life is easier
+ system("/usr/share/vicibox/vicibox-web.sh $redirect $phpmyadmin $VICIDBIP >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+
+ # And finally, insert ourselves into the vicibox table if not legacy and not a restore operation
+ if ($legacy==0 and $restore==0) {
+ $stmtSQL="INSERT INTO `vicibox` (`server`, `server_ip`, `server_type`, `field1`, `field2`) VALUES ('$myname', '$localip', 'Web', '$extip', '$randomstring');";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+ }
+ system("/usr/bin/systemctl enable apache2 >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ system("/usr/bin/systemctl restart apache2 >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ }
+
+ # Telephony server stuff
+ if ($TEL==1) {
+ print "Configuring Telephony Server...\n";
+
+ if ($restore==0) {
+ # Check to make sure we aren't doing something silly like installing the same server twice, exception being a restore
+ $stmtCHECKTEL = "select * from servers where server_ip='$localip' or server_ip='$extip';";
+ $sthCHECKTEL = $dbhVD->prepare($stmtCHECKTEL) or die "Preparing stmtCHECKTEL: ",$dbhVD->errstr;
+ $sthCHECKTEL->execute or die "Executing sthCHECKTEL: ",$dbhVD->errstr;
+ $sthCHECKTELrows=$sthCHECKTEL->rows;
+ if ($sthCHECKTELrows > 0) { die "Telephony server already exists! Server was previously installed.\n"; }
+ }
+
+ # Do the general stuff for a telephony server from bash where life is easier
+ system("/usr/share/vicibox/vicibox-tel.sh $PJSIP >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+
+ # We only run the below, which inserts us into vicidial and the vicihost table, if we aren't in restore mode
+ if ($restore==0) {
+ # Modify the SQL files for dialer insertion
+ if ($primarydialer==1) {
+ system("/usr/bin/sed 's/10.10.10.15/$localip/g' /usr/src/astguiclient/trunk/extras/first_server_install.sql > /tmp/viciserver.sql");
+ system("/bin/echo \"update system_settings set active_voicemail_server='$localip';\" >> /tmp/viciserver.sql");
+ } else {
+ system("/usr/bin/sed 's/10.10.10.16/$localip/g' /usr/src/astguiclient/trunk/extras/second_server_install.sql > /tmp/viciserver.sql");
+ }
+
+ # Modify the SQL files for hostname
+ system("/usr/bin/sed -i 's/TESTast/$myname/g' /tmp/viciserver.sql");
+
+ ## Inject the SQL file into MySQL
+ if (system("/usr/bin/mariadb -u $VICIuser -p$VICIpass -P $VICIport -h $VICIDBIP $VICIdatabase -f < /tmp/viciserver.sql")!=0) { die "Could not load telephony data into master database.\n"; }
+
+
+ # Do some clean-up to make things prettier on the user side
+ $randomstring=random_pass(15);
+ $stmtSQL="update servers set server_description='Server $myname', asterisk_version='$astverstring', conf_secret='$randomstring', vicidial_balance_active='Y', auto_restart_asterisk='Y' where server_ip='$localip';";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+
+
+ # If we have an external IP, throw that in there too
+ if ($extip ne "X") {
+ $stmtSQL="update servers set external_server_ip='$extip' where server_ip='$localip';";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+ }
+
+ # And finally, insert ourselves into the vicibox table if not legacy
+ if ($legacy==0) {
+ $stmtSQL="INSERT INTO `vicibox` (`server`, `server_ip`, `server_type`, `field1`) VALUES ('$myname', '$localip', 'Telephony', '$extip');";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+ }
+
+ } elsif ($restore==1 && $legacy==0) {
+ # Update the server record with the new asterisk version in case it's different from the restore
+ $stmtSQL="update servers set asterisk_version='$astverstring' where server_ip='$localip';";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+ }
+
+ # Make sure we start on boot
+ system("/usr/bin/systemctl enable vicidial >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ system("/usr/bin/systemctl enable apache2 >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ system("/usr/bin/systemctl restart apache2");
+ }
+
+ # Archive server
+ if ($ARC==1) {
+
+ print "Configuring Archive Server...\n";
+
+ # Do our system set-up
+ system("/bin/mkdir -p /home/archive/$TELarchivedir");
+ system("/usr/sbin/useradd -d /home/archive -s /bin/false $TELarchiveuser");
+ system("/bin/chown -R $TELarchiveuser:users /home/archive");
+ system("/bin/echo -e '$TELarchivepass\n$TELarchivepass' | /usr/bin/passwd $TELarchiveuser");
+ system("/usr/bin/systemctl enable vsftpd >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ system("/usr/bin/systemctl restart vsftpd");
+ system("/usr/bin/systemctl enable apache2 >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ system("/usr/bin/systemctl restart apache2");
+
+ # And finally, insert ourselves into the vicibox table if not legacy and not a restore
+ if ($legacy==0 and $restore==0) {
+ $stmtSQL="INSERT INTO `vicibox` (`server`, `server_ip`, `server_type`, `field1`, `field2`, `field3`, `field4`, `field5`) VALUES ('$myname', '$TELarchiveip', 'Archive', '$TELarchiveuser', '$TELarchivepass', '$TELarchiveport', '$TELarchivedir', '$TELarchiveurl');";
+ $sthSQL = $dbhVD->prepare($stmtSQL) or die "Preparing stmtSQL: ",$dbhVD->errstr;
+ $sthSQL->execute;
+ }
+ }
+
+
+ # All the easy stuff is over, now the big mess of stuff that is trying to figure out how to ACTUALLY install vicidial :(
+ # First we build up our generic install.pl options for use later on
+ $installPLstring = "--web=/srv/www/htdocs --asterisk_version=$asterisk --copy_sample_conf_files --no-prompt --server_ip=$localip --DB_database=$VICIdatabase --DB_user=$VICIuser --DB_pass=$VICIpass --DB_custom_user=$VICIcustomuser --DB_custom_pass=$VICIcustompass --DB_port=$VICIport";
+ if ($debug==1) { print "Install PL String: $installPLstring\n"; }
+
+ if ($havearchive==1) {
+ # We have an archive, so Add that info to the string
+ $installPLstring = $installPLstring . " --FTP_host=$TELarchiveip --FTP_user=$TELarchiveuser --FTP_pass=$TELarchivepass --FTP_port=$TELarchiveport --FTP_dir=$TELarchivedir --HTTP_path=$TELarchiveurl";
+ if ($debug==1) { print "Archive found, adding info: $installPLstring\n"; }
+ }
+
+ if ($DB==1 && $DBS==0) {
+ # We are primary DB, so connect through localhost
+ $installPLstring = $installPLstring . " --DB_server=localhost";
+ if ($debug==1) { print "We are Primary DB, adding info: $installPLstring\n"; }
+
+ } else {
+ # We are not the primary DB, so we use an IP address for database connectivity
+ $installPLstring = $installPLstring . " --DB_server=$VICIDBIP";
+ if ($debug==1) { print "We aren't Primary DB, adding info: $installPLstring\n"; }
+ }
+
+ # Now that our base string is built, all we are adding are the keepalives which depend on how the server's roles were selected
+ if ($DB==1 && $DBS==0) {
+ # We at least get the allcron and database stuff
+ $needdbcron=1;
+ }
+
+ if ($TEL==1) {
+ # We need at least the allcron and telephony stuff
+ $needtelcron=1;
+ }
+
+ # If we have no crons, then use X for keepalives
+ if ($needdbcron==0 && $needtelcron==0) {
+ $installPLstring = $installPLstring . " --active_keepalives=X";
+ if ($debug==1) { print "Not Database or Telephony, no cron, adding info: $installPLstring\n"; }
+
+ } elsif ($needdbcron==1 && $needtelcron==0) {
+ # We are a DB only, adding that info
+ $installPLstring = $installPLstring . " --active_keepalives=579E";
+ if ($debug==1) { print "Database only, adding info: $installPLstring\n"; }
+ system("/bin/cat /usr/share/vicibox/allcron > /tmp/rootcron");
+ system("/bin/cat /usr/share/vicibox/dbcron >> /tmp/rootcron");
+ if ($debug==1) { print "rootcron generated, allcron and dbcron\n"; }
+
+ } elsif ($needdbcron==0 && $needtelcron==1) {
+ # We are a telephony server only, adding that info
+ $installPLstring = $installPLstring . " --active_keepalives=123468S";
+ if ($debug==1) { print "Telephony only, adding info: $installPLstring\n"; }
+ system("/bin/cat /usr/share/vicibox/allcron > /tmp/rootcron");
+ system("/bin/cat /usr/share/vicibox/dialcron >> /tmp/rootcron");
+ if ($debug==1) { print "rootcron generated, allcron and dialcron\n"; }
+
+ } elsif ($needdbcron==1 && $needtelcron==1) {
+ # At this point we must be both, so we set-up for both.
+ $installPLstring = $installPLstring . " --active_keepalives=123456789ES";
+ if ($debug==1) { print "Telephony only, adding info: $installPLstring\n"; }
+ system("/bin/cat /usr/share/vicibox/allcron > /tmp/rootcron");
+ system("/bin/cat /usr/share/vicibox/dbcron >> /tmp/rootcron");
+ system("/bin/cat /usr/share/vicibox/dialcron >> /tmp/rootcron");
+ if ($debug==1) { print "rootcron generated, allcron and dbcron and dialcron\n"; }
+ }
+
+ if ($havearchive==1 && $TEL==1) {
+ # We have an archive and are a telephony server, so we enable that in the crontab
+ system("/usr/bin/sed -i 's/#2,5,8,11/2,5,8,11/' /tmp/rootcron");
+ }
+
+ # Ok, and away we go, installing the actual ViciDial software. Hope it works :)
+ if ($debug==1) { print "Final install.pl string: $installPLstring\n"; }
+ system("cd /usr/src/astguiclient/trunk && /usr/bin/perl install.pl $installPLstring >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ if ($DB==1 && $DBS==0) { system("/usr/bin/crontab /tmp/rootcron"); }
+ if ($WEB==1 || $TEL==1) { system("/usr/bin/crontab /tmp/rootcron"); }
+
+ # Populate the GMT tables and what-not
+ if ($DB==1 && $DBS==0) {
+ if ($extip ne "X") {
+ print "Loading GMT and Phone Codes...\n";
+ $gmtload=system("/usr/share/astguiclient/ADMIN_area_code_populate.pl >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ if ($gmtload!=0) {
+ # Looks like we couldn't obtain the area code lists, use local copies
+ print "GMT and Phone Codes failed to update from internet, using local copies...\n";
+ system("cp /usr/src/astguiclient/conf/phone_codes_GMT-latest-24.txt /usr/share/astguiclient");
+ system("cp /usr/src/astguiclient/conf/GMT_USA_zip-latest.txt /usr/share/astguiclient");
+ system("cp /usr/src/astguiclient/conf/country_ISO_TLD-latest.txt /usr/share/astguiclient");
+ system("/usr/share/astguiclient/ADMIN_area_code_populate.pl --use-local-files >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ }
+ } else {
+ print "Loading GMT and phone codes using local copies...\n";
+ system("cp /usr/src/astguiclient/conf/phone_codes_GMT-latest-24.txt /usr/share/astguiclient");
+ system("cp /usr/src/astguiclient/conf/GMT_USA_zip-latest.txt /usr/share/astguiclient");
+ system("/usr/share/astguiclient/ADMIN_area_code_populate.pl --use-local-copies >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+
+ }
+ }
+
+ # Fix-up for Zoiper
+ if ($WEB==1) {
+ system("/usr/bin/sed -i 's/Version=1,17,0,6802/Version=2,8,0,15810/' /srv/www/htdocs/agc/webphone/zoiperweb.php");
+ }
+
+ # Modify sip.conf for our external IP
+ if ($TEL==1 && $extip ne 'X') {
+ system("/usr/bin/sed -i 's/^;externip.*=.*/externip = $extip/' /etc/asterisk/sip.conf");
+ system("/usr/bin/sed -i 's/^external_media_address.*=.*/external_media_address = $extip/' /etc/asterisk/pjsip.conf");
+ system("/usr/bin/sed -i 's/^external_signaling_address.*=.*/external_signaling_address = $extip/' /etc/asterisk/pjsip.conf");
+ }
+
+ # Populate audio store if we are primary and not in restore mode
+ if ($TEL==1 && $primarydialer==1 && $restore==0) {
+ print "\nSeeding the audio store, this may take a while...\n";
+ system("/usr/bin/perl /usr/share/astguiclient/ADMIN_audio_store_sync.pl --upload >> /var/log/vicibox.log 2>> /var/log/vicibox.log");
+ }
+
+ # Give some helpful output for the uninitiated
+ $randomstring=random_pass(15);
+ print "\n\nPLEASE use secure passwords inside vicidial. It prevents hackers\n";
+ print "and other undesirables from compromising your system and costing\n";
+ print "you thousands in toll fraud and long distance. A secure password\n";
+ print "Contains at least one capital letter and one number. A good example\n";
+ print "of a secure password would be $randomstring.\n\n";
+ print "Don't feed the black market, secure your systems properly!\n\n";
+ print "System should be installed. Please type 'reboot' to cleanly load everything.\n";
+
+}
+
+# Set-up some default variables so we have known values to work with
+$myname=hostname;
+$myname =~ s/\..*$//; # Yes, someone managed to put in srv.dmn.com for the HOSTNAME, so just get the leftmost part before the .
+$myname=~s/[^a-zA-Z0-9_\-]//go; # and sanitize to something sane
+$debug=0; # Gives extra output while cluttering up the screen
+$restore=0; # Whether we a restoring as a server in a cluster
+$expert=0; # Hides some options that require more knowledge then the average sysadmin
+$legacy=0; # prompts for cluster info instead of using auto-configuration table
+$redirect=1; # We want to enable the HTML redirect by default, it's handy
+$phpmyadmin=0; # phpMyAdmin is evil to the uninitiated, so it's installed through the expert mode
+$DB=0;
+$DBS=0;
+$WEB=0;
+$TEL=0;
+$ARC=0;
+$viciboxexpress=0;
+$skipexternalip=0; # Skip the check for an External IP
+$VICIDBIP = "127.0.0.1";
+$VICIdatabase = "asterisk";
+$VICIport = 3306;
+# Detect MySQL/MariaDB socket (openSUSE uses /var/run/mysql/mysql.sock, others may use /run/mysql/mysql.sock)
+$mysql_socket = "";
+foreach my $sock ("/var/run/mysql/mysql.sock", "/run/mysql/mysql.sock", "/var/lib/mysql/mysql.sock", "/tmp/mysql.sock") {
+ if (-S $sock) { $mysql_socket = $sock; last; }
+}
+$VICIuser = "cron";
+$VICIpass = "1234";
+$VICIcustomuser = "custom";
+$VICIcustompass = "custom1234";
+$VICIslaveuser = "slave";
+$VICIslavepass = "slave1234";
+$TELarchiveip = "X";
+$TELarchiveuser = "cronarchive";
+$TELarchivepass = "archive1234";
+$TELarchiveport = "21";
+$TELarchivedir = '';
+$TELarchiveurl = 'http://'; # We fill it in later, but we define it now for consistencys sake
+$astverstring = "1.4.44-vici";
+$asterisk = "1.4";
+$DBmysqlid=0; # 0 is the master, and slaves are numbered up from there
+$primarydialer=1; # By default assume we are the primary dialer until proven otherwise
+$havearchive=0; # We have no archive server until told differently
+$disablefirewall=0;
+$needdbcron=0; # Whether we should install the DB settings
+$needtelcron=0; # Whether we should install the telephony settings
+my $someinput; # Keep this specific to main since it's my little trash variable
+my $myprompt; # Another trash variable used for user input
+
+# Show who we are and that we mean business
+print "\n\nViciBox Installer\n\n";
+
+
+
+# Parse our run-times, cleaned up from matt-matt code so the rest of us can read it
+$args = "";
+if (defined $ARGV[0]) {
+ $i=0;
+ while ($#ARGV >= $i) {
+ $args = "$args $ARGV[$i]";
+ $i++;
+ }
+ if ($args =~ /--help/i) {
+ print "allowed run time options:\n";
+ print " [--restore] = Restore server from a ViciBox DB entry or user-provided input\n";
+ print " [--legacy] = Force legacy mode on, usually auto-detected by the installer\n";
+ print " [--vicibox-express] = Install an all-in-one ViciBox Express server\n";
+ print " [--debug] = debug mode, shows more output, asks a few more questions\n";
+ exit;
+
+ } else {
+ # Check for debug flag
+ if ($args =~ /--debug/i) {
+ $debug=1;
+ print "\n----- DEBUG Enabled -----\n\n";
+ }
+
+ # Check for restore flag
+ if ($args =~ /--restore/i) {
+ $restore=1;
+ print "Restore mode activated\n";
+ }
+
+ # Check for vicibox-express flag
+ if ($args =~ /--vicibox-express/i) {
+ $viciboxexpress=1;
+ print "Vicibox Express mode activated\n";
+ }
+
+ # Check for legacy flag
+ if ($args =~ /--legacy/i) {
+ $legacy=1;
+ print "Legacy mode activated\n";
+ }
+
+ # Don't check for the external IP
+ if ($args =~ /--skipexternal/i) {
+ $skipexternalip=1;
+ $extip='X';
+ debugoutput(" CLI Check External IP : No",0);
+ }
+ }
+}
+
+# Some output for debug
+if ($debug==1) {
+print "Hostname : $myname\n";
+print "Default Database : $VICIdatabase\n";
+print "Default DB User : $VICIuser\n";
+print "Default DB Pass : $VICIpass\n";
+print "Default DB Custom User : $VICIcustomuser\n";
+print "Default DB Custom Pass : $VICIcustompass\n";
+print "Default DB Port : $VICIport\n";
+}
+
+# Get our local IP info
+$localip = &getlocalip;
+if ($localip eq 'X') {
+ print "Local IP address not found! Please enter the IP address to use for ViciDial on this machine\n";
+ print "Local IP Address : ";
+ $localip = trim();
+ if (&checkipv4($localip)==1) {
+ die "Local IP entered is not valid: $localip\n";
+ }
+ } elsif ($debug==1) { print "Local IP Address : $localip\n";
+}
+
+# Get external IP while simultaneously checking for internet connection
+if ($skipexternalip==0) {
+ $extip = &getextip;
+ if ($extip eq 'X' || &checkipv4($extip)==1) {
+ if ($debug==1) { print "No external IP found! Probably not on the internet\n"; };
+ $extip='X';
+ } elsif ($debug==1) {
+ print "External IP Address : $extip\n";
+ }
+
+ } else {
+ debugoutput("External IP Check disabled",0);
+}
+
+# Find the number of CPU cores for later decisions, hyper-threading skews this but ohh well
+$numcpucores = trim(`grep '^processor' /proc/cpuinfo | sort -u | wc -l`);
+if ($debug==1) { print "Number of CPU Cores: $numcpucores\n" };
+
+# Find out how much memory we got
+$ram = (`cat /proc/meminfo | grep "MemTotal" | awk '{print \$2}'`);
+if ($debug==1) { print "System Ram in kBytes: $ram\n" };
+
+# Get the admin.php version even though the SVN version is MUCH more important
+($buildver, $adminver) = &adminphp;
+
+# Grab our local asterisk version and dynamically use that info
+my @astverARY=split(' ', trim(`/usr/sbin/asterisk -V`));
+$astverstring = &trim($astverARY[1]);
+if ( $astverstring =~ m/^1.4/ ) { if ($debug==1) { print "Asterisk v.1.4 found!\n"; } $asterisk='1.4'; }
+if ( $astverstring =~ m/^1.8/ ) { if ($debug==1) { print "Asterisk v.1.8 found!\n"; } $asterisk='1.8'; }
+if ( $astverstring =~ m/^11./ ) { if ($debug==1) { print "Asterisk v.11 found!\n"; } $asterisk='11'; }
+if ( $astverstring =~ m/^13./ ) { if ($debug==1) { print "Asterisk v.13 found!\n"; } $asterisk='13'; }
+if ( $astverstring =~ m/^16./ ) { if ($debug==1) { print "Asterisk v.16 found!\n"; } $asterisk='16'; }
+if ( $astverstring =~ m/^18./ ) { if ($debug==1) { print "Asterisk v.18 found!\n"; } $asterisk='18'; }
+
+# Get the SVN version of our local copy
+@svninfo = `/usr/bin/svn info /usr/src/astguiclient/trunk | grep Revision | sed -e 's/Revision: //'`;
+$localsvn = trim($svninfo[0]);
+if ($debug==1) { print "Local SVN Revision : $localsvn\n"; }
+
+# See if we have external connectivity and get more info
+if ( $extip ne "X") {
+ @svninfo = `/usr/bin/svn info svn://svn.eflo.net:3690/agc_2-X/trunk | grep Revision | sed -e 's/Revision: //'`;
+ $svnhead = trim($svninfo[0]);
+ if ($debug==1) { print "Head SVN Revision : $svnhead\n"; }
+ } else {
+ $svnhead="X";
+ if ($debug==1) { print "Not connected to internet, SVN head unavailable\n"; }
+}
+
+if ($restore==1) {
+ # We are restoring a server from a cluster, so we do that here.
+ print "\nThis will attempt to restore a missing server in a cluster using the\n";
+ print "information found in the primary database or as supplied by the user.\n";
+ print "What this will NOT restore is a database or a ViciBox express install.\n";
+ print "The restore option is primarily designed to allow for a more graceful\n";
+ print "replacement of web servers, telephony servers, and archive servers. It\n";
+ print "is NOT a substitute for having a proper back-up method and emergency\n";
+ print "procedures in place. It is mean't merely as a time-saving tool to use.\n";
+ print "\nThis server should be attached in it's production network environment\n";
+ print "prior to attempting a restore. Otherwise the restore will fail. This means\n";
+ print "that the server has the SAME IP address as it's entry in the vicibox table\n";
+ print "and/or the ViciBox cluster.\n";
+
+ print "\n\nDo you want to continue with the ViciBox restore? [y/N] :";
+ $myprompt = &yesprompt;
+ if ($myprompt==0) { exit; }
+
+ # Prompt for IP address to use if we don't have one
+ if ( $localip eq "X") {
+ print "\nAn internal IP address could not be found on the system.\n";
+ print "Please enter the IP address to use for this server : ";
+ $someinput = trim();
+ if ( &checkipv4($someinput)==1 ) {
+ die "That is not a valid IP address : $someinput\n";
+ } else {
+ $localip = $someinput;
+ }
+
+ } else {
+ print "\nThe Internal IP address found was $localip.\n";
+ print "Do you want to use this IP address for ViciDial? [Y/n] : ";
+ $myprompt = &noprompt;
+ if ($myprompt==1) {
+ print "Please enter the IP address to use for this server : ";
+ $someinput = trim();
+ if ( &checkipv4($someinput)==1 ) {
+ die "That is not a valid IP address : $someinput\n";
+ } else {
+ $localip = $someinput;
+ }
+ }
+ }
+
+
+ print "\nPlease input the master database IP address (127.0.0.1) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIDBIP = $someinput; }
+ if (&checkipv4($VICIDBIP)!=0) {
+ exit 1;
+ }
+ print "Do you want to connect using the default ViciDial DB settings? [Y/n] : ";
+ $myprompt=&noprompt;
+ if ($myprompt==0) {
+ # Try connecting with default user cron and password 1234
+ $dbhVD = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIuser", "$VICIpass") or die "Couldn't connect to ViciDial database: " . DBI->errstr;
+ $dbhVDC = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIcustomuser", "$VICIcustompass") or die "Couldn't connect as custom user to ViciDial database. Check permissions: " . DBI->errstr;
+ if ($debug==1) { print "Database Connectivity checks good\n"; }
+ } else {
+ # Ask what user info to use for the DB and try to connect
+ print "Please enter the database information below\n";
+ print "DB Username ($VICIuser) : ";
+ $someinput = trim();
+ if (length($someinput)>=3) { $VICIuser = $someinput; }
+ print "DB Password ($VICIpass) : ";
+ $someinput = trim();
+ if (length($someinput)>=3) { $VICIpass = $someinput; }
+ print "DB Name ($VICIdatabase) : ";
+ $someinput = trim();
+ if (length($someinput)>=3) { $VICIdatabase = $someinput; }
+ print "DB Custom Username ($VICIcustomuser) : ";
+ $someinput = trim();
+ if (length($someinput)>=3) { $VICIcustomuser = $someinput; }
+ print "DB Custom Password ($VICIcustompass) : ";
+ $someinput = trim();
+ if (length($someinput)>=3) { $VICIcustompass = $someinput; }
+ print "DB Port ($VICIport) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIport = $someinput; }
+ $dbhVD = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIuser", "$VICIpass") or die "Couldn't connect to ViciDial database: " . DBI->errstr;
+ $dbhVDC = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIcustomuser", "$VICIcustompass") or die "Couldn't connect as custom user to ViciDial database. Check permissions: " . DBI->errstr;
+ if ($debug==1) { print "Database Connectivity checks good\n"; }
+ }
+
+ # Now we check to see if we are a vicibox v.4.0+ install so we can suck in settings or enable legacy mode (yay?)
+ $stmtVBOXcheck = "show tables like 'vicibox';";
+ $sthVBOXcheck = $dbhVD->prepare($stmtVBOXcheck) or die "Preparing stmtVBOXcheck: ",$dbhVD->errstr;
+ $sthVBOXcheck->execute or die "Executing sthVBOXcheck: ",$dbhVD->errstr;
+ $sthVBOXcheckrows = $sthVBOXcheck->rows;
+ if ($sthVBOXcheckrows > 0) {
+ if ($debug==1) { print "ViciBox table found\n"; }
+ # We found a vicibox table, so now lets make sure there's good info in it!
+ # If the info doesn't match, then we enable expert mode and all bets are off
+ $stmtVBOXverify = "select field1,field3,field8,field9 from vicibox where server_type='Database' and server_ip IN ('$VICIDBIP', '127.0.0.1') and field1='0';";
+ $sthVBOXverify = $dbhVD->prepare($stmtVBOXverify) or die "Preparing stmtVBOXverify: ",$dbhVD->errstr;
+ $sthVBOXverify->execute or die "Executing sthVBOXverify: ",$dbhVD->errstr;
+ $sthVBOXverifyrows = $sthVBOXverify->rows;
+ if ($sthVBOXverifyrows < 1) {
+ print "Database entry does not match settings supplied! Enabling legacy mode!\n";
+ print "Please verify all data before continuing! Installing on a cluster that\n";
+ print "is already set-up can cause irreparable damage! You have been warned.\n";
+ $legacy=1;
+
+ } else {
+ # Looks like we got results, so load our settings from the primary DB
+ @aryVBOXverify = $sthVBOXverify->fetchrow_array;
+ $DBsvnrev = $aryVBOXverify[1];
+ if ($debug==1) {
+ print "DB SVN rev : $DBsvnrev\n";
+ }
+ }
+ } elsif ($legacy==0) {
+ print "ViciBox table not found, legacy mode enabled!\n";
+ $legacy=1;
+ }
+
+ if ($legacy==0) {
+ # Look up this server's IP from the vicihost tables
+ $stmtVBOXlookup = "select server_type,field1,field2,field3,field4,field5,field6,field7,field8,field9 from vicibox where server_ip='$localip';";
+ $sthVBOXlookup = $dbhVD->prepare($stmtVBOXlookup) or die "Preparing stmtVBOXlookup: ",$dbhVD->errstr;
+ $sthVBOXlookup->execute or die "Executing sthVBOXlookup: ",$dbhVD->errstr;
+ $sthVBOXlookuprows=$sthVBOXlookup->rows;
+ if ($sthVBOXlookuprows>0) {
+ # Found something, suck in the first result and process
+ while (@aryVBOXlookup=$sthVBOXlookup->fetchrow_array()) {
+ $server_type=$aryVBOXlookup[0];
+ $field1=$aryVBOXlookup[1];
+ $field2=$aryVBOXlookup[2];
+ $field4=$aryVBOXlookup[4];
+ $field5=$aryVBOXlookup[5];
+
+ if ($server_type eq 'Database') { die "The restore option cannot be used for databases at this time"; }
+
+ if ($server_type eq 'Web') {
+ $WEB=1;
+ print "Web server entry found\n";
+ print "---> Install Redirect Page? [y/N] : ";
+ $redirect = &yesprompt;
+ # PhpMyAdmin should never be installed haphazardly, so remove from the installer.
+ #print "---> Install phpMyAdmin ? [y/N] : ";
+ #$phpmyadmin = &yesprompt;
+ }
+
+ if ($server_type eq 'Telephony') {
+ $TEL=1;
+ print "Telephony server entry found\n";
+ $primarydialer=0;
+
+ # See if we have an archive server listed and suck in those settings
+ $stmtVBOXtelarc = "select server_ip,field1,field2,field3,field4,field5 from vicibox where server_type='Archive';";
+ $sthVBOXtelarc = $dbhVD->prepare($stmtVBOXtelarc) or die "Preparing stmtVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarc->execute or die "Executing sthVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarcrows = $sthVBOXtelarc->rows;
+ if ($sthVBOXtelarcrows > 0) {
+ # We found an archive server! Suck in those settings too
+ @aryVBOXtelarc = $sthVBOXtelarc->fetchrow_array;
+ $TELarchiveip = $aryVBOXtelarc[0];
+ $TELarchiveuser = $aryVBOXtelarc[1];
+ $TELarchivepass = $aryVBOXtelarc[2];
+ $TELarchiveport = $aryVBOXtelarc[3];
+ $TELarchivedir = $aryVBOXtelarc[4];
+ $TELarchiveurl = $aryVBOXtelarc[5];
+ if ($debug==1) {
+ print "Archive IP : $TELarchiveip\n";
+ print "Archive user : $TELarchiveuser\n";
+ print "Archive pass : $TELarchivepass\n";
+ print "Archive port : $TELarchiveport\n";
+ print "Archive directory : $TELarchivedir\n";
+ print "Archive URL : $TELarchiveurl\n";
+ }
+ $havearchive=1;
+ } else {
+ print "No Archive server found in provisioning table\n";
+ }
+
+ }
+
+ if ($server_type eq 'Archive') {
+ $ARC=1;
+ print "Archive server entry found\n";
+ $TELarchivedir=$field4;
+ $TELarchiveuser=$field1;
+ $TELarchivepass=$field2;
+ $TELarchiveurl=$field5;
+ }
+
+ }
+
+ } else {
+ # Ask our legacy questions
+ die "\n\nA server with IP $localip could not be located in the vicibox table!\nPerhaps the server has the wrong IP, try again.";
+ }
+
+ } else {
+ # ask our legacy question
+ print "\nLegacy mode has been enable with a restore. Extra care must be taken to\n";
+ print "make sure that the server being restored exists. If you are trying to add a\n";
+ print "new server then you should not be using the restore option at all.\n";
+
+ print "\nWill this server be used as a Web server? [y/N] : ";
+ $WEB = &yesprompt;
+
+ # If we are a web server and an expert, we get more questions!
+ if ($WEB==1) {
+ print "---> Install Redirect Page? [y/N] : ";
+ $redirect = &yesprompt;
+ #print "---> Install phpMyAdmin ? [y/N] : ";
+ #$phpmyadmin = &yesprompt;
+ }
+
+ print "\nWill this server be used as a Telephony server? [y/N] : ";
+ $TEL = &yesprompt;
+
+ if ($TEL==1) {
+ # If asterisk 18 or higher, ask for PJSIP
+ if ($asterisk >= 18) {
+ print "---> Enable PJSIP? [Y/n] : ";
+ $PJSIP = &noprompt;
+ }
+ print "---> Do you have an archive server? [y/N] : ";
+ $havearchive = &yesprompt;
+ if ($havearchive==1) {
+ # Ask for user input for archive server
+ print "Archive server IP : ";
+ $TELarchiveip = trim();
+ if ( &checkipv4($TELarchiveip)==1) { die "Not a valid archive IP\n"; }
+ print "Archive FTP User ($TELarchiveuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveuser = $someinput; }
+ print "Archive FTP Password ($TELarchivepass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchivepass = $someinput; }
+ print "Archive FTP Port : ";
+ $TELarchiveport = trim();
+ print "Archive FTP Directory : ";
+ $TELarchivedir = trim();
+ print "Archive URL : ";
+ $TELarchiveurl = trim();
+ }
+ }
+
+ print "\nWill this server be used as an Archive server? [y/N] : ";
+ $ARC = &yesprompt;
+
+ if ($ARC==1) {
+ print "Archive FTP User ($TELarchiveuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveuser = $someinput; }
+ print "Archive FTP Password ($TELarchivepass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchivepass = $someinput; }
+ }
+ }
+
+ print "\nDo you want to disable the built-in firewall? [y/N] : ";
+ $myprompt=&yesprompt;
+ if ($myprompt==1) { $disablefirewall=1; }
+
+
+ # Determine the SVN version assuming that we are in legacy mode
+ if ($legacy==1) {
+ print "\nThe local SVN is build $buildver version $adminver from SVN $localsvn\n";
+ if ( $extip ne "X") {
+ print "Do you want to use the ViciDial version listed above? [Y/n] : ";
+ $uselocalsvn = &yesprompt;
+ if ($uselocalsvn==0) {
+ print "Do you want to use the latest SVN version $svnhead? [Y/n] : ";
+ $usesvnhead = &yesprompt;
+ if ($usesvnhead==0) {
+ print "Please enter the SVN revision to use : ";
+ $usersvnrev = trim();
+ if ($usersvnrev > $svnhead) {
+ die "The is not a valid SVN revision\n";
+ } else {
+ $DBsvnrev = $usersvnrev;
+ }
+ } else {
+ $DBsvnrev = $svnhead;
+ }
+ } else {
+ $DBsvnrev = $localsvn;
+ }
+ } else {
+ print "Internet connectivity was not detected. If the above version of ViciDial\n";
+ print "is not correct then you will need to transfer the correct version to the\n";
+ print "directory /usr/share/astguiclient/trunk. If this is an all-in-one ViciBox\n";
+ print "Express installation then you can disregard this message\n\n";
+ }
+
+ } elsif ($legacy==0 && $DB==0 && $DBsvnrev != $localsvn && $extip eq "X") {
+ print "The SVN revision installed on the database is $DBsvnrev. The local SVN version\n";
+ print "is $localsvn. Unfortunately no internet connection was detected so the install\n";
+ print "can not continue. Please copy the SVN version of ViciDial from the database to\n";
+ print "this machine to complete the installation or connect this machine to the internet.\n";
+ die "Local SVN revision does not match database SVN revision and cannot update to it\n";
+
+ } elsif ($legacy==0 && $DB==0 && $DBsvnrev != $localsvn && $extip ne "X") {
+ if ($debug==1) { print "The database SVN revision is $DBsvnrev. This system will be updated to that revision\n"; }
+
+ } elsif ($DB==1 && $DBS==0 && $extip eq "X") {
+ # We are a database, that is not slave, without internets, we use the local SVN copy
+ if ($debug==1) { print "Internet connectivity not found, using local SVN revision $localsvn.\n"; }
+ $DBsvnrev = $localsvn;
+
+ } elsif ($DB==1 && $DBS==0 && $extip ne "X") {
+ # We are a database, that is not slave, with internets, we use the head SVN copy
+ if ($debug==1) { print "Internet connectivity found, using head SVN revision $svnhead.\n"; }
+ $DBsvnrev = $svnhead;
+
+ } else {
+ # At this point all hell has broken loose, cats and dogs sleeping together, mass hysteria
+ # So we just give generic output and hope for the best
+ if ($debug==1) { print "The database SVN revision is $DBsvnrev. This system will be updated to that revision\n"; }
+ }
+
+ # Summary output
+ print "\n\n--- ViciBox Restore Summary ---\n\n";
+ if ($legacy==1) { print "Legacy : Yes\n"; } else { print "Legacy : No\n"; }
+ if ($WEB==1) { print "Web : Yes\n"; } else { print "Web : No\n"; }
+ if ($WEB==1 && $expert==1) {
+ if ($redirect==1) { print "Redirect : Yes\n"; } else { print "Redirect : No\n"; }
+ #if ($phpmyadmin==1) { print "PMA : Yes\n"; } else { print "PMA : No\n"; }
+ }
+ if ($TEL==1) { print "Telephony: Yes\n"; } else { print "Telephony: No\n"; }
+ if ($TEL==1 && $legacy==1) {
+ if ($havearchive==1) { print "Have Arch: Yes\n"; } else { print "Have Arch: No\n"; }
+ }
+ if ($ARC==1) { print "Archive : Yes\n"; } else { print "Archive : No\n"; }
+ if ($disablefirewall==0) {
+ print "Firewall : Enabled\n";
+ } else {
+ print "Firewall : Disabled\n";
+ }
+
+ print "\n--- Configuration Information ---\n";
+ print "- Database -\n";
+ print "SVN Rev : $DBsvnrev\n";
+ print "IP Addr : $VICIDBIP\n";
+ print "Name : $VICIdatabase\n";
+ print "User : $VICIuser\n";
+ print "Password : $VICIpass\n";
+ print "Cust User: $VICIcustomuser\n";
+ print "Cust Pass: $VICIcustompass\n";
+ print "Port : $VICIport\n";
+
+ if ($TEL==1 && $havearchive==1) {
+ print "\n- Archive -\n";
+ print "IP Addr : $TELarchiveip\n";
+ print "User : $TELarchiveuser\n";
+ print "Password : $TELarchivepass\n";
+ print "Port : $TELarchiveport\n";
+ print "Directory: $TELarchivedir\n";
+ print "URL : $TELarchiveurl\n";
+ }
+
+print "\n\nPlease verify the above information before continuing!\n";
+print "Do you want to continue the restoration? [y/N] : ";
+$myprompt = &yesprompt;
+
+# Now either do the restore, or just exit out
+if ($myprompt==1) { dothedeed; exit; } else { exit; }
+
+}
+
+# Vicibox Express stuff
+if ($viciboxexpress==1) {
+ # Disclaimer and BS goes here
+ print "\nThis will install ViciBox in \"Express\" mode. This will result in a\n";
+ print "single server installation performing all roles of the ViciDial Call\n";
+ print "Center Suite. This is the simplest method of installation and generally\n";
+ print "suitable for use with 20 agents or less. Minimum server specifications\n";
+ print "are Quad-Core CPU, 8GB of ram or more, and two 500-GB SSDs in RAID1. A\n";
+ print "software RAID can be setup by using the MD or MultiDevice install media\n";
+ print "for ViciBox.\n";
+ print "\nTo continue beyond this point will be destructive to the installed system.\n";
+
+ print "\n\nDo you want to continue with the ViciBox Express install? [y/N] :";
+ $myprompt = &yesprompt;
+ if ($myprompt==0) { exit; }
+
+ # Set a bunch of variables and install, most of which are defaults except for server roles
+ $TEL=1;
+ $DB=1;
+ $WEB=1;
+ $PJSIP=1; # Use SIP by default
+ if ($asterisk >= 18) {
+ $PJSIP=0; # Use PJSIP if it's asterisk 18
+ }
+ # If we detect internet connectivity, update from SVN, otherwise use local copy
+ if ($extip ne "X") {
+ $DBsvnrev = $svnhead;
+ } else {
+ $DBsvnrev = $localsvn;
+ }
+ dothedeed;
+
+} else {
+
+# Disclaimer and BS goes here
+print "\nThe installer will ask questions based upon the role that this server is\n";
+print "to provide for the ViciBox Call Center Suite. You should have the database\n";
+print "and optionally archive servers setup prior to installing any other servers.\n";
+print "The installer will not run without there being a configured database! If this\n";
+print "server is to be the database then it must be installed before the archive server\n";
+print "Verify that all servers are connected to the same network and have connectivity\n";
+print "to each other before continuing. This installer will be destructive to the the\n";
+print "server if it is run.\n";
+
+# So we get the nitty gritty out of the way and ask if they want to continue installing
+print "\n\nDo you want to continue with the ViciBox install? [y/N] : ";
+$myprompt = &yesprompt;
+if ($myprompt==0) { exit; }
+
+print "\nDo you want to enable expert installation? [y/N] : ";
+$expert = &yesprompt;
+
+if ($debug==1) {
+print "\nDo you want to enable legacy install support? [y/N] : ";
+$legacy = &yesprompt;
+}
+
+# Prompt for IP address to use if we don't have one
+if ( $localip eq "X") {
+ print "\nAn internal IP address could not be found on the system.\n";
+ print "Please enter the IP address to use for this server : ";
+ $someinput = trim();
+ if ( &checkipv4($someinput)==1 ) {
+ die "That is not a valid IP address : $someinput\n";
+ } else {
+ $localip = $someinput;
+ }
+ } else {
+ print "\nThe Internal IP address found was $localip.\n";
+ print "Do you want to use this IP address for ViciDial? [Y/n] : ";
+ $myprompt = &noprompt;
+ if ($myprompt==1) {
+ print "Please enter the IP address to use for this server : ";
+ $someinput = trim();
+ if ( &checkipv4($someinput)==1 ) {
+ die "That is not a valid IP address : $someinput\n";
+ } else {
+ $localip = $someinput;
+ }
+ }
+}
+
+
+print "\nWill this server be used as the Database? [y/N] : ";
+$DB = &yesprompt;
+
+# If we are an expert and a database, see if we are a slave server
+if ($DB==1 && $expert==1) {
+ print "---> Will this be a Slave Databse? [y/N] : ";
+ $DBS = &yesprompt;
+}
+
+
+# Get the DB info and set-up our mysql connections for further fun
+# This is all the DB related things to do when we are NOT the primary database
+if ($DB==0 || ($DB==1 && $DBS==1)) {
+ print "\nPlease input the master database IP address ($localip) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIDBIP = $someinput; } else { $VICIDBIP=$localip; }
+ if (&checkipv4($VICIDBIP)!=0) {
+ die "Not a valid database IP\n";
+ }
+ print "Do you want to connect using the default ViciDial DB settings? [Y/n] : ";
+ $myprompt=&noprompt;
+ if ($myprompt==0) {
+ # Try connecting with default user cron and password 1234
+ $dbhVD = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIuser", "$VICIpass") or die "Couldn't connect to ViciDial database: " . DBI->errstr;
+ $dbhVDC = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIcustomuser", "$VICIcustompass") or die "Couldn't connect as custom user to ViciDial database. Check permissions: " . DBI->errstr;
+ if ($debug==1) { print "Database Connectivity checks good\n"; }
+ } else {
+ # Ask what user info to use for the DB and try to connect
+ print "Please enter the database information below\n";
+ print "DB Username ($VICIuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIuser = $someinput; }
+ print "DB Password ($VICIpass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIpass = $someinput; }
+ print "DB Name ($VICIdatabase) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIdatabase = $someinput; }
+ print "DB Custom Username ($VICIcustomuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIcustomuser = $someinput; }
+ print "DB Custom Password ($VICIcustompass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIcustompass = $someinput; }
+ print "DB Port ($VICIport) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIport = $someinput; }
+ $dbhVD = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIuser", "$VICIpass") or die "Couldn't connect to ViciDial database: " . DBI->errstr;
+ $dbhVDC = DBI->connect("DBI:mysql:$VICIdatabase:$VICIDBIP:$VICIport", "$VICIcustomuser", "$VICIcustompass") or die "Couldn't connect as custom user to ViciDial database. Check permissions: " . DBI->errstr;
+ if ($debug==1) { print "Database Connectivity checks good\n"; }
+ }
+
+ # Now we check to see if we are a vicibox v.4.0+ install so we can suck in settings or enable legacy mode (yay?)
+ $stmtVBOXcheck = "show tables like 'vicibox';";
+ $sthVBOXcheck = $dbhVD->prepare($stmtVBOXcheck) or die "Preparing stmtVBOXcheck: ",$dbhVD->errstr;
+ $sthVBOXcheck->execute or die "Executing sthVBOXcheck: ",$dbhVD->errstr;
+ $sthVBOXcheckrows = $sthVBOXcheck->rows;
+ if ($sthVBOXcheckrows > 0) {
+ if ($debug==1) { print "ViciBox table found\n"; }
+ # We found a vicibox table, so now lets make sure there's good info in it!
+ # If the info doesn't match, then we enable expert mode and all bets are off
+ $stmtVBOXverify = "select field1,field3,field8,field9 from vicibox where server_type='Database' and server_ip IN ('$VICIDBIP', '127.0.0.1') and field1='0';";
+ $sthVBOXverify = $dbhVD->prepare($stmtVBOXverify) or die "Preparing stmtVBOXverify: ",$dbhVD->errstr;
+ $sthVBOXverify->execute or die "Executing sthVBOXverify: ",$dbhVD->errstr;
+ $sthVBOXverifyrows = $sthVBOXverify->rows;
+ if ($sthVBOXverifyrows < 1) {
+ print "Database entry does not match settings supplied! Enabling legacy mode!\n";
+ print "Please verify all data before continuing! Installing on a cluster that\n";
+ print "is already set-up can cause irreparable damage! You have been warned.\n";
+ $legacy=1;
+
+ } else {
+ # Looks like we got results, so load our settings from the primary DB
+ @aryVBOXverify = $sthVBOXverify->fetchrow_array;
+ $DBmysqlid = $aryVBOXverify[0];
+ $DBsvnrev = $aryVBOXverify[1];
+ $VICIslaveuser = $aryVBOXverify[2];
+ $VICIslavepass = $aryVBOXverify[3];
+ if ($debug==1) {
+ print "DB SVN rev : $DBsvnrev\n";
+ print "DB Slave user : $VICIslaveuser\n";
+ print "DB Slave pass : $VICIslavepass\n";
+ }
+ if ($legacy==1) {
+ print "ViciBox v.4.0+ cluster info found! Recommend disabling legacy mode.\n";
+ print "If you do not have a strong reason for enabling legacy mode, disable it.\n";
+ print "Would you like to disable legacy mode? [Y/n] : ";
+ $menuprompt = &noprompt;
+ if ($menuprompt==0) { $legacy=0; }
+ }
+ }
+ } elsif ($legacy==0) {
+ print "ViciBox table not found, legacy mode enabled!\n";
+ $legacy=1;
+ }
+
+ # Since we are a slave, and we are working with a legacy vicibox cluster, we need more options
+ if ($DBS==1 && $legacy==1) {
+ print "Please enter the MySQL Slave ID to use : ";
+ $DBmysqlid = trim();
+ if ($DBmysqlid<2 or $DBmysqlid>10) {
+ print "\n\nPlease enter a valid slave id that is 2 through 10.\n";
+ exit;
+ }
+ print "Please make sure that the 'replication' priviledge is granted to\n";
+ print "the DB user before continuing. If not then the replication will fail.\n";
+ } elsif ($DBS==1) {
+ # We are a slave, but we have vicibox info, so figure out what server ID to use
+ $stmtVBOXmysqlid = "select field1 from vicibox where server_type='Database' order by field1 desc limit 1;";
+ $sthVBOXmysqlid = $dbhVD->prepare($stmtVBOXmysqlid) or die "Preparing stmtVBOXmysqlid: ",$dbhVD->errstr;
+ $sthVBOXmysqlid->execute or die "Executing sthVBOXmysqlid: ",$dbhVD->errstr;
+ $sthVBOXmysqlidrows = $sthVBOXmysqlid->rows;
+ if ($sthVBOXmysqlidrows > 0) {
+ # We have records, so get it and set our ID
+ @aryVBOXmysqlid = $sthVBOXmysqlid->fetchrow_array;
+ $oldvalue = $aryVBOXmysqlid[0];
+ if ($debug==1) { print "MySQL old ID : $oldvalue\n"; }
+ if ($oldvalue==0) { $DBmysqlid = $oldvalue+2; } else { $DBmysqlid = $oldvalue+1; } #
+ if ($debug==1) { print "MySQL ID : $DBmysqlid\n"; }
+ }
+ }
+ } elsif ($DB==1 && $DBS==0) {
+ # Since we are a primary DB, use the user-selected IP for the DB IP
+ $VICIDBIP=$localip;
+ # Since we are a primary DB, see if we want to use the default ViciDial DB credentials
+ print "Do you want to use the default ViciDial DB settings? [Y/n] : ";
+ $myprompt=&noprompt;
+ if ($myprompt==1) {
+ print "Please enter the database information below\n";
+ print "DB Username ($VICIuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIuser = $someinput; }
+ print "DB Password ($VICIpass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIpass = $someinput; }
+ print "DB Name ($VICIdatabase) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIdatabase = $someinput; }
+ print "DB Custom Username ($VICIcustomuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIcustomuser = $someinput; }
+ print "DB Custom Password ($VICIcustompass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIcustompass = $someinput; }
+ print "DB Port ($VICIport) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIport = $someinput; }
+ print "DB Slave User ($VICIslaveuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIslaveuser = $someinput; }
+ print "DB Slave Pass ($VICIslavepass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $VICIslavepass = $someinput; }
+ }
+}
+
+print "\nWill this server be used as a Web server? [y/N] : ";
+$WEB = &yesprompt;
+
+# If we are a web server and an expert, we get more questions!
+if ($WEB==1 && $expert==1) {
+ print "---> Install Redirect Page? [y/N] : ";
+ $redirect = &yesprompt;
+ #print "---> Install phpMyAdmin ? [y/N] : ";
+ #$phpmyadmin = &yesprompt;
+}
+
+print "\nWill this server be used as a Telephony server? [y/N] : ";
+$TEL = &yesprompt;
+
+if ($TEL==1 and $asterisk >= 18) {
+ print "---> Enable PJSIP? [Y/n] : ";
+ $PJSIP = &noprompt;
+}
+
+# If we are legacy and telephony then ask more questions
+if ($TEL==1 && $legacy==1 && $DB==0) {
+ print "---> Is this the first server in a cluster? [y/N] : ";
+ $primarydialer = &yesprompt;
+ print "---> Do you have an archive server? [y/N] : ";
+ $havearchive = &yesprompt;
+ if ($havearchive==1) {
+ # Ask for user input for archive server
+ print "Archive server IP : ";
+ $TELarchiveip = trim();
+ if ( &checkipv4($TELarchiveip)==1) { die "Not a valid archive IP\n"; }
+ print "Archive FTP User : ";
+ $TELarchiveuser = trim();
+ print "Archive FTP Password : ";
+ $TELarchivepass = trim();
+ print "Archive FTP Port : ";
+ $TELarchiveport = trim();
+ print "Archive FTP Directory : ";
+ $TELarchivedir = trim();
+ print "Archive URL : ";
+ $TELarchiveurl = trim();
+ }
+
+ } elsif ($TEL==1 && $legacy==0 && $DB==0) {
+ # We are a telephony server, and not in legacy mode, so we suck in our settings from vicibox
+ $stmtVBOXtelct = "select server from vicibox where server_type='Telephony';";
+ $sthVBOXtelct = $dbhVD->prepare($stmtVBOXtelct) or die "Preparing stmtVBOXtelct: ",$dbhVD->errstr;
+ $sthVBOXtelct->execute or die "Executing sthVBOXtelct: ",$dbhVD->errstr;
+ $sthVBOXtelctrows = $sthVBOXtelct->rows;
+ if ($sthVBOXtelctrows > 0 ) {
+ $primarydialer=0;
+ if ($debug==1) { print "We are not the first dialer, there are $sthVBOXtelctrows others\n"; }
+ } else {
+ if ($debug==1) { print "We are the first dialer\n"; }
+ }
+
+ # See if we have an archive server listed and suck in those settings
+ $stmtVBOXtelarc = "select server_ip,field1,field2,field3,field4,field5 from vicibox where server_type='Archive';";
+ $sthVBOXtelarc = $dbhVD->prepare($stmtVBOXtelarc) or die "Preparing stmtVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarc->execute or die "Executing sthVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarcrows = $sthVBOXtelarc->rows;
+ if ($sthVBOXtelarcrows > 0) {
+ # We found an archive server! Suck in those settings too
+ @aryVBOXtelarc = $sthVBOXtelarc->fetchrow_array;
+ $TELarchiveip = $aryVBOXtelarc[0];
+ $TELarchiveuser = $aryVBOXtelarc[1];
+ $TELarchivepass = $aryVBOXtelarc[2];
+ $TELarchiveport = $aryVBOXtelarc[3];
+ $TELarchivedir = $aryVBOXtelarc[4];
+ $TELarchiveurl = $aryVBOXtelarc[5];
+ if ($debug==1) {
+ print "Archive IP : $TELarchiveip\n";
+ print "Archive user : $TELarchiveuser\n";
+ print "Archive pass : $TELarchivepass\n";
+ print "Archive port : $TELarchiveport\n";
+ print "Archive directory : $TELarchivedir\n";
+ print "Archive URL : $TELarchiveurl\n";
+ }
+ $havearchive=1;
+ } else {
+ print "No Archive server found in provisioning table\n";
+ }
+}
+
+print "\nWill this server be used as an Archive server? [y/N] : ";
+$ARC = &yesprompt;
+
+# And now we do some archive server set-up
+if ($ARC==1) {
+ if ($havearchive==1) { die "Archive server already found! Can't set-up two.\n"; }
+ # Some defaults generated from the above messes
+ $TELarchiveurl = "http://" . $localip . "/archive/";
+ $TELarchiveip = $localip;
+
+ if ($legacy==0 && $DB==0) {
+ # Check to see if we already have an archive server defined in non-legacy mode and we aren't the DB
+ $stmtVBOXtelarc = "select server_ip,field1,field2,field3,field4,field5 from vicibox where server_type='Archive';";
+ $sthVBOXtelarc = $dbhVD->prepare($stmtVBOXtelarc) or die "Preparing stmtVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarc->execute or die "Executing sthVBOXtelarc: ",$dbhVD->errstr;
+ $sthVBOXtelarcrows = $sthVBOXtelarc->rows;
+ if ($sthVBOXtelarcrows > 0) { die "Archive server found! Can't set-up two.\n"; }
+ }
+
+ if ($legacy==1 || $expert==1) {
+ # Ask for user input for archive server
+ print "Archive server IP ($TELarchiveip) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveip = $someinput; }
+ if ( &checkipv4($TELarchiveip)==1) { die "Not a valid archive IP\n"; }
+ print "Archive FTP User ($TELarchiveuser) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveuser = $someinput; }
+ print "Archive FTP Password ($TELarchivepass) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchivepass = $someinput; }
+ print "Archive FTP Port ($TELarchiveport) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveport = $someinput; }
+ print "Archive FTP Directory ($TELarchivedir) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchivedir = $someinput; }
+ print "Archive URL ($TELarchiveurl) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveurl = $someinput; }
+
+ } else {
+ # We will use defaults, but verify that the internal vicidial IP and external URL are correct
+ print "Archive server IP ($TELarchiveip) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveip = $someinput; }
+ if ( &checkipv4($TELarchiveip)==1) { die "Not a valid archive IP\n"; }
+ print "Archive URL ($TELarchiveurl) : ";
+ $someinput = trim();
+ if (length($someinput)>3) { $TELarchiveurl = $someinput; }
+ }
+}
+
+
+# Determine the SVN version assuming that we are in legacy mode
+if ($legacy==1) {
+ print "\nThe local SVN is build $buildver version $adminver from SVN $localsvn\n";
+ if ( $extip ne "X") {
+ print "Do you want to use the ViciDial version listed above? [Y/n] : ";
+ $uselocalsvn = &yesprompt;
+ if ($uselocalsvn==0) {
+ print "Do you want to use the latest SVN version $svnhead? [Y/n] : ";
+ $usesvnhead = &yesprompt;
+ if ($usesvnhead==0) {
+ print "Please enter the SVN revision to use : ";
+ $usersvnrev = trim();
+ if ($usersvnrev > $svnhead) {
+ die "The is not a valid SVN revision\n";
+ } else {
+ $DBsvnrev = $usersvnrev;
+ }
+ } else {
+ $DBsvnrev = $svnhead;
+ }
+ } else {
+ $DBsvnrev = $localsvn;
+ }
+ } else {
+ print "Internet connectivity was not detected. If the above version of ViciDial\n";
+ print "is not correct then you will need to transfer the correct version to the\n";
+ print "directory /usr/share/astguiclient/trunk. If this is an all-in-one ViciBox\n";
+ print "Express installation then you can disregard this message\n\n";
+ }
+
+ } elsif ($legacy==0 && $DB==0 && $DBsvnrev != $localsvn && $extip eq "X") {
+ print "The SVN revision installed on the database is $DBsvnrev. The local SVN version\n";
+ print "is $localsvn. Unfortunately no internet connection was detected so the install\n";
+ print "can not continue. Please copy the SVN version of ViciDial from the database to\n";
+ print "this machine to complete the installation or connect this machine to the internet.\n";
+ die "Local SVN revision does not match database SVN revision and cannot update to it\n";
+
+ } elsif ($legacy==0 && $DB==0 && $DBsvnrev != $localsvn && $extip ne "X") {
+ if ($debug==1) { print "The database SVN revision is $DBsvnrev. This system will be updated to that revision\n"; }
+
+ } elsif ($DB==1 && $DBS==0 && $extip eq "X") {
+ # We are a database, that is not slave, without internets, we use the local SVN copy
+ if ($debug==1) { print "Internet connectivity not found, using local SVN revision $localsvn.\n"; }
+ $DBsvnrev = $localsvn;
+
+ } elsif ($DB==1 && $DBS==0 && $extip ne "X") {
+ # We are a database, that is not slave, with internets, we use the head SVN copy
+ if ($debug==1) { print "Internet connectivity found, using head SVN revision $svnhead.\n"; }
+ $DBsvnrev = $svnhead;
+
+ } else {
+ # At this point all hell has broken loose, cats and dogs sleeping together, mass hysteria
+ # So we just give generic output and hope for the best
+ if ($debug==1) { print "The database SVN revision is $DBsvnrev. This system will be updated to that revision\n"; }
+}
+
+# Sanity check
+if ($TEL==0 && $DB==0 && $WEB==0 && $ARC==0) { die "Did not select any server roles, exiting.\n"; }
+
+# See if we want to disable the firewall or not
+if ($DB==1 && $TEL==0 && $WEB==0 && $ARC==0) {
+ # Since we seem to be a dedicated DB, we shouldn't need firewall, default to disabled
+ $disablefirewall=1;
+ print "\nDo you want to enable the built-in firewall? [y/N] : ";
+ $myprompt=&yesprompt;
+ if ($myprompt==1) { $disablefirewall=0; }
+ } else {
+ # Since we aren't dedicated, we are probably on the real internet, so default to enabled
+ print "\nDo you want to disable the built-in firewall? [y/N] : ";
+ $myprompt=&yesprompt;
+ if ($myprompt==1) { $disablefirewall=1; }
+}
+
+# Summary output
+print "\n\n--- ViciBox Install Summary ---\n\n";
+if ($expert==1) { print "Expert : Yes\n"; } else { print "Expert : No\n"; }
+if ($legacy==1) { print "Legacy : Yes\n"; } else { print "Legacy : No\n"; }
+if ($DB==1) { print "Database : Yes\n"; } else { print "Database : No\n"; }
+if ($DBS==1) { print "Slave ID : $DBmysqlid\n"; }
+if ($WEB==1) { print "Web : Yes\n"; } else { print "Web : No\n"; }
+if ($WEB==1 && $expert==1) {
+if ($redirect==1) { print "Redirect : Yes\n"; } else { print "Redirect : No\n"; }
+#if ($phpmyadmin==1) { print "PMA : Yes\n"; } else { print "PMA : No\n"; }
+}
+if ($TEL==1) { print "Telephony: Yes\n"; } else { print "Telephony: No\n"; }
+if ($TEL==1 && $legacy==1) {
+ if ($primarydialer==1) { print "First Srv: Yes\n"; } else { print "First Srv: No\n"; }
+ if ($havearchive==1) { print "Have Arch: Yes\n"; } else { print "Have Arch: No\n"; }
+}
+if ($ARC==1) { print "Archive : Yes\n"; } else { print "Archive : No\n"; }
+if ($disablefirewall==0) {
+ print "Firewall : Enabled\n";
+ } else {
+ print "Firewall : Disabled\n";
+}
+
+print "\n--- Configuration Information ---\n";
+print "- Database -\n";
+print "SVN Rev : $DBsvnrev\n";
+print "IP Addr : $VICIDBIP\n";
+print "Name : $VICIdatabase\n";
+print "User : $VICIuser\n";
+print "Password : $VICIpass\n";
+print "Cust User: $VICIcustomuser\n";
+print "Cust Pass: $VICIcustompass\n";
+if ($DBS==1) {
+ print "Slave Usr: $VICIslaveuser\n";
+ print "Slave Pw : $VICIslavepass\n";
+
+}
+print "Port : $VICIport\n";
+
+if ($TEL==1 && $havearchive==1) {
+print "\n- Archive -\n";
+print "IP Addr : $TELarchiveip\n";
+print "User : $TELarchiveuser\n";
+print "Password : $TELarchivepass\n";
+print "Port : $TELarchiveport\n";
+print "Directory: $TELarchivedir\n";
+print "URL : $TELarchiveurl\n";
+}
+
+print "\n\nPlease verify the above information before continuing!\n";
+print "Do you want to continue the installation? [y/N] : ";
+$myprompt = &yesprompt;
+
+if ($myprompt==1) { dothedeed; }
+
+}
diff --git a/Custom/backvicibox/restore.sh b/Custom/backvicibox/restore.sh
new file mode 100644
index 0000000..9bd2522
--- /dev/null
+++ b/Custom/backvicibox/restore.sh
@@ -0,0 +1,125 @@
+#!/bin/bash
+#
+# Script de restauración de Vicibox para servidor destino
+# Uso: ./restore.sh
+#
+
+set -e
+
+# Colores para output
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m'
+
+info() {
+ echo -e "${GREEN}[INFO]${NC} $1"
+}
+
+warn() {
+ echo -e "${YELLOW}[WARN]${NC} $1"
+}
+
+error() {
+ echo -e "${RED}[ERROR]${NC} $1"
+}
+
+# Verificar que se ejecuta como root
+if [ "$EUID" -ne 0 ]; then
+ error "Este script debe ejecutarse como root"
+ exit 1
+fi
+
+# Verificar que existen los archivos
+if [ ! -f "vicibox-scripts.tar.gz" ]; then
+ error "No se encuentra vicibox-scripts.tar.gz"
+ exit 1
+fi
+
+if [ ! -f "astguiclient-trunk.tar.gz" ]; then
+ error "No se encuentra astguiclient-trunk.tar.gz"
+ exit 1
+fi
+
+info "=========================================="
+info "Restauración de Vicibox"
+info "=========================================="
+echo ""
+
+# 1. Restaurar scripts de Vicibox
+info "1. Restaurando scripts de Vicibox..."
+mkdir -p /usr/share
+if tar -xzf vicibox-scripts.tar.gz -C /usr/share/ 2>/dev/null; then
+ chmod +x /usr/share/vicibox/*.sh 2>/dev/null
+ chmod +x /usr/share/vicibox/*.pl 2>/dev/null
+ chmod +x /usr/share/vicibox/vicibox-* 2>/dev/null
+ info " ✓ Scripts restaurados"
+else
+ error " ✗ Error al restaurar scripts"
+ exit 1
+fi
+echo ""
+
+# 2. Crear enlaces simbólicos
+info "2. Creando enlaces simbólicos..."
+mkdir -p /usr/local/bin
+ln -sf /usr/share/vicibox/vicibox-install.pl /usr/local/bin/vicibox-install 2>/dev/null
+ln -sf /usr/share/vicibox/vicibox-express /usr/local/bin/vicibox-express 2>/dev/null
+ln -sf /usr/share/vicibox/vicibox-externip /usr/local/bin/vicibox-externip 2>/dev/null
+ln -sf /usr/share/vicibox/vicibox-timezone /usr/local/bin/vicibox-timezone 2>/dev/null
+ln -sf /usr/share/vicibox/vicibox-mdraid1 /usr/local/bin/vicibox-mdraid1 2>/dev/null
+info " ✓ Enlaces simbólicos creados"
+echo ""
+
+# 3. Restaurar código fuente
+info "3. Restaurando código fuente de ViciDial..."
+mkdir -p /usr/src
+if tar -xzf astguiclient-trunk.tar.gz -C /usr/src/ 2>/dev/null; then
+ chmod +x /usr/src/astguiclient/trunk/install.pl 2>/dev/null
+ chmod +x /usr/src/astguiclient/trunk/bin/* 2>/dev/null || true
+ chmod +x /usr/src/astguiclient/trunk/extras/*.sh 2>/dev/null || true
+ info " ✓ Código fuente restaurado"
+else
+ error " ✗ Error al restaurar código fuente"
+ exit 1
+fi
+echo ""
+
+# 4. Verificación
+info "4. Verificando instalación..."
+ERRORS=0
+
+if [ ! -f "/usr/share/vicibox/vicibox-install.pl" ]; then
+ error " ✗ No se encuentra vicibox-install.pl"
+ ERRORS=$((ERRORS+1))
+fi
+
+if [ ! -f "/usr/src/astguiclient/trunk/install.pl" ]; then
+ error " ✗ No se encuentra install.pl de ViciDial"
+ ERRORS=$((ERRORS+1))
+fi
+
+if [ ! -f "/usr/src/astguiclient/trunk/extras/MySQL_AST_CREATE_tables.sql" ]; then
+ error " ✗ No se encuentra MySQL_AST_CREATE_tables.sql"
+ ERRORS=$((ERRORS+1))
+fi
+
+if [ $ERRORS -eq 0 ]; then
+ info " ✓ Verificación completada sin errores"
+else
+ warn " ⚠ Se encontraron $ERRORS errores en la verificación"
+fi
+echo ""
+
+info "=========================================="
+info "Restauración completada!"
+info "=========================================="
+echo ""
+info "Ahora puedes ejecutar la instalación:"
+echo ""
+echo " Para instalación Express (todo-en-uno):"
+echo " vicibox-install --vicibox-express"
+echo ""
+echo " Para instalación personalizada:"
+echo " vicibox-install"
+echo ""
diff --git a/Custom/backvicibox/version-info.txt b/Custom/backvicibox/version-info.txt
new file mode 100644
index 0000000..0564efa
--- /dev/null
+++ b/Custom/backvicibox/version-info.txt
@@ -0,0 +1,21 @@
+=== Información de Versión ===
+Fecha de backup: Fri Feb 6 04:46:49 PM UTC 2026
+
+--- Versión de Vicibox ---
+- ViciBox v.12.0.2 240121
+* MariaDB 10.11 deprecated the old TIMESTAMP behavior
+* ssh service was defined twice in the external.xml zonefile.
+- ViciBox v.12.0.1 250118
+* firewalld (the firewall) was not enabled by default. This is a policy issue and not a bug.
+* Added version into to /etc/issue and Grub. So now it'll say v.12.0.1 instead of v.12.0
+* vicibox-mdraid1 bug see https://docs.vicibox.com/en/latest/bugfix/bugfix1200-1.html
+- ViciBox v.12.0.0-Beta 250116
+
+--- Versión de ViciDial ---
+2.14b0.5
+
+--- Información del Sistema ---
+Linux vicibox12 6.4.0-150600.23.73-default #1 SMP PREEMPT_DYNAMIC Tue Oct 7 08:43:02 UTC 2025 (46f6a23) x86_64 x86_64 x86_64 GNU/Linux
+
+--- Versión de Asterisk ---
+Asterisk 18.26.4-vici
diff --git a/Custom/backvicibox/vicibox-scripts.tar.gz b/Custom/backvicibox/vicibox-scripts.tar.gz
new file mode 100644
index 0000000..854c83e
Binary files /dev/null and b/Custom/backvicibox/vicibox-scripts.tar.gz differ
diff --git a/Custom/installer/custom.css b/Custom/installer/custom.css
index e8b4b9f..48a4022 100644
--- a/Custom/installer/custom.css
+++ b/Custom/installer/custom.css
@@ -1206,7 +1206,7 @@ body:has(table[bgcolor="white"][cellpadding="0"] td[width="170"][bgcolor="#015B9
display: block;
margin-left: auto;
margin-right: auto;
- max-width: 100%;
+ max-width: 70%;
height: auto;
}
@@ -10336,6 +10336,144 @@ body:has(form#vsn) form#vsn textarea#call_notes {
resize: vertical !important;
}
+/* ========== Solo #SearcHForMDisplaYBox (Search for a lead) - estilos únicos para este componente ========== */
+#SearcHForMDisplaYBox {
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px) !important;
+ z-index: 73 !important;
+}
+#SearcHForMDisplaYBox > table {
+ width: auto !important;
+ max-width: 520px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#SearcHForMDisplaYBox > table > tbody > tr > td {
+ padding: 16px 20px !important;
+ text-align: left !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#SearcHForMDisplaYBox .sd_text,
+#SearcHForMDisplaYBox font.sd_text {
+ font-family: var(--font-family) !important;
+ font-size: 15px !important;
+ font-weight: 700 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ display: block !important;
+ margin-bottom: 8px !important;
+}
+#SearcHForMDisplaYBox .sh_text,
+#SearcHForMDisplaYBox font.sh_text {
+ font-family: var(--font-family) !important;
+ font-size: 12px !important;
+ line-height: 1.4 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeaDSearcHVieWClose"] {
+ display: inline-block !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ color: var(--color-text-dark, #333) !important;
+ font-size: 12px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeaDSearcHVieWClose"]:hover {
+ background: rgba(0, 0, 0, 0.1) !important;
+}
+#SearcHForMDisplaYBox table table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ margin: 10px 0 !important;
+}
+#SearcHForMDisplaYBox table table tr {
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td {
+ padding: 6px 0 !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td[align="right"] {
+ padding-right: 12px !important;
+ width: 1% !important;
+ white-space: nowrap !important;
+ font-weight: 500 !important;
+ font-size: 12px !important;
+}
+#SearcHForMDisplaYBox table table input[type="text"] {
+ width: 100% !important;
+ max-width: 220px !important;
+ box-sizing: border-box !important;
+ padding: 6px 10px !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+ border-radius: 6px !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+}
+#SearcHForMDisplaYBox table table input[type="text"]:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 2px rgba(0, 139, 139, 0.2) !important;
+}
+#SearcHForMDisplaYBox table table input[type="checkbox"] {
+ width: auto !important;
+ margin-right: 6px !important;
+ vertical-align: middle !important;
+}
+#SearcHForMDisplaYBox table table td[align="center"][colspan="2"] {
+ padding-top: 16px !important;
+ padding-bottom: 0 !important;
+ text-align: center !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchSubmit"] {
+ display: inline-block !important;
+ padding: 8px 18px !important;
+ border-radius: 6px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease, transform 0.1s ease !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchSubmit"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+ transform: translateY(-1px) !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchReset"] {
+ display: inline-block !important;
+ padding: 6px 12px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 0, 0, 0.06) !important;
+ color: var(--color-text-dark, #333) !important;
+ font-size: 12px !important;
+ text-decoration: none !important;
+ margin-left: 8px !important;
+}
+#SearcHForMDisplaYBox a[onclick*="LeadSearchReset"]:hover {
+ background: rgba(0, 0, 0, 0.1) !important;
+}
+
/* ========== SearcHResultSDisplaYBox (Search Results) - bloque nuevo ========== */
#SearcHResultSDisplaYBox {
display: flex !important;
@@ -10428,4 +10566,1788 @@ body:has(form#vsn) form#vsn textarea#call_notes {
#SearcHResultSDisplaYBox .scroll_calllog a[href="#"][onclick*="hideDiv"]:hover {
background: var(--color-primary-dark, #2E7D7D) !important;
}
+/* Refinamientos solo #SearcHResultSDisplaYBox: caja más compacta y visibilidad */
+
+#SearcHResultSDisplaYBox > table {
+ max-width: 380px !important;
+}
+#SearcHResultSDisplaYBox #SearcHResultSSpan,
+#SearcHResultSDisplaYBox .scroll_calllog {
+ max-height: 55vh !important;
+ -webkit-overflow-scrolling: touch !important;
+}
+
+/* ========== Solo #AgentTimeDisplayBox (Agent Time Report) - estilos exclusivos ========== */
+body:has(#AgentTimeDisplayBox[style*="visibility: visible"]) {
+ overflow: hidden !important;
+}
+#AgentTimeDisplayBox {
+ position: fixed !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ background: rgba(0, 0, 0, 0.45) !important;
+ backdrop-filter: blur(4px) !important;
+ z-index: 70 !important;
+}
+#AgentTimeDisplayBox > table {
+ width: auto !important;
+ max-width: 520px !important;
+ max-height: 85vh !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 12px !important;
+ background: var(--color-bg-white, #fff) !important;
+ border: none !important;
+ border-radius: var(--vdc-radius, 8px) !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#AgentTimeDisplayBox > table > tbody > tr > td {
+ padding: 16px 20px !important;
+ text-align: center !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan,
+#AgentTimeDisplayBox .scroll_calllog {
+ display: block !important;
+ max-height: 55vh !important;
+ overflow-y: auto !important;
+ padding: 12px 0 !important;
+ margin: 0 !important;
+ font-family: var(--font-family) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: var(--color-text-dark, #2D2D2D) !important;
+ -webkit-overflow-scrolling: touch !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan b,
+#AgentTimeDisplayBox .scroll_calllog b {
+ font-weight: 700 !important;
+ color: var(--color-primary-dark, #2E7D7D) !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan a[onclick*="AgentTimeReport"],
+#AgentTimeDisplayBox .scroll_calllog a[onclick*="AgentTimeReport"] {
+ display: inline-block !important;
+ padding: 8px 18px !important;
+ margin-top: 12px !important;
+ border-radius: 6px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 13px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#AgentTimeDisplayBox #AgentTimeDisplaySpan a[onclick*="AgentTimeReport"]:hover,
+#AgentTimeDisplayBox .scroll_calllog a[onclick*="AgentTimeReport"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+
+#AgentTimeSpan {
+ margin-top: -30px;
+ margin-left: 100px;
+
+}
+
+/* ========== Solo #VolumeControlSpan (controles de volumen) - estilos exclusivos ========== */
+/* Fuente Font Awesome 6 Solid solo para estos iconos (volume-up/down) */
+@font-face {
+ font-family: "Font Awesome 6 Free VDC";
+ font-style: normal;
+ font-weight: 900;
+ font-display: block;
+ src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/webfonts/fa-solid-900.woff2") format("woff2");
+}
+#VolumeControlSpan {
+
+ position: absolute !important;
+ left: 10px !important;
+ top: 848px !important;
+ z-index: 14 !important;
+ display: inline-flex !important;
+ flex-direction: column !important;
+ align-items: center !important;
+ gap: 1px !important;
+ padding: 5px 6px !important;
+ background: rgba(255, 255, 255, 0.95) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
+ backdrop-filter: blur(8px) !important;
+}
+#VolumeControlSpan br {
+ display: none !important;
+}
+#VolumeControlSpan #VolumeUpSpan,
+#VolumeControlSpan #VolumeDownSpan {
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 32px !important;
+ height: 32px !important;
+ line-height: 0 !important;
+ border-radius: 8px !important;
+ transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease !important;
+}
+#VolumeControlSpan #VolumeUpSpan img,
+#VolumeControlSpan #VolumeDownSpan img {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+#VolumeControlSpan #VolumeUpSpan::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ content: "\f028" !important; /* fa-volume-high */
+ font-size: 1.125rem !important;
+ color: #2D2D2D !important;
+}
+#VolumeControlSpan #VolumeDownSpan::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ content: "\f027" !important; /* fa-volume-low */
+ font-size: 1.125rem !important;
+ color: #2D2D2D !important;
+}
+#VolumeControlSpan #VolumeUpSpan:hover,
+#VolumeControlSpan #VolumeDownSpan:hover {
+ background: rgba(0, 139, 139, 0.08) !important;
+ transform: scale(1.06) !important;
+}
+#VolumeControlSpan #VolumeUpSpan:hover::before,
+#VolumeControlSpan #VolumeDownSpan:hover::before {
+ color: #008b8b !important;
+}
+
+/* ========== Solo #AgentStatusSpan (estado del agente) - estilos exclusivos ========== */
+#AgentStatusSpan {
+
+ left: 60px !important;
+ margin-top: 40px;
+ z-index: 15 !important;
+ display: inline-block !important;
+ padding: 10px 14px !important;
+ background: rgba(255, 255, 255, 0.95) !important;
+ border-radius: 10px !important;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
+ backdrop-filter: blur(8px) !important;
+}
+#AgentStatusSpan .body_text,
+#AgentStatusSpan font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ line-height: 1.5 !important;
+ color: #2D2D2D !important;
+ font-weight: 400 !important;
+}
+#AgentStatusSpan #AgentStatusStatus {
+ display: inline-block !important;
+ padding: 2px 8px !important;
+ margin-left: 2px !important;
+ border-radius: 6px !important;
+ background: rgba(0, 139, 139, 0.12) !important;
+ color: #008b8b !important;
+ font-weight: 600 !important;
+ font-size: 12px !important;
+ letter-spacing: 0.02em !important;
+}
+#AgentStatusSpan br {
+ display: block !important;
+ margin: 4px 0 0 0 !important;
+}
+#AgentStatusSpan #AgentStatusDiaLs {
+ font-weight: 600 !important;
+ color: #2D2D2D !important;
+}
+
+/* ========== Solo #callsinqueuedisplay (Calls In Queue) - estilos exclusivos ========== */
+#callsinqueuedisplay {
+ position: absolute !important;
+ left: 13px !important;
+ top: 912px !important;
+ width: 1176px !important;
+ z-index: 17 !important;
+
+ overflow-x: auto !important;
+ overflow-y: hidden !important;
+ padding: 10px 16px !important;
+ background: rgba(255, 255, 255, 0.98) !important;
+ border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.03) !important;
+}
+#callsinqueuedisplay > table {
+ width: 100% !important;
+ max-width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#callsinqueuedisplay > table td {
+ padding: 4px 8px !important;
+ border: none !important;
+ vertical-align: middle !important;
+}
+#callsinqueuedisplay > table td:first-child {
+ width: 5px !important;
+ padding-left: 0 !important;
+}
+#callsinqueuedisplay .body_text,
+#callsinqueuedisplay font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ color: #2D2D2D !important;
+ font-weight: 500 !important;
+}
+#callsinqueuedisplay #callsinqueuelist {
+ font-size: 13px !important;
+ color: #2D2D2D !important;
+ line-height: 1.4 !important;
+}
+
+/* ========== Solo #AgentViewSpan (Other Agents Status) - estilos exclusivos ========== */
+#AgentViewSpan {
+ position: absolute !important;
+ right: 12px !important;
+ left: auto !important;
+ top: 20px !important;
+ width: 260px !important;
+ height: 500px !important;
+ max-height: 75vh !important;
+ z-index: 21 !important;
+ overflow: auto !important;
+ padding: 12px 14px !important;
+ background: #fafafa !important;
+ border: 1px solid #eee !important;
+ border-radius: 8px !important;
+ box-shadow: 0 2px 10px rgba(0,0,0,0.04) !important;
+}
+#AgentViewSpan > table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#AgentViewSpan > table td {
+ padding: 4px 0 !important;
+ border: none !important;
+ vertical-align: top !important;
+}
+#AgentViewSpan > table td:first-child {
+ width: 5px !important;
+ padding-right: 6px !important;
+}
+#AgentViewSpan .body_text,
+#AgentViewSpan font.body_text,
+#vicidial_form #AgentViewSpan .body_text,
+#vicidial_form #AgentViewSpan font.body_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: #1a1a1a !important;
+}
+#AgentViewSpan #AgentViewStatus {
+ display: block !important;
+ margin-top: 6px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 12px !important;
+ color: #333 !important;
+ line-height: 1.45 !important;
+}
+#AgentViewSpan #AgentViewStatus > table {
+ width: 100% !important;
+ border: none !important;
+ border-collapse: collapse !important;
+}
+#AgentViewSpan #AgentViewStatus > table td {
+ padding: 6px 8px !important;
+ border: none !important;
+ border-radius: 4px !important;
+ font-size: 12px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ background: transparent !important;
+}
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#ADD8E6"] td { background: #e3f2fd !important; }
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#D8BFD8"] td { background: #f3e5f5 !important; }
+#AgentViewSpan #AgentViewStatus > table tr[bgcolor="#F0E68C"] td { background: #fff9c4 !important; }
+#AgentViewSpan #AgentViewStatus br {
+ display: block !important;
+ margin: 8px 0 0 0 !important;
+}
+#AgentViewSpan #AgentViewStatus font[style*="font-size:10px"] {
+ font-size: 11px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ color: #666 !important;
+}
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#ADD8E6"],
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#D8BFD8"],
+#AgentViewSpan #AgentViewStatus font[style*="background-color:#F0E68C"] {
+ display: inline-block !important;
+ width: 10px !important;
+ height: 10px !important;
+ border-radius: 2px !important;
+ vertical-align: middle !important;
+ margin-right: 2px !important;
+}
+
+/* ========== Solo #InvalidOpenerSpan (mensaje "not opened properly") - estilos exclusivos ========== */
+#InvalidOpenerSpan {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ z-index: 186 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(0, 0, 0, 0.5) !important;
+ backdrop-filter: blur(4px) !important;
+}
+
+#InvalidOpenerSpan > table {
+ width: auto !important;
+ max-width: 420px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 16px !important;
+ background: #fff !important;
+ border: none !important;
+ border-radius: 10px !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#InvalidOpenerSpan > table td {
+ padding: 24px 28px !important;
+ text-align: center !important;
+ border: none !important;
+ background: transparent !important;
+}
+#InvalidOpenerSpan .sd_text,
+#InvalidOpenerSpan font.sd_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 15px !important;
+ line-height: 1.5 !important;
+ color: #2D2D2D !important;
+ font-weight: 500 !important;
+}
+#InvalidOpenerSpan br {
+ display: block !important;
+ margin: 0 !important;
+}
+
+/* ========== Solo #blind_monitor_alert_span (ALERT / Go Back) - estilos exclusivos ========== */
+#blind_monitor_alert_span {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ z-index: 184 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(0, 0, 0, 0.5) !important;
+ backdrop-filter: blur(4px) !important;
+}
+
+#blind_monitor_alert_span > table {
+ width: auto !important;
+ max-width: 480px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 16px !important;
+ background: #fff !important;
+ border: none !important;
+ border-radius: 10px !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#blind_monitor_alert_span > table td {
+ padding: 24px 28px !important;
+ text-align: center !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#blind_monitor_alert_span .sd_text,
+#blind_monitor_alert_span font.sd_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ color: #2D2D2D !important;
+ line-height: 1.5 !important;
+}
+#blind_monitor_alert_span .sh_text,
+#blind_monitor_alert_span font.sh_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 14px !important;
+ color: #2D2D2D !important;
+ line-height: 1.5 !important;
+}
+#blind_monitor_alert_span .sh_text b,
+#blind_monitor_alert_span .sh_text font[color="red"],
+#blind_monitor_alert_span #blind_monitor_alert_span_contents {
+ font-size: 1.25rem !important;
+ font-weight: 700 !important;
+ color: #c62828 !important;
+}
+#blind_monitor_alert_span br {
+ display: block !important;
+ margin: 4px 0 !important;
+}
+#blind_monitor_alert_span a[onclick*="hideDiv('blind_monitor_alert_span')"] {
+ display: inline-block !important;
+ margin-top: 16px !important;
+ padding: 10px 20px !important;
+ border-radius: 8px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#blind_monitor_alert_span a[onclick*="hideDiv('blind_monitor_alert_span')"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+
+/* ========== Solo #ManualValidateBox (Manual Dial Validation) - estilos exclusivos ========== */
+#ManualValidateBox {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ z-index: 83 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(0, 0, 0, 0.5) !important;
+ backdrop-filter: blur(4px) !important;
+}
+
+#ManualValidateBox > table {
+ width: auto !important;
+ max-width: 440px !important;
+ height: auto !important;
+ min-height: 0 !important;
+ margin: 16px !important;
+ background: #fff !important;
+ border: none !important;
+ border-radius: 10px !important;
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+ overflow: hidden !important;
+}
+#ManualValidateBox > table td {
+ padding: 24px 28px !important;
+ text-align: center !important;
+ vertical-align: top !important;
+ border: none !important;
+ background: transparent !important;
+}
+#ManualValidateBox .sd_text,
+#ManualValidateBox font.sd_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 15px !important;
+ font-weight: 600 !important;
+ color: #2D2D2D !important;
+ line-height: 1.5 !important;
+}
+#ManualValidateBox .sh_text,
+#ManualValidateBox font.sh_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 14px !important;
+ color: #2D2D2D !important;
+ line-height: 1.5 !important;
+}
+#ManualValidateBox #ManualValidateContent {
+ display: block !important;
+ margin-bottom: 8px !important;
+ font-weight: 500 !important;
+ color: #333 !important;
+}
+#ManualValidateBox br {
+ display: block !important;
+ margin: 6px 0 !important;
+}
+#ManualValidateBox input#ManualValidateEntry,
+#ManualValidateBox input.cust_form[name="ManualValidateEntry"] {
+ display: inline-block !important;
+ width: 100% !important;
+ max-width: 280px !important;
+ margin: 8px 0 !important;
+ padding: 10px 12px !important;
+ font-size: 14px !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ border: 1px solid #ccc !important;
+ border-radius: 6px !important;
+ box-sizing: border-box !important;
+}
+#ManualValidateBox input#ManualValidateEntry:focus,
+#ManualValidateBox input.cust_form[name="ManualValidateEntry"]:focus {
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ outline: none !important;
+ box-shadow: 0 0 0 2px rgba(0, 139, 139, 0.2) !important;
+}
+#ManualValidateBox a[onclick*="ManualValidateSubmit"] {
+ display: inline-block !important;
+ margin: 4px !important;
+ padding: 10px 20px !important;
+ border-radius: 8px !important;
+ background: var(--color-primary-medium, #008b8b) !important;
+ color: #fff !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#ManualValidateBox a[onclick*="ManualValidateSubmit"]:hover {
+ background: var(--color-primary-dark, #2E7D7D) !important;
+}
+#ManualValidateBox a[onclick*="ManualValidateCancel"] {
+ display: inline-block !important;
+ margin: 4px !important;
+ padding: 10px 20px !important;
+ border-radius: 8px !important;
+ background: #e0e0e0 !important;
+ color: #333 !important;
+ font-size: 14px !important;
+ font-weight: 600 !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease !important;
+}
+#ManualValidateBox a[onclick*="ManualValidateCancel"]:hover {
+ background: #bdbdbd !important;
+}
+
+/* ========== Solo #ScriptTopBGspan (fondo script) - estilos exclusivos ========== */
+#ScriptTopBGspan {
+ position: fixed !important;
+ left: 0 !important;
+ top: 0 !important;
+ width: 100vw !important;
+ height: 100vh !important;
+ min-height: 100vh !important;
+ z-index: 99 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ background: rgba(255, 255, 255, 0.97) !important;
+ backdrop-filter: blur(6px) !important;
+}
+#ScriptTopBGspan > table {
+ width: 100% !important;
+ height: 100% !important;
+ max-width: 100% !important;
+ border: none !important;
+ background: transparent !important;
+}
+#ScriptTopBGspan > table td {
+ padding: 0 !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+ border: none !important;
+ background: transparent !important;
+}
+#ScriptTopBGspan .sd_text,
+#ScriptTopBGspan font.sd_text {
+ font-size: 0 !important;
+ line-height: 0 !important;
+}
+#ScriptTopBGspan br {
+ display: none !important;
+}
+
+/* ========== Solo #ViewCommentsBox (View Comment History) - estilos exclusivos ========== */
+#ViewCommentsBox {
+ left: 10px !important;
+}
+#ViewCommentsBox > table {
+ margin-top: 500px !important;
+ width: 1000px !important;
+ height: auto !important;
+ min-height: 200px !important;
+ max-height: 70vh !important;
+ border: none !important;
+ border-collapse: collapse !important;
+ border-radius: 10px !important;
+ overflow: hidden !important;
+ background: #fff !important;
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
+}
+#ViewCommentsBox > table td {
+ padding: 12px 14px !important;
+ border: none !important;
+ vertical-align: top !important;
+}
+#ViewCommentsBox > table tr[bgcolor="#FFEEBB"] td {
+ background: #fff8e8 !important;
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ color: #2D2D2D !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
+ padding: 10px 14px !important;
+}
+#ViewCommentsBox .sh_text,
+#ViewCommentsBox font.sh_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 13px !important;
+ color: #2D2D2D !important;
+ font-weight: 600 !important;
+}
+#ViewCommentsBox .sk_text,
+#ViewCommentsBox font.sk_text {
+ font-family: var(--font-family, system-ui, sans-serif) !important;
+ font-size: 12px !important;
+ font-weight: 400 !important;
+}
+#ViewCommentsBox #ViewCommentsShowHide a {
+ display: inline-block !important;
+ padding: 4px 10px !important;
+ border-radius: 6px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ font-size: 12px !important;
+ text-decoration: none !important;
+ transition: background 0.2s ease, color 0.2s ease !important;
+}
+#ViewCommentsBox #ViewCommentsShowHide a:hover {
+ color: var(--color-primary-dark, #2E7D7D) !important;
+ background: rgba(0, 139, 139, 0.08) !important;
+}
+#ViewCommentsBox > table tr:not([bgcolor]) td,
+#ViewCommentsBox > table tr td[bgcolor="white"] {
+ background: #fff !important;
+ height: auto !important;
+ min-height: 180px !important;
+ max-height: 50vh !important;
+ overflow: auto !important;
+ padding: 12px 14px !important;
+}
+#ViewCommentsBox #audit_comments,
+#ViewCommentsBox pre {
+ font-family: var(--font-family, system-ui, monospace) !important;
+ font-size: 12px !important;
+ line-height: 1.5 !important;
+ color: #2D2D2D !important;
+ white-space: pre-wrap !important;
+ word-break: break-word !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ border: none !important;
+ background: transparent !important;
+}
+#ViewCommentsBox pre font[size="1"] {
+ font-size: 12px !important;
+}
+
+/* ========== Bloque Administration (tabla 800px, solo este componente) ========== */
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] {
+ border-collapse: separate !important;
+ border-spacing: 12px 10px !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] tbody > tr > td[width="220"] {
+ vertical-align: top !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] tbody > tr > td[width="220"] > table {
+ width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 0 6px !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected {
+ cursor: pointer !important;
+ border-radius: 10px !important;
+ background: #fff !important;
+ border: 1px solid rgba(0, 0, 0, 0.08) !important;
+ transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected:hover {
+ background: #f5f7fa !important;
+ border-color: rgba(0, 139, 139, 0.25) !important;
+ box-shadow: 0 4px 12px rgba(0, 139, 139, 0.12) !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td {
+ padding: 10px 12px !important;
+ vertical-align: middle !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected a {
+ text-decoration: none !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ gap: 12px !important;
+ color: inherit !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected span,
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected font {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 14px !important;
+ font-weight: bold !important;
+ color: #1a1a1a !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a {
+ position: relative !important;
+ width: 42px !important;
+ height: 42px !important;
+ min-width: 42px !important;
+ min-height: 42px !important;
+ align-items: center !important;
+ justify-content: center !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a img {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ font-size: 1.35rem !important;
+ color: #008b8b !important;
+ line-height: 1 !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_calltimes"]) a::before { content: "\f017" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_shifts"]) a::before { content: "\f073" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_phones"]) a::before { content: "\f095" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_templates"]) a::before { content: "\f5fd" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_carriers"]) a::before { content: "\f0d1" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_servers"]) a::before { content: "\f233" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_conferences"]) a::before { content: "\f0c0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_settings"]) a::before { content: "\f013" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_screenlabels"]) a::before { content: "\f02c" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_screencolors"]) a::before { content: "\f53f" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_statuses"]) a::before { content: "\f201" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_statusgroups"]) a::before { content: "\f247" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_cidgroups"]) a::before { content: "\f2c2" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_voicemail"]) a::before { content: "\f2a0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_audiostore"]) a::before { content: "\f001" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_musiconhold"]) a::before { content: "\f001" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_languages"]) a::before { content: "\f1ab" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_vm_messages"]) a::before { content: "\f0e0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_settingscontainer"]) a::before { content: "\f187" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_queuegroups"]) a::before { content: "\f022" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) > img[src*="icon_black_admin"] {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) > font:first-of-type {
+ display: inline-flex !important;
+ align-items: center !important;
+ gap: 12px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 1.25rem !important;
+ font-weight: bold !important;
+ color: #1a1a1a !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) > font:first-of-type::before {
+ content: "\f505" !important;
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ font-size: 1.75rem !important;
+ color: #008b8b !important;
+ line-height: 1 !important;
+}
+
+/* ========== Formulario "MODIFY A CONFERENCE RECORD" (solo este componente) ========== */
+/* Contenedor principal del formulario de Conference (tabla 850px dentro del área de contenido admin) */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración) */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto y selects dentro del formulario de Conference */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Botón SUBMIT del formulario de Conference (más grande, estilo pill) */
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* Variante para páginas sin el contenedor td[width="870"][bgcolor="#D9E6FE"] */
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] select {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] select:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[type="hidden"][name="old_conf_exten"]) center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Formulario "MODIFY A PHONE RECORD" (solo este componente) ========== */
+/* Contenedor principal del formulario de Phone (tabla 850px dentro del área de contenido admin) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración, distintos colores de fondo originales) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"],
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#8EBCFD"],
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#CCFFFF"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto, selects y textarea dentro del formulario de Phone */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select,
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus,
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Checkboxes (por si este formulario incluye alguno) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="checkbox"] {
+ margin-right: 4px !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces auxiliares internos del formulario (audio chooser, Server IP, etc.) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botón SUBMIT del formulario de Phone (más grande, estilo pill) */
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[name="old_extension"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Formulario "MODIFY A CONF TEMPLATE RECORD" (solo este componente) ========== */
+/* Contenedor principal del formulario de Conf Template (tabla 850px dentro del área de contenido admin) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto, selects y textarea dentro del formulario de Conf Template */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select,
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus,
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces internos (si los hay dentro de la tabla) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botón SUBMIT del formulario de Conf Template (más grande, estilo pill) */
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[type="hidden"][name="template_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Formulario "MODIFY A CARRIER RECORD" (solo este componente) ========== */
+/* Contenedor principal del formulario de Carrier (tabla 850px dentro del área de contenido admin) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto, selects y textarea dentro del formulario de Carrier */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select,
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus,
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces internos dentro de la tabla (Template ID, etc.) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botón SUBMIT del formulario de Carrier (más grande, estilo pill) */
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[type="hidden"][name="carrier_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Formulario "MODIFY A SERVER RECORD" (solo este componente) ========== */
+/* Contenedor principal del formulario de Server (tabla 850px dentro del área de contenido admin) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (B6D3FC y 8EBCFD) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"],
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#8EBCFD"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto, selects y textarea dentro del formulario de Server */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] textarea:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces internos dentro de la tabla (si los hay) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botón SUBMIT del formulario de Server (más grande, estilo pill) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Listados inferiores en pantalla de SERVER (trunks, carriers, phones, conferences) ========== */
+/* Tablas de resumen debajo del formulario de servidor: 500 / 600 / 400 px de ancho */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="500"][cellspacing="3"],
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="600"][cellspacing="3"],
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="400"][cellspacing="3"] {
+ border-collapse: separate !important;
+ border-spacing: 0 !important;
+ border-radius: 8px !important;
+ border: 1px solid rgba(15, 23, 42, 0.08) !important;
+ background: #ffffff !important;
+ overflow: hidden;
+}
+
+/* Cabecera de estas tablas (primera fila) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="500"][cellspacing="3"] > tbody > tr:first-child td,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="600"][cellspacing="3"] > tbody > tr:first-child td,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="400"][cellspacing="3"] > tbody > tr:first-child td {
+ background: #015B91 !important;
+ color: #ffffff !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ font-weight: 600 !important;
+ padding: 6px 8px !important;
+}
+
+/* Filas de datos (a partir de la segunda fila) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="500"][cellspacing="3"] > tbody > tr:nth-child(n+2) td,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="600"][cellspacing="3"] > tbody > tr:nth-child(n+2) td,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="400"][cellspacing="3"] > tbody > tr:nth-child(n+2) td {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: #111827 !important;
+ padding: 5px 8px !important;
+}
+
+/* Enlaces dentro de estas tablas (IDs clicables) */
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="500"][cellspacing="3"] a,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="600"][cellspacing="3"] a,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="400"][cellspacing="3"] a {
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="500"][cellspacing="3"] a:hover,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="600"][cellspacing="3"] a:hover,
+body:has(input[type="hidden"][name="old_server_id"]) td[width="870"][bgcolor="#D9E6FE"] table[width="400"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* ========== Formulario "MODIFY A SHIFT" (solo este componente) ========== */
+/* Contenedor principal del formulario de Shift (tabla 850px dentro del área de contenido admin) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto, selects y checkboxes dentro del formulario de Shift */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Checkboxes de Shift Weekdays */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="checkbox"] {
+ margin-right: 4px !important;
+}
+
+/* Botón "Calculate Shift Length" (leve y un poco más grande) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="button"][name="shift_calc"] {
+ background-color: rgba(0, 139, 139, 0.06) !important;
+ color: #025a5a !important;
+ border-radius: 999px !important;
+ border: 1px solid rgba(0, 139, 139, 0.18) !important;
+ padding: 6px 16px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="button"][name="shift_calc"]:hover {
+ background-color: rgba(0, 139, 139, 0.12) !important;
+ border-color: rgba(0, 139, 139, 0.3) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces dentro de este formulario (si hubiera) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botón SUBMIT del formulario de Shift (más grande, estilo pill) */
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[name="shift_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+/* ========== Barra de enlaces de Call Times (fila gris) ========== */
+/* Contenedor de la barra: fila gris con enlaces de Call Times dentro del área principal admin */
+body:has(a[href="/vicidial/admin.php?ADD=100000000"]) td[width="870"][bgcolor="#D9E6FE"] tr[bgcolor="#C6C6C6"] td[align="LEFT"][colspan="2"] {
+ padding: 6px 10px !important;
+}
+
+/* Enlaces de la barra convertidos en "botones" leves */
+body:has(a[href="/vicidial/admin.php?ADD=100000000"]) td[width="870"][bgcolor="#D9E6FE"] tr[bgcolor="#C6C6C6"] td[align="LEFT"][colspan="2"] a {
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ padding: 5px 12px !important;
+ margin-right: 4px !important;
+ border-radius: 999px !important;
+ background: rgba(0, 139, 139, 0.06) !important;
+ border: 1px solid rgba(0, 139, 139, 0.14) !important;
+ text-decoration: none !important;
+ cursor: pointer !important;
+}
+
+/* Texto dentro de los "botones" */
+body:has(a[href="/vicidial/admin.php?ADD=100000000"]) td[width="870"][bgcolor="#D9E6FE"] tr[bgcolor="#C6C6C6"] td[align="LEFT"][colspan="2"] a font {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ font-weight: 600 !important;
+ color: #025a5a !important;
+}
+
+/* Hover suave sobre los "botones" */
+body:has(a[href="/vicidial/admin.php?ADD=100000000"]) td[width="870"][bgcolor="#D9E6FE"] tr[bgcolor="#C6C6C6"] td[align="LEFT"][colspan="2"] a:hover {
+ background: rgba(0, 139, 139, 0.14) !important;
+ border-color: rgba(0, 139, 139, 0.28) !important;
+}
+
+
+/* ========== Formulario "MODIFY A CALL TIME" (solo este componente) ========== */
+/* Contenedor principal del formulario de Call Time (tabla 850px dentro del área de contenido admin) */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] {
+ background: #ffffff !important;
+ border-radius: 12px !important;
+ border: 1px solid rgba(0, 0, 0, 0.06) !important;
+ box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08) !important;
+ padding: 18px 20px !important;
+ box-sizing: border-box !important;
+}
+
+/* Filas del formulario (campos de configuración) */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] {
+ background: #f8fafc !important;
+}
+
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td {
+ padding: 8px 10px !important;
+ vertical-align: middle !important;
+}
+
+/* Etiquetas alineadas a la derecha (columna izquierda) */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] tr[bgcolor="#B6D3FC"] td[align="right"] {
+ white-space: nowrap !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ color: #1f2933 !important;
+ font-weight: 600 !important;
+}
+
+/* Inputs de texto y selects dentro del formulario de Call Time */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"],
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select {
+ border-radius: 6px !important;
+ border: 1px solid #cbd5e1 !important;
+ padding: 6px 8px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 12px !important;
+ color: #111827 !important;
+ background-color: #ffffff !important;
+ box-sizing: border-box !important;
+}
+
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="text"]:focus,
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] select:focus {
+ outline: none !important;
+ border-color: var(--color-primary-medium, #008b8b) !important;
+ box-shadow: 0 0 0 1px rgba(0, 139, 139, 0.15) !important;
+}
+
+/* Iconos de ayuda dentro del formulario (help.png) */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] img[alt="HELP"] {
+ cursor: pointer !important;
+ margin-left: 6px !important;
+ vertical-align: middle !important;
+}
+
+/* Enlaces "audio chooser" y otros links auxiliares dentro de filas de tiempo */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 11px !important;
+ color: var(--color-primary-medium, #008b8b) !important;
+ text-decoration: none !important;
+}
+
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] a:hover {
+ text-decoration: underline !important;
+}
+
+/* Botones SUBMIT del formulario de Call Time (un poco más grandes y nivelados) */
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"] {
+ background-color: var(--color-primary-medium, #008b8b) !important;
+ color: #ffffff !important;
+ border: none !important;
+ border-radius: 999px !important;
+ padding: 8px 22px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 13px !important;
+ font-weight: 600 !important;
+ cursor: pointer !important;
+ box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15) !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.04em !important;
+}
+
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:hover {
+ background-color: var(--color-primary-dark, #006b6b) !important;
+ box-shadow: 0 3px 9px rgba(15, 23, 42, 0.2) !important;
+ transform: translateY(-1px);
+}
+
+body:has(input[name="call_time_id"]) td[width="870"][bgcolor="#D9E6FE"] center > table[width="850"][cellspacing="3"] input[type="submit"]:active {
+ transform: translateY(0);
+ box-shadow: 0 1px 4px rgba(15, 23, 42, 0.15) !important;
+}
+
+
+/* ========== Bloque Administration (tabla 800px, solo este componente) ========== */
+/* Contenedor: td colspan=2 que contiene "Admin" y tabla width=800 */
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] {
+ border-collapse: separate !important;
+ border-spacing: 12px 10px !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] tbody > tr > td[width="220"] {
+ vertical-align: top !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] tbody > tr > td[width="220"] > table {
+ width: 100% !important;
+ border-collapse: separate !important;
+ border-spacing: 0 6px !important;
+}
+/* Filas del menú admin (solo dentro de este bloque) */
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected {
+ cursor: pointer !important;
+ border-radius: 10px !important;
+ background: #fff !important;
+ border: 1px solid rgba(0, 0, 0, 0.08) !important;
+ transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected:hover {
+ background: #f5f7fa !important;
+ border-color: rgba(0, 139, 139, 0.25) !important;
+ box-shadow: 0 4px 12px rgba(0, 139, 139, 0.12) !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td {
+ padding: 10px 12px !important;
+ vertical-align: middle !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected a {
+ text-decoration: none !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ gap: 12px !important;
+ color: inherit !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected span,
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected font {
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 14px !important;
+ font-weight: bold !important;
+ color: #1a1a1a !important;
+}
+/* Ocultar imágenes originales y mostrar icono FA en el primer td */
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a {
+ position: relative !important;
+ width: 42px !important;
+ height: 42px !important;
+ min-width: 42px !important;
+ min-height: 42px !important;
+ align-items: center !important;
+ justify-content: center !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a img {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child a::before {
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ font-size: 1.35rem !important;
+ color: #008b8b !important;
+ line-height: 1 !important;
+}
+/* Iconos por imagen (reemplazo con Font Awesome) */
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_calltimes"]) a::before { content: "\f017" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_shifts"]) a::before { content: "\f073" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_phones"]) a::before { content: "\f095" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_templates"]) a::before { content: "\f5fd" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_carriers"]) a::before { content: "\f0d1" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_servers"]) a::before { content: "\f233" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_conferences"]) a::before { content: "\f0c0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_settings"]) a::before { content: "\f013" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_screenlabels"]) a::before { content: "\f02c" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_screencolors"]) a::before { content: "\f53f" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_statuses"]) a::before { content: "\f201" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_statusgroups"]) a::before { content: "\f247" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_cidgroups"]) a::before { content: "\f2c2" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_voicemail"]) a::before { content: "\f2a0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_audiostore"]) a::before { content: "\f001" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_musiconhold"]) a::before { content: "\f001" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_languages"]) a::before { content: "\f1ab" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_vm_messages"]) a::before { content: "\f0e0" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_settingscontainer"]) a::before { content: "\f187" !important; }
+td[colspan="2"]:has(img[alt="Admin"]) table[width="800"] .adminmenu_style_selected td:first-child:has(img[src*="icon_queuegroups"]) a::before { content: "\f022" !important; }
+/* Título "Administration" y icono de cabecera (solo en este td colspan=2) */
+td[colspan="2"]:has(img[alt="Admin"]) > img[src*="icon_black_admin"] {
+ position: absolute !important;
+ width: 0 !important;
+ height: 0 !important;
+ overflow: hidden !important;
+ opacity: 0 !important;
+ pointer-events: none !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) {
+ position: relative !important;
+ padding-left: 0 !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) > font:first-of-type {
+ display: inline-flex !important;
+ align-items: center !important;
+ gap: 12px !important;
+ font-family: Arial, Helvetica, sans-serif !important;
+ font-size: 1.25rem !important;
+ font-weight: bold !important;
+ color: #1a1a1a !important;
+}
+td[colspan="2"]:has(img[alt="Admin"]) > font:first-of-type::before {
+ content: "\f505" !important;
+ font-family: "Font Awesome 6 Free VDC" !important;
+ font-weight: 900 !important;
+ font-size: 1.75rem !important;
+ color: #008b8b !important;
+ line-height: 1 !important;
+}