/* ====================================================================
   RedZone Edge — Data Validator component theme.
   Variables are scoped to .dv-root so the component is self-contained:
   no global :root pollution, host application can override by setting
   the variables on its own ancestor wrapper if it wants.
   ==================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

.dv-root {
    --dv-bg-deep:        #0A1428;
    --dv-bg-base:        #0F1B33;
    --dv-bg-elev-1:      #162547;
    --dv-bg-elev-2:      #1D2F58;
    --dv-bg-elev-3:      #25396B;
    --dv-border:         #243860;
    --dv-border-strong:  #335086;

    --dv-text-primary:   #E8EEF8;
    --dv-text-secondary: #9AA8C2;
    --dv-text-tertiary:  #6A7895;
    --dv-text-quaternary:#4C5874;

    --dv-cyan:           #00D4FF;
    --dv-cyan-dim:       #007FA0;

    --dv-green:          #2ECC8C;
    --dv-green-dim:      #1B8B5E;

    --dv-amber:          #F2A93B;
    --dv-amber-dim:      #B57A1F;

    --dv-red:            #E94B5C;
    --dv-red-dim:        #A82F3D;

    --dv-purple:         #9B7FE0;

    --dv-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --dv-font-mono: 'JetBrains Mono', ui-monospace, monospace;

    --dv-r-sm: 2px;
    --dv-r-md: 3px;

    /* Component itself — base appearance */
    background: var(--dv-bg-base);
    color: var(--dv-text-primary);
    font-family: var(--dv-font-sans);
    font-size: 12.5px;
    line-height: 1.4;
    -webkit-font-smoothing: antialiased;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.dv-root *,
.dv-root *::before,
.dv-root *::after {
    box-sizing: border-box;
}

.dv-root button {
    font: inherit;
    cursor: pointer;
    border: none;
    background: none;
    color: inherit;
    margin: 0;
    padding: 0;
}
.dv-root input,
.dv-root select { font: inherit; }

.dv-mono {
    font-family: var(--dv-font-mono);
    font-feature-settings: 'tnum' 1;
}

.dv-root *::-webkit-scrollbar { width: 6px; height: 6px; }
.dv-root *::-webkit-scrollbar-thumb { background: var(--dv-border-strong); border-radius: 3px; }

@keyframes dv-pulse {
    50% { opacity: 0.35; }
}
@keyframes dv-fade-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}