/* ══════════════════════════════════════════════════════
   NEXUS — variables.css
   Variables globales, reset y estilos base del documento
   ══════════════════════════════════════════════════════ */

/* ── Variables base (tema oscuro por defecto) ── */
:root {
    /* ── Colores del VISOR 3D ── */
    --bg-primary: #0f0f14;
    --bg-secondary: #1C202B;
    --bg-tertiary: #2C3749;
    --accent-primary: #3C96FE;
    --accent-secondary: #2A7ADE;
    --text-primary: #e8eaed;
    --text-secondary: #9ca3af;
    --text-muted: #6F7A8C;
    --border-color: rgba(255, 255, 255, 0.08);
    --border-hover: rgba(255, 255, 255, 0.15);
    --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.5);
    --success: #10b981;
    --warning: #f59e0b;
    --error: #ef4444;

    /* Altura header */
    --header-h: 69px;

    /* ── Paleta de la plataforma (tema oscuro por defecto) ── */
    --bg:          #1C202B;
    --surface:     #2C3749;
    --surface-2:   #212C3E;
    --text:        #FFFFFF;
    --text-2:      #96A1B2;
    --text-3:      #6F7A8C;
    --border:      rgba(150,161,178,0.12);
    --border-dark: rgba(150,161,178,0.25);

    /* ── Estados ── */
    --state-success:     #4CAF84;
    --state-success-bg:  rgba(76,175,132,0.12);
    --state-warning:     #D99B4A;
    --state-warning-bg:  rgba(217,155,74,0.12);
    --state-danger:      #D95C5C;
    --state-danger-bg:   rgba(217,92,92,0.12);
    --state-violet:      #8B7AB8;
    --state-violet-bg:   rgba(139,122,184,0.12);

    /* ── Tipografía ── */
    --p-mono:    'IBM Plex Sans', sans-serif;
    --p-sans:    'IBM Plex Sans', sans-serif;

    /* ── Paleta de avatares ── */
    --avatar-1:  #FFD7C2; --avatar-1-tx: #8A4B1E;
    --avatar-2:  #C9E8D1; --avatar-2-tx: #1F6A44;
    --avatar-3:  #D8DFFB; --avatar-3-tx: #37418C;
    --avatar-4:  #FBE0EC; --avatar-4-tx: #9C3A69;
    --avatar-5:  #FFF2C2; --avatar-5-tx: #8A6A0E;
    --avatar-6:  #D6F0F5; --avatar-6-tx: #1D6E7D;
    --avatar-7:  #E6DAFB; --avatar-7-tx: #5B3A9C;
    --avatar-8:  #E2ECC8; --avatar-8-tx: #556B1E;
}

/* ── Variables de la PLATAFORMA (alias al tema oscuro) ── */
:root {
    --p-bg:      var(--bg);
    --p-bg2:     var(--surface-2);
    --p-surface: var(--surface);
    --p-sur2:    var(--surface-2);
    --p-border:  var(--border);
    --p-border2: var(--border-dark);
    --p-accent:  #3C96FE;
    --p-aglow:   rgba(60,150,255,0.08);
    --p-green:   var(--state-success);
    --p-gglow:   var(--state-success-bg);
    --p-amber:   #D99B4A;
    --p-red:     var(--state-danger);
    --p-violet:  var(--state-violet);
    --p-text:    var(--text);
    --p-text2:   var(--text-2);
    --p-text3:   var(--text-3);
}

/* ══════════════════════════════════════════════════════
   TEMA CLARO — aplicado a #platformOverlay.p-light
   ══════════════════════════════════════════════════════ */
