/* v22 · Profilo d'area SICURFORM Formazione (derivato da sf20.css). Caricato solo dalle pagine del profilo. */
:root[data-sf-profile="formazione"] {
  --sf20-accent: #087b78;
  --sf20-dark: #0d4144;
  --sf20-light: #7ed3c9;
  --sf20-tint: #e8f6f3;
}

/* Testata ------------------------------------------------------------------------------- */
#dmRoot .sf20-head {
  --blue: #087b78;
  --sky: #e8f6f3;
}
#dmRoot .sf20-head .sf6-head__utility { background: #061f36 !important; }
#dmRoot .sf20-eco__nav { display: flex !important; align-items: center !important; gap: 2px !important; min-width: 0 !important; overflow-x: auto !important; scrollbar-width: none !important; }
#dmRoot .sf20-eco__nav::-webkit-scrollbar { display: none; }
#dmRoot .sf20-eco__label { margin-right: 8px !important; color: #9fb2c6 !important; font: 800 10.5px/1 "Manrope", Arial, sans-serif !important; letter-spacing: .14em !important; text-transform: uppercase !important; white-space: nowrap !important; }
#dmRoot .sf6-head__utility a.sf20-eco__item {
  display: inline-flex !important; align-items: center !important; gap: 7px !important; min-height: 28px !important;
  padding: 0 10px !important; border-radius: 6px !important; color: #c7d3e0 !important; opacity: 1 !important;
  font: 600 12.5px/1 "Manrope", Arial, sans-serif !important; white-space: nowrap !important; text-decoration: none !important;
  transition: background-color 160ms cubic-bezier(.23, 1, .32, 1), color 160ms cubic-bezier(.23, 1, .32, 1) !important;
}
#dmRoot .sf6-head__utility a.sf20-eco__item i { width: 8px !important; height: 8px !important; border-radius: 50% !important; flex: 0 0 auto !important; }
#dmRoot .sf6-head__utility a.sf20-eco__item:hover,
#dmRoot .sf6-head__utility a.sf20-eco__item:focus-visible { color: #fff !important; background: rgba(255, 255, 255, .1) !important; text-decoration: none !important; }
#dmRoot .sf6-head__utility a.sf20-eco__item.is-current { color: #fff !important; font-weight: 800 !important; background: rgba(255, 255, 255, .14) !important; }
#dmRoot .sf20-eco__contacts { flex: 0 0 auto !important; }

#dmRoot .sf20-head .sf6-head__main { grid-template-columns: 300px minmax(0, 1fr) auto !important; }
#dmRoot .sf20-brand { display: flex !important; align-items: center !important; gap: 14px !important; min-width: 0 !important; }
#dmRoot .sf20-head a.sf20-brand__logo { width: 168px !important; flex: 0 0 auto !important; padding: 6px 0 !important; }
#dmRoot .sf20-head a.sf20-brand__logo .sf6-head__logo { max-width: 168px !important; }
#dmRoot .sf20-head a.sf20-brand__endorse {
  display: grid !important; gap: 1px !important; padding: 4px 0 4px 13px !important; border-left: 1px solid #dde3ea !important;
  color: #5b6675 !important; font: 400 12.5px/1.25 "Source Sans 3", Arial, sans-serif !important; white-space: nowrap !important; text-decoration: none !important;
}
#dmRoot .sf20-head a.sf20-brand__endorse b { color: #00519e !important; font-weight: 700 !important; }
#dmRoot .sf20-head a.sf20-brand__endorse:hover b,
#dmRoot .sf20-head a.sf20-brand__endorse:focus-visible b { text-decoration: underline !important; }
#dmRoot .sf20-head .sf6-head__nav { justify-content: center !important; }
#dmRoot .sf20-head a.sf6-head__cta { background: #087b78 !important; }
#dmRoot .sf20-head a.sf6-head__cta:hover,
#dmRoot .sf20-head a.sf6-head__cta:focus-visible { background: #0d4144 !important; outline: 3px solid rgba(8, 123, 120, .22) !important; }
#dmRoot .sf20-head .sf6-head__rule { height: 5px !important; background: #087b78 !important; }
#dmRoot .sf20-head .sf6-head__rule::after { display: none !important; }
#dmRoot .sf20-head .sf6-head__mobile-contact a:first-child { color: #0d4144 !important; background: #e8f6f3 !important; }
#dmRoot .sf20-head .sf6-head__mobile-contact a:last-child { color: #fff !important; background: #087b78 !important; }

