@import url("inter.css"); /* Inter self-hosted (GDPR) — era https://rsms.me/inter/inter.css */

/* lcRaptor 3.0 - override minimi su Tabler */

/* Colore icone disattive */
:root {
    --tblr-muted-fg: #d9dde1;
}

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

/* Colore th e note */
:root {
    --tblr-bg-surface-tertiary: #e8f4f5;
}

.alert-info {
    background-color: var(--tblr-bg-surface-tertiary);
}

/* Navbar sidebar - colore di sfondo e colore testo */
.navbar-vertical {
    background-color: #023f48 !important;
}

.navbar-dark,
.navbar[data-bs-theme=dark],
body[data-bs-theme=dark] .navbar[data-bs-theme=light] {
    --tblr-navbar-color: rgba(255, 255, 255, 0.8);
}

/* Immagini thumbnail nelle liste */
.card-table img {
    max-height: 60px;
    width: auto;
}

/* Didascalia data/ora sotto il nome record */
.table td small.text-muted {
    font-size: .75rem;
}

/* Icone nelle tabelle dati - dimensione e comportamento uniforme */
.card-table .ti {
    font-size: 1.25rem;
}

.card-table td>a {
    text-decoration: none;
    opacity: .75;
    transition: opacity .15s;
    font-weight: 500;
    font-size: 15px
}

.card-table td>a:hover {
    opacity: 1;
}

.card-table td>a .ti-trash {
    color: var(--tblr-danger);
}

.card-table td>a .ti-plus {
    color: var(--tblr-success);
}

/* Badge conteggio gallery */
.card-table .badge {
    line-height: normal;
}

/* Icone sidebar - dimensione leggermente aumentata */
.navbar-vertical .nav-link-icon .ti {
    font-size: 1.15rem;
}

/* Grip drag & drop - cursore */
.ordertd {
    cursor: grab;
}

.ordertd:active {
    cursor: grabbing;
}

/* Input ordine nascosto (usato da SortableJS) */
.inputorder {
    display: none !important;
}

/* Feedback drag ordine */
#lc-order-bar {
    margin-bottom: 8px;
}

#lc-order-save {
    font-weight: 500;
}

/* Sidebar: section labels */
.navbar-vertical .nav-link.disabled {
    pointer-events: none;
    font-size: .7rem;
    letter-spacing: .05em;
}

/* Form: label + asterisco sulla stessa riga, input sotto */
.card-body label {
    display: inline-block;
    margin-bottom: .15rem;
    font-weight: 500;
}

.card-body label.form-check-label {
    display: inline;
    font-weight: normal;
}

/* Bordo campi form più visibile */
.form-control,
.form-select {
    border-color: #bbced1 !important;
}

/* Larghezza 100% solo nei form ins/mod (non in input-group, search, select categoria).
   :not(.ts-hidden-accessible) → NON forzare il 100% sul <select> originale che TomSelect
   nasconde (sennò resta largo 100% e allarga lo scroll orizzontale della pagina). */
#form_ins_mod .form-control:not(.ts-hidden-accessible),
#form_ins_mod .form-select:not(.ts-hidden-accessible),
#rap_cat_ins_mod .form-control:not(.ts-hidden-accessible),
#rap_cat_ins_mod .form-select:not(.ts-hidden-accessible) {
    width: 100% !important;
}

/* Tom Select: nascondi tag individuali in count-mode, mostra solo contatore */
.ts-wrapper[data-count-mode] .ts-control .item {
    display: none !important;
}

/* Tom Select: padding verticale selettore categorie secondarie */
.ts-wrapper.select-cats-tags .ts-control {
    padding-top: 9px;
    padding-bottom: 9px;
}

/* Tom Select: mappa le variabili BS5 su quelle Tabler (ts-bootstrap5 usa --bs-body-bg) */
.ts-dropdown {
    --bs-body-bg: var(--tblr-bg-surface, #fff);
}

/* Preview record */
.card-body h5.text-uppercase {
    font-size: .7rem;
    letter-spacing: .06em;
}

/* Note modulo dentro alert: normalizza <p class="note"> */
.alert .note {
    margin: 0;
    padding: 0;
    font-size: .875rem;
}

.alert .note+.note {
    margin-top: .2rem;
}

/* Note modulo: variante "scheda note" — titolo <p class="note-title">, riga guida
   <p class="note-intro">, elenco puntato <ul class="note-list">. Accento sovrascrivibile
   per-sito con --note-accent. Additiva: non tocca le note vecchie <p class="note">. */
/* L'.alert Tabler è display:flex row → wrappare le note in <div class="note-card">
   per farle impilare verticalmente a tutta larghezza (titolo/intro/lista). */
.alert .note-card {
    flex: 1 1 100%;
    min-width: 0;
}
.alert .note-title {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--note-accent, #1aa3b8);
    margin: 0 0 14px;
}
.alert .note-intro {
    margin: 0 0 16px;
    padding-left: 14px;
    border-left: 3px solid var(--note-accent, #1aa3b8);
    font-size: .9rem;
}
.alert .note-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px;
    font-size: .9rem;
}
.alert .note-list li {
    position: relative;
    padding-left: 22px;
}
.alert .note-list li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: .55em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--note-accent, #1aa3b8);
}
.alert .note-list .muted { opacity: .7; }
.alert .note-list code {
    font-family: "SF Mono", "Cascadia Code", Consolas, monospace;
    font-size: .88em;
    color: #b3402e;
    background: rgba(179, 64, 46, .07);
    padding: 1px 5px;
    border-radius: 4px;
    white-space: nowrap;
}