#platformOverlay.p-light,
#platformOverlay.p-light .p-view,
#platformOverlay.p-light .p-sidebar,
#platformOverlay.p-light .p-main,
#platformOverlay.p-light .p-content-body {
    /* ── Fondos ── */
    --p-bg:      #F3F5F8;
    --p-bg2:     #F8F9FB;
    --p-surface: #FFFFFF;
    --p-sur2:    #F8F9FB;
    --p-border:  #E3E7ED;
    --p-border2: #CBD2DC;
    --p-text:    #0F0F14;
    --p-text2:   #646464;
    --p-text3:   #97979D;
    --p-accent:  #3C96FE;
    --p-aglow:   rgba(60,150,255,0.06);
    --p-green:   #0E9D6B;
    --p-gglow:   #E1F7ED;
    --p-amber:   #B26A00;
    --p-red:     #D6304A;
    --p-violet:  #7C5CFA;
}

/* ── TEMA CLARO: elementos específicos ── */
#platformOverlay.p-light .p-login-card {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
    box-shadow: 0 24px 60px rgba(0,0,0,0.06);
}

#platformOverlay.p-light .p-login-card::before {
    background: #3C96FE;
}

#platformOverlay.p-light .p-role-tab {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
    color: #97979D;
}
#platformOverlay.p-light .p-role-tab.p-active-tab {
    background: rgba(60,150,255,0.06);
    border-color: #3C96FE;
    color: #3C96FE;
}

#platformOverlay.p-light .p-field-input {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
    color: #0F0F14;
}
#platformOverlay.p-light .p-field-input:focus {
    border-color: #3C96FE;
    box-shadow: 0 0 0 3px rgba(60,150,255,0.08);
}

#platformOverlay.p-light .p-btn-login {
    background: #3C96FE;
    color: #fff;
}
#platformOverlay.p-light .p-btn-login:hover {
    background: #2A7ADE;
}

#platformOverlay.p-light .p-login-hint {
    color: #97979D;
}
#platformOverlay.p-light .p-login-hint span {
    color: #3C96FE;
}
#platformOverlay.p-light .p-login-hint span:hover {
    color: #2A7ADE;
}

#platformOverlay.p-light .lang-toggle-login {
    background: #F8F9FB;
    color: #646464;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .lang-toggle-login:hover {
    background: rgba(60,150,255,0.06);
    border-color: #3C96FE;
    color: #3C96FE;
}

#platformOverlay.p-light .p-sidebar {
    background: #FFFFFF;
    border-right: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-sidebar-hd {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-sidebar-logo {
    color: #3C96FE;
}
#platformOverlay.p-light .p-sidebar-user {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-user-av {
    background: rgba(60,150,255,0.08);
    color: #3C96FE;
}
#platformOverlay.p-light .p-user-name {
    color: #0F0F14;
}
#platformOverlay.p-light .p-user-role {
    color: #97979D;
}

#platformOverlay.p-light .p-nav-item {
    color: #646464;
}
#platformOverlay.p-light .p-nav-item:hover {
    background: #F8F9FB;
    color: #0F0F14;
}
#platformOverlay.p-light .p-nav-item.p-active-nav {
    background: rgba(60,150,255,0.06);
    color: #3C96FE;
    border: 1px solid rgba(60,150,255,0.12);
}

#platformOverlay.p-light .p-sidebar-ft {
    border-top: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-btn-logout {
    border: 1px solid rgba(214,48,74,0.15);
    background: rgba(214,48,74,0.04);
    color: #D6304A;
}
#platformOverlay.p-light .p-btn-logout:hover {
    border-color: #D6304A;
    background: rgba(214,48,74,0.08);
}

#platformOverlay.p-light .p-main {
    background: #F3F5F8;
}
#platformOverlay.p-light .p-content-hd {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-page-title {
    color: #0F0F14;
}
#platformOverlay.p-light .p-page-sub {
    color: #97979D;
}

#platformOverlay.p-light .p-card {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-card-hd {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-card-title {
    color: #646464;
}
#platformOverlay.p-light .p-card-body {
    color: #0F0F14;
}

#platformOverlay.p-light .p-stat {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-stat-lbl {
    color: #97979D;
}
#platformOverlay.p-light .p-stat-val {
    color: #0F0F14;
}

