/*
 * NewVoip UI - Legacy bridge v0.1
 *
 * Ponte temporaneo tra Phoenix/Bootstrap esistenti e il nuovo design system.
 * Serve per poter provare le palette su tutto il pannello mentre le view vengono
 * migrate gradualmente verso le classi nv-*.
 *
 * Da ridurre progressivamente man mano che le view diventano native nv-*.
 */

html.nv-ui body,
html.nv-ui .main,
html.nv-ui main.content,
html.nv-ui .wrapper {
    background-color: var(--nv-bg) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .navbar-top {
    background: var(--nv-topbar-bg) !important;
    border-color: var(--nv-border) !important;
    color: var(--nv-text) !important;
    backdrop-filter: blur(14px);
}

html.nv-ui .navbar-vertical,
html.nv-ui .navbar-vertical-content,
html.nv-ui .navbar-vertical-footer {
    background: var(--nv-sidebar-bg) !important;
    border-color: var(--nv-border) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .navbar-vertical .nav-link,
html.nv-ui .navbar-top .nav-link,
html.nv-ui .navbar-top .navbar-brand,
html.nv-ui .navbar-top .logo-text {
    color: var(--nv-text-muted) !important;
}

html.nv-ui .navbar-vertical .nav-link:hover,
html.nv-ui .navbar-vertical .nav-link.active,
html.nv-ui .navbar-top .nav-link:hover {
    color: var(--nv-text) !important;
}

html.nv-ui .navbar-vertical .nav-link:hover,
html.nv-ui .navbar-vertical .nav-link.active {
    background: var(--nv-accent-soft) !important;
    border-radius: var(--nv-radius-sm);
}

html.nv-ui .card,
html.nv-ui .accordion-item,
html.nv-ui .dropdown-menu,
html.nv-ui .modal-content,
html.nv-ui .list-group-item,
html.nv-ui .offcanvas {
    background-color: var(--nv-surface) !important;
    color: var(--nv-text) !important;
    border-color: var(--nv-border) !important;
}

html.nv-ui .card-header,
html.nv-ui .card-footer,
html.nv-ui .accordion-header,
html.nv-ui .modal-header,
html.nv-ui .modal-footer,
html.nv-ui .dropdown-divider {
    background-color: var(--nv-surface-2) !important;
    border-color: var(--nv-border) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .bg-body,
html.nv-ui .bg-light,
html.nv-ui .bg-body-tertiary {
    background-color: var(--nv-surface) !important;
}

html.nv-ui .bg-body-secondary {
    background-color: var(--nv-surface-2) !important;
}

html.nv-ui .text-body,
html.nv-ui .text-body-emphasis,
html.nv-ui .text-body-highlight,
html.nv-ui .text-dark {
    color: var(--nv-text) !important;
}

html.nv-ui .text-muted,
html.nv-ui .text-secondary,
html.nv-ui .text-body-secondary,
html.nv-ui .text-body-tertiary {
    color: var(--nv-text-muted) !important;
}

html.nv-ui .border,
html.nv-ui .border-top,
html.nv-ui .border-bottom,
html.nv-ui .border-start,
html.nv-ui .border-end,
html.nv-ui hr {
    border-color: var(--nv-border) !important;
}

html.nv-ui .form-control,
html.nv-ui .form-select,
html.nv-ui .input-group-text,
html.nv-ui .select2-container--default .select2-selection--single,
html.nv-ui .select2-container--default .select2-selection--multiple {
    background-color: var(--nv-surface-3) !important;
    border-color: var(--nv-border) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .form-control::placeholder {
    color: var(--nv-text-subtle) !important;
}

html.nv-ui .form-control:focus,
html.nv-ui .form-select:focus {
    border-color: var(--nv-accent) !important;
    box-shadow: 0 0 0 .2rem var(--nv-accent-soft) !important;
}

html.nv-ui .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--nv-text);
    --bs-table-border-color: var(--nv-border);
    --bs-table-striped-bg: var(--nv-surface-2);
    --bs-table-striped-color: var(--nv-text);
    --bs-table-hover-bg: var(--nv-surface-3);
    --bs-table-hover-color: var(--nv-text);
    color: var(--nv-text) !important;
}

html.nv-ui .table thead th,
html.nv-ui .table thead td {
    background: var(--nv-surface-2) !important;
    color: var(--nv-text-muted) !important;
    border-color: var(--nv-border) !important;
}

/* Phoenix/Bootstrap actions: le azioni neutre seguono il tema. */
html.nv-ui .btn-phoenix-secondary,
html.nv-ui .btn-outline-secondary {
    background: var(--nv-surface-3) !important;
    color: var(--nv-text) !important;
    border-color: var(--nv-border) !important;
}

html.nv-ui .btn-primary:not(.nv-telephony-state),
html.nv-ui .btn-info:not(.nv-telephony-state) {
    border-color: var(--nv-accent) !important;
}

/*
 * Stati telefonici legacy.
 * Manteniamo le classi Bootstrap perché Asterisk-websocket-client.js le usa
 * direttamente. Il significato resta costante tra tutte le palette.
 */
html.nv-ui .nv-monitor-overview .btn-success {
    background: var(--nv-success) !important;
    border-color: var(--nv-success) !important;
    color: #06140e !important;
}

html.nv-ui .nv-monitor-overview .btn-warning {
    background: var(--nv-warning) !important;
    border-color: var(--nv-warning) !important;
    color: #251800 !important;
}

html.nv-ui .nv-monitor-overview .btn-danger {
    background: var(--nv-danger) !important;
    border-color: var(--nv-danger) !important;
    color: #fff !important;
}

html.nv-ui .nv-monitor-overview .btn-primary {
    background: var(--nv-info) !important;
    border-color: var(--nv-info) !important;
    color: #071522 !important;
}

html.nv-ui .nv-monitor-overview .btn-secondary {
    background: var(--nv-text-subtle) !important;
    border-color: var(--nv-text-subtle) !important;
    color: #fff !important;
}

html.nv-ui .nv-monitor-overview .btn-dark {
    background: #343a40 !important;
    border-color: #343a40 !important;
    color: #fff !important;
}

/* Theme preview control */
.nv-theme-preview-toggle {
    min-width: 38px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--nv-radius-sm) !important;
    background: var(--nv-surface) !important;
    border: 1px solid var(--nv-border) !important;
    color: var(--nv-accent) !important;
}

.nv-theme-preview-menu {
    min-width: 245px;
    padding: 12px !important;
}

.nv-theme-preview-menu .form-label {
    color: var(--nv-text-muted) !important;
    font-size: var(--nv-font-size-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.nv-theme-preview-note {
    margin-top: 8px;
    color: var(--nv-text-subtle);
    font-size: .70rem;
    line-height: 1.35;
}

.nv-privilege-indicator {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 6px;
    padding: 6px 10px;
    border: 1px solid var(--nv-admin-border);
    border-radius: var(--nv-radius-pill);
    background: #fff3e3;
    color: #8f4300;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .04em;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(143, 67, 0, .08);
}

.nv-privilege-indicator strong {
    color: #713500;
}

@media (max-width: 1180px) {
    .nv-privilege-indicator-text {
        display: none;
    }
}



/*
 * Contrasto legacy forte.
 * Molte view storiche hanno sfondi propri o classi Phoenix che possono
 * sopravvivere al bridge. In queste aree il testo deve restare leggibile
 * indipendentemente dalla palette.
 */
html.nv-ui .card-body,
html.nv-ui .list-group,
html.nv-ui .list-group-item,
html.nv-ui .dropdown-item,
html.nv-ui .accordion-body,
html.nv-ui .modal-body {
    color: var(--nv-text) !important;
}

html.nv-ui .dropdown-item:hover,
html.nv-ui .dropdown-item:focus,
html.nv-ui .dropdown-item.active,
html.nv-ui .dropdown-item:active {
    background-color: var(--nv-accent-soft) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .btn-outline-primary {
    color: var(--nv-accent) !important;
    border-color: var(--nv-accent) !important;
    background: var(--nv-surface) !important;
}

html.nv-ui .btn-outline-primary:hover,
html.nv-ui .btn-outline-primary:focus {
    color: var(--nv-text-on-accent) !important;
    background: var(--nv-accent) !important;
    border-color: var(--nv-accent) !important;
}

/* Rubrica Panoramica: niente testo chiaro su fondi chiari. */
html.nv-ui .nv-monitor-overview #contacts .card,
html.nv-ui .nv-monitor-overview #contacts .card-body,
html.nv-ui .nv-monitor-overview #contacts .list-group,
html.nv-ui .nv-monitor-overview #contacts .list-group-item {
    background: var(--nv-surface) !important;
    color: var(--nv-text) !important;
}

html.nv-ui .nv-monitor-overview #contacts .fw-semibold,
html.nv-ui .nv-monitor-overview #contacts .list-group-item > div {
    color: var(--nv-text) !important;
}

html.nv-ui .nv-monitor-overview #contacts .text-muted,
html.nv-ui .nv-monitor-overview #contacts .small {
    color: var(--nv-text-muted) !important;
}

html.nv-ui .nv-monitor-overview #contacts_search {
    background: #ffffff !important;
    color: var(--nv-text) !important;
    border-color: var(--nv-border-strong) !important;
}


/* Stato salvataggio preferenza tema */
.nv-theme-preview-note.is-saving {
    color: var(--nv-info) !important;
}

.nv-theme-preview-note.is-saved {
    color: var(--nv-success) !important;
}

.nv-theme-preview-note.is-error {
    color: var(--nv-danger) !important;
}