/* ── Flag icons (self-hosted, 5 lingue) ─────────────────────────────── */
.flag{position:relative;display:inline-block;height:1em;aspect-ratio:1.33333;background:no-repeat center/cover;box-shadow:var(--tblr-shadow-border);border-radius:var(--tblr-border-radius);vertical-align:middle}
.flag-xxs{height:1rem}
.flag-xs{height:1.25rem}
.flag-sm{height:2rem}
.flag-md{height:2.5rem}
.flag-lg{height:3rem}
.flag-xl{height:5rem}
.flag-2xl{height:7rem}
.flag-country-it{background-image:url("../img/it.svg")}
.flag-country-es{background-image:url("../img/es.svg")}
.flag-country-en{background-image:url("../img/en.svg")}
.flag-country-fr{background-image:url("../img/fr.svg")}
.flag-country-de{background-image:url("../img/de.svg")}

/* ── CodeMirror scrollbar always visible ────────────────────────────── */
.cm-scroller {
    scrollbar-color: rgba(255,255,255,.5) transparent;
    scrollbar-width: thin;
}
.cm-scroller::-webkit-scrollbar { width: 8px; height: 8px; }
.cm-scroller::-webkit-scrollbar-track { background: transparent; }
.cm-scroller::-webkit-scrollbar-thumb { background: rgba(255,255,255,.5); border-radius: 4px; }

/* ── parent-tab: form-control riempie il suo col (Tabler sovrascrive con width:auto su input[size]) */
.parent-tab .form-control {
    width: 100%;
}

/* ── Nav-tabs: bordo leggermente più scuro + active teal ────────────────── */
.nav-tabs {
    border-bottom-color: #9fb3c0;
}
.nav-tabs .nav-link.active {
    background-color: #e1f1f4;
    border-color: #9fb3c0 #9fb3c0 #e1f1f4;
}

