/* =============================================================
   PAGE-THEMES.CSS — farebná cesta naprieč podstránkami

   Podstránky ležia na jednom farebnom gradiente v poradí menu:
   od teplej hlinenej cez piesok a olivu až po chladnú zeleň.
   Jas sa pritom strieda tmavá / svetlá — tým sa drží tmavo-zlatá
   identita značky a zároveň vzniká rytmus pri preklikávaní.

     O mně      tmavá   hlinená        #3A2413
     Procedury  svetlá  piesková       #F0E3CE
     Ceník      tmavá   olivovo-hnedá  #3B3318
     Rezervace  svetlá  olivová        #E6E9D3
     Blog       tmavá   tmavá olivová  #2F3A22
     Recenze    svetlá  šalviová       #D8E5D9
     FAQ        tmavá   hlboká zelená  #24352C

   Každý motív nastavuje tri premenné:
     --pt-hero    … hlavička stránky
     --pt-body    … telo stránky
     --pt-accent  … odlíšený pás vnútri stránky

   Režim sa volí triedou .page-dark / .page-light na <main>, napr.:
     <main class="pricing-page page-dark theme-pricing">

   Selektory používajú `main.` — page-specific CSS (booking.css,
   blog.css…) sa importuje až za týmto súborom a inak by prebíjalo.
   ============================================================= */

/* ═══ Motívy ═══════════════════════════════════════════════════ */

