/* Positano theme: customizes Bootstrap 5.3 through its CSS variables.
   Load after bootstrap.min.css. Colors come from logo.svg:
   blu maiolica #1656A0 · verde ceramica #198D79 · giallo sole #F2B32E */

:root,
[data-bs-theme=light] {
  --pz-blu: #1656A0;
  --pz-blu-dark: #104380;
  --pz-blu-darker: #0C3566;
  --pz-blu-soft: #E4EDF8;
  --pz-verde: #198D79;
  --pz-verde-ink: #0D6353;
  --pz-verde-soft: #DCF1EC;
  --pz-giallo: #F2B32E;
  --pz-giallo-ink: #6A4800;
  --pz-giallo-soft: #FDF1D2;
  --pz-ink: #1B2433;

  --bs-body-bg: #F4F6F9;
  --bs-body-bg-rgb: 244, 246, 249;
  --bs-body-color: #1B2433;
  --bs-body-color-rgb: 27, 36, 51;
  --bs-secondary-color: #566173;
  --bs-border-color: #D8DEE6;
  --bs-border-radius: .5rem;
  --bs-border-radius-lg: .75rem;

  --bs-primary: #1656A0;
  --bs-primary-rgb: 22, 86, 160;
  --bs-primary-bg-subtle: #E4EDF8;
  --bs-primary-border-subtle: #A9C3E3;
  --bs-primary-text-emphasis: #104380;
  --bs-success: #198D79;
  --bs-success-rgb: 25, 141, 121;
  --bs-success-bg-subtle: #DCF1EC;
  --bs-success-text-emphasis: #0D6353;
  --bs-warning: #F2B32E;
  --bs-warning-rgb: 242, 179, 46;
  --bs-warning-bg-subtle: #FDF1D2;
  --bs-warning-text-emphasis: #6A4800;
  --bs-danger-bg-subtle: #FBE6E8;
  --bs-danger-text-emphasis: #8E1F2C;

  --bs-link-color: #1656A0;
  --bs-link-color-rgb: 22, 86, 160;
  --bs-link-hover-color: #104380;
  --bs-link-hover-color-rgb: 16, 67, 128;
  --bs-focus-ring-color: rgba(22, 86, 160, .35);
  --bs-font-monospace: "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", monospace;
}

body { min-height: 100vh; display: flex; flex-direction: column; }
/* The hidden attribute must win over display utilities such as .d-flex. */
[hidden] { display: none !important; }

/* Buttons: brand blue primary, calm secondary, 44px+ targets */
.btn { --bs-btn-padding-y: .55rem; --bs-btn-padding-x: 1.1rem; --bs-btn-font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; }
.btn-lg { --bs-btn-padding-y: .7rem; --bs-btn-padding-x: 1.5rem; --bs-btn-font-size: 1.0625rem; min-height: 52px; }
.btn-primary {
  --bs-btn-bg: var(--pz-blu); --bs-btn-border-color: var(--pz-blu);
  --bs-btn-hover-bg: var(--pz-blu-dark); --bs-btn-hover-border-color: var(--pz-blu-dark);
  --bs-btn-active-bg: var(--pz-blu-darker); --bs-btn-active-border-color: var(--pz-blu-darker);
  --bs-btn-disabled-bg: var(--pz-blu); --bs-btn-disabled-border-color: var(--pz-blu);
  --bs-btn-focus-shadow-rgb: 22, 86, 160;
}
.btn-outline-primary {
  --bs-btn-color: var(--pz-blu); --bs-btn-border-color: var(--pz-blu);
  --bs-btn-hover-bg: var(--pz-blu-soft); --bs-btn-hover-color: var(--pz-blu-dark); --bs-btn-hover-border-color: var(--pz-blu);
  --bs-btn-active-bg: var(--pz-blu); --bs-btn-active-color: #fff; --bs-btn-active-border-color: var(--pz-blu);
  --bs-btn-focus-shadow-rgb: 22, 86, 160;
}
.btn-outline-secondary {
  --bs-btn-color: var(--pz-ink); --bs-btn-border-color: #AEB8C5; --bs-btn-bg: #fff;
  --bs-btn-hover-bg: #EEF2F6; --bs-btn-hover-color: var(--pz-ink); --bs-btn-hover-border-color: var(--pz-ink);
  --bs-btn-active-bg: var(--pz-ink); --bs-btn-active-color: #fff; --bs-btn-active-border-color: var(--pz-ink);
  --bs-btn-focus-shadow-rgb: 27, 36, 51;
}
/* "Aggiungi …" inside a document */
.btn-add { border-style: dashed; }

