/* =========================================================
   Ferihegy Dental - a téma stílusai (Bootstrap 5.3 felett)
   Visszafogott, letisztult megjelenés: fehér alap, vékony
   vonalak, kis lekerekítés, árnyékok nélkül.
   ========================================================= */

:root {
  --fd-brand: #76232f;        /* bordó, a logóból */
  --fd-brand-dark: #5e1b25;
  --fd-text: #22252a;
  --fd-muted: #6a6e75;
  --fd-alt: #f5f4f2;          /* váltakozó szekcióháttér */
  --fd-line: #e2dfda;

  --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bs-body-color: var(--fd-text);
  --bs-body-bg: #fff;
  --bs-link-color-rgb: 118, 35, 47;
  --bs-link-hover-color-rgb: 94, 27, 37;
  --bs-border-radius: 4px;
}

html { scroll-padding-top: 84px; }
@media (max-width: 991.98px) { body { padding-bottom: 68px; } }

h1, h2, h3, h4 { font-weight: 600; color: var(--fd-text); }
a { text-decoration: none; }

.skip-link { position: absolute; z-index: 2000; left: 1rem; top: 1rem; background: #fff; padding: .5rem 1rem; }

.section { padding: 5rem 0; }
.section-alt { background: var(--fd-alt); }
@media (max-width: 767.98px) { .section { padding: 3.5rem 0; } }

.section-title { font-size: clamp(1.75rem, 1.4rem + 1.1vw, 2.25rem); margin-bottom: 2rem; }
.section-title-sub { font-size: 1.5rem; margin-top: 4rem; }

/* ---------- Gombok ---------- */
.btn { border-radius: 4px; font-weight: 500; padding: .7rem 1.4rem; }
.btn-brand {
  --bs-btn-bg: var(--fd-brand);
  --bs-btn-border-color: var(--fd-brand);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: var(--fd-brand-dark);
  --bs-btn-hover-border-color: var(--fd-brand-dark);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--fd-brand-dark);
  --bs-btn-active-border-color: var(--fd-brand-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-focus-shadow-rgb: 118, 35, 47;
}
.btn-outline-dark { --bs-btn-border-color: #b9b6b1; --bs-btn-hover-bg: var(--fd-text); --bs-btn-hover-border-color: var(--fd-text); }

/* ---------- Fejléc ---------- */
.navbar { background: #fff; border-bottom: 1px solid var(--fd-line); padding: .9rem 0; }
.navbar .nav-link { color: var(--fd-text); font-weight: 500; padding: .5rem .85rem !important; }
.navbar .nav-link:hover, .navbar .nav-link.active { color: var(--fd-brand); }
.nav-phone { color: var(--fd-brand); font-weight: 600; white-space: nowrap; }
.nav-phone:hover { color: var(--fd-brand-dark); }
.navbar-toggler { border: 0; padding: .25rem; }
.navbar-toggler:focus { box-shadow: none; }

.mobile-nav a {
  display: block; padding: .85rem 0; border-bottom: 1px solid var(--fd-line);
  font-size: 1.125rem; font-weight: 500; color: var(--fd-text);
}

/* ---------- Nyitókép ----------
   A kép teljes szélességű háttérnek készült: bal oldalt a jelenet,
   jobbra fehérbe fut ki, oda kerül a szöveg. Nem vágjuk le. */
.hero { position: relative; background: #fff; }
.hero-img { display: block; width: 100%; height: auto; }
.hero-content { padding-top: 1.75rem; padding-bottom: 3rem; }

@media (min-width: 992px) {
  /* Legalább akkora, mint a kép (legfeljebb a képernyő 85%-a),
     de a szöveggel együtt nőhet, így semmi nem vágódik le. */
  .hero { display: flex; align-items: center; min-height: min(56.24vw, 85vh); }
  .hero-img {
    position: absolute; left: 0; top: 0; height: 100%; width: auto; max-width: 100%;
    object-fit: contain; object-position: left top;
    /* a kép jobb széle finoman beleolvad a fehér háttérbe */
    -webkit-mask-image: linear-gradient(to right, #000 75%, transparent);
    mask-image: linear-gradient(to right, #000 75%, transparent);
  }
  .hero-content { position: relative; width: 100%; padding-top: 3.5rem; padding-bottom: 3.5rem; }
}
@media (max-width: 991.98px) {
  .hero-img { aspect-ratio: 4 / 3; object-fit: cover; object-position: left center; }
}

.hero h1 { font-size: clamp(2rem, 1.2rem + 1.6vw, 2.75rem); line-height: 1.15; margin-bottom: 1rem; text-wrap: balance; }
.hero-lead { font-size: 1.125rem; color: #3b3f45; margin-bottom: 0; max-width: 34rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.75rem; }
.hero-info {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem;
  margin-top: 2.25rem; padding-top: 1.5rem; border-top: 1px solid var(--fd-line);
  font-size: .9375rem; color: #3b3f45;
}
.hero-info strong { display: block; font-weight: 600; color: var(--fd-text); margin-bottom: .35rem; }
.hero-info p { margin: 0; line-height: 1.6; }

/* ---------- Időpont lemondása ---------- */
/* Keskeny, középre igazított fehér lap a szürke sávon */
.notice-band { background: var(--fd-alt); padding: 3.5rem 0; }
.notice {
  max-width: 48rem; margin: 0 auto; padding: 2.5rem 3rem;
  background: #fff; border: 1px solid var(--fd-line); border-radius: 4px;
  color: #3b3f45; text-align: center;
}
.notice-title { font-size: 1.375rem; margin-bottom: 1.25rem; }
.notice p { margin-bottom: .75rem; line-height: 1.7; text-wrap: pretty; }
.notice strong { color: var(--fd-brand); font-weight: 600; }
.notice .notice-thanks { font-style: italic; color: var(--fd-muted); margin: 1.25rem 0 0; }
@media (max-width: 767.98px) {
  .notice-band { padding: 2.5rem 0; }
  .notice { padding: 1.5rem 1.25rem; text-align: left; }
}

/* ---------- Szolgáltatások ---------- */
.services-photo { width: 100%; height: 100%; min-height: 360px; object-fit: cover; border-radius: 4px; }
.service-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--fd-line); }
.service-list li { border-bottom: 1px solid var(--fd-line); }
.service-list a, .service-list .item {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding: 1rem 0; color: var(--fd-text);
}
.service-list .name { font-size: 1.125rem; font-weight: 500; }
.service-list .more { font-size: .875rem; color: var(--fd-brand); white-space: nowrap; }
.service-list a:hover .name { color: var(--fd-brand); }
.service-list a:hover .more { text-decoration: underline; }

/* ---------- Orvosaink ---------- */
.team-card .photo { aspect-ratio: 3 / 4; overflow: hidden; border-radius: 4px; background: #e6e3de; margin-bottom: .9rem; }
.team-card img { width: 100%; height: 100%; object-fit: cover; object-position: center 15%; }
.team-card h3 { font-size: 1rem; margin-bottom: .25rem; }
.team-card .role { font-size: .875rem; color: var(--fd-brand); margin-bottom: .2rem; }
.team-card .spec { font-size: .875rem; color: var(--fd-muted); margin-bottom: .5rem; }
.team-card .hours { font-size: .8125rem; color: #3b3f45; margin: 0; }

/* ---------- Rendelő galéria: oszlopos, vágás nélkül ---------- */
.fd-gallery { columns: 3 260px; column-gap: 12px; }
.fd-gallery button {
  display: block; width: 100%; margin: 0 0 12px; padding: 0; border: 0;
  border-radius: 4px; overflow: hidden; background: var(--fd-line); break-inside: avoid;
}
.fd-gallery img { display: block; width: 100%; height: auto; transition: opacity .2s; }
.fd-gallery button:hover img { opacity: .88; }
.fd-gallery button.d-extra { display: none; }
.fd-gallery.expanded button.d-extra { display: block; }
@media (max-width: 575.98px) { .fd-gallery { columns: 2; column-gap: 8px; } .fd-gallery button { margin-bottom: 8px; } }
#lightbox .carousel-item img { max-height: 84vh; object-fit: contain; width: 100%; }

/* ---------- Kapcsolat ---------- */
.contact-list { margin-bottom: 2.5rem; }
.contact-list dt { font-size: .875rem; font-weight: 400; color: var(--fd-muted); }
.contact-list dd { font-size: 1.0625rem; font-weight: 500; margin-bottom: 1rem; }
.contact-list a { color: var(--fd-text); }
.contact-list a:hover { color: var(--fd-brand); }

.hours-title { font-size: 1rem; margin-bottom: .5rem; }
.hours-table { width: 100%; font-size: .9375rem; }
.hours-table th, .hours-table td { padding: .5rem 0; border-bottom: 1px solid var(--fd-line); }
.hours-table th { font-weight: 400; }
.hours-table td { text-align: right; color: var(--fd-muted); }
.hours-table tr.today th, .hours-table tr.today td { color: var(--fd-brand); font-weight: 600; }

.contact-form { background: #fff; border: 1px solid var(--fd-line); border-radius: 4px; padding: 2rem; }
.contact-form h3 { font-size: 1.25rem; margin-bottom: 1.5rem; }
.contact-form .form-label { font-size: .875rem; font-weight: 500; }
.contact-form .form-control { border-color: #cfcbc5; padding: .65rem .85rem; }
.contact-form .form-control:focus { border-color: var(--fd-brand); box-shadow: 0 0 0 .2rem rgba(118, 35, 47, .12); }
.form-check-input:checked { background-color: var(--fd-brand); border-color: var(--fd-brand); }
@media (max-width: 575.98px) { .contact-form { padding: 1.25rem; } }

.map-wrap { height: 400px; }
.map-wrap iframe { display: block; width: 100%; height: 100%; border: 0; }

/* ---------- Lábléc ---------- */
.site-footer { border-top: 1px solid var(--fd-line); padding: 3.5rem 0 1.5rem; font-size: .9375rem; }
.site-footer h4 { font-size: .9375rem; margin-bottom: .75rem; }
.site-footer li { padding: .2rem 0; color: #3b3f45; }
.site-footer a { color: #3b3f45; }
.site-footer a:hover { color: var(--fd-brand); }
.footer-bottom { border-top: 1px solid var(--fd-line); margin-top: 2.5rem; padding-top: 1.25rem; font-size: .8125rem; color: var(--fd-muted); }

/* ---------- Mobil alsó sáv ---------- */
.mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: #fff; border-top: 1px solid var(--fd-line);
}
.mobile-bar .btn { padding: .65rem; }

/* =========================================================
   WordPress-specifikus részek
   ========================================================= */

/* Logó: a Testreszabóban feltöltött kép is ekkora lesz */
.site-logo { display: block; height: 45px; width: auto; }
.offcanvas-header .site-logo { height: 41px; }

/* Adminsáv bejelentkezett felhasználóknak: a ragadós fejléc alá csússzon */
.admin-bar .sticky-top { top: 32px; }
html:has(body.admin-bar) { scroll-padding-top: 116px; }
@media screen and (max-width: 782px) { .admin-bar .sticky-top { top: 46px; } }
@media screen and (max-width: 600px) { .admin-bar .sticky-top { top: 0; } }

.mobile-bar.mobile-bar-single { grid-template-columns: 1fr; }

/* Űrlap: rejtett csapdamező a spamrobotoknak */
.fd-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form .alert { font-size: .9375rem; }

/* ---------- Belső oldalak ---------- */
.page-header { background: var(--fd-alt); padding: 3rem 0 2.5rem; }
.page-header h1 { font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.4rem); margin: 0; }
.page-header .back { display: inline-block; font-size: .9375rem; margin-bottom: .6rem; }
.page-header .back:hover { text-decoration: underline; }
.page-body { padding-top: 3rem; padding-bottom: 5rem; }
@media (max-width: 767.98px) { .page-header { padding: 2rem 0 1.75rem; } .page-body { padding-top: 2rem; padding-bottom: 3.5rem; } }

.entry-content { max-width: 50rem; line-height: 1.7; color: #33363c; }
.entry-content p, .entry-content ul, .entry-content ol { margin-bottom: 1.1rem; }
.entry-content h2 { font-size: 1.5rem; margin: 2.5rem 0 1rem; }
.entry-content h3 { font-size: 1.25rem; margin: 2rem 0 .75rem; }
.entry-content h4 { font-size: 1.0625rem; margin: 1.75rem 0 .6rem; }
.entry-content > :first-child { margin-top: 0; }
.entry-content ul, .entry-content ol { padding-left: 1.25rem; }
.entry-content li { margin-bottom: .35rem; }
.entry-content a:not(.btn) { text-decoration: underline; text-underline-offset: 2px; }
.entry-content img { max-width: 100%; height: auto; border-radius: 4px; }
.entry-content > img, .entry-content p > img:only-child { display: block; margin: .5rem 0 1.5rem; }

.entry-content table { width: 100%; border-collapse: collapse; margin: 0 0 2rem; font-size: .9375rem; line-height: 1.5; }
.entry-content th, .entry-content td { padding: .6rem .75rem; border-bottom: 1px solid var(--fd-line); text-align: left; vertical-align: top; }
.entry-content th { background: var(--fd-alt); font-weight: 600; }
.entry-content .wp-block-table { margin: 0 0 2rem; }
.entry-content .wp-block-table table { margin: 0; }
/* Árlista: az ár oszlop jobbra zárva, nem törik */
.page-arlista .entry-content { max-width: 56rem; }
.page-arlista .entry-content td:last-child, .page-arlista .entry-content th:last-child { text-align: right; white-space: nowrap; }
.page-arlista .entry-content tr:has(th) + tr td { border-top: 0; }
.page-arlista .entry-content tr:has(th):not(:first-child) th { padding-top: 1.75rem; background: none; border-bottom: 2px solid var(--fd-text); font-size: 1rem; }
.page-arlista .entry-content tr:first-child th { background: none; border-bottom: 2px solid var(--fd-text); font-size: 1rem; }
@media (max-width: 575.98px) {
  .entry-content th, .entry-content td { padding: .55rem .4rem; }
  .page-arlista .entry-content td:last-child { white-space: normal; min-width: 6.5rem; }
}

.post-summary { padding: 1.25rem 0; border-bottom: 1px solid var(--fd-line); }
.post-summary h2 { font-size: 1.25rem; margin: 0 0 .5rem; }

/* Szolgáltatás aloldal: oldalsáv */
.service-aside { position: sticky; top: 100px; }
.aside-box { background: var(--fd-alt); border-radius: 4px; padding: 1.5rem; margin-bottom: 1.5rem; }
.aside-box h2 { font-size: 1.125rem; margin-bottom: .75rem; }
.aside-phone { font-size: 1.125rem; font-weight: 600; margin-bottom: .5rem; }
.aside-phone a { color: var(--fd-text); }
.aside-hours { font-size: .9375rem; color: #3b3f45; margin-bottom: 1.25rem; }
.aside-links { list-style: none; padding: 0; margin: 0; }
.aside-links li + li { border-top: 1px solid var(--fd-line); }
.aside-links a { display: block; padding: .5rem 0; color: var(--fd-text); font-size: .9375rem; }
.aside-links a:hover, .aside-links .current a { color: var(--fd-brand); }
@media (max-width: 991.98px) { .service-aside { position: static; } }

/* WordPress alapelemek */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.alignleft { float: left; margin: .25rem 1.5rem 1rem 0; }
.alignright { float: right; margin: .25rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .wp-element-caption { font-size: .875rem; color: var(--fd-muted); }