#platformOverlay.p-light .p-badge.pbg {
    background: #E1F7ED;
    color: #0E9D6B;
    border: 1px solid rgba(14,157,107,0.15);
}
#platformOverlay.p-light .p-badge.pba {
    background: rgba(60,150,255,0.06);
    color: #3C96FE;
    border: 1px solid rgba(60,150,255,0.12);
}
#platformOverlay.p-light .p-badge.pbr {
    background: rgba(214,48,74,0.04);
    color: #D6304A;
    border: 1px solid rgba(214,48,74,0.12);
}
#platformOverlay.p-light .p-badge.pbv {
    background: rgba(124,92,250,0.06);
    color: #7C5CFA;
    border: 1px solid rgba(124,92,250,0.12);
}

#platformOverlay.p-light .p-btn-blue {
    background: rgba(60,150,255,0.06);
    border-color: rgba(60,150,255,0.15);
    color: #3C96FE;
}
#platformOverlay.p-light .p-btn-blue:hover {
    background: rgba(60,150,255,0.12);
}
#platformOverlay.p-light .p-btn-green {
    background: #E1F7ED;
    border-color: rgba(14,157,107,0.15);
    color: #0E9D6B;
}
#platformOverlay.p-light .p-btn-green:hover {
    background: #C8F0E0;
}
#platformOverlay.p-light .p-btn-red {
    background: rgba(214,48,74,0.04);
    border-color: rgba(214,48,74,0.12);
    color: #D6304A;
}
#platformOverlay.p-light .p-btn-red:hover {
    background: rgba(214,48,74,0.08);
}
#platformOverlay.p-light .p-btn-violet {
    background: rgba(124,92,250,0.06);
    border-color: rgba(124,92,250,0.12);
    color: #7C5CFA;
}
#platformOverlay.p-light .p-btn-violet:hover {
    background: rgba(124,92,250,0.12);
}
#platformOverlay.p-light .p-btn-primary {
    background: #3C96FE;
    color: #fff;
    box-shadow: 0 4px 16px rgba(60,150,255,0.2);
}
#platformOverlay.p-light .p-btn-primary:hover {
    background: #2A7ADE;
    box-shadow: 0 8px 24px rgba(60,150,255,0.3);
}

#platformOverlay.p-light table.p-table th {
    color: #97979D;
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light table.p-table td {
    color: #646464;
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light table.p-table tr:hover td {
    background: rgba(60,150,255,0.03);
}

#platformOverlay.p-light .p-form-input,
#platformOverlay.p-light .p-form-select,
#platformOverlay.p-light .p-form-textarea {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
    color: #0F0F14;
}
#platformOverlay.p-light .p-form-input:focus,
#platformOverlay.p-light .p-form-select:focus,
#platformOverlay.p-light .p-form-textarea:focus {
    border-color: #3C96FE;
    box-shadow: 0 0 0 3px rgba(60,150,255,0.06);
}
#platformOverlay.p-light .p-form-lbl {
    color: #97979D;
}

#platformOverlay.p-light .p-case-block {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-case-header:hover {
    background: #F3F5F8;
}
#platformOverlay.p-light .p-case-name {
    color: #0F0F14;
}
#platformOverlay.p-light .p-case-meta {
    color: #97979D;
}

#platformOverlay.p-light .p-layer {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-layer-name {
    color: #646464;
}
#platformOverlay.p-light .p-layer-url {
    color: #97979D;
}

#platformOverlay.p-light .p-study-card {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-study-card:hover {
    border-color: rgba(60,150,255,0.3);
    box-shadow: 0 10px 32px rgba(60,150,255,0.06);
}
#platformOverlay.p-light .p-study-card-thumb {
    background: #F8F9FB;
}
#platformOverlay.p-light .p-study-card-name {
    color: #0F0F14;
}
#platformOverlay.p-light .p-study-card-date {
    color: #97979D;
}
#platformOverlay.p-light .p-btn-open {
    background: rgba(60,150,255,0.06);
    border-color: rgba(60,150,255,0.12);
    color: #3C96FE;
}
#platformOverlay.p-light .p-btn-open:hover {
    background: rgba(60,150,255,0.12);
}

