/* Tema del pannello VPS sui colori della dashboard NetBird.
   Si carica DOPO bootstrap.min.css, con <html data-bs-theme="dark">. */

:root, [data-bs-theme="dark"] {
    --nb-bg:          #18191d;
    --nb-surface:     #1b1f22;
    --nb-surface-2:   #25282d;
    --nb-border:      rgba(50, 54, 61, .5);
    --nb-border-2:    rgba(63, 68, 75, .8);
    --nb-control:     rgba(63, 68, 75, .5);
    --nb-text:        #e4e7e9;
    --nb-muted:       #8f9ca8;
    --nb-orange:      #f68330;
    --nb-orange-600:  #e55311;

    --bs-body-bg: var(--nb-bg);
    --bs-body-color: var(--nb-text);
    --bs-body-font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
    --bs-body-font-size: .875rem;
    --bs-secondary-color: var(--nb-muted);
    --bs-tertiary-bg: var(--nb-surface);
    --bs-border-color: var(--nb-border);
    --bs-border-radius: .5rem;
    --bs-border-radius-sm: .5rem;
    --bs-border-radius-lg: .75rem;
    --bs-link-color: var(--nb-orange);
    --bs-link-color-rgb: 246, 131, 48;
    --bs-link-hover-color: #fab677;
    --bs-link-hover-color-rgb: 250, 182, 119;
    --bs-primary: var(--nb-orange);
    --bs-primary-rgb: 246, 131, 48;
    --bs-focus-ring-color: rgba(246, 131, 48, .25);
}

body {
    background: var(--nb-bg) !important;
    color: var(--nb-text);
    -webkit-font-smoothing: antialiased;
}

.text-muted { color: var(--nb-muted) !important; }

/* barra in alto, piè di pagina, barra della console */
.navbar, footer, .toolbar {
    background: var(--nb-surface) !important;
    border-color: var(--nb-border) !important;
}
.navbar-brand, .brand-title { color: #fff; font-weight: 500; }

/* il logo Argomedia è scuro: sul fondo scuro va schiarito */
img[src*="LOGO_ARGOMEDIA"] { filter: invert(1) brightness(1.1); }

/* card e tabelle */
.card, .modal-content {
    background: var(--nb-surface);
    border: 1px solid var(--nb-border) !important;
    border-radius: .75rem;
    box-shadow: none !important;
}
.card { overflow: hidden; }
.modal-header, .modal-footer { border-color: var(--nb-border); }

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--nb-text);
    --bs-table-border-color: var(--nb-border);
    --bs-table-hover-bg: rgba(63, 68, 75, .25);
    --bs-table-hover-color: var(--nb-text);
    margin-bottom: 0;
}
.table > thead > tr > th {
    background: var(--nb-surface-2);
    color: var(--nb-muted);
    font-size: .75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .03em;
    border-bottom-color: var(--nb-border);
}
.table td, .table th { padding: .85rem 1rem; }

/* campi */
.form-control, .form-select {
    background-color: var(--nb-control);
    border: 1px solid var(--nb-border-2);
    color: var(--nb-text);
    border-radius: .5rem;
}
.form-control::placeholder { color: var(--nb-muted); }
.form-control:focus, .form-select:focus {
    background-color: var(--nb-control);
    color: var(--nb-text);
    border-color: var(--nb-orange);
    box-shadow: 0 0 0 .2rem rgba(246, 131, 48, .2);
}
.form-select option { background: var(--nb-surface-2); color: var(--nb-text); }

/* bottoni: primario arancio pieno, gli altri grigi come in NetBird */
.btn { border-radius: .5rem; font-weight: 500; }
.btn-primary {
    --bs-btn-bg: var(--nb-orange);
    --bs-btn-border-color: var(--nb-orange);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--nb-orange-600);
    --bs-btn-hover-border-color: var(--nb-orange-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--nb-orange-600);
    --bs-btn-active-border-color: var(--nb-orange-600);
    --bs-btn-disabled-bg: var(--nb-orange);
    --bs-btn-disabled-border-color: var(--nb-orange);
}
.btn-outline-primary, .btn-outline-secondary, .btn-secondary {
    --bs-btn-bg: var(--nb-control);
    --bs-btn-border-color: var(--nb-border-2);
    --bs-btn-color: var(--nb-text);
    --bs-btn-hover-bg: rgba(63, 68, 75, .85);
    --bs-btn-hover-border-color: var(--nb-border-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: rgba(63, 68, 75, .85);
    --bs-btn-active-border-color: var(--nb-border-2);
    --bs-btn-active-color: #fff;
}
/* accensione e spegnimento: tinte tenui con testo colorato */
.btn-success, .btn-warning, .btn-danger, .btn-outline-danger {
    --bs-btn-color: var(--tone);
    --bs-btn-bg: rgba(var(--tone-rgb), .12);
    --bs-btn-border-color: rgba(var(--tone-rgb), .35);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: rgba(var(--tone-rgb), .30);
    --bs-btn-hover-border-color: rgba(var(--tone-rgb), .55);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: rgba(var(--tone-rgb), .40);
    --bs-btn-active-border-color: rgba(var(--tone-rgb), .55);
}
.btn-success { --tone: #4ade80; --tone-rgb: 74, 222, 128; }
.btn-warning { --tone: #fbbf24; --tone-rgb: 251, 191, 36; }
.btn-danger, .btn-outline-danger { --tone: #f87171; --tone-rgb: 248, 113, 113; }

/* badge a pillola, come gli stati dei peer in NetBird */
.badge {
    border-radius: 999px;
    font-weight: 500;
    font-size: .75rem;
    padding: .3em .7em;
    border: 1px solid transparent;
}
.badge.text-bg-success   { background: rgba(74, 222, 128, .12) !important; color: #4ade80 !important; border-color: rgba(74, 222, 128, .3); }
.badge.text-bg-danger    { background: rgba(248, 113, 113, .12) !important; color: #f87171 !important; border-color: rgba(248, 113, 113, .3); }
.badge.text-bg-warning   { background: rgba(251, 191, 36, .12) !important; color: #fbbf24 !important; border-color: rgba(251, 191, 36, .3); }
.badge.text-bg-info      { background: rgba(56, 189, 248, .12) !important; color: #7dd3fc !important; border-color: rgba(56, 189, 248, .3); }
.badge.text-bg-primary   { background: rgba(246, 131, 48, .12) !important; color: #fab677 !important; border-color: rgba(246, 131, 48, .3); }
.badge.text-bg-secondary,
.badge.text-bg-dark      { background: var(--nb-control) !important; color: var(--nb-text) !important; border-color: var(--nb-border-2); }
/* pallino di stato davanti a RUNNING / STOPPED */
.badge.text-bg-success::before, .badge.text-bg-danger::before,
.badge.text-bg-warning::before {
    content: ""; display: inline-block; width: .45em; height: .45em;
    border-radius: 50%; background: currentColor; margin-right: .45em; vertical-align: .1em;
}

.btn-close { filter: invert(1) grayscale(1) brightness(1.5); }
.vr { background-color: var(--nb-border-2); opacity: 1; }
.navlink { color: var(--nb-muted); }
.navlink:hover { color: var(--nb-text); }

/* piè di pagina: scritte arancioni (richiesta di Omar) */
footer, footer .text-muted, footer .navlink { color: var(--nb-orange) !important; }
footer .navlink:hover { color: #fab677 !important; }
