/* ════════════════════════════════════════════════════════════════════
   POSEIDON REFINE LAYER
   Capa aditiva que se carga DESPUÉS de los estilos existentes.
   No renombra clases, no cambia layout. Solo eleva tipografía,
   foco, hover, scrollbar, números, transiciones.
   ════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.bunny.net/css?family=geist:400,500,600,700|geist-mono:400,500&display=swap');

:root {
    color-scheme: dark;
    accent-color: #2dd4bf;

    --ps-accent: #2dd4bf;
    --ps-accent-soft: rgba(45,212,191,.14);
    --ps-accent-ring: rgba(45,212,191,.38);
    --ps-font-sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', system-ui, sans-serif;
    --ps-font-mono: 'Geist Mono', 'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
    --ps-ease: cubic-bezier(.16,1,.3,1);
}

/* ═══ Tipografía global ═══ */
html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--ps-font-sans) !important;
    font-feature-settings: "ss01", "ss03", "cv11";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.page-title, .card-title, .section-title, .stat-value, .stat-label,
.sidebar-brand-text, .logo, .brand {
    font-family: var(--ps-font-sans) !important;
    letter-spacing: -0.01em;
}

h1, .page-title { letter-spacing: -0.02em; }

/* Tabular numbers everywhere — admin app */
.stat-value, .stat-number, .badge, .nav-badge,
table, td, th,
input[type="number"], input[type="text"], input[type="email"], input[type="password"],
code, pre, .code, .mono, .text-mono,
.notification-item-detail, .meta, .timestamp, .date, .duration {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum", "zero", "ss01";
}

code, pre, .code, .mono, .text-mono,
.font-mono, [class*="mono"] {
    font-family: var(--ps-font-mono) !important;
}

/* ═══ Selection ═══ */
::selection {
    background: var(--ps-accent-soft);
    color: #ecfeff;
    text-shadow: none;
}

/* ═══ Scrollbar refinada ═══ */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.07);
    border: 2px solid transparent;
    background-clip: padding-box;
    border-radius: 10px;
    transition: background-color 200ms var(--ps-ease);
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(45,212,191,.35);
    background-clip: padding-box;
}
* { scrollbar-color: rgba(255,255,255,.12) transparent; scrollbar-width: thin; }

/* ═══ Focus rings consistentes ═══ */
*:focus { outline: none; }
*:focus-visible {
    outline: 2px solid var(--ps-accent-ring);
    outline-offset: 2px;
    border-radius: 4px;
    transition: outline-offset 120ms var(--ps-ease);
}
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
.btn:focus-visible {
    outline-offset: 3px;
}
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--ps-accent-soft), 0 0 0 1px var(--ps-accent) !important;
}

/* ═══ Botones — micro-feedback táctil ═══ */
button, .btn, [role="button"], a.btn, input[type="submit"], input[type="button"] {
    transition: transform 180ms var(--ps-ease),
                box-shadow 220ms var(--ps-ease),
                background-color 180ms var(--ps-ease),
                border-color 180ms var(--ps-ease),
                color 180ms var(--ps-ease),
                opacity 180ms var(--ps-ease) !important;
    will-change: transform;
    -webkit-tap-highlight-color: transparent;
}
button:not(:disabled):hover,
.btn:not(:disabled):hover,
input[type="submit"]:not(:disabled):hover {
    transform: translateY(-1px);
}
button:not(:disabled):active,
.btn:not(:disabled):active,
input[type="submit"]:not(:disabled):active {
    transform: translateY(0) scale(0.985);
    transition-duration: 90ms;
}
button:disabled, .btn:disabled, [aria-disabled="true"] {
    cursor: not-allowed;
    transform: none !important;
}

/* ═══ Cards / paneles — hover lift suave ═══ */
.card, .stat-card, .feature-card, .service-card,
.user-card, .panel, .data-card,
[class*="-card"]:not(.notification-item):not(.config-card) {
    transition: transform 280ms var(--ps-ease),
                border-color 280ms var(--ps-ease),
                box-shadow 280ms var(--ps-ease),
                background-color 280ms var(--ps-ease) !important;
}

.stat-card:hover,
.feature-card:hover {
    transform: translateY(-2px);
    border-color: rgba(45,212,191,.22) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.35), 0 0 0 1px rgba(45,212,191,.10) !important;
}

/* ═══ Inputs / textareas — refinamiento ═══ */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
textarea, select {
    font-family: var(--ps-font-sans) !important;
    transition: border-color 180ms var(--ps-ease),
                background-color 180ms var(--ps-ease),
                box-shadow 180ms var(--ps-ease) !important;
}
input::placeholder, textarea::placeholder {
    color: rgba(255,255,255,.28) !important;
    font-weight: 400;
}
input[type="checkbox"], input[type="radio"] {
    accent-color: var(--ps-accent);
    cursor: pointer;
}

/* ═══ Links ═══ */
a {
    transition: color 180ms var(--ps-ease), opacity 180ms var(--ps-ease);
    -webkit-tap-highlight-color: transparent;
}

/* ═══ Tablas — refinamiento numérico ═══ */
table { font-variant-numeric: tabular-nums; }
table th {
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-size: 0.72rem;
    color: rgba(255,255,255,.5);
}
table tbody tr { transition: background-color 160ms var(--ps-ease); }
table tbody tr:hover { background: rgba(255,255,255,.025); }

/* ═══ Badges / pills — tabular ═══ */
.badge, .nav-badge, .pill, .tag, .chip {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum", "ss01";
    letter-spacing: 0.02em;
}

/* ═══ Sidebar / nav — sutil hover ═══ */
.nav-item, .sidebar-item, [class*="nav-link"] {
    transition: background-color 180ms var(--ps-ease),
                color 180ms var(--ps-ease),
                padding-left 200ms var(--ps-ease) !important;
}
.nav-item:not(.active):hover,
.sidebar-item:not(.active):hover {
    padding-left: calc(var(--nav-padding-left, 10px) + 2px);
}

/* ═══ Glow ambient sutil (no AI-purple) ═══ */
body::after {
    content: '';
    position: fixed;
    top: -30%;
    right: -15%;
    width: 55vw;
    height: 55vw;
    background: radial-gradient(circle at center, rgba(45,212,191,.045) 0%, transparent 65%);
    pointer-events: none;
    z-index: -1;
    filter: blur(40px);
}

/* ═══ Animaciones de entrada (cuando JS toggle .active) ═══ */
@keyframes ps-fade-in {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}
.notification-panel.active,
.modal.active,
.modal.show,
.dropdown.open,
.dropdown.active {
    animation: ps-fade-in 220ms var(--ps-ease);
}

/* ═══ Toast / notification refinamiento ═══ */
.toast, .notification, .alert {
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
}

/* ═══ Loading spinner accent override ═══ */
.spinner, .loader, [class*="loading"] svg circle,
[class*="loading"] svg path {
    stroke: var(--ps-accent) !important;
}

/* ═══ Reduced motion ═══ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    body::after { display: none; }
}

/* ═══ Print ═══ */
@media print {
    body::after { display: none; }
    .sidebar, .nav, .header-actions, button { display: none !important; }
}