#platformOverlay.p-light .p-assign-item {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .p-assign-item:hover {
    border-color: #CBD2DC;
}
#platformOverlay.p-light .p-assign-chk {
    background: #FFFFFF;
    border: 2px solid #E3E7ED;
}
#platformOverlay.p-light .p-assign-chk.pchk {
    background: #3C96FE;
    border-color: #3C96FE;
}
#platformOverlay.p-light .p-assign-name {
    color: #0F0F14;
}
#platformOverlay.p-light .p-assign-type {
    color: #97979D;
}

#platformOverlay.p-light .p-hamburger {
    background: #3C96FE;
    box-shadow: 0 4px 20px rgba(60,150,255,0.25);
}
#platformOverlay.p-light .p-sidebar-overlay {
    background: rgba(0,0,0,0.3);
}

#platformOverlay.p-light .p-theme-btn {
    border: 1px solid #E3E7ED;
    color: #646464;
}
#platformOverlay.p-light .p-theme-btn:hover {
    border-color: #3C96FE;
    color: #3C96FE;
    background: rgba(60,150,255,0.04);
}

#platformOverlay.p-light .lang-toggle-sidebar {
    background: #F8F9FB;
    color: #646464;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .lang-toggle-sidebar:hover {
    background: rgba(60,150,255,0.04);
    border-color: #3C96FE;
    color: #3C96FE;
}

#platformOverlay.p-light .pdash-hero {
    background: #FFFFFF;
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pdash-greeting {
    color: #97979D;
}
#platformOverlay.p-light .pdash-hero-name {
    color: #0F0F14;
}
#platformOverlay.p-light .pdash-hero-sub {
    color: #97979D;
}

#platformOverlay.p-light .pdash-stat {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pdash-stat-blue:hover {
    border-color: rgba(60,150,255,0.3);
}
#platformOverlay.p-light .pdash-stat-green:hover {
    border-color: rgba(14,157,107,0.3);
}
#platformOverlay.p-light .pdash-stat-violet:hover {
    border-color: rgba(124,92,250,0.3);
}
#platformOverlay.p-light .pdash-stat-blue {
    border-color: rgba(60,150,255,0.1);
}
#platformOverlay.p-light .pdash-stat-green {
    border-color: rgba(14,157,107,0.1);
}
#platformOverlay.p-light .pdash-stat-violet {
    border-color: rgba(124,92,250,0.1);
}
#platformOverlay.p-light .pdash-stat-lbl {
    color: #97979D;
}

#platformOverlay.p-light .pdash-card {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pdash-card-hd {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pdash-card-title {
    color: #646464;
}

#platformOverlay.p-light .pdash-cal-nav {
    background: #F8F9FB;
    border: 1px solid #E3E7ED;
    color: #646464;
}
#platformOverlay.p-light .pdash-cal-nav:hover {
    border-color: #3C96FE;
    color: #3C96FE;
}
#platformOverlay.p-light .pdash-cal-month {
    color: #0F0F14;
}
#platformOverlay.p-light .pdash-cal-dow {
    color: #97979D;
}
#platformOverlay.p-light .pdash-cal-day {
    color: #646464;
}
#platformOverlay.p-light .pdash-cal-day:hover {
    background: #F8F9FB;
    color: #0F0F14;
}
#platformOverlay.p-light .pdash-cal-day.pdash-cal-today {
    background: #3C96FE;
    color: #fff;
}
#platformOverlay.p-light .pdash-cal-day.pdash-cal-other {
    color: #97979D;
}
#platformOverlay.p-light .pdash-cal-day.pdash-cal-selected {
    background: rgba(60,150,255,0.06);
    color: #3C96FE;
    border-color: rgba(60,150,255,0.12);
}
#platformOverlay.p-light .pdash-cal-legend {
    color: #97979D;
}

