/*
 * Tavolozza QSPOS HelpDesk: blu confidente per il testo e l'accento primario (coerente con un
 * prodotto di assistenza tecnica), verde/teal per gli accenti secondari e per gli stati "ok".
 * Sovrascrivendo le variabili di Tabler l'intero tema — pulsanti, link, badge, form — segue la
 * palette senza dover intervenire pagina per pagina.
 */
:root {
    --tblr-primary: #205fa8;
    --tblr-primary-rgb: 32, 95, 168;
    --tblr-blue: #205fa8;
    --tblr-blue-rgb: 32, 95, 168;
    --tblr-link-color: #205fa8;
    --tblr-link-color-rgb: 32, 95, 168;
    --tblr-teal: #12a594;
    --tblr-teal-rgb: 18, 165, 148;
    --tblr-green: #2fa86a;
    --tblr-green-rgb: 47, 168, 106;
}

/* stessa tavolozza, schiarita per restare leggibile sullo sfondo scuro */
:root[data-bs-theme="dark"] {
    --tblr-primary: #6fa8e0;
    --tblr-primary-rgb: 111, 168, 224;
    --tblr-blue: #6fa8e0;
    --tblr-blue-rgb: 111, 168, 224;
    --tblr-link-color: #6fa8e0;
    --tblr-link-color-rgb: 111, 168, 224;
    --tblr-teal: #4fd6c6;
    --tblr-teal-rgb: 79, 214, 198;
    --tblr-green: #70c99f;
    --tblr-green-rgb: 112, 201, 159;
}

/* icona/monogramma nella navbar principale, al posto di un logo immagine */
.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--tblr-border-radius, .375rem);
    background: var(--tblr-primary);
    color: #fff;
    font-size: 1.25rem;
}

/* riquadri di collegamento rapido nella home */
.tile-collegamento {
    text-decoration: none;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease;
}

.tile-collegamento:hover {
    transform: translateY(-2px);
    box-shadow: var(--tblr-box-shadow-lg);
    color: inherit;
}

.tile-collegamento .avatar {
    color: #fff;
}

/* la chiave TOTP e i codici 2FA vanno a capo fra un gruppo e l'altro, mai spezzando le lettere */
kbd {
    font-family: var(--tblr-font-monospace);
    letter-spacing: .06em;
    overflow-wrap: normal;
    word-break: keep-all;
}

/* il QR generato da qrcode.js resta leggibile anche su schermi piccoli */
#qrCode {
    display: inline-block;
    padding: .75rem;
    background: #fff;
    border-radius: var(--tblr-border-radius, .375rem);
    border: 1px solid var(--tblr-border-color);
}