.theme-about      { --pt-hero: #3A2413; --pt-body: #2A1810; --pt-accent: #452C18; }
.theme-procedures { --pt-hero: #F0E3CE; --pt-body: #FAF5EC; --pt-accent: #E9DBC4; }
.theme-pricing    { --pt-hero: #3B3318; --pt-body: #2A2512; --pt-accent: #463D1D; }
.theme-booking    { --pt-hero: #E6E9D3; --pt-body: #F5F7EC; --pt-accent: #DEE1C9; }
.theme-blog       { --pt-hero: #2F3A22; --pt-body: #222A19; --pt-accent: #38452A; }
.theme-reviews    { --pt-hero: #D8E5D9; --pt-body: #EDF3EE; --pt-accent: #D0DDCF; }
.theme-faq        { --pt-hero: #24352C; --pt-body: #1A2721; --pt-accent: #2C4036; }


/* ═══════════════════════════════════════════════════════════════
   TMAVÝ REŽIM
   Text ostáva svetlý ako doteraz, mení sa len farba plôch.
   ═══════════════════════════════════════════════════════════════ */

main.page-dark {
  background-color: var(--pt-body);
}

main.page-dark .page-hero {
  background-color: var(--pt-hero);
}

main.page-dark .pricing-section,
main.page-dark .blog-section,
main.page-dark .faq-section,
main.page-dark .about-bio {
  background-color: transparent;
}

/* Odlíšený pás vnútri stránky — drží sa farby motívu,
   nie natvrdo zapísanej zelenej */
main.page-dark .about-philosophy {
  background-color: var(--pt-accent);
}

/* Text v pásoch bol ladený na zelené pozadie — na farbe motívu
   potrebuje neutrálny svetlý tón */
main.page-dark .philosophy-card p {
  color: var(--color-beige);
}

/* Karty a panely sa dvíhajú svetlým závojom, takže si držia
   kontrast nezávisle od toho, aký odtieň je pod nimi */
main.page-dark .service-card,
main.page-dark .blog-card,
main.page-dark .review-card,
main.page-dark .philosophy-card,
main.page-dark .sidebar-block {
  background-color: rgba(250, 235, 205, 0.09);
  border-color: rgba(201, 150, 60, 0.26);
}

main.page-dark .service-card:hover,
main.page-dark .blog-card:hover {
  background-color: rgba(250, 235, 205, 0.15);
  border-color: rgba(201, 150, 60, 0.55);
}

/* CTA bánery na tmavej stránke nadväzujú na jej odtieň */
main.page-dark .booking-cta,
main.page-dark .about-cta {
  background:
    linear-gradient(180deg,
      var(--pt-body) 0%,
      var(--pt-accent) 45%,
      var(--pt-body) 100%);
}


/* ═══════════════════════════════════════════════════════════════
   SVETLÝ REŽIM
   ═══════════════════════════════════════════════════════════════ */

main.page-light {
  background-color: var(--pt-body);
}

main.page-light .pricing-section,
main.page-light .blog-section,
main.page-light .faq-section,
main.page-light .reviews-section,
main.page-light .booking-form-section {
  background-color: transparent;
}

/* Sekcia procedúr si drží vlastný farebný prechod v rámci motívu */
main.page-light .services-section {
  background-color: var(--pt-body);
  background-image: linear-gradient(
    180deg,
    var(--pt-hero) 0%,
    var(--pt-body) 34%,
    var(--pt-body) 62%,
    var(--pt-accent) 100%
  );
}

main.page-light .services-section::before {
  background: radial-gradient(circle, rgba(201, 150, 60, 0.12) 0%, transparent 70%);
}

/* ─── Hlavička stránky ───────────────────────────────────────── */

main.page-light .page-hero {
  background-color: var(--pt-hero);
}

/* Pôvodné tmavé radiálne gradienty by na bledom podklade špinili */
main.page-light .page-hero::before {
  background:
    radial-gradient(ellipse 100% 80% at 50% 0%,
      rgba(255, 255, 255, 0.5) 0%, transparent 70%),
    radial-gradient(ellipse 60% 50% at 80% 100%,
      rgba(201, 150, 60, 0.1) 0%, transparent 60%);
}

main.page-light .page-hero h1 {
  color: var(--color-brown-dark);
}

main.page-light .page-hero-desc,
main.page-light .page-hero p {
  color: var(--color-brown-mid);
}

/* Zlaté logo je na bledom podklade svetlé — stmavíme ho */
main.page-light .page-hero-logo {
  filter: brightness(0.82) saturate(1.15);
}

main.page-light .page-hero-ornament span {
  background: linear-gradient(90deg, transparent, var(--color-gold-deep));
}

main.page-light .page-hero-ornament span:last-child {
  background: linear-gradient(90deg, var(--color-gold-deep), transparent);
}

main.page-light .page-hero-ornament em,
main.page-light .page-hero .section-label {
  color: var(--color-gold-deep);
}

main.page-light .page-hero-breadcrumb,
main.page-light .page-hero-breadcrumb a {
  color: var(--color-brown-light);
}

/* ─── Text ───────────────────────────────────────────────────── */

main.page-light h1,
main.page-light h2,
main.page-light h3,
main.page-light h4 {
  color: var(--color-brown-dark);
}

main.page-light p,
main.page-light li {
  color: var(--color-brown-mid);
}

main.page-light .section-label {
  color: var(--color-gold-deep);
}

main.page-light .divider-gold {
  background: linear-gradient(90deg, transparent, var(--color-gold-deep), transparent);
}

/* ─── Karty procedúr ─────────────────────────────────────────── */

main.page-light .service-card {
  background-color: rgba(255, 253, 248, 0.72);
  border-color: rgba(160, 120, 48, 0.28);
  box-shadow: 0 2px 14px rgba(44, 26, 14, 0.07);
}

main.page-light .service-card:hover {
  border-color: var(--color-gold-deep);
  box-shadow: 0 10px 30px rgba(44, 26, 14, 0.12);
}

main.page-light .service-card h3,
main.page-light .service-card:hover h3 {
  color: var(--color-brown-dark);
}

main.page-light .service-card p {
  color: var(--color-brown-mid);
}

main.page-light .service-card-link,
main.page-light .service-price,
main.page-light .service-card:hover .service-price {
  color: var(--color-gold-deep);
}

main.page-light .service-duration {
  color: var(--color-green-mid);
}

main.page-light .service-card-meta {
  border-top-color: rgba(160, 120, 48, 0.2);
}

/* ─── Detail procedúry ───────────────────────────────────────── */

main.page-light .service-detail-section {
  background-color: transparent;
}

main.page-light .service-detail-body p {
  color: var(--color-brown-mid);
}

/* Podnadpisy generované z riadkov „Nadpis:" v popise z EA */
main.page-light .service-detail-body p strong {
  color: var(--color-gold-deep);
  border-bottom-color: rgba(160, 120, 48, 0.3);
}

main.page-light .service-detail-highlights {
  border-top-color: rgba(160, 120, 48, 0.25);
}

main.page-light .service-detail-highlight .highlight-icon {
  color: var(--color-gold-deep);
}

main.page-light .service-detail-highlight strong {
  color: var(--color-brown-light);
}

main.page-light .service-detail-highlight span {
  color: var(--color-brown-dark);
}

main.page-light .service-price-hero {
  color: var(--color-gold-deep);
}

main.page-light .sidebar-cta {
  background: rgba(255, 253, 248, 0.72);
  border-color: rgba(160, 120, 48, 0.28);
}

main.page-light .sidebar-cta h3 {
  color: var(--color-brown-dark);
}

main.page-light .sidebar-cta p {
  color: var(--color-brown-light);
}

main.page-light .sidebar-variant-btn {
  background: rgba(255, 255, 255, 0.6);
  border-color: rgba(160, 120, 48, 0.3);
  color: var(--color-brown-dark);
}

main.page-light .sidebar-variant-btn:hover {
  background: rgba(201, 150, 60, 0.14);
  border-color: var(--color-gold-deep);
  color: var(--color-brown-dark);
}

main.page-light .sidebar-variant-price {
  color: var(--color-gold-deep);
}

/* ─── Rezervačný formulár ────────────────────────────────────── */

main.page-light .booking-step-title {
  color: var(--color-brown-dark);
}

main.page-light .stepper-num {
  color: rgba(92, 58, 30, 0.28);
}

main.page-light .stepper-step--active .stepper-num,
main.page-light .stepper-step--done .stepper-num {
  color: var(--color-gold-deep);
}

main.page-light .stepper-label {
  color: rgba(92, 58, 30, 0.5);
}

main.page-light .stepper-step--active .stepper-label,
main.page-light .stepper-step--done .stepper-label {
  color: var(--color-brown-mid);
}

main.page-light .stepper-line {
  background: linear-gradient(90deg, rgba(160, 120, 48, 0.35), rgba(160, 120, 48, 0.35));
}

main.page-light .ea-cat-tab-count {
  color: rgba(92, 58, 30, 0.5);
}

main.page-light .ea-cat-tab--active .ea-cat-tab-count {
  color: var(--color-gold-deep);
}

/* Logo watermark v riadku kategórie je na svetlom takmer neviditeľné */
main.page-light .ea-cat-tab::after {
  opacity: 0.07;
}

main.page-light .ea-cat-tab:hover::after,
main.page-light .ea-cat-tab--active::after {
  opacity: 0.14;
}

main.page-light .ea-cat-list,
main.page-light .ea-cat-item,
main.page-light .ea-uncategorized {
  border-color: rgba(160, 120, 48, 0.25);
}

main.page-light .ea-cat-tab-name {
  color: var(--color-brown-mid);
}

main.page-light .ea-cat-tab:hover .ea-cat-tab-name,
main.page-light .ea-cat-tab--active .ea-cat-tab-name {
  color: var(--color-brown-dark);
}

main.page-light .ea-cat-tab-ornament {
  color: rgba(160, 120, 48, 0.5);
}

main.page-light .ea-cat-tab--active .ea-cat-tab-ornament {
  color: var(--color-gold-deep);
}

main.page-light .ea-service-name {
  color: var(--color-brown-dark);
}

main.page-light .ea-service-duration {
  color: var(--color-green-mid);
}

main.page-light .ea-service-price {
  color: var(--color-gold-deep);
}

main.page-light .ea-service-card:hover {
  background: rgba(201, 150, 60, 0.12);
}

main.page-light .ea-uncategorized-label {
  color: var(--color-brown-light);
}

main.page-light .ea-uncategorized-line {
  background: rgba(160, 120, 48, 0.25);
}

main.page-light .booking-label {
  color: var(--color-brown-light);
}

main.page-light .booking-input,
main.page-light .booking-select,
main.page-light .booking-textarea {
  background: rgba(255, 255, 255, 0.75);
  border-color: rgba(160, 120, 48, 0.3);
  color: var(--color-brown-dark);
}

main.page-light .booking-input::placeholder,
main.page-light .booking-textarea::placeholder {
  color: rgba(92, 58, 30, 0.4);
}

main.page-light .booking-input:focus,
main.page-light .booking-select:focus,
main.page-light .booking-textarea:focus {
  border-color: var(--color-gold-deep);
  background: #fff;
}

/* Natívna ikonka kalendára — na svetlom podklade bez invertovania */
main.page-light .booking-input[type="date"]::-webkit-calendar-picker-indicator {
  filter: none;
  opacity: 0.6;
}

main.page-light .booking-select option {
  background: #fff;
  color: var(--color-brown-dark);
}

main.page-light .booking-slot-btn {
  background: rgba(255, 255, 255, 0.75);
  border-color: rgba(160, 120, 48, 0.3);
  color: var(--color-brown-mid);
}

main.page-light .booking-slot-btn:hover {
  border-color: var(--color-gold-deep);
  color: var(--color-brown-dark);
  background: rgba(201, 150, 60, 0.12);
}

main.page-light .booking-slots-empty,
main.page-light .booking-step-hint {
  color: var(--color-brown-light);
}

main.page-light .booking-summary {
  background: rgba(255, 255, 255, 0.7);
  border-left-color: var(--color-gold-deep);
}

main.page-light .booking-summary-label {
  color: var(--color-brown-light);
}

main.page-light .booking-summary-val {
  color: var(--color-brown-dark);
}

main.page-light .booking-step-actions {
  border-top-color: rgba(160, 120, 48, 0.25);
}

main.page-light .ea-unavailable-inner {
  border-color: rgba(160, 120, 48, 0.3);
  background: rgba(255, 255, 255, 0.55);
}

main.page-light .ea-unavailable-icon {
  color: var(--color-gold-deep);
}

/* ─── Recenzie ───────────────────────────────────────────────── */

main.page-light .reviews-summary {
  background-color: rgba(255, 255, 255, 0.55);
  border-bottom-color: rgba(160, 120, 48, 0.25);
}

main.page-light .rating-score-number {
  color: var(--color-gold-deep);
}

main.page-light .rating-score-max,
main.page-light .rating-count,
main.page-light .rating-bar-label,
main.page-light .rating-bar-count {
  color: var(--color-brown-light);
}

main.page-light .rating-bar-track {
  background-color: rgba(92, 58, 30, 0.14);
}

main.page-light .reviews-summary-divider {
  background: rgba(160, 120, 48, 0.3);
}

main.page-light .review-card {
  background-color: rgba(255, 253, 248, 0.72);
  border-color: rgba(160, 120, 48, 0.26);
  box-shadow: 0 2px 14px rgba(44, 26, 14, 0.06);
}

main.page-light .review-quote-mark {
  color: var(--color-gold-deep);
  opacity: 0.18;
}

main.page-light .review-text {
  color: var(--color-brown-mid);
}

main.page-light .review-name {
  color: var(--color-brown-dark);
}

main.page-light .review-date {
  color: var(--color-brown-light);
}

main.page-light .review-footer {
  border-top-color: rgba(160, 120, 48, 0.2);
}

main.page-light .review-source--priamo {
  color: var(--color-gold-deep);
  background-color: rgba(201, 150, 60, 0.14);
  border-color: rgba(201, 150, 60, 0.35);
}

main.page-light .review-service-badge {
  color: var(--color-green-mid);
  background-color: rgba(74, 103, 65, 0.12);
  border-color: rgba(74, 103, 65, 0.35);
}

main.page-light .reviews-cta {
  border-top-color: rgba(160, 120, 48, 0.25);
}

main.page-light .reviews-cta p {
  color: var(--color-brown-light);
}

/* ─── Cenník ─────────────────────────────────────────────────── */

main.page-light .pricing-table tbody tr {
  border-bottom-color: rgba(160, 120, 48, 0.2);
}

main.page-light .pricing-table tbody tr:hover {
  background-color: rgba(201, 150, 60, 0.07);
}

main.page-light .pricing-name {
  color: var(--color-brown-dark);
}

main.page-light .pricing-name-sub,
main.page-light .pricing-duration,
main.page-light .pricing-price-from {
  color: var(--color-brown-light);
}

main.page-light .pricing-price {
  color: var(--color-gold-deep);
}

main.page-light .pricing-duration-badge {
  background-color: rgba(74, 103, 65, 0.12);
  border-color: rgba(74, 103, 65, 0.3);
  color: var(--color-green-mid);
}

main.page-light .pricing-category-line {
  background: linear-gradient(90deg, rgba(160, 120, 48, 0.45), transparent);
}

main.page-light .pricing-notes,
main.page-light .pricing-cta {
  border-top-color: rgba(160, 120, 48, 0.25);
}

main.page-light .pricing-note-icon {
  color: var(--color-gold-deep);
}

main.page-light .pricing-cta p {
  color: var(--color-brown-light);
}

/* ─── FAQ ────────────────────────────────────────────────────── */

main.page-light .faq-item,
main.page-light .faq-item:first-child {
  border-color: rgba(160, 120, 48, 0.25);
}

main.page-light .faq-question-text {
  color: var(--color-brown-dark);
}

main.page-light .faq-icon {
  border-color: rgba(160, 120, 48, 0.45);
  color: var(--color-gold-deep);
}

main.page-light .faq-answer-inner p {
  color: var(--color-brown-mid);
}

main.page-light .faq-answer-inner a,
main.page-light .faq-cta p {
  color: var(--color-gold-deep);
}

main.page-light .faq-cta {
  border-top-color: rgba(160, 120, 48, 0.25);
}

/* ─── Blog ───────────────────────────────────────────────────── */

main.page-light .blog-card {
  background-color: rgba(255, 253, 248, 0.72);
  border-color: rgba(160, 120, 48, 0.28);
  box-shadow: 0 2px 14px rgba(44, 26, 14, 0.07);
}

main.page-light .blog-card:hover {
  border-color: var(--color-gold-deep);
  box-shadow: 0 10px 30px rgba(44, 26, 14, 0.12);
}

main.page-light .blog-card h3,
main.page-light .blog-card:hover h3 {
  color: var(--color-brown-dark);
}

main.page-light .blog-card-excerpt {
  color: var(--color-brown-mid);
}

main.page-light .blog-card-date,
main.page-light .blog-card-author,
main.page-light .blog-card-meta-sep {
  color: var(--color-brown-light);
}

main.page-light .blog-card-link {
  color: var(--color-gold-deep);
}

main.page-light .blog-card-tag {
  background-color: rgba(44, 26, 14, 0.75);
  color: var(--color-gold-pale);
}

/* ─── Detail článku ──────────────────────────────────────────── */

/* Hero s fotkou a tmavým prekrytím zostáva tmavý */
main.page-light .article-hero-content h1,
main.page-light .article-breadcrumbs,
main.page-light .article-breadcrumbs a,
main.page-light .article-breadcrumbs-sep {
  color: var(--color-gold-pale);
}

main.page-light .article-content,
main.page-light .article-content p,
main.page-light .article-content li {
  color: var(--color-brown-mid);
}

main.page-light .article-content h2,
main.page-light .article-content h3 {
  color: var(--color-brown-dark);
}

main.page-light .about-lead {
  color: var(--color-brown-light) !important;
}

main.page-light .article-content blockquote {
  color: var(--color-brown-light);
  background-color: rgba(201, 150, 60, 0.07);
}

main.page-light .article-meta,
main.page-light .article-meta-item,
main.page-light .article-meta-sep,
main.page-light .sidebar-post-date,
main.page-light .sidebar-cta p {
  color: var(--color-brown-light);
}

main.page-light .article-tag {
  background-color: rgba(160, 120, 48, 0.14);
  color: var(--color-gold-deep);
}

main.page-light .sidebar-block {
  background-color: rgba(255, 253, 248, 0.72);
  border-color: rgba(160, 120, 48, 0.28);
}

main.page-light .sidebar-block-title,
main.page-light .sidebar-post-title {
  color: var(--color-brown-dark);
}

main.page-light .article-footer {
  border-top-color: rgba(160, 120, 48, 0.25);
}

main.page-light .article-back {
  color: var(--color-gold-deep);
}

/* ─── Tlačidlá na svetlom podklade ───────────────────────────── */

main.page-light .btn-ghost {
  color: var(--color-brown-dark);
  border-color: rgba(92, 58, 30, 0.4);
}

main.page-light .btn-ghost:hover {
  color: var(--color-gold-deep);
  border-color: var(--color-gold-deep);
  background-color: rgba(201, 150, 60, 0.1);
}

/* CTA bánery ostávajú tmavé — sú to kotvy značky.
   Na svetlej stránke ich držíme v hnedej, nie v zelenej. */
main.page-light .booking-cta,
main.page-light .about-cta {
  background:
    linear-gradient(135deg,
      var(--color-brown-dark) 0%,
      var(--color-brown-mid) 45%,
      #3d2a12 75%,
      var(--color-brown-dark) 100%);
}

main.page-light .booking-cta h2,
main.page-light .about-cta h2 {
  color: var(--color-gold-pale);
}

main.page-light .booking-cta p,
main.page-light .booking-cta-sub,
main.page-light .about-cta p {
  color: var(--text-secondary);
}