@media (max-width: 1120px) {
  #dmRoot .sf20-head .sf6-head__main { grid-template-columns: 260px minmax(0, 1fr) auto !important; }
  #dmRoot .sf20-head a.sf20-brand__logo { width: 146px !important; }
  #dmRoot .sf20-head a.sf20-brand__endorse { font-size: 11.5px !important; padding-left: 10px !important; }
}
@media (max-width: 960px) {
  #dmRoot .sf20-head .sf6-head__main { grid-template-columns: minmax(0, 1fr) auto !important; }
  #dmRoot .sf20-eco__label { display: none !important; }
  #dmRoot .sf20-eco__contacts a:first-child { display: none !important; }
}
@media (max-width: 560px) {
  #dmRoot .sf20-head .sf6-head__utility-inner { justify-content: flex-start !important; }
  #dmRoot .sf20-eco__contacts { display: none !important; }
  #dmRoot .sf6-head__utility a.sf20-eco__item { padding: 0 8px !important; font-size: 12px !important; }
  #dmRoot .sf20-head a.sf20-brand__logo { width: 132px !important; }
  #dmRoot .sf20-head a.sf20-brand__endorse { font-size: 10.5px !important; padding-left: 9px !important; }
}
@media (max-width: 640px) {
  /* Su smartphone la candidatura resta nel menu e nell'apertura: la garanzia del Gruppo resta leggibile. */
  #dmRoot .sf20-head a.sf6-head__cta { display: none !important; }
}
@media (max-width: 340px) {
  #dmRoot .sf20-head a.sf20-brand__endorse { display: none !important; }
}

/* Footer: livello 1 (area) --------------------------------------------------------------- */
#dmRoot .sf20-sr { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
#dmRoot .sf20-foot .sf20-foot__rule { height: 5px !important; background: #087b78 !important; }
#dmRoot .sf20-foot__area { padding: 54px 0 44px !important; color: #e8eef5 !important; background: linear-gradient(140deg, #0d4144, #0a3335) !important; }
#dmRoot .sf20-foot__grid { display: grid !important; grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(0, 1fr)) !important; gap: 34px !important; }
#dmRoot .sf20-foot__brand img { display: block !important; width: min(100%, 330px) !important; height: auto !important; }
#dmRoot .sf20-foot__brand p { max-width: 360px !important; margin: 16px 0 0 !important; color: #d8dff0 !important; font-size: 14px !important; line-height: 1.55 !important; }
#dmRoot .sf20-foot__area .sf9-foot__nav-group summary,
#dmRoot .sf20-foot__area .sf9-foot__title { color: #7ed3c9 !important; }
#dmRoot .sf20-foot__area .sf9-foot__list a { color: #e8eef5 !important; }
#dmRoot .sf20-foot__area .sf9-foot__list a:hover,
#dmRoot .sf20-foot__area .sf9-foot__list a:focus-visible { color: #fff !important; text-decoration: underline !important; }
#dmRoot .sf20-foot__area .sf9-foot__contacts { border-top-color: rgba(255, 255, 255, .16) !important; }

/* Footer: livello 2 (rete del Gruppo) ---------------------------------------------------- */
#dmRoot .sf20-foot__net { padding: 16px 0 !important; background: #092944 !important; }
#dmRoot .sf20-net { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px 22px !important; }
#dmRoot .sf20-net__label { margin: 0 !important; color: #9fb2c6 !important; font: 800 11px/1.2 "Manrope", Arial, sans-serif !important; letter-spacing: .14em !important; text-transform: uppercase !important; }
#dmRoot .sf20-net__links { display: flex !important; flex-wrap: wrap !important; gap: 4px 20px !important; }
#dmRoot .sf20-net__links a { min-height: 36px !important; display: inline-flex !important; align-items: center !important; color: #d5e3ec !important; font: 600 13px/1.2 "Manrope", Arial, sans-serif !important; }
#dmRoot .sf20-net__links a:hover,
#dmRoot .sf20-net__links a:focus-visible { color: #fff !important; text-decoration: underline !important; }

