/* =========================================================
   CARE NETWORK - Il Farmacista Clinico
   Stylesheet custom - Bootstrap 5.3
   Palette estratta dal programma PDF (pag. 1 e pag. 12)
   ========================================================= */

:root {
  --cn-teal: #2D6879;
  --cn-teal-dark: #1F4B57;
  --cn-teal-rgb: 45, 104, 121;
  --cn-green: #72CDA1;
  --cn-green-dark: #4FAE85;
  --cn-green-soft: #DFF2E5;
  --cn-ink: #1C3A42;
  --cn-radius: 1rem;
}

body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--cn-ink);
  background-color: #F6FBF8;
  background:
          url("/assets/img/care-network-background.png") center top / cover no-repeat;
}

h1, h2, h3, h4, .cn-font-heading {
  font-family: "Montserrat", "Inter", sans-serif;
  font-weight: 800;
  letter-spacing: .3px;
}

a { color: var(--cn-teal); }
a:hover { color: var(--cn-teal-dark); }

/* ---------- Navbar ---------- */
.cn-navbar {
  background-color: #ffffffee;
  backdrop-filter: saturate(180%) blur(6px);
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
}
.cn-navbar .navbar-brand {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  color: var(--cn-teal);
}
.cn-navbar .navbar-brand span { color: var(--cn-green-dark); }
.cn-navbar .nav-link {
  font-weight: 600;
  color: var(--cn-ink);
}
.cn-navbar .nav-link:hover,
.cn-navbar .nav-link.active { color: var(--cn-teal); }

/* ---------- Header / Hero ---------- */
.cn-header {
  background:
    linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(223,242,229,.85) 100%),
    url("/assets/img/bg-pattern.jpg") center top / cover no-repeat;
  border-bottom: 1px solid rgba(var(--cn-teal-rgb), .15);
}

.cn-logo {
  width: 600px;
  object-fit: contain;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.08));
}

.cn-title {
  color: var(--cn-teal);
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.05;
  margin: 0;
}
.cn-title span { color: var(--cn-green-dark); }

.cn-subtitle {
  color: var(--cn-teal-dark);
  font-size: clamp(1.1rem, 2.6vw, 1.6rem);
  font-weight: 700;
}

.cn-tagline {
  color: var(--cn-ink);
  font-size: clamp(.95rem, 1.6vw, 1.1rem);
  max-width: 620px;
}

.cn-header-bar {
  background-color: var(--cn-teal);
  color: #fff;
}
.cn-header-bar strong { font-weight: 700; }

/* ---------- CTA cards (blocchi cliccabili) ---------- */
.cn-cta-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid rgba(var(--cn-teal-rgb), .12);
  border-color: rgba(var(--cn-teal-rgb), .3);
  border-radius: var(--cn-radius);
  padding: 2rem 1.75rem;
  box-shadow: 0 4px 16px rgba(0,0,0,.06);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.cn-cta-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, var(--cn-green) 0%, var(--cn-teal) 100%);
  transition: width .25s ease;
}

.cn-cta-card:hover,
.cn-cta-card:focus-visible {
  transform: translateY(-8px);
  box-shadow: 0 16px 34px rgba(var(--cn-teal-rgb), .22);
  border-color: rgba(var(--cn-teal-rgb), .3);
}
.cn-cta-card:hover::before { width: 10px; }

.cn-cta-card--alt::before {
  background: linear-gradient(180deg, var(--cn-teal) 0%, var(--cn-green) 100%);
}

.cn-cta-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  color: var(--cn-teal);
  background: var(--cn-green-soft);
  margin-bottom: 1.1rem;
  transition: transform .25s ease, background .25s ease, color .25s ease;
}
.cn-cta-card:hover .cn-cta-icon {
  background: var(--cn-teal);
  color: #fff;
  transform: scale(1.08) rotate(-6deg);
}

.cn-cta-card h3 {
  font-size: 1.3rem;
  color: var(--cn-ink);
  margin-bottom: .5rem;
}

.cn-cta-card p {
  color: #5b6d70;
  margin-bottom: 1.25rem;
}

.cn-cta-link {
  margin-top: auto;
  font-weight: 700;
  color: var(--cn-teal);
}
.cn-cta-card:hover .cn-cta-link { color: var(--cn-green-dark); }
.cn-cta-link i { transition: transform .25s ease; }
.cn-cta-card:hover .cn-cta-link i { transform: translateX(4px); }

/* ---------- Sezioni generiche ---------- */
.cn-section-alt { background-color: var(--cn-green-soft); }

.cn-section-title {
  color: var(--cn-teal);
  font-size: clamp(1.6rem, 3.2vw, 2.1rem);
}

.cn-section-title::after {
  content: "";
  display: block;
  width: 64px;
  height: 4px;
  margin: .75rem auto 0;
  background: var(--cn-green);
  border-radius: 2px;
}

/* ---------- Card relatori ---------- */
.cn-speaker-card {
  border: 1px solid rgba(var(--cn-teal-rgb), .1);
  border-color: rgba(var(--cn-teal-rgb), .3);
  border-radius: var(--cn-radius);
  box-shadow: 0 3px 12px rgba(0,0,0,.05);
  transition: transform .2s ease, box-shadow .2s ease;
}
.cn-speaker-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 28px rgba(var(--cn-teal-rgb), .18);
}

.cn-speaker-day {
  align-self: flex-start;
  background: var(--cn-green-soft);
  color: var(--cn-teal-dark);
  font-weight: 700;
  font-size: .70rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .35em .7em;
  border-radius: 20rem;
  margin-bottom: .75rem;
}

.cn-speaker-name {
  color: var(--cn-ink);
  align-self: flex-start;
  background: var(--cn-green-soft);
  font-weight: 700;
  font-size: .90rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .35em .7em;
  border-radius: 10px;
  margin-bottom: .75rem;
}

.cn-speaker-title {
  color: black;
  font-size: 1rem;
  margin-bottom: 1rem;
}

.cn-btn-outline {
  border: 1.5px solid var(--cn-teal);
  color: var(--cn-teal);
  font-weight: 600;
  font-size: .88rem;
  border-radius: 50rem;
  padding: .45rem 1.1rem;
  align-self: flex-start;
  transition: background .2s ease, color .2s ease;
}
.cn-btn-outline:hover {
  background: var(--cn-teal);
  color: #fff;
}
.btn-new-target {
  max-width: 200px;
  font-weight: normal;
}

.cn-btn-solid {
  background: var(--cn-teal);
  border: 1.5px solid var(--cn-teal);
  color: #fff;
  font-weight: 700;
  border-radius: 50rem;
  padding: .6rem 1.6rem;
  transition: background .2s ease, border-color .2s ease;
}
.cn-btn-solid:hover {
  background: var(--cn-teal-dark);
  border-color: var(--cn-teal-dark);
  color: #fff;
}

/* ---------- Footer ---------- */
.cn-footer-top {
  background-color: var(--cn-teal);
  color: #fff;
}
.cn-footer-heading { color: #fff; font-size: 1.2rem; }

.cn-patrocinio-badge {
  background: #fff;
  border-radius: .75rem;
  padding: .85rem 1rem;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 10px rgba(0,0,0,.12);
  transition: transform .2s ease;
}
.cn-patrocinio-badge:hover { transform: translateY(-3px); }
.cn-patrocinio-badge img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}

.cn-footer-bottom {
  background-color: var(--cn-green);
  color: var(--cn-teal-dark);
  font-weight: 600;
}

/* ---------- Back to top ---------- */
#cnBackToTop {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1040;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--cn-teal);
  color: #fff;
  border: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.25);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}
#cnBackToTop:hover { background: var(--cn-teal-dark); }


.privacy-link {
color: var(--cn-teal)
}
.form-check-input {
  border-color: var(--cn-teal);
}



@media (max-height: 800px) {
  .fixed-bottom {
    position: relative;
  }
}

@media (max-width: 1300px) {

  .cn-logo { width: 600px; }
}

@media (max-width: 767px) {
  .cn-logo { width: 300px;
    padding: 15px;
  }
}



/* ---------- Modale PDF fullscreen ---------- */
.cn-pdf-modal-content {
  border-radius: 0;
  height: 100%;
}

.cn-pdf-modal-header {
  background-color: var(--cn-teal);
  color: #fff;
  border-bottom: 0;
  flex-wrap: wrap;
  row-gap: .5rem;
}
.cn-pdf-modal-header .cn-pdf-header-actions {
  flex: 0 0 auto;
  margin-left: auto;
}

.cn-pdf-modal-header .modal-title {
  flex: 1 1 100%;
  min-width: 0; /* indispensabile: senza questo text-truncate non tronca dentro un flex item */
}

.cn-pdf-modal-header .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 1;
  flex-shrink: 0;
/*  margin-right: 10px;*/
}
.cn-pdf-modal-header .btn-close:hover,
.cn-pdf-modal-header .btn-close:focus {
  opacity: .75;
}

.cn-pdf-modal-header .cn-btn-outline {
  border-color: #fff;
  color: #fff;
}
.cn-pdf-modal-header .cn-btn-outline:hover {
  background: #fff;
  color: var(--cn-teal);
}

.cn-pdf-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.cn-pdf-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  z-index: 1;
  color: var(--cn-teal);
}
.cn-pdf-spinner.d-none { display: none; }
@media (min-width: 576px) {
  .cn-pdf-modal-header .modal-title {
    flex: 1 1 auto; /* da sm in su torna su un'unica riga con le azioni */
  }
}

@media (max-width: 480px) {
  .cn-pdf-modal-header .btn-close { margin-right: 0;}
}