#platformOverlay.p-light .pu-hero {
    background: #FFFFFF;
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pu-hero-label {
    color: #97979D;
}
#platformOverlay.p-light .pu-hero-name {
    color: #0F0F14;
}
#platformOverlay.p-light .pu-hero-sub {
    color: #97979D;
}
#platformOverlay.p-light .pu-hero-badge {
    background: rgba(0,0,0,0.02);
    border: 1px solid #E3E7ED;
    color: #646464;
}

#platformOverlay.p-light .pu-mini-stat {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pu-mini-stat:hover {
    border-color: rgba(60,150,255,0.15);
}
#platformOverlay.p-light .pu-mini-lbl {
    color: #97979D;
}

#platformOverlay.p-light .pu-card {
    background: #FFFFFF;
    border: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pu-card-hd {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pu-card-title {
    color: #646464;
}

#platformOverlay.p-light .pu-caso-row {
    border-bottom: 1px solid #E3E7ED;
}
#platformOverlay.p-light .pu-caso-row:hover {
    background: rgba(60,150,255,0.02);
}
#platformOverlay.p-light .pu-caso-name {
    color: #0F0F14;
}
#platformOverlay.p-light .pu-caso-meta {
    color: #97979D;
}

#platformOverlay.p-light .pu-profile-av {
    background: rgba(60,150,255,0.08);
    color: #3C96FE;
}
#platformOverlay.p-light .pu-profile-name {
    color: #0F0F14;
}
#platformOverlay.p-light .pu-profile-loc {
    color: #97979D;
}
#platformOverlay.p-light .pu-profile-divider {
    background: #E3E7ED;
}
#platformOverlay.p-light .pu-profile-lbl {
    color: #97979D;
}
#platformOverlay.p-light .pu-profile-val {
    color: #646464;
}

#platformOverlay.p-light #pToast {
    background: #FFFFFF;
    border: 1px solid rgba(14,157,107,0.15);
    color: #0E9D6B;
    box-shadow: 0 8px 30px rgba(14,157,107,0.06);
}

#platformOverlay.p-light #openSlicerHeaderBtn {
    background: rgba(60,150,255,0.06);
    border: 1px solid rgba(60,150,255,0.12);
    color: #3C96FE;
}
#platformOverlay.p-light #openSlicerHeaderBtn:hover {
    background: rgba(60,150,255,0.12);
}

#platformOverlay.p-light #pBackBtn {
    background: rgba(60,150,255,0.06);
    border: 1px solid rgba(60,150,255,0.12);
    color: #3C96FE;
}
#platformOverlay.p-light #pBackBtn:hover {
    background: rgba(60,150,255,0.12);
}

/* ── TEMA CLARO: scrollbar ── */
#platformOverlay.p-light::-webkit-scrollbar-track {
    background: #F8F9FB;
}
#platformOverlay.p-light::-webkit-scrollbar-thumb {
    background: #CBD2DC;
}
#platformOverlay.p-light::-webkit-scrollbar-thumb:hover {
    background: #B0B9C8;
}

/* ── TEMA CLARO: fondo de grid ── */
#platformOverlay.p-light::before {
    background-image:
        linear-gradient(rgba(0,0,0,0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,0,0,0.02) 1px, transparent 1px);
}

/* ── Variables de altura del header ── */
@media (max-width: 640px) { :root { --header-h: 52px; } }
@media (max-width: 400px) { :root { --header-h: 46px; } }

/* ══════════════════════════════════════════════════════
   RESET GLOBAL
   ══════════════════════════════════════════════════════ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    height: -webkit-fill-available;
    height: 100%;
}

body {
    font-family: 'IBM Plex Sans', -apple-system, sans-serif;
    background: var(--bg-primary);
    color: var(--text-primary);
    overflow: hidden;
    height: 100vh;
    height: -webkit-fill-available;
    overscroll-behavior: none;
    -webkit-overflow-scrolling: touch;
    top: 0 !important;
}

.skiptranslate,
.goog-te-banner-frame,
.goog-tooltip {
    display: none !important;
}
.goog-text-highlight {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}