/*
 * Site-specific CSS overrides.
 * Bootstrap Italia + Dev Kit Italia provide all the base styles.
 * Add only what's truly custom here.
 */

/* ── Theming PoC — header & footer ──────────────────────────────────────────–── */

/* Define custom color palette with verified WCAG AA contrast ratios on white */
:root {
  --custom-orange-primary: #b85a0c;
  --custom-orange-muted: #944a0a;
  --custom-orange-deep: #6d2e0a;
}

/* SLIM HEADER - Keep custom darker shade */
.it-header-slim-wrapper {
  --bsi-header-slim-background: var(--custom-orange-deep);
  --bsi-header-slim-text-color: #ffffff;
}

/* HEADER CENTER & NAV - Custom primary */
.it-header-wrapper,
.it-header-center-wrapper,
.it-header-navbar-wrapper {
  --bsi-header-center-background: var(--custom-orange-primary);
  --bsi-header-nav-background: var(--custom-orange-primary);
  --bsi-header-center-text-color: #ffffff;
  --bsi-header-nav-text-color: #ffffff;
  --bsi-header-brand-color: #ffffff;
  --bsi-header-brand-icon-color: #ffffff;
  --bsi-header-search-icon-color: var(--custom-orange-primary);
}

.navbar {
  --bsi-navbar-background: var(--custom-orange-primary);
}

/* FOOTER - Custom gradient (muted + deep) */
.it-footer {
  --bsi-footer-top-background: var(--custom-orange-muted);
  --bsi-footer-bottom-background: var(--custom-orange-deep);
  --bsi-footer-brand-icon-color: #ffffff;
}

/* ── Layout ─────────────────────────────────────────────────────────────────── */

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main {
  flex: 1;
}

main article>*:first-child {
  margin-top: 0;
}

/* ── Typography & spacing ──────────────────────────────────────────────────── */


p {
  max-width: 75ch;
}

it-video,
it-breadcrumbs,
it-accordion,
it-hero,
it-input {
  display: block;
  margin-bottom: 2.5rem;
}

h2 {
  margin-top: 4.5rem;
}

h3 {
  margin-top: 1rem;
}

h4 {
  margin-top: 0.875rem;
}

hr {
  margin-top: 4.5rem!important;
  border-top: dotted 4px #666!important;
}


/* Restore BSI 85% for inline code — overridden to 1em by styles.css Dev Kit. 
   Is it a Dev Kit style issue? */
:not(pre)>code {
  font-size: 0.875em;
}

/* ––– Temporary –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Issue BSI 3: https://github.com/italia/bootstrap-italia/issues/1726 */
ul.it-card-list li .it-card-text {
  font-size: 1rem !important;
}

ul.it-card-list li it-card {
  font-size: 1rem;
}