/*
 * bs5-compat.css — accademiapolizialocale.it
 *
 * Il sito resta su Bootstrap 3.3.7, ma Helix3 3.1.4 emette in una manciata di
 * punti le utility di Bootstrap 5 (features/menu.php, features/logo.php,
 * paginazione, messaggi di sistema, com_search, plg_content_pagenavigation...).
 * Qui quelle poche utility sono ridefinite con la semantica e i breakpoint
 * ORIGINALI di Bootstrap 5, così il markup vendor si comporta come previsto
 * senza dover modificare nemmeno un file di Helix.
 *
 * File aggiunto da noi: nessun aggiornamento di Helix3 lo tocca.
 * Caricato da index.php subito dopo bootstrap.min.css.
 */

/* --- display --- */
.d-none         { display: none !important; }
.d-inline       { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-block        { display: block !important; }
.d-flex         { display: flex !important; }

@media (min-width: 576px) {
  .d-sm-none { display: none !important; }  .d-sm-block { display: block !important; }
  .d-sm-flex { display: flex !important; }  .d-sm-inline-block { display: inline-block !important; }
}
@media (min-width: 768px) {
  .d-md-none { display: none !important; }  .d-md-block { display: block !important; }
  .d-md-flex { display: flex !important; }  .d-md-inline-block { display: inline-block !important; }
}
@media (min-width: 992px) {
  .d-lg-none { display: none !important; }  .d-lg-block { display: block !important; }
  .d-lg-flex { display: flex !important; }  .d-lg-inline-block { display: inline-block !important; }
}
@media (min-width: 1200px) {
  .d-xl-none { display: none !important; }  .d-xl-block { display: block !important; }
}
@media print { .d-print-none { display: none !important; } }

/* --- float / text (logical properties BS5 -> LTR) --- */
.float-start { float: left !important; }
.float-end   { float: right !important; }
.float-none  { float: none !important; }
.text-start  { text-align: left !important; }
.text-end    { text-align: right !important; }

/* --- spaziature usate dal markup vendor (scala BS5: 1=.25rem ... 5=3rem) --- */
.ms-0 { margin-left: 0 !important; }      .me-0 { margin-right: 0 !important; }
.ms-1 { margin-left: .25rem !important; } .me-1 { margin-right: .25rem !important; }
.ms-2 { margin-left: .5rem !important; }  .me-2 { margin-right: .5rem !important; }
.ms-3 { margin-left: 1rem !important; }   .me-3 { margin-right: 1rem !important; }
.ps-0 { padding-left: 0 !important; }     .pe-0 { padding-right: 0 !important; }
.ps-2 { padding-left: .5rem !important; } .pe-2 { padding-right: .5rem !important; }

/* --- accessibilità: BS5 .visually-hidden == BS3 .sr-only --- */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important; border: 0 !important;
}

/* --- .btn-close: usato da html/layouts/joomla/system/message.php --- */
.btn-close {
  box-sizing: content-box;
  width: 1em; height: 1em;
  padding: .25em;
  color: #000; background: transparent;
  border: 0; border-radius: .25rem;
  opacity: .5; cursor: pointer;
  font-size: 1.25rem; line-height: 1;
}
.btn-close::before { content: "\00d7"; display: block; line-height: 1em; }
.btn-close:hover { opacity: .85; text-decoration: none; }

