:root{
  --bg:#0b0f14;
  --card:#111823;
  --muted:#8aa0b6;
  --text:#eaf2ff;
  --line:#1f2a3a;
  --green:#c45e39;
  --green2:#dfe64a;
  --danger:#ff4d4d;
  --yellow:#ffc857;
  --blue:#59b0ff;
  --blue2:#3896ee;
}


/* =========================================================
   TEMA BLANCO (modo claro) - variables base
   ========================================================= */
body.tema-blanco{
  --bg:#ffffff;
  --card:#ffffff;
  --muted:#4b5563;
  --text:#000000;
  --line:#dee2e6;
  --yellow:#b78100; /* más legible en blanco */
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", Arial, sans-serif;
  background:var(--bg);
  color:var(--text);
}
a{color:inherit}

.topbar{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  padding:12px 16px;
  border-bottom:1px solid var(--line);
  background:rgba(11,15,20,.92);
  backdrop-filter: blur(10px);
}
.brand__title{
  text-decoration:none;
  font-weight:800;
  letter-spacing:.6px;
}
.nav{display:flex; gap:12px; flex-wrap:wrap}
.nav a{
  text-decoration:none;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid transparent;
  color:var(--muted);
}
.nav a:hover{border-color:var(--line); color:var(--text)}

.userbox{display:flex; gap:10px; align-items:center; position:relative}
.userbox__name{font-size:14px; color:var(--muted)}

.container{max-width:1100px; margin:0 auto; padding:18px 14px 40px}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  margin:14px 0;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.h1{font-size:26px; margin:0 0 8px}
.h2{font-size:20px; margin:0 0 10px}
.h3{font-size:16px; margin:0 0 10px}
.muted{color:var(--muted); font-size:13px}

.grid2{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px}
.grid2 > *{min-width:0}
@media (max-width:820px){.grid2{grid-template-columns:1fr}}

.row{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.row.space-between{justify-content:space-between}
.grow{flex:1}

.label{display:block; margin:10px 0 6px; color:var(--muted); font-size:13px}
.input{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#0e1520;
  color:var(--text);
  outline:none;
}
.input:focus{border-color:#2c3c57}
textarea.input{resize:vertical}

/* Calendario en blanco (inputs date) */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1); /* Cambia de negro a blanco */
    cursor: pointer;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#0e1520;
  color:var(--text);
  text-decoration:none;
  cursor:pointer;
}
.btn-sm{padding:7px 10px; border-radius:10px; font-size:13px}
.btn-green{background:var(--green); border-color:transparent; color:#1b1f05; font-weight:700}
.btn-green:hover{background:var(--green2)}
.btn-blue{background:var(--blue); border-color:transparent; color:#031425; font-weight:800}
.btn-blue:hover{background:var(--blue2)}
.btn-outline{background:transparent}
.btn-danger{background:var(--danger); border-color:transparent; color:#220606; font-weight:700}
.w100{width:100%}

.actions{display:flex; gap:10px; margin-top:12px; flex-wrap:wrap}

.pill{
  display:inline-block;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:12px;
}

/* Prioridades */
.pill--prio-low{background:#0e2a17; border-color:#1a5a34; color:#d7f3e3}
.pill--prio-med{background:#2a250e; border-color:#6b5f14; color:#fff1c2}
.pill--prio-crit{background:#2a1212; border-color:#7a1f1f; color:#ffd6d6}

/* Estatus (listado tickets) */
.pill--st-proceso{background:#000; border-color:#333; color:#fff}
.pill--st-pausa{background:var(--yellow); border-color:transparent; color:#1a140c; font-weight:800}
.pill--st-finalizado{background:var(--green); border-color:transparent; color:#1b1f05; font-weight:800}

.pill--active{background:#0b2a3a; border-color:#1d5f86; color:#d6efff; font-weight:800}
.pill--inactive{background:#3a240b; border-color:#a0631b; color:#ffe7cf; font-weight:800}

/* Admin / Clients: header + rows aligned */
.clients-grid{
  display:grid;
  grid-template-columns:
    2fr   /* Nombre */
    1.6fr /* RFC */
    1.6fr /* Permiso CRE */
    1fr   /* Estado */
    1fr   /* Póliza */
    1.2fr /* Vigencia */
    1.4fr /* Acciones */;
  gap:12px;
  align-items:center;
}
.clients-head{border-top:0; color:var(--muted); font-size:13px; padding:10px; border-bottom:1px solid var(--line)}
.clients-row{padding:10px; border-top:1px solid var(--line)}
@media (max-width:980px){
  .clients-grid{grid-template-columns: 1fr; gap:6px;}
  .clients-head{display:none;}
  .clients-row .row{justify-content:flex-start;}
}

.tr.tr--clients{grid-template-columns: 1.6fr 1fr 1fr .8fr 1fr 1fr auto;}

.alert{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#0e1520;
}
.alert-warn{border-color:#3b2b13; background:#1a140c}
.alert-ok{border-color:#123b22; background:#0d1a12}

.table{width:100%}
.tr{display:grid; grid-template-columns: 1fr 1.5fr 1fr 1fr 1.2fr 1.3fr 1fr; gap:10px; padding:10px; border-top:1px solid var(--line)}
.tr.th{border-top:0; color:var(--muted); font-size:13px}
@media (max-width:980px){
  .tr{grid-template-columns: 1fr 1.5fr 1fr 1fr;}
  .tr > div:nth-child(n+5){display:none}
}

/* Listado de tickets: mantener botón VER visible en móvil */
.tr--tickets{grid-template-columns: .7fr 1.4fr 1fr 1.3fr 1fr 1fr 1.2fr 1.2fr auto}

/* Tabla de Información de pólizas: solo 2 columnas (evitar columnas vacías) */
.tr--policies{grid-template-columns: 180px 1fr}
@media (max-width:980px){
  .tr--tickets{grid-template-columns: .8fr 1.6fr 1fr auto;}
  /* Oculta: Póliza(3), Asunto(4), Estatus(6), Creado por(7), Fecha(8) */
  .tr--tickets > div:nth-child(3),
  .tr--tickets > div:nth-child(4),
  .tr--tickets > div:nth-child(6),
  .tr--tickets > div:nth-child(7),
  .tr--tickets > div:nth-child(8){display:none}
  /* Botón (9) visible */
  .tr--tickets > div:nth-child(9){display:flex; justify-content:flex-end}
}

.chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.chip{border:1px solid var(--line); border-radius:999px; padding:6px 10px; font-size:13px}
.chip--green{border-color:#184428; background:#0e2216}
.chip--yellow{border-color:#5a4516; background:#1f180a}
.chip--red{border-color:#4b1a1a; background:#1b0d0d}
.chip--select{cursor:pointer}
.chip--select input{margin-right:8px}

.newsbar{
  overflow:hidden;
  border-radius:14px;
  border:1px solid var(--line);
  background:#0e1520;
  margin-bottom:14px;
}
.newsbar__track{
  display:flex;
  width:max-content;
  animation: scroll 18s linear infinite;
}
.newsbar__text{
  padding:10px 16px;
  white-space:nowrap;
  color:#ffcc00;
}
@keyframes scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

.thread{display:flex; flex-direction:column; gap:12px; overflow:hidden}
.msg{border:1px solid var(--line); border-radius:14px; padding:12px; background:#0e1520; max-width:100%; overflow:hidden}
.msg--admin{background:#152a3fe3; border-color:#ffffff}
.msg--usuario{background:#095865f6; border-color:#ffffff}
.msg--soporte{background:#00377bb8; border-color:#ffffff}
.msg__meta{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:8px}
.msg__body{line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word}
.msg__body a{overflow-wrap:anywhere; word-break:break-word}
.msg__files{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.file{border:1px solid var(--line); padding:6px 10px; border-radius:12px; text-decoration:none; font-size:13px}
.file:hover{border-color:#2c3c57}

.prebox{white-space:pre-wrap; padding:12px; border-radius:14px; border:1px solid var(--line); background:#0b121c; color:var(--text); margin-top:8px}

.login-page{display:flex; align-items:center; justify-content:center; padding:24px}
.login-page{background:var(--bg); color:var(--text);} /* evita que el login quede blanco por estilos externos */
.login-card{width:min(420px, 100%); background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px}
.login-logo{display:flex; justify-content:center; margin-bottom:8px}
.login-logo img{max-width:220px; max-height:90px; object-fit:contain}
.hint{color:var(--muted); font-size:12px; margin:8px 0 10px}

.logo-preview{width:120px; height:60px; object-fit:contain; border:1px solid var(--line); border-radius:12px; background:#0e1520}

.rowgreen{background:rgba(33,196,90,.06)}
.rowyellow{background:rgba(255,200,87,.06)}
.rowred{background:rgba(255,77,77,.06)}

.check{display:flex; gap:10px; align-items:center; color:var(--muted)}


.flash{padding:10px 12px;border:1px solid #2b3a52;border-radius:12px;margin:10px 0;background:#0e1520;color:#eaf2ff}
.flash--ok{border-color:#1f6f3a}
.flash--warn{border-color:#b38b00}
.flash--err{border-color:#b00020}

.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:end}
@media(max-width:900px){.grid3{grid-template-columns:1fr}}

/* Date picker icon (calendar) in white for dark theme */
/* Reforzar en caso de overrides */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1); /* Cambia de negro a blanco */
    cursor: pointer;
}
/* Icono WhatsApp negro dentro del botón */
.wa-icon{margin-left:6px; vertical-align:middle; display:inline-block}

/* Adjuntos en conversación: fondo blanco, tipografía negra */
.msg__files .file{background:#fff; color:#000; border-color:#fff;}
.msg__files .file:hover{border-color:#e6e6e6;}
.msg__files .file .muted{color:#111; opacity:.7;}


/* Dropzone (clientes) */
.dropzone{
  border:1px dashed var(--line);
  border-radius:14px;
  padding:12px;
  background:#0e1520;
}
.dropzone--on{border-color:#2c3c57}
.link{
  border:0;
  background:transparent;
  color:var(--text);
  text-decoration:underline;
  cursor:pointer;
  padding:0;
  font:inherit;
}

/* Badge póliza (usa color configurable) */
.badge-policy{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.15);
  color:#07111a;
  font-weight:800;
  font-size:12px;
}

.rowinactive{opacity:.65}


/* Prioridad: select con colores + resaltado */
.priority-highlight{
  box-shadow: 0 0 0 2px rgba(255, 215, 0, .35);
}
.priority-select.prio-critico{background:transparent; color:#ff4d4d; font-weight:800;}
.priority-select.prio-medio{background:transparent; color:#ffd43b; font-weight:800;}
.priority-select.prio-bajo{background:transparent; color:#2dd4bf; font-weight:800;}
.h1 {
    text-align: center;
    width: 100%; /* Asegura que ocupe todo el ancho disponible */
    display: block;
}
.form-container {
    display: flex;
    flex-direction: column; /* Alinea los elementos uno abajo del otro */
    align-items: center;    /* Centra horizontalmente todos los hijos */
    max-width: 350px;       /* Ancho ideal para login */
    margin: 0 auto;         /* Centra el formulario completo en la pantalla */
    gap: 10px;              /* Espacio uniforme entre elementos */
}

.form-container .input {
    width: 100%;            /* Que el input ocupe el ancho del contenedor (350px) */
    text-align: center;     /* Opcional: Centra el texto que escribe el usuario */
}

.form-container .label {
    width: 100%;
    text-align: center;     /* Centra el texto "Usuario" y "Contraseña" */
    font-weight: bold;
}

/* Ticket view standard selects */
.ticket-select{width:193px !important;max-width:193px !important;height:38px !important;}


/* Tema blanco (configurable en Admin > Configuración) */
body.tema-blanco{background:#ffffff !important;color:#000000;}
body.tema-blanco .topbar{background:#ffffff !important;}
body.tema-blanco .topbar a, body.tema-blanco .topbar .brand__title{color:#000000 !important;}


/* =========================================================
   TEMA BLANCO (modo claro)
   Se activa cuando <body> tiene la clase .tema-blanco
   ========================================================= */
body.tema-blanco {
    background: #ffffff !important;
    color: #000000 !important;
}

/* En tema blanco, el ícono del calendario debe verse (Chrome/Edge) */
body.tema-blanco input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(0) !important;
    opacity: .85;
}

/* Texto general */
body.tema-blanco,
body.tema-blanco p,
body.tema-blanco span,
body.tema-blanco label,
body.tema-blanco small,
body.tema-blanco .text-muted,
body.tema-blanco .text-white {
    color: #000000 !important;
}

/* Enlaces */
body.tema-blanco a { color: #0d6efd; }
body.tema-blanco a:hover { color: #0a58ca; }

/* Fondos comunes (Bootstrap-ish) */
body.tema-blanco .bg-dark,
body.tema-blanco .bg-black,
body.tema-blanco .bg-primary,
body.tema-blanco .bg-secondary,
body.tema-blanco .bg-info {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #dee2e6;
}

/* Barras, header, sidebar, topbar */
body.tema-blanco header,
body.tema-blanco .header,
body.tema-blanco .navbar,
body.tema-blanco .topbar,
body.tema-blanco .sidebar,
body.tema-blanco .sidebar-wrapper,
body.tema-blanco .nav-header {
    background: #ffffff !important;
    color: #000000 !important;
    border-color: #dee2e6 !important;
}

/* Cards/contendedores */
body.tema-blanco .card,
body.tema-blanco .panel,
body.tema-blanco .box,
body.tema-blanco .container,
body.tema-blanco .container-fluid,
body.tema-blanco .content-wrapper,
body.tema-blanco .content,
body.tema-blanco .wrapper {
    background: #ffffff !important;
    color: #000000 !important;
}

/* Secciones que antes eran azules: forzamos texto negro si quedó blanco */
body.tema-blanco .bg-primary *,
body.tema-blanco .bg-info *,
body.tema-blanco .bg-secondary * {
    color: #000000 !important;
}

/* Inputs */
body.tema-blanco input,
body.tema-blanco select,
body.tema-blanco textarea {
    background: #ffffff !important;
    color: #000000 !important;
    border-color: #ced4da !important;
}

body.tema-blanco select{
  background: #E8F0FE !important;
  color: #1F2933 !important;
}
body.tema-blanco select option{ background: #ffffff; color: #1F2933; }

/* Tablas */
body.tema-blanco table,
body.tema-blanco .table {
    color: #000000 !important;
}
body.tema-blanco .table thead th {
    background: #f8f9fa !important;
    color: #000000 !important;
}

/* Botones: mantenemos el primary azul con texto blanco */
body.tema-blanco .btn-primary { color: #ffffff !important; }
body.tema-blanco .btn-dark,
body.tema-blanco .btn-secondary {
    background: #f8f9fa !important;
    color: #000000 !important;
    border-color: #ced4da !important;
}

/* Badges */
body.tema-blanco .badge,
body.tema-blanco .label {
    color: #000000 !important;
}

/* Iconos */
body.tema-blanco i,
body.tema-blanco svg {
    color: inherit;
    fill: currentColor;
}



/* Fuerza cualquier tipografía blanca a negro en tema blanco */
body.tema-blanco .text-white,
body.tema-blanco .text-white *,
body.tema-blanco [class*="text-white"],
body.tema-blanco [class*="text-white"] * {
    color: #000000 !important;
}



/* Login en tema blanco */
body.tema-blanco .login,
body.tema-blanco .login-page,
body.tema-blanco .auth-wrapper,
body.tema-blanco .auth,
body.tema-blanco .login-wrapper,
body.tema-blanco .login-container {
    background: #ffffff !important;
    color: #000000 !important;
}
body.tema-blanco .login .card,
body.tema-blanco .login-page .card,
body.tema-blanco .auth-wrapper .card {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #dee2e6 !important;
}



/* Header buttons (campana/salir) en tema blanco */
body.tema-blanco .btn.btn-outline,
body.tema-blanco .btn-outline{
  background:#f8f9fa !important;
  color:#000000 !important;
  border:1px solid #ced4da !important;
}
body.tema-blanco .btn.btn-outline:hover,
body.tema-blanco .btn-outline:hover{
  background:#e9ecef !important;
  color:#000000 !important;
}



/* En tema blanco, cualquier tipografía blanca pasa a negro (excepto botones primary) */
body.tema-blanco .text-white,
body.tema-blanco .text-white *,
body.tema-blanco [class*="text-white"],
body.tema-blanco [class*="text-white"] *{
  color:#000000 !important;
}
body.tema-blanco .btn-primary,
body.tema-blanco .btn-primary *,
body.tema-blanco .btn-blue,
body.tema-blanco .btn-blue *{
  color:#ffffff !important;
}


/* =========================================================
   TEMA BLANCO v2 (rediseño completo)
   Paleta: azul + verde + blanco + gris
   Fecha: 2026-01-26
   ========================================================= */

body.tema-blanco{
  --tw-bg: #F4F6F8;
  --tw-card: #FFFFFF;
  --tw-border: #E1E5EA;
  --tw-text: #1F2933;
  --tw-muted: #5F6C7B;
  --tw-primary: #2563EB;
  --tw-primary-2: #1E40AF;
  --tw-primary-soft: #E8F0FE;
  --tw-success: #16A34A;
  --tw-success-soft: #EAF7EF;
  --tw-danger-soft:#FEE2E2;
  --tw-danger:#991B1B;
  --tw-warn-soft:#FEF3C7;
  --tw-warn:#92400E;
  background: var(--tw-bg) !important;
  color: var(--tw-text) !important;
}

/* Tipografía general */
body.tema-blanco,
body.tema-blanco p,
body.tema-blanco span,
body.tema-blanco label,
body.tema-blanco small{
  color: var(--tw-text) !important;
}
body.tema-blanco .text-muted,
body.tema-blanco .muted{
  color: var(--tw-muted) !important;
}

/* Enlaces */
body.tema-blanco a{ color: var(--tw-primary) !important; }
body.tema-blanco a:hover{ color: var(--tw-primary-2) !important; }

/* Header / topbar / sidebar */
body.tema-blanco header,
body.tema-blanco .header,
body.tema-blanco .navbar,
body.tema-blanco .topbar,
body.tema-blanco .sidebar,
body.tema-blanco .sidebar-wrapper,
body.tema-blanco .nav-header{
  background: var(--tw-card) !important;
  color: var(--tw-text) !important;
  border-color: var(--tw-border) !important;
}
body.tema-blanco .topbar a,
body.tema-blanco .topbar .brand__title{
  color: var(--tw-text) !important;
}

/* Cards / contenedores */
body.tema-blanco .card,
body.tema-blanco .panel,
body.tema-blanco .box,
body.tema-blanco .content,
body.tema-blanco .content-wrapper,
body.tema-blanco .wrapper,
body.tema-blanco .container,
body.tema-blanco .container-fluid{
  background: var(--tw-card) !important;
  color: var(--tw-text) !important;
  border: 1px solid var(--tw-border) !important;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.04);
}

/* Fondos utilitarios que en oscuro eran “azules” o “negros” */
body.tema-blanco .bg-dark,
body.tema-blanco .bg-black,
body.tema-blanco .bg-secondary{
  background: var(--tw-card) !important;
  color: var(--tw-text) !important;
  border: 1px solid var(--tw-border) !important;
}
body.tema-blanco .bg-primary{
  background: var(--tw-primary-soft) !important;
  color: var(--tw-text) !important;
  border: 1px solid rgba(37,99,235,0.20) !important;
}
body.tema-blanco .bg-info{
  background: var(--tw-primary-soft) !important;
  color: var(--tw-text) !important;
  border: 1px solid rgba(37,99,235,0.20) !important;
}
body.tema-blanco .bg-success{
  background: var(--tw-success-soft) !important;
  color: var(--tw-text) !important;
  border: 1px solid rgba(22,163,74,0.20) !important;
}

/* Asegura texto legible dentro de fondos */
body.tema-blanco .bg-primary *,
body.tema-blanco .bg-info *,
body.tema-blanco .bg-secondary *,
body.tema-blanco .bg-dark *,
body.tema-blanco .bg-black *{
  color: var(--tw-text) !important;
}

/* Inputs */
body.tema-blanco input,
body.tema-blanco select,
body.tema-blanco textarea{
  background: #FFFFFF !important;
  color: var(--tw-text) !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 8px;
}
body.tema-blanco input:focus,
body.tema-blanco select:focus,
body.tema-blanco textarea:focus{
  border-color: var(--tw-primary) !important;
  box-shadow: 0 0 0 2px rgba(37,99,235,0.15) !important;
}

/* Tablas */
body.tema-blanco table,
body.tema-blanco .table{
  color: var(--tw-text) !important;
  background: var(--tw-card) !important;
}
body.tema-blanco .table thead th,
body.tema-blanco th{
  background: #F1F5F9 !important;
  color: var(--tw-text) !important;
  border-color: var(--tw-border) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}
body.tema-blanco td{
  border-color: var(--tw-border) !important;
}

/* Botones */
body.tema-blanco .btn-primary{
  background: var(--tw-primary) !important;
  border-color: var(--tw-primary) !important;
  color: #FFFFFF !important;
}
body.tema-blanco .btn-primary:hover{
  background: var(--tw-primary-2) !important;
  border-color: var(--tw-primary-2) !important;
}

body.tema-blanco .btn-success{
  background: var(--tw-success) !important;
  border-color: var(--tw-success) !important;
  color: #FFFFFF !important;
}

body.tema-blanco .btn-dark{
  background: #111827 !important;
  border-color: #111827 !important;
  color: #FFFFFF !important;
}

body.tema-blanco .btn-secondary{
  background: #D1D5DB !important;
  border-color: #D1D5DB !important;
  color: var(--tw-text) !important;
}
body.tema-blanco .btn-secondary:hover{
  background: #9CA3AF !important;
  border-color: #9CA3AF !important;
}

/* Outline (header y acciones laterales) */
body.tema-blanco .btn.btn-outline,
body.tema-blanco .btn-outline{
  background: #FFFFFF !important;
  color: var(--tw-text) !important;
  border: 1px solid var(--tw-border) !important;
}
body.tema-blanco .btn.btn-outline:hover,
body.tema-blanco .btn-outline:hover{
  background: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: var(--tw-text) !important;
}

/* Badges / labels */
body.tema-blanco .badge,
body.tema-blanco .label{
  /* Sin fondo azul: que se lea siempre */
  background: #FFFFFF !important;
  color: var(--tw-text) !important;
  border: 1px solid rgba(148,163,184,0.55) !important;
  border-radius: 12px;
  font-size: 15px !important;
  padding: 6px 12px !important;
}
body.tema-blanco .badge-success,
body.tema-blanco .label-success{
  background: var(--tw-success-soft) !important;
  color: var(--tw-success) !important;
  border-color: rgba(22,163,74,0.18) !important;
}

/* Editor propio (reemplazo TinyMCE) */
.rte{margin-top:4px}
.rte__toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:10px;
  border:1px solid rgba(148,163,184,0.45);
  border-radius:10px;
  background:#FFFFFF;
}
.rte__btn{
  background:#F1F5F9;
  border:1px solid rgba(148,163,184,0.45);
  border-radius:8px;
  padding:6px 10px;
  font-size:14px;
  cursor:pointer;
  color:#111827;
}
.rte__btn:hover{background:#E2E8F0}
.rte__sep{width:1px; background:rgba(148,163,184,0.45); margin:0 2px}
.rte__editor{
  margin-top:10px;
  min-height:220px;
  padding:12px;
  border:1px solid rgba(148,163,184,0.45);
  border-radius:10px;
  background:#FFFFFF;
  color:#111827 !important;
  caret-color:#111827;
  outline:none;
}
.rte__editor:focus{box-shadow:0 0 0 2px rgba(37,99,235,0.12); border-color:rgba(37,99,235,0.55)}
.rte__editor img{max-width:100%; height:auto}
.rte__editor:empty:before{content:attr(data-placeholder); color:#94A3B8}

/* Alertas */
body.tema-blanco .alert-info{ background: var(--tw-primary-soft) !important; color: #1E3A8A !important; border-color: rgba(37,99,235,0.20) !important; }
body.tema-blanco .alert-success{ background: var(--tw-success-soft) !important; color: #166534 !important; border-color: rgba(22,163,74,0.20) !important; }
body.tema-blanco .alert-danger{ background: var(--tw-danger-soft) !important; color: var(--tw-danger) !important; border-color: rgba(153,27,27,0.20) !important; }
body.tema-blanco .alert-warning{ background: var(--tw-warn-soft) !important; color: var(--tw-warn) !important; border-color: rgba(146,64,14,0.20) !important; }

/* Login */
body.tema-blanco.login-page,
body.tema-blanco .login-page,
body.tema-blanco .auth-wrapper,
body.tema-blanco .login-wrapper,
body.tema-blanco .login-container{
  background: var(--tw-bg) !important;
  color: var(--tw-text) !important;
}
body.tema-blanco .login .card,
body.tema-blanco .login-page .card,
body.tema-blanco .auth-wrapper .card{
  background: var(--tw-card) !important;
  border: 1px solid var(--tw-border) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.06);
}

/* Por si quedaron textos blancos colados */
body.tema-blanco .text-white,
body.tema-blanco .text-white *,
body.tema-blanco [class*="text-white"],
body.tema-blanco [class*="text-white"] *{
  color: var(--tw-text) !important;
}




/* Avisos/top message en tema blanco */
body.tema-blanco .notice,
body.tema-blanco .top-notice,
body.tema-blanco .marquee,
body.tema-blanco .banner{
  background:#ffffff !important;
  border:1px solid #dee2e6 !important;
  color:#000000 !important;
}



/* =========================================================
   TEMA BLANCO – TODOS LOS BOTONES NEGROS
   ========================================================= */
body.tema-blanco .btn,
body.tema-blanco button,
body.tema-blanco input[type="submit"],
body.tema-blanco input[type="button"]{
  background:#000000 !important;
  color:#ffffff !important;
  border-color:#000000 !important;
}

body.tema-blanco .btn:hover,
body.tema-blanco button:hover{
  background:#111111 !important;
  color:#ffffff !important;
}

/* Botones del header / navegación */
body.tema-blanco .navbar a,
body.tema-blanco .navbar .nav-link,
body.tema-blanco header a.btn,
body.tema-blanco header .btn{
  background:#000000 !important;
  color:#ffffff !important;
  border-radius:6px;
  padding:6px 12px;
}

/* Quitar estilos previos de colores */
body.tema-blanco .btn-primary,
body.tema-blanco .btn-secondary,
body.tema-blanco .btn-success,
body.tema-blanco .btn-info,
body.tema-blanco .btn-warning,
body.tema-blanco .btn-danger{
  background:#000000 !important;
  color:#ffffff !important;
  border-color:#000000 !important;
}

/* =========================================================
   TEMA BLANCO v2 (rediseño completo)
   Paleta: azul + verde + blanco + gris
   Fecha: 2026-01-26
   (Sí, esto va al final para ganarle a reglas viejas.)
   ========================================================= */

body.tema-blanco{
  --w-bg: #F4F6F8;
  --w-surface: #FFFFFF;
  --w-border: #E1E5EA;
  --w-text: #1F2933;
  --w-text2: #5F6C7B;
  --w-primary: #2563EB;
  --w-primary-700: #1E40AF;
  --w-primary-soft: #E8F0FE;
  --w-success: #16A34A;
  --w-success-soft: #EAF7EF;
  --w-danger-soft: #FEE2E2;
  --w-warning-soft: #FEF3C7;
  background: var(--w-bg) !important;
  color: var(--w-text) !important;
}

/* Texto */
body.tema-blanco,
body.tema-blanco p,
body.tema-blanco span,
body.tema-blanco label,
body.tema-blanco small,
body.tema-blanco .text-muted{
  color: var(--w-text) !important;
}
body.tema-blanco .text-muted{ color: var(--w-text2) !important; }

/* Links */
body.tema-blanco a{ color: var(--w-primary) !important; }
body.tema-blanco a:hover{ color: var(--w-primary-700) !important; }

/* Header / topbar / sidebar */
body.tema-blanco header,
body.tema-blanco .header,
body.tema-blanco .navbar,
body.tema-blanco .topbar,
body.tema-blanco .sidebar,
body.tema-blanco .sidebar-wrapper,
body.tema-blanco .nav-header{
  background: var(--w-surface) !important;
  color: var(--w-text) !important;
  border-color: var(--w-border) !important;
}
body.tema-blanco .topbar,
body.tema-blanco header,
body.tema-blanco .navbar{
  border-bottom: 1px solid var(--w-border) !important;
}

/* Contenedores / cards */
body.tema-blanco .card,
body.tema-blanco .panel,
body.tema-blanco .box,
body.tema-blanco .content-wrapper,
body.tema-blanco .content,
body.tema-blanco .wrapper{
  background: var(--w-surface) !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border) !important;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.04);
}

/* Inputs */
body.tema-blanco input,
body.tema-blanco select,
body.tema-blanco textarea{
  background: var(--w-surface) !important;
  color: var(--w-text) !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 8px;
}
body.tema-blanco input:focus,
body.tema-blanco select:focus,
body.tema-blanco textarea:focus{
  border-color: var(--w-primary) !important;
  box-shadow: 0 0 0 2px rgba(37,99,235,0.15) !important;
  outline: none;
}

/* Tablas */
body.tema-blanco table,
body.tema-blanco .table{ color: var(--w-text) !important; }
body.tema-blanco .table thead th{
  background: #F1F5F9 !important;
  color: var(--w-text) !important;
  border-bottom: 1px solid var(--w-border) !important;
}
body.tema-blanco .table td,
body.tema-blanco .table th{ border-top: 1px solid var(--w-border) !important; }

/* Badges / etiquetas */
body.tema-blanco .badge,
body.tema-blanco .label{
  background: var(--w-primary-soft) !important;
  color: var(--w-primary) !important;
  border: 1px solid rgba(37,99,235,0.15) !important;
  border-radius: 999px;
  font-weight: 700;
}
body.tema-blanco .badge-success{ background: var(--w-success-soft) !important; color: var(--w-success) !important; border-color: rgba(22,163,74,0.18) !important; }

/* Alertas (si existen) */
body.tema-blanco .alert-info{ background: var(--w-primary-soft) !important; color: #1E3A8A !important; border-color: rgba(37,99,235,0.2) !important; }
body.tema-blanco .alert-success{ background: var(--w-success-soft) !important; color: #166534 !important; border-color: rgba(22,163,74,0.2) !important; }
body.tema-blanco .alert-danger{ background: var(--w-danger-soft) !important; color: #991B1B !important; border-color: rgba(153,27,27,0.2) !important; }
body.tema-blanco .alert-warning{ background: var(--w-warning-soft) !important; color: #92400E !important; border-color: rgba(146,64,14,0.2) !important; }

/* Botones */
body.tema-blanco .btn,
body.tema-blanco button{
  border-radius: 8px;
}
body.tema-blanco .btn-primary{
  background: var(--w-primary) !important;
  color: #FFFFFF !important;
  border: 1px solid var(--w-primary) !important;
}
body.tema-blanco .btn-primary:hover{ background: var(--w-primary-700) !important; border-color: var(--w-primary-700) !important; }

body.tema-blanco .btn-success{
  background: var(--w-success) !important;
  color: #FFFFFF !important;
  border: 1px solid var(--w-success) !important;
}

body.tema-blanco .btn-secondary,
body.tema-blanco .btn-dark{
  background: #D1D5DB !important;
  color: var(--w-text) !important;
  border: 1px solid #CBD5E1 !important;
}
body.tema-blanco .btn-secondary:hover,
body.tema-blanco .btn-dark:hover{
  background: #9CA3AF !important;
}

/* Outline (ej. header buttons, dropdown, etc.) */
body.tema-blanco .btn-outline,
body.tema-blanco .btn.btn-outline{
  background: var(--w-surface) !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border) !important;
}

/* =========================================================
   TEMA BLANCO v3 (ajustes finos por legibilidad)
   Si otra regla está rompiendo texto/fondos, esto gana.
   ========================================================= */

/* Texto secundario real (la clase .muted se estaba quedando casi invisible) */
body.tema-blanco .muted{ color: var(--w-text2) !important; }

/* Encabezados de tablas/filas (adiós al azul en headers) */
body.tema-blanco .tr.th,
body.tema-blanco .clients-head{
  background: #F1F5F9 !important;
  color: var(--w-text2) !important;
  border-bottom: 1px solid var(--w-border) !important;
  border-top: 0 !important;
}

/* Tabla de pólizas (columna descripción y textos) */
body.tema-blanco .tr--policies > div,
body.tema-blanco .tr--policies .muted{
  color: var(--w-text2) !important;
}

/* Badge de póliza: conserva color configurado pero garantiza legibilidad */
body.tema-blanco .badge-policy{
  color:#ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.60) !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
}

/* Slider / marquee (newsbar): fondo suave, texto legible */
body.tema-blanco .newsbar{
  background: #F1F5F9 !important;
  border: 1px solid var(--w-border) !important;
}
body.tema-blanco .newsbar__text{
  color: var(--w-text) !important;
}

/* Botones del header (nav links) con fondo, sin negro agresivo */
body.tema-blanco .nav a{
  background: #F1F5F9 !important;
  border: 1px solid var(--w-border) !important;
  color: var(--w-text) !important;
  border-radius: 10px;
  padding: 8px 12px;
}
body.tema-blanco .nav a:hover{
  background: var(--w-primary-soft) !important;
  border-color: rgba(37,99,235,0.35) !important;
  color: var(--w-primary-700) !important;
}

/* “En proceso” no puede ser negro en tema blanco (se pierde y se ve raro) */
body.tema-blanco .pill--st-proceso{
  background: var(--w-primary-soft) !important;
  border-color: rgba(37,99,235,0.25) !important;
  color: var(--w-primary-700) !important;
  font-weight: 800 !important;
}
body.tema-blanco .pill--st-pausa{
  background: #FEF3C7 !important;
  border-color: rgba(146,64,14,0.20) !important;
  color: #92400E !important;
}
body.tema-blanco .pill--st-finalizado{
  background: var(--w-success-soft) !important;
  border-color: rgba(22,163,74,0.20) !important;
  color: #166534 !important;
}

/* Quita el “todos los botones negros” (era una bomba nuclear) */
body.tema-blanco .btn,
body.tema-blanco button,
body.tema-blanco input[type="submit"],
body.tema-blanco input[type="button"]{
  background: unset !important;
  color: unset !important;
  border-color: unset !important;
}

/* Respeta clases de botones existentes */
body.tema-blanco .btn.btn-green,
body.tema-blanco .btn-green{ background: #c45e39 !important; color:#1b1f05 !important; border-color: #c45e39 !important; }
body.tema-blanco .btn.btn-blue,
body.tema-blanco .btn-blue{ background: var(--w-primary) !important; color:#fff !important; border-color: var(--w-primary) !important; }
body.tema-blanco .btn.btn-outline,
body.tema-blanco .btn-outline{ background: #FFFFFF !important; color: var(--w-text) !important; border: 1px solid var(--w-border) !important; }
body.tema-blanco .btn.btn-outline:hover,
body.tema-blanco .btn-outline:hover{ background:#F1F5F9 !important; }
body.tema-blanco .btn-outline:hover,
body.tema-blanco .btn.btn-outline:hover{
  background: #F1F5F9 !important;
}

/* Si algo quedó con clases tipo bg-*, lo aterrizamos sin matar el diseño */
body.tema-blanco .bg-dark,
body.tema-blanco .bg-black{ background: var(--w-surface) !important; color: var(--w-text) !important; border: 1px solid var(--w-border) !important; }
body.tema-blanco .bg-primary{ background: var(--w-primary-soft) !important; color: var(--w-primary) !important; }
body.tema-blanco .bg-info{ background: var(--w-primary-soft) !important; color: var(--w-primary) !important; }
body.tema-blanco .bg-secondary{ background: #F1F5F9 !important; color: var(--w-text) !important; }

/* Login */
body.tema-blanco .login,
body.tema-blanco .login-page,
body.tema-blanco .auth-wrapper,
body.tema-blanco .auth,
body.tema-blanco .login-wrapper,
body.tema-blanco .login-container{
  background: var(--w-bg) !important;
  color: var(--w-text) !important;
}
body.tema-blanco .login .card,
body.tema-blanco .login-page .card,
body.tema-blanco .auth-wrapper .card{
  background: var(--w-surface) !important;
  border: 1px solid var(--w-border) !important;
}

/* Texto blanco forzado: en tema blanco se vuelve texto normal, excepto botones */
body.tema-blanco .text-white,
body.tema-blanco .text-white *,
body.tema-blanco [class*="text-white"],
body.tema-blanco [class*="text-white"] *{
  color: var(--w-text) !important;
}
body.tema-blanco .btn-primary,
body.tema-blanco .btn-primary *,
body.tema-blanco .btn-success,
body.tema-blanco .btn-success *{
  color: #FFFFFF !important;
}

/* =========================================================
   TEMA BLANCO v3 (RE-REDISEÑO)
   Objetivo: cero texto perdido por contrastes.
   Cambios solicitados:
   - Info de pólizas: descripción visible (muted legible)
   - Slider/newsbar: fondo suave, sin amarillo chillón
   - Encabezados/tablas: sin “azulón”
   - Botones del header/nav con fondo
   - Etiqueta “En proceso”: fondo/texto legibles
   ========================================================= */

/* Muted real (antes podía quedar demasiado claro) */
body.tema-blanco .muted{ color: var(--w-text2) !important; }

/* Header nav como botones (sin pintar el header de azul) */
body.tema-blanco .nav a{
  background: #F1F5F9 !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border) !important;
  border-radius: 10px;
  padding: 8px 12px;
}
body.tema-blanco .nav a:hover{
  background: var(--w-primary-soft) !important;
  border-color: rgba(37,99,235,0.30) !important;
  color: var(--w-primary-700) !important;
}

/* Botones del header (campana/salir/cerrar notif) con fondo consistente */
body.tema-blanco header .btn-outline,
body.tema-blanco header .btn.btn-outline{
  background: #F1F5F9 !important;
  color: var(--w-text) !important;
  border: 1px solid var(--w-border) !important;
}

/* =====================
   Notificaciones (campanita)
   ===================== */
.notif-row{
  display:flex;
  gap:10px;
  align-items:stretch;
  margin:8px 0;
}
.notif-row__btn{
  flex:1;
  width:100%;
}
.notif-row__check{
  display:flex;
  align-items:center;
  gap:6px;
  padding:10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  user-select:none;
  white-space:nowrap;
}
.tema-blanco .notif-row__check{
  border-color: rgba(0,0,0,.12);
}


/* Panel de notificaciones: fondo sólido para que no se mezcle con el contenido inferior */
.notif-panel-card{
  background: #111d2b !important;
  border: 1px solid rgba(148,163,184,.28) !important;
  box-shadow: 0 22px 48px rgba(0,0,0,.48) !important;
  backdrop-filter: none !important;
}
.tema-blanco .notif-panel-card{
  background: #ffffff !important;
  border-color: rgba(15,23,42,.16) !important;
  box-shadow: 0 22px 42px rgba(15,23,42,.18) !important;
}
.notif-panel-card .notif-row__btn{
  background: #243a5b !important;
  border-color: rgba(147,197,253,.28) !important;
  color: #f8fafc !important;
}
.tema-blanco .notif-panel-card .notif-row__btn{
  background: #eef4ff !important;
  border-color: rgba(37,99,235,.22) !important;
  color: #0f172a !important;
}
.notif-panel-card .muted{
  color: #cbd5e1 !important;
}
.tema-blanco .notif-panel-card .muted{
  color: #475569 !important;
}

/* =====================
   Header responsivo (móvil)
   ===================== */
.mobile-nav-toggle{ display:none; }
.mobile-nav{ display:none; width:100%; margin-top:10px; }
.mobile-nav a{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  margin:6px 0;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
}
.tema-blanco .mobile-nav a{
  border-color: rgba(0,0,0,.10);
  background: rgba(0,0,0,.04);
  color:#111;
}

@media (max-width: 820px){
  .topbar{ flex-wrap:wrap; }
  .nav{ display:none; }
  .mobile-nav-toggle{ display:inline-flex; margin-left:10px; }
  .userbox{ margin-left:auto; }
}
body.tema-blanco header .btn-outline:hover,
body.tema-blanco header .btn.btn-outline:hover{
  background: #E5E7EB !important;
}

/* Encabezados de tablas tipo "tr th" (los de tu tabla custom, no <th>) */
body.tema-blanco .tr.th,
body.tema-blanco .clients-head{
  background: #F1F5F9 !important;
  color: var(--w-text2) !important;
  border: 1px solid var(--w-border) !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* Newsbar/slider (adiós fondo oscuro + texto amarillo) */
body.tema-blanco .newsbar{
  background: #FFFFFF !important;
  border: 1px solid var(--w-border) !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.04);
}
body.tema-blanco .newsbar__text{
  color: var(--w-text) !important;
  font-weight: 700;
}
body.tema-blanco .newsbar{
  position: relative;
}
body.tema-blanco .newsbar:before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:6px;
  background: linear-gradient(180deg, var(--w-primary), var(--w-success));
}
body.tema-blanco .newsbar__text{ padding-left: 22px !important; }

/* Estado "En proceso" (pill) */
body.tema-blanco .pill--st-proceso{
  background: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: var(--w-text) !important;
  font-weight: 800;
}
body.tema-blanco .pill--st-pausa{
  background: #FEF3C7 !important;
  border-color: #F59E0B !important;
  color: #1F2933 !important;
}
body.tema-blanco .pill--st-finalizado{
  background: var(--w-success-soft) !important;
  border-color: rgba(22,163,74,0.25) !important;
  color: #166534 !important;
}

/* Badge de póliza: texto siempre visible aunque el color sea "creativo" */
body.tema-blanco .badge-policy{
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.55);
  border: 1px solid rgba(0,0,0,0.15);
}

/* En listado/tabla de pólizas: asegurar que la columna descripción no herede colores raros */
body.tema-blanco .tr--policies > div:nth-child(2),
body.tema-blanco .tr--policies .muted{
  color: var(--w-text2) !important;
}





/* ===============================
   AJUSTES EXTRA - TEMA BLANCO (v4)
   Fixes de legibilidad solicitados
   =============================== */
body.tema-blanco .badge,
body.tema-blanco .label{
  /* Etiquetas generales: verde claro transparente */
  background: rgba(22,163,74,0.10) !important;
  border: 1px solid rgba(22,163,74,0.22) !important;
  color: #0F172A !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  padding: 8px 12px !important;
  border-radius: 12px !important;
}

/* Pills generales en tema blanco, PERO no tocar estatus/prioridad (tienen colores propios) */
body.tema-blanco .pill:not(.pill--st-proceso):not(.pill--st-pausa):not(.pill--st-finalizado):not(.pill--prio-low):not(.pill--prio-med):not(.pill--prio-crit){
  background: rgba(22,163,74,0.10) !important;
  border: 1px solid rgba(22,163,74,0.22) !important;
  color: #0F172A !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
}

/* Quitar cualquier fondo azul heredado en etiquetas/badges */
body.tema-blanco .badge.bg-primary,
body.tema-blanco .badge.bg-info,
body.tema-blanco .label.bg-primary,
body.tema-blanco .label.bg-info,
body.tema-blanco .pill.bg-primary,
body.tema-blanco .pill.bg-info{
  background: rgba(22,163,74,0.10) !important;
  border-color: rgba(22,163,74,0.22) !important;
  color: #0F172A !important;
}


/* Prioridad en ticket: no más fondos oscuros */
body.tema-blanco .pill--prio-low{ background:#EAF7EF !important; border-color:rgba(22,163,74,0.25) !important; color:#166534 !important; }
body.tema-blanco .pill--prio-med{ background:#FEF3C7 !important; border-color:rgba(245,158,11,0.35) !important; color:#92400E !important; }
body.tema-blanco .pill--prio-crit{ background:#FEE2E2 !important; border-color:rgba(220,38,38,0.35) !important; color:#991B1B !important; }

/* Mensaje "Guardado" (Configuración) - claro y visible */
body.tema-blanco .alert-ok{
  background: #EAF7EF !important;
  border-color: rgba(22,163,74,0.30) !important;
  color: #0F172A !important;
}

/* Flash (incluye avisos en tickets y respuestas del servidor) */
body.tema-blanco .flash{
  background: #FFFFFF !important;
  color: #0F172A !important;
  border-color: #CBD5E1 !important;
}
body.tema-blanco .flash--warn{
  background: #FEF9C3 !important;
  border-color: rgba(245,158,11,0.35) !important;
  color: #0F172A !important;
}
body.tema-blanco .flash--err{
  background: #FEE2E2 !important;
  border-color: rgba(220,38,38,0.35) !important;
  color: #0F172A !important;
}

/* Valores en ticket (prebox) estaban oscuros */
body.tema-blanco .prebox{
  background: #F8FAFC !important;
  color: #0F172A !important;
  border-color: #CBD5E1 !important;
}

/* Conversación del ticket: fondos claros, bordes por rol */
body.tema-blanco .msg{ border-color:#E5E7EB !important; }
body.tema-blanco .msg--admin{ background:#FFF7ED !important; border-color:#FDBA74 !important; color:#0F172A !important; }
body.tema-blanco .msg--soporte{ background:#EAF7EF !important; border-color:#86EFAC !important; color:#0F172A !important; }
body.tema-blanco .msg--usuario{ background:#F3F4F6 !important; border-color:#D1D5DB !important; color:#0F172A !important; }
body.tema-blanco .msg__meta .muted{ color:#475569 !important; }
body.tema-blanco .msg__body,
body.tema-blanco .msg__body *{ color:#0F172A !important; }

/* Botón WhatsApp: icono blanco dentro del botón verde */
body.tema-blanco .btn.btn-green .wa-icon{ color:#FFFFFF !important; }
body.tema-blanco .btn.btn-green .wa-icon svg{ fill: currentColor !important; }



/* ===== Theme White tweaks (v7) ===== */
.tema-blanco .label{
  background: rgba(22,163,74,0.10);
  border: 1px solid rgba(22,163,74,0.25);
  color:#14532d;
  font-size: 15px;
  padding: 10px 14px;
  border-radius: 12px;
  display:block;
  width:100%;
  width: 100%;
  box-sizing: border-box;
}

/* Dropzone hint */
.tema-blanco .dropzone{
  background: rgba(22,163,74,0.92);
  border-color: rgba(255,255,255,0.55);
}
.tema-blanco .drop-hint{
  color:#fff;
  font-size: 16px;
  font-weight: 700;
}
.tema-blanco .drop-hint .link{
  color:#fff;
  text-decoration: underline;
}

/* Client view labels */
.tema-blanco .field-label{
  font-weight: 800;
  font-size: 15px;
  color:#111827;
  margin-bottom: 2px;
}

/* Dark theme field labels (tickets/view + admin/clients/view + info cliente) */
.tema-negro .field-label{
  font-weight: 800;
  font-size: 15px;
  color:#ffffff;
  margin-bottom: 2px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
  padding: 4px 8px;
  border-radius: 10px;
  display: inline-block;
}

/* Ticket list status pills */
.tema-blanco .pill--st-proceso{
  background: rgba(37,99,235,0.14);
  border-color: rgba(37,99,235,0.25);
  color:#1e3a8a;
  font-weight: 800;
}
.tema-blanco .pill--st-pausa{
  background: rgba(245,158,11,0.18);
  border-color: rgba(245,158,11,0.25);
  color:#92400e;
  font-weight: 800;
}
.tema-blanco .pill--st-finalizado{
  background: rgba(22,163,74,0.16);
  border-color: rgba(22,163,74,0.25);
  color:#166534;
  font-weight: 800;
}


/* === Tema Blanco: mejoras de legibilidad === */
.tema-blanco .field-label{
  font-weight:800;
  font-size:15px;
  color:#1f2933;
  margin-bottom:6px;
}

.tema-blanco .field-value{
  background: rgba(22,163,74,0.06);
  border: 1px solid rgba(22,163,74,0.18);
  border-radius: 10px;
  padding: 10px 12px;
  color:#0f172a;
  min-height: 38px;
  display:flex;
  align-items:center;
}

/* Preboxes (Datos adicionales / Observaciones) */
.tema-blanco .prebox{
  background: rgba(22,163,74,0.06);
  border: 1px solid rgba(22,163,74,0.18);
  color:#0f172a;
}

/* Estatus (listado tickets) - colores por estado */
.tema-blanco .pill--st-proceso{
  background: rgba(37,99,235,0.14);
  border-color: rgba(37,99,235,0.25);
  color:#1e3a8a;
  font-weight:800;
}
.tema-blanco .pill--st-pausa{
  background: rgba(245,158,11,0.18);
  border-color: rgba(245,158,11,0.28);
  color:#7c2d12;
  font-weight:800;
}
.tema-blanco .pill--st-finalizado{
  background: rgba(22,163,74,0.16);
  border-color: rgba(22,163,74,0.26);
  color:#14532d;
  font-weight:800;
}

/* Toolbar para redimensionar imágenes del editor */
.rte-wrap{ position: relative; }
.rte-img-toolbar{
  position: absolute;
  top: 8px;
  right: 8px;
  background: #ffffff;
  border: 1px solid #e1e5ea;
  border-radius: 10px;
  padding: 8px 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
  z-index: 50;
}
.rte-img-toolbar__row{ display:flex; align-items:center; gap:8px; }
.rte-img-toolbar__label{ font-size:12px; color:#334155; font-weight:700; }
.rte-img-toolbar__range{ width: 130px; }
.rte-img-toolbar__pct{ font-size:12px; color:#0f172a; min-width:42px; text-align:right; font-weight:800; }
.rte-img-toolbar__btn{
  background:#111827;
  color:#fff;
  border:0;
  border-radius:8px;
  padding:6px 8px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.rte-img-toolbar__btn:hover{ opacity:0.92; }

.rte-img-selected{
  outline: 2px solid rgba(37,99,235,0.55);
  outline-offset: 2px;
  border-radius: 6px;
}


/* === Ajustes tema blanco (alias real: .tema-blanco) === */
.tema-blanco .drop-hint{color:#fff !important; font-size:18px !important; font-weight:800 !important;}
.tema-blanco .drop-hint .link{color:#fff !important;}
/* Control flotante para redimensionar imágenes en editor */
.rte__imgctl{
  position: absolute;
  z-index: 9999;
  background: rgba(15,23,42,0.92);
  color:#fff;
  border:1px solid rgba(255,255,255,0.18);
  border-radius: 10px;
  padding: 8px 10px;
  display:none;
  gap:8px;
  align-items:center;
  font-size:12px;
}
.rte__imgctl input[type="range"]{ width: 140px; }
.rte__imgctl .btn-mini{
  background: rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.18);
  color:#fff;
  border-radius: 8px;
  padding: 6px 8px;
  cursor:pointer;
  font-weight:800;
}
.rte__imgctl .btn-mini:hover{ background: rgba(255,255,255,0.18); }



.tema-blanco .field-value{
  background: rgba(22,163,74,0.08) !important;
  border-color: rgba(22,163,74,0.22) !important;
}
.tema-blanco .prebox{
  background: rgba(15,23,42,0.04) !important;
  border: 1px solid rgba(15,23,42,0.10) !important;
  color:#0f172a !important;
}



/* WHITE THEME OVERRIDES */


/* Tema blanco */
.tema-blanco .drop-hint,
.tema-blanco .dz-hint,
.tema-blanco .dropzone-hint{
  color:#ffffff !important;
  font-size:1.05rem !important;
  font-weight:700 !important;
}

/* Selects legibles en tema blanco (Agente asignado, Estatus, etc.) */
.tema-blanco select,
.tema-blanco .form-select,
.tema-blanco .select{
  background:#ffffff !important;
  border:1px solid #cbd5e1 !important;
  color:#1f2933 !important;
}

/* Valores estilo "RFC" (cliente y ticket) */
.tema-blanco .field-value{
  background: rgba(22,163,74,0.10) !important;
  border: 1px solid rgba(22,163,74,0.25) !important;
  color:#1f2933 !important;
  border-radius:10px !important;
  padding:10px 12px !important;
  line-height:1.25 !important;
}
.tema-blanco .field-value--block{
  white-space: pre-wrap !important;
  min-height: 44px;
  display:block !important;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Evitar que links/cadenas largas (credenciales/URLs) revienten el contenedor */
.tema-blanco .field-value--block a,
.field-value--block a{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* El bloque de observaciones/credenciales puede venir como HTML (rte-content) */
.rte-content,
.rte-content *{
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Preboxes del ticket/cliente con el mismo estilo */
.tema-blanco .prebox{
  background: rgba(22,163,74,0.10) !important;
  border: 1px solid rgba(22,163,74,0.25) !important;
  color:#1f2933 !important;
}

/* Descripción pólizas: más visible */
.tema-blanco .policy-desc{
  font-weight:800 !important;
  font-size:1.02rem !important;
  color:#1f2933 !important;
}

/* Estatus: colores por estado en listado */
.tema-blanco .pill--st-proceso{ background: rgba(37,99,235,0.14) !important; border-color: rgba(37,99,235,0.35) !important; color:#1e3a8a !important; }
.tema-blanco .pill--st-pausa{ background: rgba(245,158,11,0.18) !important; border-color: rgba(245,158,11,0.40) !important; color:#92400e !important; }
.tema-blanco .pill--st-finalizado{ background: rgba(22,163,74,0.14) !important; border-color: rgba(22,163,74,0.40) !important; color:#166534 !important; }



/* Previsualización de imágenes adjuntas en conversación */
.msg__imgwrap{display:flex; flex-direction:column; gap:6px; margin-top:8px}
.msg__img{max-width:520px; width:100%; height:auto; border-radius:12px; border:1px solid var(--line)}
body.tema-blanco .msg__img{border-color:#E5E7EB !important;}
.msg__imgmeta{display:flex; gap:8px; align-items:center; flex-wrap:wrap}


/* Labels con fondo en vistas (tema negro) */
body:not(.tema-blanco) .view-fields .field-label{
  display:inline-block;
  padding:4px 8px;
  border-radius:10px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
}

/* Contenido rich-text (observaciones) */
.rte-content a{ color: var(--blue); text-decoration: underline; }
.rte-content ul, .rte-content ol{ margin: 8px 0 8px 22px; }
.rte-content p{ margin: 8px 0; }


/* ===== FIX: evitar desbordes en tema blanco (cadenas largas en vista cliente/ticket) ===== */
.grid2 > div{min-width:0}
.field-value{
  min-width:0;
  flex-wrap:wrap;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.field-value a{
  overflow-wrap:anywhere;
  word-break:break-word;
}
body.tema-blanco .field-value{
  overflow-wrap:anywhere;
  word-break:break-word;
}



/* Tabla de usuarios: mantener acciones visibles en móvil */
.tr--users{grid-template-columns: .8fr 1.2fr 1.3fr 1fr .8fr 1.2fr auto}
.user-actions{justify-content:flex-end}
.user-actions form{margin:0}
@media (max-width:980px){
  .table-users .tr--users{
    grid-template-columns: minmax(54px,.7fr) minmax(110px,1.15fr) minmax(120px,1.2fr) minmax(138px,auto) !important;
    align-items:center;
  }
  .table-users .tr--users > div:nth-child(4),
  .table-users .tr--users > div:nth-child(5),
  .table-users .tr--users > div:nth-child(6){display:none !important}
  .table-users .tr--users > div:nth-child(7){
    display:flex !important;
    justify-content:flex-end;
    min-width:138px;
  }
  .table-users .tr--users > div:nth-child(7).user-actions{
    gap:6px;
    flex-wrap:wrap;
  }
  .table-users .tr--users > div:nth-child(7) .btn{
    padding:8px 10px;
    font-size:12px;
    white-space:nowrap;
  }
  .table-users .tr--users.th > div:nth-child(7){
    font-size:12px;
  }
}


/* Usuarios en móvil: barra de acciones separada para que Editar/Eliminar no desaparezcan */
.user-mobile-actions{display:none; margin:8px 10px 14px; padding:10px 12px; border:1px solid var(--line)}
.user-mobile-actions__meta{display:flex; flex-direction:column; gap:3px; margin-bottom:8px}
.user-mobile-actions__buttons{gap:8px; justify-content:flex-end}
.user-mobile-actions__buttons form{margin:0}
@media (max-width:980px){
  .table-users .tr--users.th{display:none}
  .table-users .tr--users{
    grid-template-columns: 60px 1fr 1fr !important;
    gap:8px;
    padding-bottom:6px;
  }
  .table-users .tr--users > div:nth-child(4),
  .table-users .tr--users > div:nth-child(5),
  .table-users .tr--users > div:nth-child(6),
  .table-users .tr--users > div:nth-child(7){display:none !important}
  .table-users .tr--users > div:nth-child(1),
  .table-users .tr--users > div:nth-child(2),
  .table-users .tr--users > div:nth-child(3){display:block !important}
  .user-mobile-actions{display:block}
}


/* =====================
   Topbar oscuro más agradable
   ===================== */
body:not(.tema-blanco) .topbar{
  background: linear-gradient(180deg, rgba(10,14,20,.96), rgba(14,21,32,.94));
  border-bottom-color: rgba(101,141,190,.18);
  box-shadow: 0 10px 30px rgba(0,0,0,.28);
}
body:not(.tema-blanco) .nav a,
body:not(.tema-blanco) .mobile-nav a{
  background: linear-gradient(180deg, rgba(41,58,84,.96), rgba(18,28,44,.96)) !important;
  color: #e7f0ff !important;
  border: 1px solid rgba(126,167,221,.30) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.18) !important;
}
body:not(.tema-blanco) .nav a:hover,
body:not(.tema-blanco) .mobile-nav a:hover,
body:not(.tema-blanco) .nav a:focus-visible,
body:not(.tema-blanco) .mobile-nav a:focus-visible{
  color: #ffffff !important;
  border-color: rgba(111,177,255,.52) !important;
  background: linear-gradient(180deg, rgba(57,80,116,.98), rgba(23,37,58,.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px rgba(0,0,0,.22) !important;
}
body:not(.tema-blanco) .topbar .btn-outline,
body:not(.tema-blanco) .topbar .btn.btn-outline,
body:not(.tema-blanco) .topbar .mobile-nav-toggle,
body:not(.tema-blanco) .topbar #notifBtn{
  background: linear-gradient(180deg, rgba(44,63,92,.98), rgba(19,30,46,.98)) !important;
  border-color: rgba(126,167,221,.30) !important;
  color: #eef5ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 8px 22px rgba(0,0,0,.18) !important;
}
body:not(.tema-blanco) .topbar .btn-outline:hover,
body:not(.tema-blanco) .topbar .btn.btn-outline:hover,
body:not(.tema-blanco) .topbar .btn-outline:focus-visible,
body:not(.tema-blanco) .topbar .btn.btn-outline:focus-visible,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:hover,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:focus-visible,
body:not(.tema-blanco) .topbar #notifBtn:hover,
body:not(.tema-blanco) .topbar #notifBtn:focus-visible{
  background: linear-gradient(180deg, rgba(62,88,126,.99), rgba(25,41,63,.99)) !important;
  border-color: rgba(111,177,255,.52) !important;
  color: #ffffff !important;
}


body:not(.tema-blanco) .topbar .nav a,
body:not(.tema-blanco) .topbar .userbox .btn,
body:not(.tema-blanco) .topbar .mobile-nav-toggle,
body:not(.tema-blanco) .topbar #notifBtn{
  background: linear-gradient(180deg, rgba(25,38,58,.96), rgba(13,22,36,.96)) !important;
  border: 1px solid rgba(95,129,170,.28) !important;
  color: #dbe9ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 6px 18px rgba(0,0,0,.22) !important;
}
body:not(.tema-blanco) .topbar .nav a:hover,
body:not(.tema-blanco) .topbar .nav a:focus-visible,
body:not(.tema-blanco) .topbar .userbox .btn:hover,
body:not(.tema-blanco) .topbar .userbox .btn:focus-visible,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:hover,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:focus-visible,
body:not(.tema-blanco) .topbar #notifBtn:hover,
body:not(.tema-blanco) .topbar #notifBtn:focus-visible{
  background: linear-gradient(180deg, rgba(40,60,88,.98), rgba(20,32,50,.98)) !important;
  border-color: rgba(111,177,255,.42) !important;
  color: #ffffff !important;
}
/* =====================
   Campos de contraseña elegantes y discretos
   ===================== */
.password-field{
  position: relative !important;
  display: block !important;
  width: 100% !important;
}
.password-field > .input.password-field__input,
.password-field > input.password-field__input,
.password-field > input[type="password"].password-field__input,
.password-field > input[type="text"].password-field__input{
  width: 100% !important;
  padding-right: 44px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.password-field > input[type="password"].password-field__input::-ms-reveal,
.password-field > input[type="password"].password-field__input::-ms-clear{
  display: none !important;
}
.password-field > input[type="password"].password-field__input::-webkit-credentials-auto-fill-button,
.password-field > input[type="password"].password-field__input::-webkit-textfield-decoration-container{
  visibility: hidden !important;
  display: none !important;
  pointer-events: none !important;
}
.password-field > .password-toggle{
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 4 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(214, 229, 255, .78) !important;
  cursor: pointer;
  outline: none !important;
}
.password-field > .password-toggle:hover,
.password-field > .password-toggle:focus-visible{
  background: rgba(100, 149, 237, .10) !important;
  color: #ffffff !important;
}
.password-field > .password-toggle:active{
  transform: translateY(-50%) scale(.96) !important;
}
.password-field > .password-toggle .password-toggle__icon{
  width: 16px !important;
  height: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
}
.password-field > .password-toggle .password-toggle__icon svg{
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
body:not(.tema-blanco) .password-field > .password-toggle{
  color: rgba(218, 231, 255, .76) !important;
}
body:not(.tema-blanco) .password-field > .password-toggle:hover,
body:not(.tema-blanco) .password-field > .password-toggle:focus-visible{
  background: rgba(103, 156, 255, .12) !important;
  color: #f8fbff !important;
}
body.tema-blanco .password-field > .password-toggle{
  color: rgba(51, 65, 85, .72) !important;
}
body.tema-blanco .password-field > .password-toggle:hover,
body.tema-blanco .password-field > .password-toggle:focus-visible{
  background: rgba(37, 99, 235, .08) !important;
  color: #0f172a !important;
}

/* =====================
   Botones de topbar más visibles en tema oscuro
   ===================== */
body:not(.tema-blanco) .topbar .btn,
body:not(.tema-blanco) .topbar a.btn,
body:not(.tema-blanco) .topbar button.btn,
body:not(.tema-blanco) .topbar .btn-outline,
body:not(.tema-blanco) .topbar .btn.btn-outline,
body:not(.tema-blanco) .topbar .mobile-nav-toggle,
body:not(.tema-blanco) .topbar #notifBtn{
  background: linear-gradient(180deg, rgba(56, 82, 120, .98), rgba(24, 38, 58, .98)) !important;
  border: 1px solid rgba(134, 180, 245, .34) !important;
  color: #f4f8ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.22) !important;
}
body:not(.tema-blanco) .topbar .btn:hover,
body:not(.tema-blanco) .topbar a.btn:hover,
body:not(.tema-blanco) .topbar button.btn:hover,
body:not(.tema-blanco) .topbar .btn:focus-visible,
body:not(.tema-blanco) .topbar a.btn:focus-visible,
body:not(.tema-blanco) .topbar button.btn:focus-visible,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:hover,
body:not(.tema-blanco) .topbar .mobile-nav-toggle:focus-visible,
body:not(.tema-blanco) .topbar #notifBtn:hover,
body:not(.tema-blanco) .topbar #notifBtn:focus-visible{
  background: linear-gradient(180deg, rgba(79, 114, 163, .99), rgba(33, 53, 82, .99)) !important;
  border-color: rgba(161, 205, 255, .58) !important;
  color: #ffffff !important;
  outline: none !important;
}


/* =====================
   Campos de contraseña discretos dentro del input
   ===================== */
.password-field{
  position: relative !important;
  width: 100% !important;
  display: block !important;
}
.password-field > .input.password-field__input,
.password-field > input.password-field__input,
.password-field > input[type="password"].password-field__input,
.password-field > input[type="text"].password-field__input{
  width: 100% !important;
  padding-right: 46px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.password-field > .password-toggle{
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(138,160,182,.16) !important;
  color: #9fb3c8 !important;
  cursor: pointer !important;
  user-select: none !important;
  z-index: 5 !important;
  box-shadow: none !important;
  outline: none !important;
}
.password-field > .password-toggle:hover,
.password-field > .password-toggle:focus-visible{
  background: rgba(89,176,255,.12) !important;
  border-color: rgba(89,176,255,.30) !important;
  color: #eaf2ff !important;
}
.password-field > .password-toggle:active{
  transform: translateY(-50%) scale(.96) !important;
}
.password-field > .password-toggle .password-toggle__icon{
  width: 15px !important;
  height: 15px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
}
.password-field > .password-toggle .password-toggle__icon svg{
  width: 15px !important;
  height: 15px !important;
  display: block !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
body.tema-blanco .password-field > .password-toggle{
  background: rgba(15,23,42,.04) !important;
  border-color: rgba(15,23,42,.12) !important;
  color: #475569 !important;
}
body.tema-blanco .password-field > .password-toggle:hover,
body.tema-blanco .password-field > .password-toggle:focus-visible{
  background: rgba(59,130,246,.08) !important;
  border-color: rgba(59,130,246,.18) !important;
  color: #1e293b !important;
}

/* Oculta los iconos nativos de mostrar contraseña/autofill del navegador */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
input[type="password"]::-webkit-credentials-auto-fill-button,
input[type="password"]::-webkit-textfield-decoration-container,
input[type="password"]::-webkit-contacts-auto-fill-button{
  visibility: hidden !important;
  display: none !important;
  pointer-events: none !important;
  position: absolute !important;
  right: 0 !important;
}



/* ===== Password toggle final fix ===== */
.password-field{
  position: relative !important;
  width: 100% !important;
  display: block !important;
}
.password-field > .password-field__input{
  width: 100% !important;
  padding-right: 46px !important;
}
.password-field > .password-toggle{
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(120, 146, 176, .18) !important;
  background: rgba(255,255,255,.04) !important;
  box-shadow: none !important;
  overflow: hidden !important;
  cursor: pointer !important;
  z-index: 6 !important;
}
.password-field > .password-toggle:hover,
.password-field > .password-toggle:focus-visible{
  background: rgba(89,176,255,.12) !important;
  border-color: rgba(89,176,255,.30) !important;
}
.password-field > .password-toggle:active{
  transform: translateY(-50%) scale(.96) !important;
}
.password-field > .password-toggle .password-toggle__icon{
  position: relative !important;
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  max-width: 14px !important;
  min-height: 14px !important;
  max-height: 14px !important;
  display: block !important;
  flex: 0 0 14px !important;
}
.password-field > .password-toggle .password-toggle__icon::before,
.password-field > .password-toggle .password-toggle__icon::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
}
.password-field > .password-toggle .password-toggle__icon::before{
  border: 1.8px solid currentColor !important;
  border-radius: 75% 15% 75% 15% / 75% 15% 75% 15% !important;
  transform: rotate(45deg) !important;
  opacity: .92 !important;
}
.password-field > .password-toggle .password-toggle__icon::after{
  width: 4px !important;
  height: 4px !important;
  min-width: 4px !important;
  min-height: 4px !important;
  max-width: 4px !important;
  max-height: 4px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon::after{
  opacity: 0 !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon{
  transform: rotate(-8deg) !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon span{
  display: none !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon::before{
  border-color: currentColor !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon{
  position: relative !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon{
  overflow: visible !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon:after{
  opacity: .0 !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon:before{
  opacity: .9 !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon{
  color: inherit !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon + *{
  display: none !important;
}
.password-field > .password-toggle.is-visible::after{
  content: "" !important;
  position: absolute !important;
  width: 16px !important;
  height: 1.8px !important;
  background: currentColor !important;
  border-radius: 999px !important;
  transform: rotate(-35deg) !important;
}
body:not(.tema-blanco) .password-field > .password-toggle{
  color: rgba(214,229,255,.78) !important;
}
body.tema-blanco .password-field > .password-toggle{
  color: #475569 !important;
  background: rgba(15,23,42,.04) !important;
  border-color: rgba(15,23,42,.12) !important;
}
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
input[type="password"]::-webkit-credentials-auto-fill-button,
input[type="password"]::-webkit-textfield-decoration-container,
input[type="password"]::-webkit-contacts-auto-fill-button{
  visibility: hidden !important;
  display: none !important;
  pointer-events: none !important;
}



/* ===== Password toggle clean override ===== */
.password-field{
  position:relative !important;
  width:100% !important;
}
.password-field > .password-field__input{
  width:100% !important;
  padding-right:52px !important;
}
.password-field > .password-toggle{
  appearance:none !important;
  -webkit-appearance:none !important;
  position:absolute !important;
  top:50% !important;
  right:12px !important;
  transform:translateY(-50%) !important;
  width:30px !important;
  height:30px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  outline:none !important;
  background:transparent !important;
  box-shadow:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  z-index:8 !important;
}
.password-field > .password-toggle::before{
  content:"" !important;
  position:absolute !important;
  inset:2px !important;
  border-radius:999px !important;
  background:transparent !important;
  transition:background .18s ease, box-shadow .18s ease !important;
}
.password-field > .password-toggle:hover::before,
.password-field > .password-toggle:focus-visible::before{
  background:rgba(255,255,255,.08) !important;
}
body.tema-blanco .password-field > .password-toggle:hover::before,
body.tema-blanco .password-field > .password-toggle:focus-visible::before{
  background:rgba(15,23,42,.07) !important;
}
.password-field > .password-toggle .password-toggle__icon{
  position:relative !important;
  width:18px !important;
  height:18px !important;
  display:block !important;
  flex:0 0 18px !important;
  color:inherit !important;
}
.password-field > .password-toggle .password-toggle__icon--hide{
  display:none !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon--show{
  display:none !important;
}
.password-field > .password-toggle.is-visible .password-toggle__icon--hide{
  display:block !important;
}
body:not(.tema-blanco) .password-field > .password-toggle{
  color:rgba(220,232,252,.92) !important;
}
body.tema-blanco .password-field > .password-toggle{
  color:#475569 !important;
}
.password-field > .password-toggle svg{
  overflow:visible !important;
}
.password-field > .password-toggle .password-toggle__icon::before,
.password-field > .password-toggle .password-toggle__icon::after,
.password-field > .password-toggle.is-visible::after{
  content:none !important;
}


/* ===== Vista de ticket: refinamiento tema oscuro ===== */
body:not(.tema-blanco) .ticket-view-card{
  background: linear-gradient(180deg, rgba(12,18,28,0.96) 0%, rgba(10,15,24,0.98) 100%);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow: 0 18px 40px rgba(0,0,0,0.28);
}
body:not(.tema-blanco) .ticket-meta-grid{
  gap:14px;
  align-items:stretch;
}
body:not(.tema-blanco) .ticket-info-item{
  background: rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:14px;
  padding:14px 15px;
  min-height:100%;
}
body:not(.tema-blanco) .view-fields .field-label{
  display:block;
  padding:0;
  margin:0 0 8px;
  border:0;
  background:transparent;
  border-radius:0;
  color:#93a4bd;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body:not(.tema-blanco) .view-fields .field-value{
  display:block;
  padding:0;
  min-height:auto;
  background:transparent;
  border:0;
  border-radius:0;
  color:#f5f7fb;
  font-size:15px;
  line-height:1.55;
}
body:not(.tema-blanco) .view-fields .field-value--block{
  background: rgba(7,12,19,0.76);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:12px;
  padding:12px 13px;
}
body:not(.tema-blanco) .ticket-view-card .h3{
  margin-bottom:14px;
}
body:not(.tema-blanco) .ticket-view-card .ticket-select,
body:not(.tema-blanco) .ticket-view-card .input,
body:not(.tema-blanco) .ticket-view-card select{
  background:#0b1220;
  border-color:rgba(255,255,255,0.10);
}
body:not(.tema-blanco) .ticket-view-card .flash--warn{
  background: rgba(180,120,0,0.12);
  border-color: rgba(255,196,0,0.34);
  color:#fde68a;
}
body:not(.tema-blanco) .ticket-view-card .pill{
  box-shadow:none;
}
body:not(.tema-blanco) .ticket-view-card .badge-policy{
  color:#041018;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 8px 18px rgba(0,0,0,.18);
}
body:not(.tema-blanco) .msg__meta .field-label{
  margin-bottom:0;
}
@media (max-width: 720px){
  body:not(.tema-blanco) .ticket-info-item{
    padding:12px;
  }
}


/* ===== Vista de cliente: refinamiento tema oscuro ===== */
body:not(.tema-blanco) .client-view-card .field-value--block{
  min-height: 64px;
}
body:not(.tema-blanco) .client-view-card .pill--active,
body:not(.tema-blanco) .client-view-card .pill--inactive,
body:not(.tema-blanco) .client-view-card .badge-policy{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
body:not(.tema-blanco) .client-files-card{
  background: linear-gradient(180deg, rgba(12,18,28,0.96) 0%, rgba(10,15,24,0.98) 100%);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow: 0 18px 40px rgba(0,0,0,0.24);
}
body:not(.tema-blanco) .client-files-card .h3{
  margin-bottom:14px;
}
body:not(.tema-blanco) .client-files-card .table{
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,0.02);
}
body:not(.tema-blanco) .client-files-card .tr{
  align-items:center;
  border-top-color:rgba(255,255,255,0.07);
}
body:not(.tema-blanco) .client-files-card .tr.th{
  background:rgba(255,255,255,0.04);
  color:#93a4bd;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body:not(.tema-blanco) .client-files-card .tr:not(.th){
  color:#edf3ff;
}
body:not(.tema-blanco) .client-files-card .tr:not(.th):nth-child(even){
  background:rgba(255,255,255,0.015);
}


/* ===== Formulario cliente: rediseño dark + light ===== */
.form-page-head{
  margin-bottom:14px;
  align-items:flex-start;
}
.form-page-subtitle{
  max-width:760px;
  line-height:1.5;
}
.client-form-card{
  padding:18px;
}
.client-form-layout{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.form-intro-card,
.form-section-card{
  border-radius:18px;
  padding:16px;
  border:1px solid var(--line);
}
.form-intro-card{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.form-kicker{
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:8px;
}
.form-intro-title{
  font-size:20px;
  font-weight:800;
  line-height:1.3;
  margin-bottom:6px;
}
.form-intro-text,
.form-note{
  color:var(--muted);
  line-height:1.55;
  font-size:14px;
}
.form-meta-chip{
  min-width:220px;
  border-radius:14px;
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.form-meta-label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
.form-meta-value{
  font-size:14px;
  font-weight:700;
}
.form-section-title{
  font-size:15px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:14px;
}
.form-grid{
  margin-bottom:12px;
}
.form-grid:last-child{
  margin-bottom:0;
}
.client-form-card .form-field .label{
  display:block;
  margin:0 0 8px;
  padding:0;
  border:0;
  background:transparent !important;
  border-radius:0;
  font-size:11px !important;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.client-form-card .form-field .input,
.client-form-card .form-field select,
.client-form-card .form-field textarea,
.client-form-card .client-rte .rte__editor,
.client-form-card .client-rte .rte__toolbar,
.client-form-card .client-dropzone{
  border-radius:14px;
}
.client-form-card .form-field .input,
.client-form-card .form-field select,
.client-form-card .form-field textarea{
  min-height:48px;
  font-size:15px;
  line-height:1.45;
}
.client-form-card textarea.input{
  min-height:112px;
}
.check-card{
  min-height:48px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid var(--line);
}
.check-card span{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.check-card small{
  color:var(--muted);
  font-size:12px;
}
.client-dropzone{
  padding:18px;
}
.client-file-list{
  line-height:1.5;
  word-break:break-word;
}
.form-actions{
  padding-top:4px;
}
.client-form-files-card .table{
  border-radius:14px;
  overflow:hidden;
}
body:not(.tema-blanco) .client-form-card{
  background:linear-gradient(180deg, rgba(12,18,28,0.96) 0%, rgba(10,15,24,0.98) 100%);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 18px 40px rgba(0,0,0,0.28);
}
body:not(.tema-blanco) .form-intro-card,
body:not(.tema-blanco) .form-section-card,
body:not(.tema-blanco) .form-meta-chip{
  background:rgba(255,255,255,0.03);
  border-color:rgba(255,255,255,0.08);
}
body:not(.tema-blanco) .form-section-title,
body:not(.tema-blanco) .form-intro-title{
  color:#f5f7fb;
}
body:not(.tema-blanco) .client-form-card .form-field .label{
  color:#93a4bd !important;
}
body:not(.tema-blanco) .client-form-card .form-field .input,
body:not(.tema-blanco) .client-form-card .form-field select,
body:not(.tema-blanco) .client-form-card .form-field textarea{
  background:#0b1220;
  border-color:rgba(255,255,255,0.10);
  color:#f5f7fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.02);
}
body:not(.tema-blanco) .client-form-card .form-field .input:focus,
body:not(.tema-blanco) .client-form-card .form-field select:focus,
body:not(.tema-blanco) .client-form-card .form-field textarea:focus{
  border-color:rgba(89,176,255,0.55);
  box-shadow:0 0 0 4px rgba(89,176,255,0.10);
}
body:not(.tema-blanco) .check-card{
  background:#0b1220;
  border-color:rgba(255,255,255,0.10);
  color:#f5f7fb;
}
body:not(.tema-blanco) .client-form-card .client-rte .rte__toolbar{
  background:#0b1220;
  border-color:rgba(255,255,255,0.10);
  color:#f5f7fb;
}
body:not(.tema-blanco) .client-form-card .client-rte .rte__editor{
  background:#ffffff;
  border-color:#cfd8e3;
  color:#111827 !important;
  caret-color:#111827;
}
body:not(.tema-blanco) .client-form-card .client-rte .rte__btn{
  background:rgba(255,255,255,0.05);
  border-color:rgba(255,255,255,0.10);
  color:#f5f7fb;
}
body:not(.tema-blanco) .client-form-card .client-rte .rte__sep{
  background:rgba(255,255,255,0.12);
}
body:not(.tema-blanco) .client-form-card .client-dropzone{
  background:#0b1220;
  border-color:rgba(255,255,255,0.14);
}
body.tema-blanco .client-form-card{
  background:linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border-color:#dbe3ee;
  box-shadow:0 18px 42px rgba(15,23,42,0.08);
}
body.tema-blanco .form-intro-card,
body.tema-blanco .form-section-card,
body.tema-blanco .form-meta-chip{
  background:#f8fbff;
  border-color:#dbe4f0;
}
body.tema-blanco .form-section-title,
body.tema-blanco .form-intro-title{
  color:#0f172a;
}
body.tema-blanco .client-form-card .form-field .label{
  color:#475569 !important;
}
body.tema-blanco .client-form-card .form-field .input,
body.tema-blanco .client-form-card .form-field select,
body.tema-blanco .client-form-card .form-field textarea{
  background:#ffffff !important;
  border:1px solid #cfd8e3 !important;
  color:#0f172a !important;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
}
body.tema-blanco .client-form-card .form-field .input:focus,
body.tema-blanco .client-form-card .form-field select:focus,
body.tema-blanco .client-form-card .form-field textarea:focus{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 4px rgba(96,165,250,0.12);
}
body.tema-blanco .check-card{
  background:#ffffff;
  border-color:#cfd8e3;
  color:#0f172a;
}
body.tema-blanco .client-form-card .client-rte .rte__toolbar,
body.tema-blanco .client-form-card .client-rte .rte__editor{
  background:#ffffff;
  border-color:#cfd8e3;
  color:#0f172a;
}
body.tema-blanco .client-form-card .client-rte .rte__btn{
  background:#f8fafc;
  border-color:#d6dee8;
  color:#0f172a;
}
body.tema-blanco .client-form-card .client-dropzone{
  background:#f8fbff !important;
  border:1px dashed #aab9cc;
}
body.tema-blanco .client-form-card .drop-hint,
body.tema-blanco .client-form-card .drop-hint .link{
  color:#0f172a !important;
}
@media (max-width: 820px){
  .form-intro-card{
    flex-direction:column;
  }
  .form-meta-chip{
    min-width:0;
    width:100%;
  }
}


/* ===== Clientes: tablas táctiles y listado rediseñado ===== */
.table-scroll{
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
}
.table-scroll--files,
.table-scroll--clients{
  padding-bottom:4px;
}
.table-scroll--files .table--files,
.table-scroll--clients .table--clients{
  min-width:760px;
}
.tr--client-files{
  grid-template-columns: minmax(240px,2fr) 120px 160px 150px !important;
  align-items:center;
}
.tr--client-files > div:last-child{
  display:flex !important;
  justify-content:flex-end;
  gap:8px;
}
.client-form-files-card .row,
.client-files-card .row{
  flex-wrap:nowrap;
}
.client-form-files-card .btn,
.client-files-card .btn{
  white-space:nowrap;
}
.admin-clients-page-head{
  margin-bottom:14px;
  align-items:flex-start;
}
.page-subtle{
  color:var(--muted);
  line-height:1.55;
  max-width:820px;
}
.admin-clients-filter-card,
.admin-clients-table-card{
  border-radius:20px;
}
.section-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.section-kicker{
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:6px;
}
.admin-clients-filter-grid .form-field .label{
  display:block;
  margin:0 0 8px;
  padding:0;
  border:0;
  background:transparent !important;
  border-radius:0;
  font-size:11px !important;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.admin-clients-filter-grid .input,
.admin-clients-filter-grid select{
  min-height:48px;
  border-radius:14px;
}
.admin-clients-filter-actions{
  align-items:flex-end;
}
.table--clients{
  border-radius:16px;
  overflow:hidden;
}
.table-scroll--clients .clients-grid{
  grid-template-columns: 2fr 1.3fr 1.45fr .9fr 1fr 1.1fr 1.6fr;
  min-width:760px;
}
.table-scroll--clients .clients-head{
  padding:12px 14px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.table-scroll--clients .clients-row{
  padding:14px;
}
.cell-text{
  font-size:14px;
  line-height:1.45;
  word-break:break-word;
}
.cell-text--strong{
  font-weight:700;
}
.cell-muted{
  color:var(--muted);
  font-size:13px;
}
.clients-row-actions{
  flex-wrap:nowrap;
}
.clients-row-actions .btn,
.clients-row-actions form .btn{
  white-space:nowrap;
}
body:not(.tema-blanco) .admin-clients-filter-card,
body:not(.tema-blanco) .admin-clients-table-card{
  background:linear-gradient(180deg, rgba(12,18,28,0.96) 0%, rgba(10,15,24,0.98) 100%);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 18px 40px rgba(0,0,0,0.24);
}
body:not(.tema-blanco) .admin-clients-filter-grid .form-field .label{
  color:#93a4bd !important;
}
body:not(.tema-blanco) .admin-clients-filter-grid .input,
body:not(.tema-blanco) .admin-clients-filter-grid select{
  background:#0b1220;
  border-color:rgba(255,255,255,0.10);
  color:#f5f7fb;
}
body:not(.tema-blanco) .admin-clients-filter-grid .input:focus,
body:not(.tema-blanco) .admin-clients-filter-grid select:focus{
  border-color:rgba(89,176,255,0.55);
  box-shadow:0 0 0 4px rgba(89,176,255,0.10);
}
body:not(.tema-blanco) .table--clients,
body:not(.tema-blanco) .table--files{
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.02);
}
body:not(.tema-blanco) .table-scroll--clients .clients-head,
body:not(.tema-blanco) .client-files-card .tr.th,
body:not(.tema-blanco) .client-form-files-card .tr.th{
  background:rgba(255,255,255,0.04);
  color:#93a4bd;
}
body:not(.tema-blanco) .table-scroll--clients .clients-row,
body:not(.tema-blanco) .tr--client-files{
  border-top:1px solid rgba(255,255,255,0.07);
}
body:not(.tema-blanco) .table-scroll--clients .clients-row:nth-child(even),
body:not(.tema-blanco) .table--files .tr--client-files:nth-child(even){
  background:rgba(255,255,255,0.015);
}
body:not(.tema-blanco) .cell-text{
  color:#edf3ff;
}
body.tema-blanco .admin-clients-filter-card,
body.tema-blanco .admin-clients-table-card{
  background:linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border:1px solid #dbe3ee;
  box-shadow:0 18px 42px rgba(15,23,42,0.08);
}
body.tema-blanco .admin-clients-filter-grid .form-field .label{
  color:#475569 !important;
}
body.tema-blanco .admin-clients-filter-grid .input,
body.tema-blanco .admin-clients-filter-grid select{
  background:#fff !important;
  border:1px solid #cfd8e3 !important;
  color:#0f172a !important;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
}
body.tema-blanco .admin-clients-filter-grid .input:focus,
body.tema-blanco .admin-clients-filter-grid select:focus{
  border-color:#60a5fa !important;
  box-shadow:0 0 0 4px rgba(96,165,250,0.12);
}
body.tema-blanco .table--clients,
body.tema-blanco .table--files{
  border:1px solid #dbe4f0;
  background:#fff;
}
body.tema-blanco .table-scroll--clients .clients-head,
body.tema-blanco .client-files-card .tr.th,
body.tema-blanco .client-form-files-card .tr.th{
  background:#f8fbff;
  color:#475569;
  border-bottom:1px solid #dbe4f0;
}
body.tema-blanco .table-scroll--clients .clients-row,
body.tema-blanco .tr--client-files{
  border-top:1px solid #e7edf5;
}
body.tema-blanco .table-scroll--clients .clients-row:nth-child(even),
body.tema-blanco .table--files .tr--client-files:nth-child(even){
  background:#fbfdff;
}
body.tema-blanco .cell-text{
  color:#0f172a;
}
@media (max-width:980px){
  .table-scroll--clients .clients-head{display:grid;}
  .table-scroll--clients .clients-grid{gap:12px;}
  .table-scroll--clients .clients-row{padding:12px 14px;}
  .tr--client-files > div:nth-child(n+1){display:block !important;}
  .tr--client-files > div:last-child{display:flex !important;}
}
@media (max-width:820px){
  .admin-clients-page-head,
  .section-heading{
    flex-direction:column;
  }
  .admin-clients-head-actions{
    width:100%;
    flex-wrap:wrap;
  }
  .admin-clients-filter-actions{
    align-items:stretch;
  }
}

/* =========================
   Tickets: mejoras visuales
   ========================= */
.alert-danger{border-color:#7a1f1f;background:rgba(122,31,31,.14);color:var(--text)}
.card--soft{background:linear-gradient(180deg, rgba(89,176,255,.08), rgba(89,176,255,.02));}
.ticket-page{display:flex;flex-direction:column;gap:16px}
.ticket-page__hero{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.ticket-page__title{margin-bottom:6px}
.ticket-page__lead{max-width:780px;margin:0}
.ticket-eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:800;color:var(--blue);margin-bottom:6px}
.ticket-hero-badges{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.ticket-form-card,.ticket-filter-card,.ticket-results-card{overflow:hidden}
.ticket-form-layout{display:flex;flex-direction:column;gap:18px}
.ticket-section{border:1px solid var(--line);border-radius:16px;padding:16px;background:rgba(255,255,255,.02)}
.ticket-section--editor{padding-bottom:18px}
.ticket-section__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
.ticket-section__head p{margin:0;max-width:760px}
.ticket-section__head--compact{margin-bottom:12px}
.ticket-form-grid,.ticket-filter-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.ticket-form-grid .field,.ticket-filter-grid .field{grid-column:span 6}
.ticket-form-grid .field--full,.ticket-filter-grid .field--full{grid-column:1 / -1}
.ticket-filter-grid .field--span-2{grid-column:span 8}
.field{min-width:0}
.field__hint{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.35}
.input--surface{background:rgba(14,21,32,.92);border-color:#30445f;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.input--surface::placeholder{color:#8fa0b3}
.input--surface:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(89,176,255,.16)}
.ticket-rte{border:1px solid #30445f;border-radius:16px;overflow:hidden;background:rgba(14,21,32,.92)}
.ticket-rte .rte__toolbar{padding:10px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
.ticket-rte .rte__editor{min-height:260px;padding:14px;color:#111827 !important;caret-color:#111827;background:#fff}
.ticket-rte .rte__btn{background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:8px 10px}
.ticket-rte .rte__btn:hover{border-color:var(--blue)}
.actions--end{justify-content:flex-end}
.ticket-list-topbar{align-items:flex-end}
.ticket-stats-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:10px;width:100%;max-width:720px;margin:0 auto}.ticket-stats-grid > .stat-card{flex:0 1 220px;width:220px;max-width:100%}
.stat-card{padding:12px 14px;text-decoration:none;display:flex;flex-direction:column;gap:6px;min-height:0;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.stat-card:hover{transform:translateY(-1px);border-color:var(--green)}
.stat-card.is-active{border-color:var(--green);box-shadow:0 0 0 2px rgba(196,94,57,.18)}
.stat-card__label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0}
.stat-card__value{font-size:26px;font-weight:800;line-height:1;margin:0}
.pagination-wrap{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:16px 0 0}
.pagination-pages{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.pagination-page{min-width:38px;height:38px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;text-decoration:none;background:var(--card);color:var(--text);font-weight:700}
.pagination-page.is-active{background:var(--green);border-color:var(--green);color:#1b1f05}
.ticket-filter-actions{grid-column:1 / -1;justify-content:flex-end;align-items:center;margin-top:0}
.ticket-results-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.ticket-results-summary{font-size:13px}
.ticket-table-wrap{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:rgba(255,255,255,.02)}
.ticket-table-head{background:rgba(255,255,255,.03);font-weight:700}
.ticket-table-row{align-items:center}
.ticket-cell-subject{font-weight:600}
.ticket-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:38px 16px;gap:8px}
.ticket-empty-state__icon{font-size:30px}
.ticket-empty-state__title{font-size:18px;font-weight:800}

body.tema-blanco .card--soft{background:linear-gradient(180deg, rgba(56,150,238,.09), rgba(56,150,238,.03));}
body.tema-blanco .ticket-section,
body.tema-blanco .ticket-table-wrap{background:#fbfcfe}
body.tema-blanco .input--surface,
body.tema-blanco .ticket-rte{background:#fff;color:#111827;border-color:#cbd5e1;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
body.tema-blanco .ticket-rte .rte__toolbar{background:#f8fafc;border-bottom-color:#dbe3ee}
body.tema-blanco .ticket-rte .rte__btn{background:#fff;color:#111827;border-color:#cbd5e1}
body.tema-blanco .ticket-rte .rte__editor{color:#111827 !important}
body.tema-blanco .input--surface::placeholder{color:#6b7280}
body.tema-blanco .input--surface:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
body.tema-blanco .ticket-table-head{background:#f8fafc}
body.tema-blanco .pill--st-proceso{background:#111827;color:#fff;border-color:#111827}
body.tema-blanco .badge-policy{color:#07111a;border-color:rgba(0,0,0,.08)}
body.tema-blanco input[type="date"]::-webkit-calendar-picker-indicator{filter:none}

@media (max-width:1100px){
  .ticket-stats-grid{gap:8px;max-width:520px}
  .ticket-stats-grid > .stat-card{flex-basis:220px}
  .ticket-form-grid .field,.ticket-filter-grid .field,.ticket-filter-grid .field--span-2{grid-column:span 12}
}
@media (max-width:980px){
  .ticket-page__hero,.ticket-results-header{flex-direction:column;align-items:flex-start}
  .ticket-hero-badges{justify-content:flex-start}
  .tr--tickets.ticket-table-head{display:none}
  .tr--tickets.ticket-table-row{display:grid;grid-template-columns:1fr;gap:10px;padding:14px}
  .tr--tickets.ticket-table-row > div{display:flex !important;justify-content:space-between;gap:12px;align-items:flex-start}
  .tr--tickets.ticket-table-row > div::before{content:attr(data-label);font-size:12px;color:var(--muted);font-weight:700;min-width:110px}
  .tr--tickets.ticket-table-row > div:last-child{justify-content:flex-end}
  .tr--tickets.ticket-table-row > div:last-child::before{display:none}
}
@media (max-width:640px){
  .ticket-stats-grid{gap:8px;max-width:520px}
  .ticket-stats-grid > .stat-card{flex-basis:220px}
  .ticket-section{padding:14px}
  .ticket-page__hero{padding:14px}
}

@media (max-width:420px){
  .ticket-stats-grid{max-width:220px}
  .ticket-stats-grid > .stat-card{width:100%;flex-basis:100%}
  .stat-card{padding:10px 12px}
  .stat-card__value{font-size:22px}
}


/* Ajustes de filtros avanzados y selector de clientes */
.ticket-filter-card--compact{padding:12px 14px}
.advanced-filters-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0;border:0;background:transparent;color:var(--text);cursor:pointer;font:inherit;text-align:left}
.advanced-filters-toggle__left{display:flex;align-items:center;gap:10px;font-weight:700}
.advanced-filters-toggle__icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;color:#64748b}
.advanced-filters-toggle__icon svg{width:18px;height:18px}
.advanced-filters-toggle__chevron{font-size:18px;color:#64748b;transition:transform .18s ease}
.advanced-filters-toggle[aria-expanded="true"] .advanced-filters-toggle__chevron{transform:rotate(180deg)}
.advanced-filters-panel{padding-top:14px}
.client-picker{display:flex;flex-direction:column;gap:12px}
.client-picker__toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.client-picker__search{flex:1 1 280px}
.client-picker__actions{display:flex;gap:8px;flex-wrap:wrap}
.client-picker__selected{display:flex;gap:8px;flex-wrap:wrap;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.client-picker__empty{color:var(--muted);font-size:13px}
.client-selected-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--text);cursor:pointer}
.client-selected-chip strong{font-size:16px;line-height:1}
.client-picker__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:360px;overflow:auto;padding-right:4px}
.client-option{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);cursor:pointer;transition:border-color .15s ease, box-shadow .15s ease, background .15s ease}
.client-option input{display:none}
.client-option:hover{border-color:#94a3b8}
.client-option.is-selected{border-color:var(--green);box-shadow:0 0 0 2px rgba(196,94,57,.18)}
.client-option.is-disabled{opacity:.55;pointer-events:none}
.client-option__main{display:flex;flex-direction:column;gap:4px;min-width:0}
.client-option__title{font-weight:700;word-break:break-word}
.client-option__meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.client-option__toggle{font-size:12px;font-weight:800;color:#475569;white-space:nowrap}
@media (max-width:900px){.client-picker__list{grid-template-columns:1fr}}

.btn-yellow-soft{background:#c45e39 !important;border-color:#c45e39 !important;color:#1b1f05 !important;font-weight:800}

.btn-yellow-soft:hover{filter:brightness(.98)}

.client-picker__notice{padding:10px 12px;border:1px solid rgba(196,94,57,.55);border-radius:12px;background:rgba(196,94,57,.16);color:var(--text);font-weight:700}

.client-picker__summary{font-weight:700;color:var(--text)}

.client-picker__selected{align-items:flex-start}

.client-picker__list{max-height:260px}
/* =========================================================
   REDISEÑO VISUAL 2026 - Light/Dark
   Cambio solicitado: F5FC51 -> #c45e39
   ========================================================= */
:root{--bg:#07111C;--card:#0E1A28;--surface:#111F30;--surface-2:#16263A;--muted:#A8B8CC;--text:#F3F8FF;--line:#263B52;--green:#c45e39;--green2:#a8482e;--accent:#c45e39;--accent-2:#e48762;--accent-soft:rgba(196,94,57,.14);--accent-line:rgba(196,94,57,.36);--danger:#FF5A67;--yellow:#F5C84B;--blue:#c45e39;--blue2:#a8482e;}
body.tema-blanco{--bg:#F4F7FB;--card:#FFFFFF;--surface:#FFFFFF;--surface-2:#F8FBFF;--muted:#5C6B7A;--text:#0F172A;--line:#D8E2EE;--green:#c45e39;--green2:#a8482e;--accent:#c45e39;--accent-2:#c45e39;--accent-soft:rgba(196,94,57,.16);--accent-line:rgba(196,94,57,.36);--w-bg:#F4F7FB;--w-surface:#FFFFFF;--w-card:#FFFFFF;--w-text:#0F172A;--w-text2:#526173;--w-border:#D8E2EE;--w-primary:#c45e39;--w-primary-700:#8f3c27;--w-primary-soft:rgba(196,94,57,.16);}
body{background:radial-gradient(circle at 10% -10%,rgba(196,94,57,.16),transparent 34%),linear-gradient(180deg,#07111C 0%,#0A1320 100%);color:var(--text);}body.tema-blanco{background:radial-gradient(circle at 8% -10%,rgba(196,94,57,.20),transparent 30%),linear-gradient(180deg,#F4F7FB 0%,#EEF4FA 100%)!important;color:var(--text)!important;}
.topbar{background:rgba(7,17,28,.88)!important;border-bottom:1px solid rgba(196,94,57,.18)!important;box-shadow:0 12px 34px rgba(0,0,0,.20);}body.tema-blanco .topbar{background:rgba(255,255,255,.88)!important;border-bottom:1px solid var(--line)!important;box-shadow:0 10px 30px rgba(15,23,42,.08)!important;}
.card,.ticket-section,.ticket-table-wrap,.client-picker__selected,.client-option,.stat-card{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;border:1px solid rgba(126,153,184,.22)!important;box-shadow:0 18px 42px rgba(0,0,0,.22);}body.tema-blanco .card,body.tema-blanco .ticket-section,body.tema-blanco .ticket-table-wrap,body.tema-blanco .client-picker__selected,body.tema-blanco .client-option,body.tema-blanco .stat-card{background:linear-gradient(180deg,#FFFFFF 0%,#FBFDFF 100%)!important;border:1px solid var(--line)!important;box-shadow:0 16px 36px rgba(15,23,42,.07)!important;color:var(--text)!important;}
.label,.field label,.field__hint,.muted,.stat-card__label,.client-option__meta{color:var(--muted)!important;}.label,.field label{font-weight:700;letter-spacing:.01em;}
.input,select,textarea,.input--surface,.password-field__input{background:#0B1726!important;color:#F3F8FF!important;border:1px solid #2C435C!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 1px 0 rgba(0,0,0,.12)!important;}.input::placeholder,textarea::placeholder{color:#7F93AA!important;}.input:focus,select:focus,textarea:focus,.input--surface:focus,.password-field__input:focus{border-color:var(--accent)!important;box-shadow:0 0 0 4px rgba(196,94,57,.15),inset 0 1px 0 rgba(255,255,255,.06)!important;outline:0!important;}
body.tema-blanco .input,body.tema-blanco select,body.tema-blanco textarea,body.tema-blanco .input--surface,body.tema-blanco .password-field__input{background:#FFFFFF!important;color:#0F172A!important;border:1px solid #CAD7E5!important;box-shadow:0 1px 2px rgba(15,23,42,.04)!important;}body.tema-blanco .input::placeholder,body.tema-blanco textarea::placeholder{color:#8493A5!important;}body.tema-blanco .input:focus,body.tema-blanco select:focus,body.tema-blanco textarea:focus,body.tema-blanco .input--surface:focus,body.tema-blanco .password-field__input:focus{border-color:#c45e39!important;box-shadow:0 0 0 4px rgba(196,94,57,.20)!important;}
.btn,button,input[type="submit"],input[type="button"]{border-radius:12px;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease;}.btn:hover,button:hover,input[type="submit"]:hover,input[type="button"]:hover{transform:translateY(-1px);}
.btn-green,body.tema-blanco .btn.btn-green,body.tema-blanco .btn-green,.btn-primary,body.tema-blanco .btn-primary{background:linear-gradient(135deg,#c45e39 0%,#a8482e 100%)!important;border-color:#c45e39!important;color:#062231!important;font-weight:850!important;box-shadow:0 10px 24px rgba(196,94,57,.22)!important;}.btn-green:hover,body.tema-blanco .btn-green:hover,.btn-primary:hover,body.tema-blanco .btn-primary:hover{background:linear-gradient(135deg,#d36b43 0%,#873722 100%)!important;border-color:#a8482e!important;color:#041D29!important;box-shadow:0 14px 30px rgba(196,94,57,.30)!important;}
.btn-outline,body.tema-blanco .btn.btn-outline,body.tema-blanco .btn-outline{background:rgba(255,255,255,.04)!important;color:var(--text)!important;border:1px solid rgba(126,153,184,.34)!important;}.btn-outline:hover,body.tema-blanco .btn-outline:hover{background:var(--accent-soft)!important;border-color:var(--accent-line)!important;color:var(--text)!important;}body.tema-blanco .btn-outline,body.tema-blanco .btn.btn-outline{background:#FFFFFF!important;color:#0F172A!important;border:1px solid #CBD8E6!important;}.btn-danger,body.tema-blanco .btn-danger{background:linear-gradient(135deg,#FF6B74,#E23D4B)!important;color:#fff!important;border-color:#FF6B74!important;}.btn-yellow-soft{background:rgba(196,94,57,.16)!important;border-color:rgba(196,94,57,.45)!important;color:var(--text)!important;font-weight:800!important;}
.table,.table--clients,.table--files,.ticket-table-wrap{border-color:var(--line)!important;}.tr.th,.ticket-table-head,.clients-head,thead th{background:rgba(196,94,57,.10)!important;color:#DFFBFF!important;border-bottom:1px solid rgba(196,94,57,.22)!important;font-weight:850!important;}.tr,tbody tr,.clients-row,.ticket-table-row{border-top:1px solid rgba(126,153,184,.16)!important;}.tr:nth-child(even),tbody tr:nth-child(even),.clients-row:nth-child(even),.ticket-table-row:nth-child(even){background:rgba(255,255,255,.025)!important;}body.tema-blanco .tr.th,body.tema-blanco .ticket-table-head,body.tema-blanco .clients-head,body.tema-blanco thead th{background:#fff1e8!important;color:#4b2115!important;border-bottom:1px solid #ead7ca!important;}body.tema-blanco .tr,body.tema-blanco tbody tr,body.tema-blanco .clients-row,body.tema-blanco .ticket-table-row{border-top:1px solid #E3EBF4!important;color:#0F172A!important;}body.tema-blanco .tr:nth-child(even),body.tema-blanco tbody tr:nth-child(even),body.tema-blanco .clients-row:nth-child(even),body.tema-blanco .ticket-table-row:nth-child(even){background:#F8FCFD!important;}
.nav a{background:rgba(255,255,255,.035)!important;border:1px solid transparent!important;color:var(--muted)!important;}.nav a:hover{background:rgba(196,94,57,.12)!important;border-color:rgba(196,94,57,.30)!important;color:var(--text)!important;}body.tema-blanco .nav a{background:#F7FBFD!important;border:1px solid #D9E5EF!important;color:#233446!important;}body.tema-blanco .nav a:hover{background:#fff1e8!important;border-color:#d8c3b6!important;color:#7c321f!important;}
.pill,.badge,.badge-policy{border-color:rgba(126,153,184,.26)!important;}.stat-card:hover,.stat-card.is-active,.client-option.is-selected,.pagination-page.is-active{border-color:#c45e39!important;box-shadow:0 0 0 3px rgba(196,94,57,.18)!important;}.pagination-page.is-active{background:#c45e39!important;color:#062231!important;}
.ticket-rte{border-color:#2C435C!important;background:#0B1726!important;}.ticket-rte .rte__toolbar{background:#101D2D!important;border-bottom:1px solid #263B52!important;}.ticket-rte .rte__btn{background:#152438!important;color:#F3F8FF!important;border-color:#2C435C!important;}.ticket-rte .rte__btn:hover{border-color:#c45e39!important;background:rgba(196,94,57,.14)!important;}.ticket-rte .rte__editor{background:#FFFFFF!important;color:#111827!important;border:0!important;}body.tema-blanco .ticket-rte{background:#FFFFFF!important;border-color:#CAD7E5!important;}body.tema-blanco .ticket-rte .rte__toolbar{background:#F4F8FC!important;border-bottom-color:#D8E2EE!important;}body.tema-blanco .ticket-rte .rte__btn{background:#FFFFFF!important;color:#0F172A!important;border-color:#CAD7E5!important;}body.tema-blanco .ticket-rte .rte__btn:hover{background:#fff1e8!important;border-color:#c45e39!important;}
.alert,.flash,.notice{border-radius:14px;border:1px solid rgba(126,153,184,.24);}input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1);opacity:.85;}body.tema-blanco input[type="date"]::-webkit-calendar-picker-indicator{filter:none;opacity:.75;}.client-picker__notice{border:1px solid rgba(196,94,57,.45)!important;background:rgba(196,94,57,.14)!important;color:var(--text)!important;}

/* =========================================================
   AJUSTE VISUAL SOLICITADO - Conversación + Light Forms
   Base de botones: #c45e39
   ========================================================= */
:root{--green:#c45e39!important;--green2:#a8482e!important;--accent:#c45e39!important;--accent-2:#e48762!important;--accent-soft:rgba(196,94,57,.15)!important;--accent-line:rgba(196,94,57,.38)!important;--blue:#c45e39!important;--blue2:#a8482e!important;}
body.tema-blanco{--green:#c45e39!important;--green2:#a8482e!important;--accent:#c45e39!important;--accent-2:#8f3c27!important;--accent-soft:rgba(196,94,57,.12)!important;--accent-line:rgba(196,94,57,.34)!important;--w-primary:#c45e39!important;--w-primary-700:#8f3c27!important;--w-primary-soft:rgba(196,94,57,.12)!important;--bg:#f7f3ef!important;--card:#fff!important;--surface:#fffaf6!important;--surface-2:#fdf1e9!important;--line:#e7d8ce!important;--muted:#6f5d53!important;--text:#241913!important;}
.btn-green,body.tema-blanco .btn.btn-green,body.tema-blanco .btn-green,.btn-primary,body.tema-blanco .btn-primary,.btn-yellow-soft{background:linear-gradient(135deg,#c45e39 0%,#9f452c 100%)!important;border-color:#c45e39!important;color:#fffaf6!important;font-weight:850!important;box-shadow:0 12px 26px rgba(196,94,57,.24)!important;}
.btn-green:hover,body.tema-blanco .btn-green:hover,.btn-primary:hover,body.tema-blanco .btn-primary:hover,.btn-yellow-soft:hover{background:linear-gradient(135deg,#d36b43 0%,#873722 100%)!important;border-color:#9f452c!important;color:#fff!important;box-shadow:0 16px 34px rgba(196,94,57,.32)!important;}
body.tema-blanco .btn-blue,body.tema-blanco .btn.btn-blue{background:#2f475c!important;border-color:#2f475c!important;color:#fff!important;}
body.tema-blanco .btn-outline,body.tema-blanco .btn.btn-outline{background:#fff!important;color:#3c2b23!important;border:1px solid #d7c5b8!important;}
body.tema-blanco .btn-outline:hover,body.tema-blanco .btn.btn-outline:hover{background:#fff1e8!important;border-color:#c45e39!important;color:#7c321f!important;}
body.tema-blanco{background:radial-gradient(circle at 8% -10%,rgba(196,94,57,.16),transparent 30%),linear-gradient(180deg,#f7f3ef 0%,#f3ebe4 100%)!important;}
body.tema-blanco .card,body.tema-blanco .ticket-section,body.tema-blanco .ticket-view-card,body.tema-blanco .client-view-card,body.tema-blanco .client-files-card,body.tema-blanco .ticket-form-card{background:linear-gradient(180deg,#fff 0%,#fffaf7 100%)!important;border:1px solid #e3d3c7!important;box-shadow:0 18px 42px rgba(70,43,30,.08)!important;color:#241913!important;}
body.tema-blanco .ticket-section,body.tema-blanco .ticket-info-item,body.tema-blanco .form-section-card,body.tema-blanco .form-intro-card{background:linear-gradient(180deg,#fffaf6 0%,#fff3eb 100%)!important;border:1px solid #ead7ca!important;border-radius:16px!important;}
body.tema-blanco .h2,body.tema-blanco .h3,body.tema-blanco .ticket-page__title{color:#231812!important;font-weight:900!important;letter-spacing:-.01em!important;}
body.tema-blanco .h3{padding-bottom:8px!important;border-bottom:1px solid #ead7ca!important;}
body.tema-blanco .label,body.tema-blanco .field label,body.tema-blanco .field-label{color:#7b351f!important;font-weight:850!important;letter-spacing:.01em!important;}
body.tema-blanco .field-value,body.tema-blanco .field-value--block{background:#fff!important;border:1px solid #e7d8ce!important;color:#241913!important;border-radius:12px!important;padding:10px 12px!important;}
body.tema-blanco .muted,body.tema-blanco .field__hint{color:#6f5d53!important;}
body.tema-blanco .input,body.tema-blanco select,body.tema-blanco textarea,body.tema-blanco .input--surface,body.tema-blanco .password-field__input{background:#fff!important;color:#241913!important;border:1px solid #d8c3b6!important;box-shadow:0 1px 2px rgba(70,43,30,.05),inset 0 1px 0 rgba(255,255,255,.75)!important;}
body.tema-blanco .input:focus,body.tema-blanco select:focus,body.tema-blanco textarea:focus,body.tema-blanco .input--surface:focus,body.tema-blanco .password-field__input:focus{border-color:#c45e39!important;box-shadow:0 0 0 4px rgba(196,94,57,.16)!important;outline:0!important;}
body.tema-blanco .ticket-rte{background:#fff!important;border-color:#d8c3b6!important;box-shadow:0 1px 2px rgba(70,43,30,.05)!important;}
body.tema-blanco .ticket-rte .rte__toolbar{background:#fff1e8!important;border-bottom-color:#ead7ca!important;}
body.tema-blanco .ticket-rte .rte__btn{background:#fff!important;color:#3c2b23!important;border-color:#d8c3b6!important;}
body.tema-blanco .ticket-rte .rte__btn:hover{background:#fde7db!important;border-color:#c45e39!important;color:#7c321f!important;}
body.tema-blanco .ticket-rte .rte__editor{background:#fff!important;color:#241913!important;}
body.tema-blanco thead th,body.tema-blanco .tr.th,body.tema-blanco .ticket-table-head,body.tema-blanco .clients-head{background:#f4dfd2!important;color:#4b2115!important;border-bottom-color:#d9b9a7!important;}
body.tema-blanco tbody tr:nth-child(even),body.tema-blanco .tr:nth-child(even),body.tema-blanco .clients-row:nth-child(even),body.tema-blanco .ticket-table-row:nth-child(even){background:#fff8f4!important;}
body.tema-blanco .pill--active,body.tema-blanco .pill--prio-low,body.tema-blanco .pill--st-finalizado,body.tema-blanco .alert-success{background:#eef4ff!important;border-color:#b9cdef!important;color:#224a80!important;}
.thread{gap:16px!important;padding:4px 0!important;}
.msg{position:relative!important;border-radius:18px!important;padding:15px 16px!important;overflow:hidden!important;border-width:1px!important;box-shadow:0 14px 34px rgba(0,0,0,.16)!important;}
.msg::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--msg-accent,#c45e39);}
.msg__meta{gap:8px 10px!important;margin-bottom:10px!important;}
.msg__meta strong{color:var(--msg-title,#fff)!important;font-weight:900!important;}
.msg__meta .pill{background:var(--msg-pill-bg,rgba(255,255,255,.12))!important;border-color:var(--msg-pill-border,rgba(255,255,255,.22))!important;color:var(--msg-pill-text,#fff)!important;text-transform:capitalize!important;}
.msg__body{color:var(--msg-body,#eef6ff)!important;line-height:1.58!important;}
.msg__body *{color:inherit;}
.msg--admin{--msg-accent:#e06f43;--msg-title:#fff4ed;--msg-body:#fff9f6;--msg-pill-bg:rgba(224,111,67,.22);--msg-pill-border:rgba(224,111,67,.45);--msg-pill-text:#ffe8dc;background:linear-gradient(135deg,rgba(83,37,24,.96),rgba(42,25,20,.96))!important;border-color:rgba(224,111,67,.45)!important;}
.msg--soporte{--msg-accent:#4aa3df;--msg-title:#eef8ff;--msg-body:#eef8ff;--msg-pill-bg:rgba(74,163,223,.20);--msg-pill-border:rgba(74,163,223,.42);--msg-pill-text:#dff2ff;background:linear-gradient(135deg,rgba(20,58,86,.96),rgba(14,35,57,.96))!important;border-color:rgba(74,163,223,.42)!important;}
.msg--usuario{--msg-accent:#9b7bd8;--msg-title:#f8f4ff;--msg-body:#f8f4ff;--msg-pill-bg:rgba(155,123,216,.20);--msg-pill-border:rgba(155,123,216,.42);--msg-pill-text:#efe7ff;background:linear-gradient(135deg,rgba(57,43,88,.96),rgba(34,28,55,.96))!important;border-color:rgba(155,123,216,.42)!important;}
body.tema-blanco .msg{box-shadow:0 12px 30px rgba(70,43,30,.08)!important;}
body.tema-blanco .msg--admin{--msg-accent:#c45e39;--msg-title:#512212;--msg-body:#2b1a13;--msg-pill-bg:#f9dfd2;--msg-pill-border:#e6b49d;--msg-pill-text:#7c321f;background:linear-gradient(135deg,#fff6f0,#fde7db)!important;border-color:#e6b49d!important;color:#2b1a13!important;}
body.tema-blanco .msg--soporte{--msg-accent:#2f7db6;--msg-title:#123a59;--msg-body:#172b3c;--msg-pill-bg:#e1f0fb;--msg-pill-border:#afd4ef;--msg-pill-text:#19527b;background:linear-gradient(135deg,#f4fbff,#e8f4fc)!important;border-color:#afd4ef!important;color:#172b3c!important;}
body.tema-blanco .msg--usuario{--msg-accent:#7957b8;--msg-title:#35235d;--msg-body:#271d3f;--msg-pill-bg:#ede7fb;--msg-pill-border:#cbbcf0;--msg-pill-text:#4d3582;background:linear-gradient(135deg,#fbf9ff,#f0ebfb)!important;border-color:#cbbcf0!important;color:#271d3f!important;}
body.tema-blanco .msg__meta .field-label{color:#6c5d54!important;background:transparent!important;border:0!important;padding:0!important;}
body.tema-blanco .msg__body,body.tema-blanco .msg__body *{color:var(--msg-body,#241913)!important;}
body.tema-blanco .msg__files .file{background:#fff!important;color:#4b2115!important;border-color:#d8c3b6!important;}
body.tema-blanco .msg__img{border-color:#d8c3b6!important;}

/* =========================================================
   FIX V11: títulos de tarjetas dentro del borde redondeado
   Solo recorre el encabezado hacia adentro. No cambia colores.
   ========================================================= */
.view-fields .ticket-info-item,
.client-view-card .ticket-info-item,
.ticket-view-card .ticket-info-item{
  box-sizing: border-box !important;
  padding-top: 24px !important;
  overflow: hidden !important;
}

.view-fields .ticket-info-item > .field-label,
.client-view-card .ticket-info-item > .field-label,
.ticket-view-card .ticket-info-item > .field-label{
  display: block !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  line-height: 1.2 !important;
  max-width: calc(100% - 16px) !important;
  overflow-wrap: anywhere !important;
}

.view-fields .ticket-info-item > .field-value,
.client-view-card .ticket-info-item > .field-value,
.ticket-view-card .ticket-info-item > .field-value{
  margin-top: 0 !important;
}


/* Corrección final: panel de notificaciones con fondo completamente sólido en ambos temas */
#notifDrop.notif-panel-card{
  display: none;
  padding: 18px !important;
  border-radius: 18px !important;
  background: #121b28 !important;
  background-color: #121b28 !important;
  background-image: none !important;
  border: 1px solid #31445f !important;
  box-shadow: 0 24px 58px rgba(0,0,0,.62) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
body.tema-blanco #notifDrop.notif-panel-card{
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 24px 48px rgba(15,23,42,.24) !important;
}
#notifDrop.notif-panel-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #121b28;
  opacity: 1;
}
body.tema-blanco #notifDrop.notif-panel-card::before{
  background: #ffffff;
}
#notifDrop.notif-panel-card .notif-row__btn{
  width: 100%;
  background: #253b5d !important;
  background-color: #253b5d !important;
  color: #f8fafc !important;
  border-color: #48678f !important;
}
body.tema-blanco #notifDrop.notif-panel-card .notif-row__btn{
  background: #eef4ff !important;
  background-color: #eef4ff !important;
  color: #0f172a !important;
  border-color: #c7d7f2 !important;
}


/* Ajuste visual final del panel de notificaciones */
#notifDrop.notif-panel-card{
  padding: 20px !important;
  border-radius: 20px !important;
  background: #101a27 !important;
  background-color: #101a27 !important;
  background-image: none !important;
  border: 1px solid #2c405c !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.58) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
  overflow: visible !important;
  isolation: auto !important;
}
body.tema-blanco #notifDrop.notif-panel-card{
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: #d6dee9 !important;
  box-shadow: 0 24px 48px rgba(15,23,42,.20) !important;
}
#notifDrop.notif-panel-card::before{
  content: none !important;
  display: none !important;
}
#notifDrop .row.space-between{
  gap: 14px !important;
  flex-wrap: nowrap !important;
}
#notifDrop #notifList{
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
#notifDrop .notif-row{
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
#notifDrop.notif-panel-card .notif-row__btn{
  display: block !important;
  width: 100% !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  background: #263d60 !important;
  background-color: #263d60 !important;
  color: #f8fafc !important;
  border: 1px solid #4b6b97 !important;
  box-shadow: none !important;
  line-height: 1.25 !important;
}
body.tema-blanco #notifDrop.notif-panel-card .notif-row__btn{
  background: #eef4ff !important;
  background-color: #eef4ff !important;
  color: #0f172a !important;
  border-color: #c9d8f0 !important;
}
#notifDrop .notif-all{
  width: 100% !important;
  min-width: 0 !important;
}
#notifClose{
  flex: 0 0 auto !important;
}


/* =========================================================
   Panel de notificaciones: marco real, sólido y redondeado
   ========================================================= */
.topbar .notif{
  position: relative !important;
}
.topbar #notifDrop.notif-panel-card{
  box-sizing: border-box !important;
  width: 390px !important;
  max-width: calc(100vw - 24px) !important;
  padding: 18px !important;
  border-radius: 22px !important;
  border: 1px solid #37506f !important;
  background: #121b28 !important;
  background-color: #121b28 !important;
  background-image: none !important;
  color: #eef5ff !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
  overflow: hidden !important;
  transform: translateZ(0) !important;
}
body.tema-blanco .topbar #notifDrop.notif-panel-card{
  border-color: #cbd5e1 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 22px 50px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
.topbar #notifDrop.notif-panel-card::before,
.topbar #notifDrop.notif-panel-card::after{
  display: none !important;
  content: none !important;
}
.topbar #notifDrop.notif-panel-card > .row:first-child{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 0 12px 0 !important;
  border-bottom: 1px solid rgba(126,167,221,.20) !important;
}
body.tema-blanco .topbar #notifDrop.notif-panel-card > .row:first-child{
  border-bottom-color: rgba(15,23,42,.10) !important;
}
.topbar #notifDrop.notif-panel-card > .row:nth-child(2){
  margin-top: 12px !important;
  margin-bottom: 12px !important;
  padding: 0 !important;
}
.topbar #notifDrop #notifList{
  margin-top: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  background: transparent !important;
}
.topbar #notifDrop .notif-row{
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.topbar #notifDrop.notif-panel-card .notif-row__btn{
  width: 100% !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  border: 1px solid #4b6b97 !important;
  background: #263d60 !important;
  color: #f8fafc !important;
  box-sizing: border-box !important;
}
body.tema-blanco .topbar #notifDrop.notif-panel-card .notif-row__btn{
  border-color: #c9d8f0 !important;
  background: #eef4ff !important;
  color: #0f172a !important;
}
.topbar #notifClose{
  border-radius: 14px !important;
}
@media (max-width:640px){
  .topbar #notifDrop.notif-panel-card{
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: 76px !important;
    width: auto !important;
    max-width: none !important;
  }
}