/* 4.1 — Aiuto in linea (rap_help_box): <details> collassabile in stile card */
.rap-help > summary { cursor: pointer; list-style: none; }
.rap-help > summary::-webkit-details-marker { display: none; }
.rap-help > summary { background-color: #f3f9fb; }
.rap-help-toggle::before { content: "\25BE"; }        /* ▾ chiuso */
.rap-help[open] .rap-help-toggle::before { content: "\25B4"; } /* ▴ aperto */
.rap-help .rap-help-body :last-child { margin-bottom: 0; }

/* ═══ 4.6 M1 — Liste unificate (opt-in per-modulo `use_list_sidebar`) ═══════ */

/* Contenitore largo: usato SOLO dai layout opt-in della 4.6 (vedi header.inc.php).
   Non è un container-fluid nudo — sotto i 1700px si comporta come container-xl. */
.container-wide {
    width: 100%;
    max-width: 1700px;
    margin-inline: auto;
    padding-inline: var(--tblr-gutter-x, 1.5rem);
}

/* ⚠️ Tabler rende flex SOLO i container di Bootstrap dentro una navbar:
   `.navbar>.container, .navbar>.container-fluid, .navbar>.container-sm … .container-xxl`.
   `.container-wide` è una classe nostra e non è in quell'elenco: nella barra in alto il div
   tornava `display:block`, `me-auto` smetteva di spingere e le icone utente/2FA/logout non
   erano più allineate a destra (segnalato su perego il 2026-07-29). Qui si replica la
   dichiarazione di Tabler per la nostra classe. */
.navbar > .container-wide {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
}

/* Sidebar categorie: si appiccica sotto l'header quando la lista è lunga */
@media (min-width: 992px) {
    .rap-cat-sidebar {
        position: sticky;
        top: 1rem;
    }
    .rap-cat-list {
        max-height: calc(100vh - 16rem);
        overflow-y: auto;
    }
}

/* Stessa cura della colonna side del form: su schermi grandi l'elenco categorie non deve
   dilatarsi (col-lg-3 di 1700px = ~425px per una lista di nomi). Qui lo sticky va bene:
   è UNA sola card, con l'elenco che scrolla al suo interno. Cap da xxl come per il form. */
@media (min-width: 1400px) {
    .rap-unified > .col-lg-3 {
        flex: 0 0 320px;
        width: 320px;
        max-width: 320px;
    }
    .rap-unified > .rap-list-main {
        flex: 1 1 0;
        width: auto;
        max-width: none;
    }
}

/* Voce di categoria: riga compatta, il nome tronca e il contatore resta visibile */
.rap-cat-list .list-group-item {
    padding: .5rem .75rem;
    font-size: .875rem;
    border-left: 0;
    border-right: 0;
}
.rap-cat-list .list-group-item .badge {
    flex: 0 0 auto;
}
.rap-cat-list .list-group-item.active {
    font-weight: 600;
}


/* ═══ 4.6 M2 — Form a blocchi main/side (opt-in `form_blocks`) ══════════════ */

/* Header del form: breadcrumb + titolo + Anteprima + Salva. Si appiccica in alto
   così il Salva resta a portata anche nei form lunghi (sostituisce quello a fondo pagina). */
.rap-form-bar {
    position: sticky;
    top: 0;
    z-index: 6;
    background: var(--tblr-body-bg, #f6f8fb);
    padding: .75rem 0;
    border-bottom: 1px solid var(--tblr-border-color, #dbe0e5);
}
.rap-form-bar .min-w-0 { min-width: 0; }

/* ⚠️ NIENTE sticky sulle card della colonna side: rendendo sticky solo la prima, le
   successive le scorrevano SOPRA (segnalato 2026-07-28 con screenshot: "Categoria" e
   "Sottocategoria" finivano sopra il blocco "Pubblicazione"). La side scorre con la
   pagina; l'unico elemento agganciato resta la barra col Salva. */

/* Su schermi grandi la side non deve dilatarsi: con container-wide a 1700px una colonna
   4/12 arriva a ~570px, troppo per una fila di selettori. Larghezza fissa e il main si
   prende tutto il resto.
   ⚠️ Il cap parte da xxl (1400px) di proposito: applicandolo già da 1200px la side FISSA a
   380px pesava PIÙ del 4/12 e il main diventava più stretto di prima (574px a vw 1290). */
@media (min-width: 1400px) {
    .rap-form-cols > .rap-form-side {
        flex: 0 0 380px;
        width: 380px;
        max-width: 380px;
    }
    .rap-form-cols > :not(.rap-form-side) {
        flex: 1 1 0;
        width: auto;
        max-width: none;
    }
}

/* Blocchi: card compatte, l'ultima senza margine sotto */
.rap-form-block > .card-body { padding-top: 1rem; }
.rap-form-cols .rap-form-block:last-child { margin-bottom: 0; }


/* ============================================================
   4.7 M1 — Centro notifiche: badge non-letti sulla campanella.
   Pallino piccolo agganciato all'angolo alto-destro dell'ICONA
   (il wrapper .rap-ntf-bell è position-relative attorno alla
   sola icona, non al nav-link col suo padding), numero bianco,
   anello del colore del fondo per staccarlo dalla campanella.
   ============================================================ */
.rap-ntf-bell {
	position: relative;
	display: inline-block;
	line-height: 1;
}
.rap-ntf-badge {
	position: absolute;
	top: -0.4rem;
	right: -0.5rem;
	min-width: 0.8rem;
	height: 0.8rem;
	padding: 0 0.15rem;
	font-size: 0.55rem;
	font-weight: 600;
	line-height: 0.8rem;
	color: #fff;
	background: var(--tblr-red, #d63939);
	border-radius: 0.5rem;
	text-align: center;
	box-shadow: 0 0 0 1.5px var(--tblr-bg-surface, #fff);
}


/* ============================================================
   4.7 — Leggibilità dei testi lunghi di notifiche e centro aiuto.
   Il pannello Tabler ha corpo .875rem: va bene per tabelle e form,
   è piccolo per la prosa delle guide e delle comunicazioni.
   Richiesta utente 2026-08-01: +10% almeno.
   ============================================================ */
.rap-ntf-text {
	font-size: 1rem;      /* era .9rem inline: +11% */
	line-height: 1.55;
}
.rap-ntf-title {
	font-size: 1.05rem;   /* titolo della notifica in elenco */
}
.rap-help-body {
	font-size: 1.05rem;   /* +20% sul corpo Tabler: sono testi da leggere */
	line-height: 1.65;
}
.rap-help-body li {
	margin-bottom: .35rem;
}
.rap-help-index {
	font-size: .95rem;    /* indice argomenti: +9% */
}