/* ------------------------------------------------------------------
Inter — carattere ufficiale IsorsCert, servito dal nostro dominio.
SIL Open Font License 1.1 (github.com/rsms/inter), sottoinsieme latin.
Fino al 21/08/2026 questi @font-face non esistevano: i CSS dichiaravano
font-family:'Inter' ma nessuno caricava il font, quindi il browser
ripiegava sul fallback di sistema — San Francisco su Mac, Segoe UI su
Windows, Roboto su Android. Il carattere del marchio non si vedeva mai,
e le pagine cambiavano aspetto da una macchina all'altra.
------------------------------------------------------------------ */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-v20-latin-regular.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-v20-latin-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-v20-latin-600.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-v20-latin-700.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/inter-v20-latin-800.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url('../fonts/inter-v20-latin-900.woff2') format('woff2')}
/* ============================================================
IsorsCert - Brand alignment layer (theme refresh 2026-05-30)
------------------------------------------------------------
Ri-allinea il theme moderno (variabili --ic3-*) ai colori del
LOGO "ISORS Cert.":
blu ISORS #2c8fcf (testo "ISORS" + pallina)
navy/indaco #2b3a8c (barra verticale + puntino)
grigio #b8bcc2 ("Cert." + archi)
Caricato per ULTIMO nel : override di isors-modern-v3.css
e del critical CSS inline. SOLO colori/variabili: nessuna
modifica alla struttura/markup (reversibile rimuovendo il link).
============================================================ */
:root{
--ic3-accent: #2c8fcf; /* blu ISORS (era #4f46e5 indaco) */
--ic3-accent-hov: #1f6fa3;
--ic3-accent-soft: #e8f3fb;
--ic3-navy: #2b3a8c; /* navy del logo */
--ic3-grad-1: linear-gradient(135deg, #2b3a8c 0%, #2c8fcf 55%, #49a7e0 100%);
--ic3-shadow-hover: 0 4px 12px rgba(16,24,40,.10), 0 18px 36px rgba(44,143,207,.14);
}
/* --- Sidebar: vira al navy del brand (eco del logo) --- */
.skin-blue .main-sidebar{
background: linear-gradient(180deg, #161d44 0%, #232c5e 100%) !important;
}
.skin-blue .sidebar-menu > li.active > a{
background: rgba(255,255,255,.06) !important;
}
.skin-blue .sidebar-menu > li > a .pull-right-container .label{
box-shadow: 0 2px 8px rgba(44,143,207,.45) !important;
}
/* --- Header logo: testo in blu ISORS --- */
.skin-blue .main-header .logo{ color: var(--ic3-accent) !important; }
/* --- Bottoni primari: gradiente brand navy -> blu --- */
.btn-primary{
background: linear-gradient(135deg, #2b3a8c 0%, #2c8fcf 100%) !important;
border-color: transparent !important;
box-shadow: 0 4px 12px rgba(44,143,207,.22) !important;
color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus{ filter: brightness(1.06); color:#fff !important; }
/* --- Link coerenti col brand --- */
a{ color: #2c8fcf; }
a:hover, a:focus{ color: #1f6fa3; }
/* --- Label / badge / sfondi "blu" AdminLTE -> blu brand --- */
/* Il colore del testo va detto insieme al fondo: la regola cambiava solo lo
sfondo e il testo restava quello del tema, blu su blu (pillola apparentemente
vuota nella banca domande). */
/* Il colore del testo va detto insieme al fondo: la regola cambiava solo lo
sfondo e il testo restava quello del tema, blu su blu (pillola apparentemente
vuota nella banca domande). Il blu del marchio con il bianco si ferma pero' a
3,54 su 1, sotto il minimo leggibile: si usa il blu piu' scuro gia' in uso nel
progetto per i collegamenti premuti, che arriva a 5,44. */
.label-primary,
.badge-primary{ background-color: #1f6fa3 !important; color: #fff !important; }
.bg-blue,
.bg-light-blue,
.callout.callout-info,
.alert-info{ background-color: #2c8fcf !important; border-color:#2c8fcf !important; color:#fff !important; }
.text-blue,
.text-light-blue,
.text-primary{ color: #2c8fcf !important; }
.progress-bar-primary,
.progress-bar-info,
.progress-bar-light-blue{ background-color: #2c8fcf !important; }
/* --- Info-box / small-box icona blu -> brand --- */
.info-box-icon.bg-blue,
.small-box.bg-blue,
.small-box.bg-light-blue{ background: linear-gradient(135deg,#2b3a8c 0%,#2c8fcf 100%) !important; }
/* --- Paginazione / DataTables active --- */
.pagination > .active > a,
.pagination > .active > a:hover,
.dataTables_wrapper .paginate_button.current{
background: #2c8fcf !important;
border-color: #2c8fcf !important;
color:#fff !important;
}
/* ============================================================
Override FORTE delle variabili (vince anche sul critical CSS
inline del master, a prescindere dall'ordine di caricamento).
============================================================ */
:root{
--ic3-accent: #2c8fcf !important;
--ic3-accent-hov: #1f6fa3 !important;
--ic3-accent-soft: #e8f3fb !important;
--ic3-grad-1: linear-gradient(135deg, #2b3a8c 0%, #2c8fcf 55%, #49a7e0 100%) !important;
}
/* ============================================================
TABELLE DataTables - modernizzazione globale (vale ovunque)
============================================================ */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select{
border-radius: 10px !important;
border: 1.5px solid #e5e7eb !important;
padding: 8px 13px !important;
font-size: 13px !important;
background:#fff !important;
transition: border-color .15s ease, box-shadow .15s ease;
}
.dataTables_wrapper .dataTables_filter input{ min-width: 220px; }
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus{
outline:none !important;
border-color: var(--ic3-accent) !important;
box-shadow: 0 0 0 3px var(--ic3-accent-soft) !important;
}
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label{
font-size: 13px; font-weight: 600; color:#475569;
}
.dataTables_wrapper .dataTables_info{
font-size: 12.5px !important; color:#64748b !important; padding-top: 12px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
border-radius: 8px !important;
border: 1px solid #e5e7eb !important;
margin: 0 2px !important;
padding: 6px 12px !important;
font-size: 13px !important;
font-weight: 600;
color:#475569 !important;
background:#fff !important;
transition: all .15s ease;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
background: var(--ic3-accent-soft) !important;
border-color: var(--ic3-accent) !important;
color: var(--ic3-accent) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
background: var(--ic3-accent) !important;
border-color: var(--ic3-accent) !important;
color:#fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled{
color:#cbd5e1 !important; background:#f8fafc !important; cursor: default;
}
.dataTables_processing{
border-radius: 12px !important;
box-shadow: 0 8px 24px rgba(16,24,40,.18) !important;
border: 1px solid #eef1f6 !important;
}
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before{
background: var(--ic3-accent) !important; border:none !important;
box-shadow: 0 1px 3px rgba(44,143,207,.4);
}
/* header tabelle generiche (anche non ic3-table-wrap) */
.table > thead > tr > th,
table.dataTable thead th{
background:#f8fafc !important;
text-transform: uppercase;
letter-spacing:.03em;
font-size: 11.5px !important;
font-weight: 700 !important;
color:#475569 !important;
border-bottom: 1px solid #e5e7eb !important;
}
.table > tbody > tr > td{ vertical-align: middle !important; }
.table-hover > tbody > tr:hover{ background:#f5fafe !important; }
/* ============================================================
FORM & INPUT - modernizzazione globale
============================================================ */
.form-control{
border-radius: 9px !important;
border: 1.5px solid #e2e8f0 !important;
padding: 9px 13px !important;
height: auto !important;
font-size: 14px !important;
color:#0f172a !important;
box-shadow:none !important;
transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus{
border-color: var(--ic3-accent) !important;
box-shadow: 0 0 0 4px rgba(44,143,207,.12) !important;
}
.form-control[readonly], .form-control:disabled{
background:#f4f7fb !important; color:#64748b !important;
}
.form-group > label, label.col-form-label{
font-weight: 600 !important; color:#1f2937 !important; font-size: 13px !important;
}
textarea.form-control{ line-height:1.55 !important; }
input[type="checkbox"], input[type="radio"]{ accent-color: var(--ic3-accent); }
.has-error .form-control{ border-color:#ef4444 !important; background:#fef2f2 !important; }
.has-error .help-block, .has-error .control-label{ color:#dc2626 !important; }
.nav-tabs{ border-bottom:1px solid #e2e8f0 !important; }
.nav-tabs > li > a{ border-radius:8px 8px 0 0 !important; color:#6b7280 !important; font-weight:500; }
.nav-tabs > li.active > a{ color: var(--ic3-accent) !important; font-weight:700; border-color:#e2e8f0 #e2e8f0 #fff !important; }
/* Evita lo zoom automatico di iOS: vale per i .form-control di Bootstrap e per
ogni altro campo, che nelle pagine pubbliche e' spesso stilizzato a mano. */
@media (max-width:767px){
.form-control,
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
select, textarea { font-size:16px !important; }
}
/* ============================================================
COMPONENTI: modali, breadcrumb, alert, label
============================================================ */
.modal-content{
border-radius: 16px !important;
border: 1px solid #eef1f6 !important;
box-shadow: 0 16px 48px rgba(16,24,40,.18) !important;
overflow: hidden;
}
.modal-header{ border-bottom:1px solid #eef1f6 !important; padding:16px 22px !important; }
.modal-footer{ border-top:1px solid #eef1f6 !important; }
.breadcrumb{ background: transparent !important; padding: 6px 0 !important; margin-bottom: 12px !important; }
.breadcrumb > li + li:before{ color:#cbd5e1 !important; }
.breadcrumb > .active{ color:#475569 !important; }
.alert{
border-radius: 12px !important;
border: 1px solid transparent;
border-left-width: 4px !important;
}
.alert-info{ border-left-color:#2c8fcf !important; }
.alert-success{ border-left-color:#10b981 !important; }
.alert-warning{ border-left-color:#f59e0b !important; }
.alert-danger{ border-left-color:#ef4444 !important; }
/* Componenti videocall (meet): da indaco a brand */
.ic3-meet-tile.is-pinned{ border-color: var(--ic3-accent) !important; }
.ic3-meet-tile.is-pinned .ic3-meet-pin-btn{ background: var(--ic3-accent) !important; border-color: var(--ic3-accent) !important; }
.ic3-meet-thumb-avatar{ background: var(--ic3-grad-1) !important; }
/* Mobile: input >=16px per evitare lo zoom automatico iOS (audit #45) */
@media (max-width:767px){
.ic3-field input, .ic3-field select, .ic3-field textarea{ font-size:16px !important; }
}
/* === Accessibilità & rifinitura (audit GIALLO grafica-ui) === */
/* Focus visibile su elementi interattivi (keyboard nav) */
.form-control:focus-visible,
.btn:focus-visible,
a:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
[tabindex]:focus-visible{
outline: 2px solid var(--ic3-accent) !important;
outline-offset: 2px !important;
}
/* Feedback hover bottoni anche su sfondi a basso contrasto */
.btn:hover{ box-shadow: 0 0 0 2px rgba(44,143,207,.22); }
/* Backdrop modale piu' marcato per isolare il focus */
.modal-backdrop.in{ opacity:.7 !important; }
/* ============================================================
ISORS BRAND - LAYER PREMIUM v2 (append, 2026-05-30)
Coerente coi token reali: --ic-* (modern.css) + --ic3-* (brand override)
Ordine: 0 token mancanti · 1 layout/header · 2 sidebar · 3 form
4 tabelle · 5 componenti · 6 banner/hero home · 7 responsive
============================================================ */
/* ---------- 0) Token mancanti referenziati altrove (definiti una sola volta) */
:root{
--ic3-warn: #f59e0b;
--ic3-warn-soft: #fffbeb;
--ic3-grad-warn: linear-gradient(135deg,#f59e0b 0%,#d97706 100%);
--ic3-shadow-sm: 0 1px 2px rgba(16,24,40,.05);
--ic3-shadow-md: 0 4px 12px rgba(16,24,40,.08);
--ic3-shadow-lg: 0 8px 24px rgba(16,24,40,.12);
}
/* ---------- 1) LAYOUT: content-header + main-header sticky ---------- */
/* NB: in modern-v3 (riga ~2546) esiste un auto-hero con ::before accent bar.
Manteniamo l'accent bar: NON impostiamo background piatto sul wrapper. */
.content-header{
padding: 18px 24px !important;
border-bottom: 1px solid var(--ic-border-soft) !important;
margin-bottom: 18px !important;
}
.content-header > h1{
font-size: 24px !important;
font-weight: 800 !important;
letter-spacing: -0.02em !important;
color: var(--ic-text) !important;
}
.content-header > h1 > small{
display: block;
font-weight: 400 !important;
color: var(--ic-muted) !important;
font-size: 13px !important;
margin-top: 4px;
letter-spacing: 0;
}
/* Header sticky: l'utente non perde la navigazione su scroll.
z-index 99 < sidebar(1050) e < modali, > contenuto. Nessun overflow:hidden
sui parent della navbar -> i dropdown utente restano visibili. */
.main-header{
position: sticky !important;
top: 0 !important;
z-index: 99 !important;
box-shadow: 0 1px 0 rgba(15,23,42,.06) !important;
}
.skin-blue .main-header .navbar .nav > li.user-menu > a{
border-radius: 9999px !important;
padding: 8px 14px !important;
font-weight: 600 !important;
transition: all .15s var(--ic-ease) !important;
}
.skin-blue .main-header .navbar .nav > li.user-menu > a:hover{
background: var(--ic3-accent) !important;
color: #fff !important;
box-shadow: 0 4px 12px rgba(44,143,207,.22) !important;
}
/* ---------- 2) SIDEBAR: indicatore border-left + hover coeso ---------- */
.skin-blue .sidebar-menu > li > a{
padding: 12px 18px !important;
border-left: 3px solid transparent !important;
color: rgba(255,255,255,.85) !important;
transition: background .15s var(--ic-ease), border-color .15s var(--ic-ease), color .15s var(--ic-ease) !important;
}
.skin-blue .sidebar-menu > li > a > .fa{ color: rgba(255,255,255,.85) !important; }
.skin-blue .sidebar-menu > li:hover > a{
background: linear-gradient(90deg, rgba(44,143,207,.10) 0%, rgba(44,143,207,0) 100%) !important;
border-left-color: var(--ic3-accent) !important;
color: #fff !important;
}
.skin-blue .sidebar-menu > li.active > a{
background: linear-gradient(90deg, rgba(44,143,207,.16) 0%, rgba(44,143,207,0) 100%) !important;
border-left-color: var(--ic3-accent) !important;
font-weight: 700 !important;
color: #fff !important;
}
/* ---------- 3) FORM & INPUT (estende il base già presente alle righe 167-194) */
.form-group > label,
label.col-form-label,
.control-label{
display: flex; align-items: center; gap: 6px;
margin-bottom: 8px !important;
letter-spacing: -0.01em;
}
label.required::after,
label[aria-required="true"]::after{
content: " *"; color: #ef4444; font-weight: 700; font-size: 15px;
}
.help-block, .form-text, .ic3-field-help{
font-size: 12px !important; color: #4b5563 !important;
margin-top: 4px !important; font-weight: 500;
}
.form-control::placeholder{ color:#9ca3af !important; opacity:.85; }
/* file input nativo brandizzato */
input[type="file"]::file-selector-button{
background:#f1f5f9; color:#475569; padding:6px 12px;
border:1px solid #cbd5e1; border-radius:6px; cursor:pointer;
font-weight:600; font-size:12px; margin-right:8px; transition:all .15s;
}
input[type="file"]::file-selector-button:hover{
background:#e2e8f0; border-color:var(--ic3-accent); color:var(--ic3-accent);
}
/* select: freccia custom brand */
select.form-control{
background-image:url('data:image/svg+xml;utf8,') !important;
background-repeat:no-repeat !important;
background-position:right 12px center !important;
background-size:12px 8px !important;
padding-right:36px !important;
-webkit-appearance:none; -moz-appearance:none; appearance:none;
}
select.form-control:focus{
background-image:url('data:image/svg+xml;utf8,') !important;
/* Ripetute anche qui: se una pagina dichiara lo shorthand `background`
(es. `background:#fff!important`) su .form-control con specificita' >=,
resetta repeat/position/size mentre questa regola :focus continua a
vincere sull'immagine -> chevron PIASTRELLATO su tutta la casella. */
background-repeat:no-repeat !important;
background-position:right 12px center !important;
background-size:12px 8px !important;
}
/* Le