/* Footer: livello 3 (marchio storico, certificazioni, dati legali) -------------------------- */
#dmRoot .sf20-foot .sf20-foot__legal { padding: 30px 0 34px !important; }
#dmRoot .sf20-foot .sf20-foot__legal .sf9-foot__bottom { margin-top: 0 !important; padding-top: 0 !important; border-top: 0 !important; }

@media (max-width: 1120px) {
  #dmRoot .sf20-foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #dmRoot .sf20-foot__brand { grid-column: 1 / -1 !important; }
}
@media (max-width: 760px) {
  #dmRoot .sf20-foot__grid { grid-template-columns: 1fr !important; gap: 22px !important; }
  #dmRoot .sf20-foot__area .sf9-foot__nav-contact { grid-column: auto !important; }
}
@media (prefers-reduced-motion: reduce) {
  #dmRoot .sf6-head__utility a.sf20-eco__item { transition: none !important; }
}

/* v21 · News dell'area nella Home d'area (schede con lo stesso stile dell'elenco /blog) */
#dmRoot #dm .sf6p .sf20-news { display: grid !important; gap: 18px !important; width: 100% !important; min-width: 0 !important; }
#dmRoot #dm .sf6p .sf20-news .sf95-rss-grid { grid-column: auto !important; }
#dmRoot #dm .sf6p .sf20-news__empty { margin: 0 !important; padding: 18px 20px !important; border: 1px dashed #b7dcd7 !important; border-radius: 14px !important; background: #f1f9f8 !important; color: #0d4144 !important; font: 500 16px/1.55 "Source Sans 3", Arial, sans-serif !important; }
#dmRoot #dm .sf6p .sf20-news__all { margin: 0 !important; }
#dmRoot #dm .sf6p .sf20-news__all a { display: inline-flex !important; align-items: center !important; gap: 8px !important; color: #06625f !important; font: 800 14px/1.3 "Manrope", Arial, sans-serif !important; text-decoration: underline !important; text-underline-offset: 3px !important; }
#dmRoot #dm .sf6p .sf20-news .sf95-rss-head span, #dmRoot #dm .sf6p .sf20-news .sf95-rss-head a { color: #06625f !important; }
@media (max-width: 720px) {
  #dmRoot #dm .sf6p .sf20-news .sf95-rss-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

/* v22 · Componenti dei profili d'area Formazione e Lavoro (accodato al foglio di profilo derivato da sf20.css).
   Caricato solo dalle pagine dei profili: www e Innovazione non lo ricevono. */

/* Tema rame del profilo Lavoro: le pagine di www dell'Agenzia usano il tema «services» (verde petrolio). */
:root[data-sf-profile="lavoro"] #dmRoot .sf6p { --accent: #a3530f; --dark: #4a2e10; --pale: #fbf1e7; }
:root[data-sf-profile="lavoro"] #dmRoot .sf6-head__item[data-accent="services"] { --menu-accent: #a3530f; }

/* Riquadro documento con il marchio d'area */
#dmRoot #dm .sf6p .sf22-doc .sf10-doc__head img { width: 150px !important; max-width: 55% !important; height: auto !important; }

/* Catalogo filtrabile ------------------------------------------------------------------------ */
#dmRoot #dm .sf6p .sf22-cat { display: grid !important; gap: 18px !important; width: 100% !important; min-width: 0 !important; }
#dmRoot #dm .sf6p .sf22-filters {
  display: grid !important; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) auto !important;
  align-items: end !important; gap: 12px 14px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important;
  padding: 18px !important; border: 1px solid var(--line) !important; border-radius: 14px !important; background: var(--pale) !important;
}
#dmRoot #dm .sf6p .sf22-filters[hidden] { display: none !important; }
#dmRoot #dm .sf6p .sf22-filters__field { display: grid !important; gap: 6px !important; min-width: 0 !important; margin: 0 !important; }
#dmRoot #dm .sf6p .sf22-filters label {
  display: block !important; margin: 0 !important; color: var(--dark) !important;
  font: 800 12px/1.2 "Manrope", Arial, sans-serif !important; letter-spacing: .06em !important; text-transform: uppercase !important;
}
#dmRoot #dm .sf6p .sf22-filters :is(input, select) {
  display: block !important; width: 100% !important; min-width: 0 !important; min-height: 48px !important; margin: 0 !important;
  padding: 10px 12px !important; border: 1.5px solid #b9c8d2 !important; border-radius: 8px !important; background-color: #fff !important;
  color: #172936 !important; font: 400 16px/1.3 "Source Sans 3", Arial, sans-serif !important; box-shadow: none !important;
  transition: border-color 160ms cubic-bezier(.23, 1, .32, 1), box-shadow 160ms cubic-bezier(.23, 1, .32, 1) !important;
}
#dmRoot #dm .sf6p .sf22-filters select {
  appearance: none !important; -webkit-appearance: none !important; padding-right: 38px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m5 8 5 5 5-5' stroke='%23172936' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 16px 16px !important;
}
#dmRoot #dm .sf6p .sf22-filters :is(input, select):focus-visible {
  outline: none !important; border-color: var(--accent) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 28%, transparent) !important;
}
#dmRoot #dm .sf6p .sf22-filters__reset,
#dmRoot #dm .sf6p .sf22-empty button {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 48px !important;
  margin: 0 !important; padding: 0 16px !important; border: 1.5px solid var(--accent) !important; border-radius: 8px !important;
  background: #fff !important; color: var(--dark) !important; font: 800 14px/1.2 "Manrope", Arial, sans-serif !important;
  cursor: pointer !important; white-space: nowrap !important;
  transition: background-color 160ms cubic-bezier(.23, 1, .32, 1), transform 160ms cubic-bezier(.23, 1, .32, 1) !important;
}
#dmRoot #dm .sf6p .sf22-empty button { min-height: 40px !important; padding: 0 12px !important; }
#dmRoot #dm .sf6p .sf22-filters__reset:hover,
#dmRoot #dm .sf6p .sf22-empty button:hover { background: var(--pale) !important; }
#dmRoot #dm .sf6p .sf22-filters__reset:active,
#dmRoot #dm .sf6p .sf22-empty button:active { transform: scale(.97) !important; }
#dmRoot #dm .sf6p .sf22-filters__reset:focus-visible,
#dmRoot #dm .sf6p .sf22-empty button:focus-visible { outline: 3px solid var(--accent) !important; outline-offset: 2px !important; }
#dmRoot #dm .sf6p .sf22-count {
  margin: 0 !important; color: var(--dark) !important; font: 800 15px/1.4 "Manrope", Arial, sans-serif !important;
}
#dmRoot #dm .sf6p .sf22-grid { width: 100% !important; min-width: 0 !important; }
#dmRoot #dm .sf6p .sf22-card[hidden] { display: none !important; }
#dmRoot #dm .sf6p .sf22-card .sf12-oppcard__meta { flex-wrap: wrap !important; gap: 6px !important; }
#dmRoot #dm .sf6p .sf22-card__sector {
  display: inline-flex !important; align-items: center !important; min-height: 24px !important; padding: 0 9px !important;
  border-radius: 999px !important; background: var(--pale) !important; color: var(--dark) !important;
  font: 700 12px/1.2 "Manrope", Arial, sans-serif !important;
}
#dmRoot #dm .sf6p .sf22-empty {
  margin: 0 !important; padding: 18px 20px !important; border: 1px dashed color-mix(in srgb, var(--accent) 45%, #fff) !important;
  border-radius: 14px !important; background: var(--pale) !important; color: var(--dark) !important;
  font: 500 16px/1.6 "Source Sans 3", Arial, sans-serif !important;
}
#dmRoot #dm .sf6p .sf22-empty[hidden] { display: none !important; }
#dmRoot #dm .sf6p .sf22-empty a { color: var(--dark) !important; font-weight: 700 !important; text-decoration: underline !important; text-underline-offset: 3px !important; }
@media (prefers-reduced-motion: no-preference) {
  #dmRoot #dm .sf6p .sf22-card.is-sf22-in { animation: sf22-in 220ms cubic-bezier(.23, 1, .32, 1) both; }
}
@keyframes sf22-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 1060px) {
  #dmRoot #dm .sf6p .sf22-filters { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #dmRoot #dm .sf6p .sf22-filters__field--q { grid-column: 1 / -1 !important; }
  #dmRoot #dm .sf6p .sf22-filters__reset { grid-column: 1 / -1 !important; justify-self: start !important; }
}
@media (max-width: 640px) {
  #dmRoot #dm .sf6p .sf22-filters { grid-template-columns: minmax(0, 1fr) !important; padding: 14px !important; }
  #dmRoot #dm .sf6p .sf22-filters__reset { width: 100% !important; }
}

/* SicurWeb sul profilo: solo collegamento ---------------------------------------------------- */
#dmRoot #dm .sf6p .sf22-sicurweb {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important;
  gap: 16px 28px !important; width: 100% !important; min-width: 0 !important; padding: 22px 24px !important;
  border: 1px solid var(--line) !important; border-left: 5px solid var(--accent) !important; border-radius: 14px !important; background: #fff !important;
}
#dmRoot #dm .sf6p .sf22-sicurweb__body { flex: 1 1 340px !important; min-width: 0 !important; }
#dmRoot #dm .sf6p .sf22-sicurweb__body p { margin: 0 !important; color: #172936 !important; font: 400 17px/1.55 "Source Sans 3", Arial, sans-serif !important; }
#dmRoot #dm .sf6p .sf22-sicurweb__actions { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px 20px !important; }

/* Pre-iscrizione nella scheda corso ------------------------------------------------------------ */
#dmRoot #dm .sf6p .sf22-pre-course p {
  display: grid !important; gap: 2px !important; margin: 0 !important; padding: 14px 16px !important;
  border-radius: 10px !important; background: var(--pale) !important; color: var(--dark) !important;
}
#dmRoot #dm .sf6p .sf22-pre-course span { font: 800 11px/1.2 "Manrope", Arial, sans-serif !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: var(--accent) !important; }
#dmRoot #dm .sf6p .sf22-pre-course strong { font: 800 18px/1.3 "Manrope", Arial, sans-serif !important; color: var(--dark) !important; }
#dmRoot #dm .sf6p .sf22-pre-course small { font: 500 14px/1.4 "Source Sans 3", Arial, sans-serif !important; color: #3d4f5c !important; }
#dmRoot #dm .sf6p .sf22-pre-note {
  margin: 0 !important; padding: 12px 14px !important; border-left: 4px solid var(--accent) !important; background: #f7f9fa !important;
  color: #23333f !important; font: 500 15px/1.5 "Source Sans 3", Arial, sans-serif !important;
}