/* --- .form-select: reso identico a .form-control di BS3 --- */
.form-select {
  display: block; width: 100%; height: 34px;
  padding: 6px 12px; font-size: 14px; line-height: 1.42857143;
  color: #555; background-color: #fff;
  border: 1px solid #ccc; border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.form-select:focus { border-color: #66afe9; outline: 0; }

.form-check       { position: relative; display: block; padding-left: 1.25rem; }
.form-check-input  { position: absolute; margin-top: .3rem; margin-left: -1.25rem; }
.form-check-label  { margin-bottom: 0; }

/* ------------------------------------------------------------------ *
 * Neutralizzazioni di less/legacy.less
 *
 * less/legacy.less è NUOVO nella 3.1.4 (viene importato da master.less e
 * finisce dentro css/template.css). È lo shim che JoomShaper ha scritto per
 * rimettere in Bootstrap 5 alcune cose di Bootstrap 2/3. Noi però Bootstrap 3
 * ce l'abbiamo davvero, quindi quelle regole si sovrappongono a
 * bootstrap.min.css e a css/legacy.css e in tre punti cambiano l'aspetto.
 * Qui i tre punti tornano ai valori che il sito ha oggi con la 2.4.
 * ------------------------------------------------------------------ */

/* legacy.less colora di grigio pieno i .btn senza variante; in BS3 sono
   trasparenti. Ripristiniamo il comportamento BS3. */
.btn:not([class*="btn-"]),
.btn:not([class*="btn-"]):hover,
.btn:not([class*="btn-"]):focus {
  background-color: transparent;
  border-color: transparent;
}

/* Il colore va gestito separatamente per tipo di elemento.
   La regola di legacy.less ha specificita' (0,2,0) e batterebbe sia `a`
   (0,0,1) sia `a:hover` (0,0,2), quindi non basta toglierla: va riaffermato
   il valore giusto.
   - <button>/<input>: nessun colore in Bootstrap 3, quindi eredita
   - <a>: deve restare il colore link del sito, che vale #5396D6
     (custom-css.css riga 63) e #101b20 in hover (presets/preset1.css).
   Se in futuro cambiano quei due colori, vanno aggiornati anche qui. */
button.btn:not([class*="btn-"]),
input.btn:not([class*="btn-"]) {
  color: inherit;
}

a.btn:not([class*="btn-"]) {
  color: #5396D6;
}

a.btn:not([class*="btn-"]):hover,
a.btn:not([class*="btn-"]):focus {
  color: #101b20;
}

/* .well: valori di css/legacy.css (Joomla 3), non quelli di legacy.less */
.well {
  padding: 19px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
}

/* .control-group: 10px come oggi, non i 16px di legacy.less */
.control-group { margin-bottom: 10px; }

/* ------------------------------------------------------------------ *
 * FontAwesome 4: la variabile CSS che Helix 3.1.4 dà per scontata
 *
 * Il LESS della 3.1.4 (menu.less, theme.less, rtl.less) scrive
 * `font-family: var(--fontAwesome--Version)` in 7 punti — freccia del
 * megamenu, freccia dei dropdown, scroll-to-top, bullet dei moduli,
 * icone entry-link/entry-quote.
 *
 * Quella variabile è definita SOLO dentro css/fontawesome.min.css
 * ("Font Awesome 6 Free") e css/joomla-fontawesome.min.css
 * ("Font Awesome 5 Free"). Noi carichiamo FontAwesome 4, quindi la
 * variabile resterebbe indefinita: `font-family` diventa invalida, si
 * eredita il font di pagina e al posto delle icone esce un carattere
 * a caso. Nella 2.4 la stessa regola era `font-family: "FontAwesome"`.
 *
 * Qui la variabile viene definita col nome della famiglia di FA4, così
 * tutti e 7 i punti tornano a funzionare senza modificare il LESS.
 * ------------------------------------------------------------------ */
:root {
  --fontAwesome--Version: "FontAwesome";
}

/* FA4 ha un solo peso (normal). Il `font-weight: 700` che la 3.1.4
   accosta alle icone — corretto per il "solid" di FA5/6 — su FA4 fa
   applicare al glifo il grassetto sintetico del browser. Nella 2.4 non
   c'era alcun font-weight: lo riportiamo a normale. */
.sp-megamenu-parent > li.sp-has-child > a:after,
.sp-megamenu-parent > li.sp-has-child > span:after,
.sp-megamenu-parent .sp-dropdown .sp-dropdown-items .sp-has-child > a:after,
.sp-module ul > li > a:before,
.scrollup:before,
.entry-link:before,
.entry-quote:before {
  font-weight: normal;
}

/* ------------------------------------------------------------------ *
 * .sp-menu-full.container — megamenu a tutta larghezza
 *
 * Classe NUOVA nella 3.1.4 (nella 2.4 non esiste) e attualmente NON
 * usata da questo sito: 0 occorrenze su tutte le pagine controllate.
 * Il LESS però le assegna le larghezze dei container di Bootstrap 5
 * (540/720/960/1140/1320), che con Bootstrap 3 non combaciano con il
 * .container di pagina (750/970/1170) — il dropdown risulterebbe
 * disallineato di 30px sul desktop.
 *
 * Precauzionale: se un domani si attiva il megamenu full-width dal
 * backend, parte già allineato. Oggi è inerte.
 * ------------------------------------------------------------------ */
@media (min-width: 768px)  { .sp-menu-full.container { width: 750px; } }
@media (min-width: 992px)  { .sp-menu-full.container { width: 970px; } }
@media (min-width: 1200px) { .sp-menu-full.container { width: 1170px; } }
@media (min-width: 1400px) { .sp-menu-full.container { width: 1170px; } }

/* ------------------------------------------------------------------ *
 * .container sopra i 1400px — cap iniettato inline da Helix 3.1.4
 *
 * La 3.1.4 introduce il parametro di template `container_width`, con due
 * sole opzioni: 1140px e 1320px (le larghezze dei container di Bootstrap 5).
 * Lo stile di questo sito è più vecchio del parametro, quindi
 * `$params->get('container_width', 1140)` restituisce il default e
 * core/helix3.php (riga ~289) inietta IN LINEA nel <head>:
 *
 *     @media (min-width: 1400px) { .container { max-width: 1140px; } }
 *
 * Con Bootstrap 3 il .container vale 1170px: sopra i 1400px di viewport il
 * sito si stringerebbe di 30px rispetto a com'è in produzione. Sotto quella
 * soglia non si vede, ed è il motivo per cui i test a 1280px non l'avevano
 * intercettato — l'ha trovato il confronto diretto locale/produzione.
 *
 * bs5-compat.css è caricato DOPO i blocchi inline, quindi a parità di
 * specificità toglie il cap e lascia governare Bootstrap 3.
 *
 * Alternativa senza CSS: mettere `container_width` a 1320 nelle opzioni del
 * template — con quel valore Helix non emette nulla. Scartata perché è un
 * cambio nel DB (il deploy resterebbe non più solo file) e lascerebbe nelle
 * opzioni un valore che non corrisponde alla larghezza reale.
 * ------------------------------------------------------------------ */
@media (min-width: 1400px) {
  .container { max-width: none; }
}

/* ------------------------------------------------------------------ *
 * .radio / .checkbox — liste di checkbox (RSForm Pro e form Joomla)
 *
 * less/legacy.less (nuovo nella 3.1.4) compila in template.css:
 *
 *     .radio:not(.btn-group), .checkbox:not(.btn-group) {
 *       display: inline-block; margin: 0 16px 16px 0px;
 *     }
 *
 * È pensato per Bootstrap 5, dove .checkbox non esiste più. Con Bootstrap 3
 * quella classe è invece su OGNI voce della lista (e su div e label insieme),
 * quindi `display: inline-block` fa due danni: le voci si dispongono a colonne
 * invece che una per riga, e le label si restringono al contenuto lasciando il
 * testo tagliato sotto la checkbox (in home: "rigento" al posto di "Agrigento").
 * Si vede nel select delle province dei due form RSForm della home.
 *
 * Qui si torna ai valori di Bootstrap 3, che sono quelli della 2.4.
 * ------------------------------------------------------------------ */
.radio:not(.btn-group),
.checkbox:not(.btn-group) {
  display: block;
  margin-top: 10px;
  margin-right: 0;   /* legacy.less mette 16px: stringerebbe la label di 32px */
  margin-bottom: 10px;
  margin-left: 0;
}

/* In RSForm la classe .checkbox sta sia sul div sia sulla label. Bootstrap 3
   dà alla label `margin-bottom: 0`: senza questo il passo tra le voci passa
   da 25px a 30px (misurato sulla 2.4). */
label.radio:not(.btn-group),
label.checkbox:not(.btn-group),
.radio:not(.btn-group) label,
.checkbox:not(.btn-group) label {
  margin-bottom: 0;
}

/* .checkbox + .checkbox { margin-top: -5px } di Bootstrap 3: è ciò che rende
   il passo 25px invece di 30px. La regola sopra lo azzererebbe. */
.radio:not(.btn-group) + .radio:not(.btn-group),
.checkbox:not(.btn-group) + .checkbox:not(.btn-group) {
  margin-top: -5px;
}

.radio:not(.btn-group) input[type="radio"],
.radio:not(.btn-group) input[type="checkbox"],
.checkbox:not(.btn-group) input[type="radio"],
.checkbox:not(.btn-group) input[type="checkbox"] {
  margin-top: 0;
  margin-right: 0;
  margin-left: -20px;
}

/* ------------------------------------------------------------------ *
 * Spaziature Bootstrap 5 usate dagli override 3.1.4
 * (com_mailto, com_content/form/edit, com_content/category/blog,
 *  tinymce/togglebutton). Scala BS5: 1=.25rem 2=.5rem 3=1rem 4=1.5rem 5=3rem
 * ------------------------------------------------------------------ */
.mt-1 { margin-top: .25rem !important; }  .mb-1 { margin-bottom: .25rem !important; }
.mt-2 { margin-top: .5rem !important; }   .mb-2 { margin-bottom: .5rem !important; }
.mt-3 { margin-top: 1rem !important; }    .mb-3 { margin-bottom: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }  .mb-4 { margin-bottom: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }    .mb-5 { margin-bottom: 3rem !important; }

/* ------------------------------------------------------------------ *
 * .btn-secondary — in layouts/joomla/content/readmore.php la 3.1.4 ha
 * sostituito `btn btn-default` (Bootstrap 3) con `btn btn-secondary`
 * (Bootstrap 4/5). Con BS3 quella classe non esiste e il pulsante
 * "leggi tutto" resterebbe senza stile. Qui prende l'aspetto che aveva
 * .btn-default nella 2.4.
 * ------------------------------------------------------------------ */
.btn-secondary {
  color: #333;
  background-color: #fff;
  background-image: none;
  border-color: #ccc;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
