/* static/css/theme-dark.css  */ 

/* Design tokens for Dark Pro */
:root {
    --ptp-bg: #1f242a;
    --ptp-card: #23282f;
    --ptp-text: #e9edf4;
    --ptp-text-muted: #9aa3b3;
    --ptp-accent-blue: #1e90ff;
    --ptp-danger: #c74444;
    --ptp-success: #3edc81;
    --ptp-radius: 6px;
    --ptp-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
    --ptp-font: "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* Preview theme only applies when this class is added */
body.ptp-dark-preview {
    background-color: var(--ptp-bg);
    color: var(--ptp-text);
    font-family: var(--ptp-font);
}
/* ============================
   CARD STYLING (Preview Mode)
============================ */

body.ptp-dark-preview .card {
    background-color: var(--ptp-card);
    color: var(--ptp-text);
    border: none;
    border-radius: var(--ptp-radius);
    box-shadow: var(--ptp-shadow);
    padding: 10px;
}

/* Optional card header refinement (if used anywhere) */
body.ptp-dark-preview .card-header {
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    color: var(--ptp-text);
    font-weight: 600;
}
/* ============================
   INPUTS (Preview Mode)
============================ */

body.ptp-dark-preview input,
body.ptp-dark-preview select,
body.ptp-dark-preview textarea {
    background-color: #2a2f36;
    color: var(--ptp-text);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--ptp-radius);
}

/* Focus effect (blue accent ring) */
body.ptp-dark-preview input:focus,
body.ptp-dark-preview select:focus,
body.ptp-dark-preview textarea:focus {
    outline: none !important;
    border-color: var(--ptp-accent-blue);
    box-shadow: 0 0 0 2px rgba(30, 144, 255, 0.4);
}
/* ===================================
   BUTTONS — Dark Theme Preview
=================================== */

body.ptp-dark-preview .btn {
    border-radius: var(--ptp-radius);
    font-weight: 500;
    border: none;
    transition: 0.15s ease;
}

/* Primary (Calculate, Load, View, Default Actions) */
body.ptp-dark-preview .btn-primary {
    background-color: var(--ptp-accent-blue);
    color: white;
}
body.ptp-dark-preview .btn-primary:hover {
    background-color: #1774d8;
}
body.ptp-dark-preview .btn-primary:active {
    background-color: #1060b4;
    transform: scale(0.98);
}

/* Success (Save Profile, Log Injection) */
body.ptp-dark-preview .btn-success {
    background-color: var(--ptp-success);
    color: #0c1419;
}
body.ptp-dark-preview .btn-success:hover {
    filter: brightness(1.1);
}
body.ptp-dark-preview .btn-success:active {
    filter: brightness(0.9);
    transform: scale(0.98);
}

/* Danger (Delete Entry, Delete Profile) */
body.ptp-dark-preview .btn-danger {
    background-color: var(--ptp-danger);
    color: white;
}
body.ptp-dark-preview .btn-danger:hover {
    filter: brightness(1.1);
}
body.ptp-dark-preview .btn-danger:active {
    filter: brightness(0.9);
    transform: scale(0.98);
}

/* Secondary or Grey Buttons (Clone, View Graph, repeat) */
body.ptp-dark-preview .btn-secondary,
body.ptp-dark-preview .btn-outline-secondary {
    background-color: #3e4650;
    color: var(--ptp-text);
}
body.ptp-dark-preview .btn-secondary:hover,
body.ptp-dark-preview .btn-outline-secondary:hover {
    background-color: #4b545f;
}
body.ptp-dark-preview .btn-secondary:active,
body.ptp-dark-preview .btn-outline-secondary:active {
    background-color: #31383f;
    transform: scale(0.98);
}
/* ============================
   NAVBAR — Frosted Glass Effect
============================ */

body.ptp-dark-preview nav.navbar {
    background: rgba(35, 40, 47, 0.45); /* semi-transparent graphite */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); /* Safari support */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Text and links inside navbar */
body.ptp-dark-preview nav.navbar .nav-link,
body.ptp-dark-preview nav.navbar .navbar-brand,
body.ptp-dark-preview nav.navbar .navbar-text {
    color: var(--ptp-text) !important;
}

/* Hover links slightly brighten */
body.ptp-dark-preview nav.navbar .nav-link:hover {
    color: var(--ptp-accent-blue) !important;
}
/* rebuild ping */