/* Forms */
.form-control, .form-select { min-height: 48px; border-color: #7A8698; }
.form-control:focus, .form-select:focus { border-color: var(--pz-blu); box-shadow: 0 0 0 .25rem rgba(22, 86, 160, .25); }
.form-check-input { width: 1.375em; height: 1.375em; border-color: #7A8698; }
.form-check-input:checked { background-color: var(--pz-blu); border-color: var(--pz-blu); }
.form-check-input:focus { border-color: var(--pz-blu); box-shadow: 0 0 0 .25rem rgba(22, 86, 160, .25); }
.form-label { font-weight: 600; }

/* Cards and lists */
.card { --bs-card-border-color: var(--bs-border-color); --bs-card-border-radius: .75rem; --bs-card-cap-bg: #fff; }
.list-group { --bs-list-group-active-bg: var(--pz-blu); --bs-list-group-active-border-color: var(--pz-blu); --bs-list-group-border-color: var(--bs-border-color); --bs-list-group-item-padding-y: .875rem; --bs-list-group-item-padding-x: 1.25rem; }

/* Navigation */
.pz-navbar { background: #fff; border-bottom: 1px solid var(--bs-border-color); min-height: 68px; }
.pz-navbar .navbar-brand img { height: 44px; width: auto; display: block; }
.breadcrumb { --bs-breadcrumb-divider-color: var(--bs-secondary-color); --bs-breadcrumb-item-active-color: var(--bs-secondary-color); font-size: .875rem; margin: 0; }
.breadcrumb a { color: var(--bs-secondary-color); }
.nav-underline { --bs-nav-underline-border-width: 3px; --bs-nav-link-color: var(--bs-secondary-color); --bs-nav-link-hover-color: var(--pz-ink); --bs-nav-underline-link-active-color: var(--pz-ink); }
.nav-underline .nav-link { min-height: 48px; display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; }
.nav-underline .nav-link.active { border-bottom-color: var(--pz-blu); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--pz-ink); --bs-nav-link-color: var(--pz-ink); --bs-nav-pills-border-radius: .625rem; gap: .5rem; }
.nav-pills .nav-link { border: 1px solid #AEB8C5; background: #fff; min-height: 56px; line-height: 1.25; text-align: left; }
.nav-pills .nav-link.active .text-body-secondary { color: #C9D2DD !important; }
.nav-pills .nav-link:hover { border-color: var(--pz-ink); }

/* Badges: level colors from the logo */
.badge { font-weight: 600; font-size: .8125rem; padding: .35em .75em; }
/* Level palette: a level's color is the entry at its rank by position, cycling (see level_badge.html). */
.badge-level-0 { background: var(--pz-verde-soft); color: var(--pz-verde-ink); }
.badge-level-1 { background: var(--pz-giallo-soft); color: var(--pz-giallo-ink); }
.badge-level-2 { background: var(--pz-blu-soft); color: var(--pz-blu-dark); }

/* Small Positano additions */
.pz-code { font-family: var(--bs-font-monospace); font-weight: 600; letter-spacing: .03em; }
.pz-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--pz-blu); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .8125rem; font-weight: 700; flex: none; }
.pz-main { width: 100%; max-width: 1200px; margin: 0 auto; padding: 1.75rem 2rem 3rem; flex: 1; }
/* A card that is also its own body must not stretch to fill the page. */
.pz-main > .card-body { flex: 0 0 auto; }
.pz-savebar { position: sticky; bottom: 0; z-index: 1020; background: rgba(255, 255, 255, .97); border-top: 1px solid var(--bs-border-color); }
.pz-footer { border-top: 1px solid var(--bs-border-color); background: #fff; color: var(--bs-secondary-color); font-size: .875rem; text-align: center; padding: 1.25rem 2rem; }
.pz-footer .heart { color: #C03A2B; vertical-align: -2px; }
.pz-step { width: 2rem; height: 2rem; border-radius: 50%; background: var(--pz-ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .9375rem; font-weight: 700; flex: none; }
.pz-state { width: 1.75rem; height: 1.75rem; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; border: 2px solid #AEB8C5; background: #fff; color: #fff; }
.pz-state.done { background: var(--pz-blu); border-color: var(--pz-blu); }
.pz-state.prog { border-color: var(--pz-blu); background: conic-gradient(var(--pz-blu) 0 50%, #fff 50% 100%); }
.pz-state.list { border-style: dashed; border-color: var(--pz-blu); }
.accordion { --bs-accordion-active-bg: var(--pz-blu-soft); --bs-accordion-active-color: var(--pz-blu-dark); --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(22, 86, 160, .25); --bs-accordion-border-color: var(--bs-border-color); }
/* Confirmations and optional fields stay native <details>, so they work without JS. */
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }

/* Answer scale: one button per value, number above its word; "Forza" set apart */
.pz-option { flex: 1 1 0; flex-direction: column; gap: 0; line-height: 1.15; min-height: 56px; padding-left: .25rem; padding-right: .25rem; }
.pz-option small { font-weight: 400; font-size: .75rem; }
.pz-clear { min-height: 32px; }
.btn-check:checked + .pz-clear { display: none; }

/* Page widths for sign-in and account pages */
.pz-narrow { width: 100%; max-width: 30rem; margin-inline: auto; }
.pz-medium { width: 100%; max-width: 52rem; margin-inline: auto; }
dl dd:last-child { margin-bottom: 0; }
dt { font-weight: 600; }

/* ---- Feedback and motion -------------------------------------------------
   States show without motion; movement is added only for people who have not
   asked to reduce it. */
fieldset[data-item].is-answered { box-shadow: inset 4px 0 0 var(--pz-verde); }

@media (prefers-reduced-motion: no-preference) {
  /* "backwards": no transform remains after the entrance, so open menus are not trapped below later blocks. */
  .pz-main > * { animation: pz-rise .28s ease-out backwards; }
  .pz-main > *:nth-child(2) { animation-delay: .04s; }
  .pz-main > *:nth-child(3) { animation-delay: .08s; }
  .pz-main > *:nth-child(n+4) { animation-delay: .12s; }

  .btn, .list-group-item-action, .nav-link, .pz-state, .form-control, .form-select { transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .12s ease; }
  .btn:active:not(:disabled) { transform: scale(.97); }
  .btn-primary:hover, .btn-light:hover { box-shadow: 0 .25rem .75rem rgba(22, 86, 160, .2); }

  .btn-check:checked + .pz-option { animation: pz-pop .22s ease-out; }
  details[open] > summary + * { animation: pz-reveal .2s ease-out; }
  .alert[data-message] { animation: pz-rise .28s ease-out backwards; }
  [data-save-status].is-unsaved { animation: pz-pulse .5s ease-out; }
}

@keyframes pz-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes pz-pop { 0% { transform: scale(.9); } 60% { transform: scale(1.06); } 100% { transform: scale(1); } }
@keyframes pz-reveal { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@keyframes pz-pulse { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }
