/* Custom overrides for Dr. Iliopoulos site (MediCio) */
.accordion-item h3 { font-size: 1.1rem; }

/* ===== Χρώματα & γραμματοσειρές από το Medilab ===== */
:root {
  --heading-font: "Poppins", sans-serif;
  --nav-font: "Raleway", sans-serif;
}

:root {
  --heading-color: #2c4964;
  --accent-color: #1977cc;
}

:root {
  --nav-color: #2c4964;
  --nav-hover-color: #1977cc;
  --nav-dropdown-color: #2c4964;
  --nav-dropdown-hover-color: #1977cc;
}

.light-background {
  --background-color: #f1f7fc;
}

/* Fix header logo sizing for two-line name + specialty */
.header .branding {
  min-height: 90px;
  padding: 14px 0;
}
.header .logo h1 {
  font-size: 20px;
  line-height: 1.3;
  text-align: center;
}
.header .logo h1 small {
  display: block;
  font-size: 16px !important;
  font-weight: 500;
  letter-spacing: 0.3px;
  margin-top: 3px;
  color: var(--accent-color);
}
.header .logo h1 small.tagline-secondary {
  font-size: 15px !important;
  font-weight: 500;
  color: var(--accent-color);
  margin-top: 1px;
}

/* On mobile, hide the dash between "Ειδικός Παθολόγος" and "Διαβητολόγος" */
.header .logo h1 small .mobile-break {
  display: none;
}
@media (max-width: 575px) {
  .header .logo h1 small .dash-sep {
    display: none;
  }
  .header .logo h1 small .mobile-break {
    display: block;
  }
}

/* Align service card titles + underlines to the same height, regardless of title length */
.services .service-item h3 {
  min-height: 58px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

/* Full alignment fix for article/media cards (Άρθρα, Media pages):
   makes the card a flex column so the byline always sits at the bottom
   and titles/underlines line up across different text lengths */
.services .service-item {
  display: flex;
  flex-direction: column;
}
.services .service-item .icon {
  flex-shrink: 0;
}
.services .service-item h3 {
  min-height: 64px;
}
.services .service-item > p:not(.fst-italic) {
  flex-grow: 1;
}
.services .service-item p.fst-italic {
  margin-top: auto;
  padding-top: 10px;
}

/* ===== Πιο κομψά βελάκια στο hero carousel ===== */
.hero .carousel-control-prev,
.hero .carousel-control-next {
  opacity: 1;
  width: 8%;
}
.hero .carousel-control-prev-icon,
.hero .carousel-control-next-icon {
  width: 52px;
  height: 52px;
  background-color: rgba(255, 255, 255, 0.9) !important;
  background-image: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  display: flex !important;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  position: relative;
}
.hero .carousel-control-prev-icon::before,
.hero .carousel-control-next-icon::before {
  font-family: "bootstrap-icons" !important;
  font-size: 22px;
  color: var(--accent-color);
  line-height: 1;
}
.hero .carousel-control-prev-icon::before {
  content: "\f284";
}
.hero .carousel-control-next-icon::before {
  content: "\f285";
}
.hero .carousel-control-prev:hover .carousel-control-prev-icon,
.hero .carousel-control-next:hover .carousel-control-next-icon {
  background-color: var(--accent-color) !important;
  transform: scale(1.1);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}
.hero .carousel-control-prev:hover .carousel-control-prev-icon::before,
.hero .carousel-control-next:hover .carousel-control-next-icon::before {
  color: #fff;
}

/* Fix footer font-size mismatch: address column was 14px, nav columns were 16px */
.footer .footer-about p {
  font-size: 16px;
}

/* Enlarge nav menu links so they balance better against the (now smaller) doctor name */
.navmenu a,
.navmenu a:focus {
  font-size: 15px !important;
}

/* Change "Χρειάζεστε ραντεβού άμεσα" section from teal to white background */
.accent-background {
  --background-color: #ffffff;
  --default-color: #212529;
  --heading-color: var(--accent-color);
  --surface-color: #f1f7fc;
}
.accent-background .cta-btn {
  color: #fff !important;
  background: var(--accent-color);
  border: 2px solid var(--accent-color) !important;
}
.accent-background .cta-btn:hover {
  background: transparent !important;
  color: var(--accent-color) !important;
}

/* Explicit height (not just min-height) on desktop too, for consistent
   cross-browser sizing of absolutely-positioned carousel images */
.hero .carousel {
  height: 70vh;
}

/* Fix hero carousel on mobile: was forced to 100vh (full screen height),
   which combined with the header caused awkward image cropping and
   text/buttons landing in odd positions on the photo */
@media (max-height: 500px), (max-width: 580px) {
  .hero .carousel {
    min-height: 80vh !important;
    height: 80vh !important;
  }
}
.hero img {
  object-position: center center;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.hero .carousel-item {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
}

/* Fix hero caption box overflowing/shifting off-screen on mobile: the
   template's 50px side margins made the box wider than the viewport */
@media (max-width: 580px) {
  .hero .container {
    margin-left: 12px !important;
    margin-right: 12px !important;
    width: calc(100% - 24px) !important;
    box-sizing: border-box;
  }
}

/* Fix anchor links (e.g. header "Κλείστε Ραντεβού" -> #appointment) landing
   right under the sticky header, making the section feel cramped/cut off */
#appointment,
#call-to-action,
#diabetes, #hypertension, #hyperlipidemia, #infections,
#tabs, #diet-special, #media, #contact {
  scroll-margin-top: 100px;
}

/* Ensure the accordion title stays visible (not hidden behind the sticky
   header) when a sub-category is opened and auto-scrolled into view */
.accordion-button {
  scroll-margin-top: 100px;
}
@media (max-width: 575px) {
  .accordion-button {
    scroll-margin-top: 190px;
  }
}
#appointment {
  padding-bottom: 80px;
}

/* Χρωματιστά social icons στο footer (επίσημα χρώματα κάθε πλατφόρμας) */
.footer .social-links a {
  border-color: color-mix(in srgb, var(--default-color), transparent 75%);
}
.footer .social-links a .bi-facebook {
  color: #1877F2;
}
.footer .social-links a .bi-linkedin {
  color: #0A66C2;
}
.footer .social-links a .bi-instagram {
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.footer .social-links a:hover {
  transform: scale(1.12);
  border-color: color-mix(in srgb, var(--default-color), transparent 40%);
}