/* Bacheca offerte (profilo Lavoro) ------------------------------------------------------------- */
#dmRoot #dm .sf6p .sf22-jobs { display: grid !important; gap: 16px !important; width: 100% !important; min-width: 0 !important; }
#dmRoot #dm .sf6p .sf22-jobs__empty {
  display: grid !important; gap: 12px !important; margin: 0 !important; padding: 22px 24px !important;
  border: 1px dashed color-mix(in srgb, var(--accent) 45%, #fff) !important; border-radius: 14px !important;
  background: var(--pale) !important; color: var(--dark) !important;
}
#dmRoot #dm .sf6p .sf22-jobs__empty p { margin: 0 !important; color: var(--dark) !important; font: 500 17px/1.6 "Source Sans 3", Arial, sans-serif !important; }
#dmRoot #dm .sf6p .sf22-jobs__empty strong { font-family: "Manrope", Arial, sans-serif !important; font-weight: 800 !important; }
#dmRoot #dm .sf6p .sf22-jobs__actions { display: flex !important; flex-wrap: wrap !important; gap: 10px 18px !important; align-items: center !important; }
#dmRoot #dm .sf6p .sf22-jobs__actions a:not(.sf6p__button) { color: var(--dark) !important; font: 800 15px/1.3 "Manrope", Arial, sans-serif !important; text-decoration: underline !important; text-underline-offset: 3px !important; }
#dmRoot #dm .sf6p .sf22-jobs .sf12-count { margin: 0 !important; color: var(--dark) !important; font: 800 15px/1.4 "Manrope", Arial, sans-serif !important; }
@media (prefers-reduced-motion: reduce) {
  #dmRoot #dm .sf6p :is(.sf22-filters :is(input, select), .sf22-filters__reset, .sf22-empty button) { transition: none !important; }
  #dmRoot #dm .sf6p .sf22-card.is-sf22-in { animation: none !important; }
}

/* Riquadro «Continua il percorso» nelle pagine a layout istituzionale (catalogo, schede corso, bacheca):
   il layout a due colonne di sf7 comprimeva il titolo in una colonna stretta. Qui torna a tutta larghezza
   come nelle altre pagine. Solo profili Formazione/Lavoro: www resta invariato in questa fase. */
#dmRoot #dm .sf6p[data-layout="institutional"] .sf9-routes > .sf6p__section-inner { display: block !important; }
