/*
Theme Name: Kapadokya Hello Child
Theme URI: https://kapadokya-muc.de/
Description: Child-Theme für Kapadokya Pide & Grill auf Basis von Hello Elementor — dunkles Design nach Claude-Design-Übergabepaket.
Author: Kapadokya Pide & Grill
Template: hello-elementor
Version: 2.0.0
Text Domain: kapadokya-hello-child
*/

/* ========== 1. Design-Tokens (aus brand-overrides.css des Übergabepakets) ========== */
:root {
  --kap-bg: #141110;
  --kap-surface: #211c19;
  --kap-text: #f2ede7;
  --kap-accent: #ec8b21;
  --kap-accent-100: #fff2e0;
  --kap-accent-200: #ffe0ba;
  --kap-accent-300: #fcc17c;
  --kap-accent-400: #f5a447;
  --kap-accent-600: #c66f15;
  --kap-accent-900: #402307;
  --kap-accent2: #d94a2e;
  --kap-accent2-400: #ec6f52;
  --kap-neutral-100: #f6f1ea;
  --kap-neutral-300: #d1c8bd;
  --kap-neutral-400: #b3aa9e;
  --kap-neutral-500: #948b80;
  --kap-neutral-700: #59524a;
  --kap-neutral-800: #3e3831;
  --kap-neutral-900: #28231e;
  --kap-section: #571f10;
  --kap-section-glow: #78301a;
  --kap-divider: color-mix(in srgb, #f2ede7 16%, transparent);
  --kap-divider-soft: color-mix(in srgb, #f2ede7 9%, transparent);
  --kap-text-70: color-mix(in srgb, #f2ede7 70%, transparent);
  --kap-text-62: color-mix(in srgb, #f2ede7 62%, transparent);
  --kap-text-55: color-mix(in srgb, #f2ede7 55%, transparent);
  --kap-wa: #25d366;
  --kap-wa-dark: #1fbd5b;
  --kap-radius: 8px;
  --kap-shadow-md: 0 0 0 1px #59524a, 0 6px 18px rgba(0,0,0,.55);
  --kap-width: 1180px;
  --kap-font: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --kap-font-display: "Dancing Script", "Brush Script MT", cursive;
}

/* ========== 2. Basis ========== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--kap-font);
  font-size: 15.5px;
  line-height: 1.75;
  color: var(--kap-text);
  background:
    radial-gradient(1200px 720px at 82% -160px, color-mix(in srgb, var(--kap-accent-900) 75%, transparent), transparent 60%),
    radial-gradient(1100px 800px at -10% 100%, color-mix(in srgb, black 30%, transparent), transparent 55%),
    var(--kap-bg);
  text-wrap: pretty;
}
h1, h2, h3, h4 { font-family: var(--kap-font); font-weight: 500; line-height: 1.2; letter-spacing: -0.012em; color: var(--kap-text); }
h1 { font-family: var(--kap-font-display); font-weight: 700; font-size: clamp(46px, 7vw, 92px); line-height: 1.08; letter-spacing: 0; }
h2 { font-family: var(--kap-font-display); font-weight: 700; font-size: clamp(34px, 4.5vw, 54px); letter-spacing: 0; }
a { color: var(--kap-accent-300); }
a:hover, a:focus-visible { color: var(--kap-accent); }
:focus-visible { outline: 2px solid var(--kap-accent); outline-offset: 2px; }
img { max-width: 100%; height: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.screen-reader-text:focus { position: fixed; z-index: 100000; top: 12px; left: 12px; width: auto; height: auto; padding: 12px 16px; clip: auto; background: var(--kap-surface); color: var(--kap-text); }
.kap-wrap { width: min(calc(100% - 40px), var(--kap-width)); margin-inline: auto; }
::selection { background: var(--kap-accent-600); color: var(--kap-accent-100); }

/* ========== 3. Buttons ========== */
.kap-btn, .kap-order {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 20px;
  border: 1px solid var(--kap-accent); border-radius: var(--kap-radius);
  background: transparent; color: var(--kap-accent);
  font-family: var(--kap-font); font-size: 15px; font-weight: 500;
  text-decoration: none; white-space: nowrap; cursor: pointer;
}
.kap-btn:hover, .kap-btn:focus-visible, .kap-order:hover, .kap-order:focus-visible {
  border-color: var(--kap-accent-400); color: var(--kap-accent-400);
}
.kap-btn-ghost { border-color: var(--kap-neutral-700); color: var(--kap-text-70); }
.kap-btn-ghost:hover, .kap-btn-ghost:focus-visible { border-color: var(--kap-accent); color: var(--kap-accent); }
.kap-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; flex: none;
  border: 1px solid var(--kap-neutral-700); border-radius: var(--kap-radius);
  color: var(--kap-text-70); text-decoration: none; background: transparent;
}
.kap-icon-btn:hover, .kap-icon-btn:focus-visible { border-color: var(--kap-accent); color: var(--kap-accent); }
.kap-icon-btn svg { width: 20px; height: 20px; }

/* ========== 4. Header / Navigation ========== */
.kap-site-header { position: relative; z-index: 1000; background: color-mix(in srgb, var(--kap-bg) 92%, transparent); border-bottom: 1px solid var(--kap-divider); }
.kap-header-inner { min-height: 84px; display: flex; align-items: center; gap: 20px; }
.kap-brand { display: inline-flex; align-items: center; flex: 0 0 auto; text-decoration: none; color: var(--kap-text); }
.kap-brand img, .kap-brand .custom-logo { display: block; width: auto; max-width: 190px; max-height: 60px; }
.kap-brand-name { font-weight: 500; font-size: 1.15rem; letter-spacing: -0.01em; }
.kap-nav { margin-left: auto; }
.kap-nav-list { display: flex; align-items: center; gap: 4px; padding: 0; margin: 0; list-style: none; }
.kap-nav-list a { display: block; padding: 12px 13px; color: var(--kap-text-70); font-weight: 400; font-size: 15px; text-decoration: none; border-radius: 6px; }
.kap-nav-list a:hover, .kap-nav-list a:focus-visible { color: var(--kap-accent); background: transparent; }
.kap-nav-list .current-menu-item > a, .kap-nav-list [aria-current="page"] { color: var(--kap-accent); }
.kap-menu-toggle { display: none; width: 44px; height: 44px; padding: 10px; border: 1px solid var(--kap-neutral-700); border-radius: 6px; background: transparent; color: var(--kap-text); cursor: pointer; }
.kap-menu-toggle span:not(.screen-reader-text) { display: block; height: 2px; margin: 5px 0; background: currentColor; }

/* ========== 5. Footer ========== */
.kap-site-footer { background: color-mix(in srgb, black 25%, var(--kap-bg)); border-top: 1px solid var(--kap-divider); color: var(--kap-text-70); }
.kap-footer-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 44px; padding-block: 54px 38px; }
.kap-site-footer h2 { margin: 0 0 16px; color: var(--kap-text); font-family: var(--kap-font); font-size: 1.05rem; font-weight: 600; letter-spacing: 0; }
.kap-site-footer p { margin: 0 0 9px; color: var(--kap-text-70); }
.kap-site-footer a { color: var(--kap-accent-300); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.kap-site-footer a:hover { color: var(--kap-accent); }
.kap-footer-links, .kap-social-links { display: flex; flex-wrap: wrap; gap: 10px 16px; padding: 0; margin: 0; list-style: none; }
.kap-social-links { margin-top: 18px; }
.kap-social-links a { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 7px 12px; border: 1px solid var(--kap-neutral-700); border-radius: 6px; text-decoration: none; color: var(--kap-text-70); }
.kap-social-links a:hover { border-color: var(--kap-accent); color: var(--kap-accent); }
.kap-route { display: inline-flex; margin-top: 9px; font-weight: 500; }
.kap-footer-bottom { padding-block: 18px; border-top: 1px solid var(--kap-divider-soft); color: var(--kap-text-55); font-size: .9rem; }

/* ========== 6. Schwebende Anruf-/WhatsApp-Buttons ========== */
.kap-float { position: fixed; right: 20px; bottom: 20px; z-index: 900; display: flex; flex-direction: column; gap: 12px; }
.kap-float a { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; text-decoration: none; box-shadow: 0 6px 18px rgba(0,0,0,.55); }
.kap-float a svg { width: 28px; height: 28px; }
.kap-float-phone { background: var(--kap-accent); color: #1a1512; }
.kap-float-phone:hover, .kap-float-phone:focus-visible { background: var(--kap-accent-400); color: #1a1512; }
.kap-float-wa { background: var(--kap-wa); color: #fff; }
.kap-float-wa:hover, .kap-float-wa:focus-visible { background: var(--kap-wa-dark); color: #fff; }
@media print { .kap-float { display: none; } }

/* ========== 7. Allgemeine Sektionen / Bausteine (Startseite u. a.) ========== */
.kap-section { padding-block: clamp(48px, 8vw, 96px); }
.kap-kicker { font-size: 13px; line-height: 1.1; letter-spacing: .06em; text-transform: uppercase; color: var(--kap-accent); margin: 0 0 14px; font-weight: 500; }
.kap-lead { color: var(--kap-text-70); max-width: 52ch; }

/* Öffnungszeiten-Band */
.kap-band { background: radial-gradient(900px 420px at 50% -120px, var(--kap-section-glow), transparent 70%), var(--kap-section); border-block: 1px solid var(--kap-divider-soft); }
.kap-band-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 32px; padding-block: clamp(40px, 6vw, 64px); }
.kap-band-num { font-size: clamp(19px, 2.3vw, 33px); font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; color: var(--kap-text); margin: 0; white-space: nowrap; }
.kap-band-sub { font-size: 13px; letter-spacing: .05em; text-transform: uppercase; color: color-mix(in srgb, var(--kap-text) 64%, transparent); margin: 8px 0 0; }
.kap-band a { color: inherit; text-decoration: none; }

/* Karten (Klassiker) */
.kap-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 28px; }
.kap-card { display: flex; flex-direction: column; gap: 12px; }
.kap-card img { aspect-ratio: 1; object-fit: cover; border-radius: var(--kap-radius); }
.kap-card-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.kap-card-row h3 { margin: 0; font-size: 17px; font-weight: 500; }
.kap-card-price { color: var(--kap-accent-300); font-feature-settings: 'tnum' 1; white-space: nowrap; }
.kap-card p { margin: 0; font-size: 13.5px; line-height: 20px; color: var(--kap-text-62); }

/* Zweispalter (Hero, Über uns, Kontakt) */
.kap-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: clamp(28px, 5vw, 64px); align-items: center; }
.kap-split img { border-radius: var(--kap-radius); }
.kap-hero-img img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }

/* Trennlinien mit Auslauf */
.kap-rule { height: 1px; border: 0; margin: 0; background: linear-gradient(to right, var(--kap-divider) calc(100% - 48px), transparent); }

/* Formulare (dunkel) */
.kap-form input[type="text"], .kap-form input[type="email"], .kap-form input[type="tel"], .kap-form textarea,
.wp-block-group input[type="text"], .wp-block-group input[type="email"], .wp-block-group input[type="tel"], .wp-block-group textarea {
  width: 100%; padding: 11px 14px; border: 1px solid var(--kap-neutral-700); border-radius: var(--kap-radius);
  background: color-mix(in srgb, var(--kap-surface) 80%, transparent); color: var(--kap-text);
  font-family: var(--kap-font); font-size: 15px;
}
.kap-form input:focus, .kap-form textarea:focus { border-color: var(--kap-accent); outline: none; }
.kap-form label { font-size: 13.5px; color: var(--kap-text-70); }
.kap-form input[type="submit"], .kap-form button[type="submit"] {
  min-height: 44px; padding: 10px 20px; border: 1px solid var(--kap-accent); border-radius: var(--kap-radius);
  background: transparent; color: var(--kap-accent); font-family: var(--kap-font); font-size: 15px; font-weight: 500; cursor: pointer;
}
.kap-form input[type="submit"]:hover, .kap-form button[type="submit"]:hover { border-color: var(--kap-accent-400); color: var(--kap-accent-400); }

/* Karte (OSM) */
.kap-map iframe { width: 100%; min-height: 380px; border: 0; border-radius: var(--kap-radius); filter: grayscale(1) invert(0.92) hue-rotate(180deg) contrast(0.88); }

/* Galerie (Masonry) */
.kap-masonry { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); grid-auto-rows: 220px; grid-auto-flow: dense; gap: 16px; }
.kap-masonry figure { margin: 0; overflow: hidden; border-radius: var(--kap-radius); }
.kap-masonry figure.kap-tall { grid-row: span 2; }
.kap-masonry img { width: 100%; height: 100%; object-fit: cover; }

/* ========== 8. Speisekarte ========== */
.kap-menu { max-width: 760px; margin-inline: auto; padding: 0 clamp(16px, 4vw, 40px) 98px; }
.kap-menu-toolbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  padding: 12px 0; margin-bottom: 4px;
  background: color-mix(in srgb, var(--kap-bg) 88%, transparent);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--kap-divider);
}
.kap-lang { display: inline-flex; border: 1px solid var(--kap-neutral-700); border-radius: var(--kap-radius); overflow: hidden; }
.kap-lang button { border: 0; cursor: pointer; padding: 8px 16px; font-family: var(--kap-font); font-size: 13px; letter-spacing: .04em; background: transparent; color: var(--kap-text-70); }
.kap-lang button:hover { color: var(--kap-accent); }
.kap-lang button[aria-pressed="true"] { background: var(--kap-accent-900); color: var(--kap-accent-100); }
.kap-chips { display: flex; gap: 6px; overflow-x: auto; max-width: 100%; scrollbar-width: none; }
.kap-chips::-webkit-scrollbar { display: none; }
.kap-chips a { text-decoration: none; white-space: nowrap; font-size: 13px; padding: 6px 12px; border: 1px solid var(--kap-neutral-700); border-radius: 999px; color: color-mix(in srgb, var(--kap-text) 78%, transparent); }
.kap-chips a:hover, .kap-chips a:focus-visible { border-color: var(--kap-accent); color: var(--kap-accent); }

.kap-menu section { padding: 56px 0 14px; scroll-margin-top: 76px; }
.kap-cat-head { display: flex; align-items: baseline; gap: 14px; }
.kap-cat-head h2 { font-size: clamp(30px, 3.8vw, 42px); line-height: 1.15; margin: 0; }
.kap-cat-head .kap-rule { flex: 1; }
.kap-cat-note { font-size: 13.5px; line-height: 20px; color: var(--kap-text-62); margin: 10px 0 0; }

.kap-dish { display: flex; gap: 16px; align-items: flex-start; padding: 16px 0; border-bottom: 1px solid var(--kap-divider-soft); }
.kap-dish-media { margin: 0; flex: none; }
.kap-dish-media img { width: 84px; height: 84px; object-fit: cover; border-radius: var(--kap-radius); display: block; }
.kap-dish-body { flex: 1; min-width: 0; }
.kap-dish-head { display: flex; align-items: baseline; gap: 10px; }
.kap-dish-nr { font-size: 12px; color: var(--kap-accent); font-feature-settings: 'tnum' 1; flex: none; }
.kap-dish-head h3 { font-size: 16.5px; line-height: 24px; font-weight: 500; margin: 0; }
.kap-dish-codes { font-size: 10.5px; color: var(--kap-text-55); vertical-align: super; letter-spacing: .03em; margin-left: 4px; }
.kap-dish-desc { font-size: 13.5px; line-height: 20px; color: var(--kap-text-62); margin: 4px 0 0; max-width: 48ch; }
.kap-dish-prices { flex: none; text-align: right; display: flex; flex-direction: column; gap: 4px; }
.kap-price-row { display: flex; gap: 8px; justify-content: flex-end; align-items: baseline; }
.kap-price-label { font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: color-mix(in srgb, var(--kap-text) 50%, transparent); }
.kap-price { font-size: 15px; font-feature-settings: 'tnum' 1; color: var(--kap-accent-300); white-space: nowrap; }

.kap-menu-notes { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--kap-divider); }
.kap-menu-notes p { font-size: 13px; line-height: 20px; color: var(--kap-text-55); margin: 0 0 10px; }
.kap-menu-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }

/* Sprachumschaltung: Inhalte je Sprache */
.kap-menu .kap-l { display: none; }
.kap-menu[data-lang="de"] .kap-l-de { display: revert; }
.kap-menu[data-lang="tr"] .kap-l-tr { display: revert; }
.kap-menu[data-lang="en"] .kap-l-en { display: revert; }

/* ========== 9. Inhalte / Gutenberg-Anpassungen dunkel ========== */
.site-main { min-height: 40vh; }
.site-main > .kap-wrap > *:first-child { margin-top: clamp(36px, 6vw, 70px); }
.wp-block-image img { border-radius: var(--kap-radius); }
.wp-block-separator { border-color: var(--kap-divider); }
.wp-block-quote { border-left: 3px solid var(--kap-accent); color: var(--kap-text-70); }
.wp-block-table td, .wp-block-table th { border-color: var(--kap-divider); }
.wp-block-button__link { border-radius: var(--kap-radius); }

/* Seiteninhalt-Grundabstand für normale Seiten */
.kap-page { padding-block: clamp(36px, 6vw, 70px) 98px; }
.kap-page-narrow { max-width: 760px; margin-inline: auto; }

/* ========== 10. Responsive ========== */
@media (max-width: 900px) {
  .kap-header-inner { min-height: 74px; flex-wrap: wrap; gap: 12px; padding-block: 8px; }
  .kap-brand img, .kap-brand .custom-logo { max-width: 150px; max-height: 52px; }
  .kap-menu-toggle { display: block; margin-left: auto; }
  .kap-header-inner > .kap-order, .kap-header-inner > .kap-icon-btn { display: none; }
  .kap-nav { display: none; order: 4; width: 100%; margin: 0; padding-bottom: 10px; }
  .kap-nav.is-open { display: block; }
  .kap-nav-list { display: grid; gap: 2px; }
  .kap-nav-list a { padding: 13px 10px; }
  .kap-nav-list .kap-mobile-order a { margin-top: 6px; border: 1px solid var(--kap-accent); color: var(--kap-accent); text-align: center; border-radius: var(--kap-radius); }
  .kap-footer-grid { grid-template-columns: 1fr 1fr; gap: 34px; }
}
@media (max-width: 620px) {
  .kap-wrap { width: min(calc(100% - 28px), var(--kap-width)); }
  .kap-footer-grid { grid-template-columns: 1fr; padding-block: 42px 30px; }
  .kap-dish { gap: 12px; }
  .kap-dish-media img { width: 64px; height: 64px; }
  .kap-float { right: 14px; bottom: 14px; }
  .kap-float a { width: 52px; height: 52px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* ========== 11. Doppelten Bestell-Link in der Navigation ausblenden (Desktop: nur der Button rechts) ========== */
@media (min-width: 901px) {
  .kap-nav-list a[href*="order.dish.co"] { display: none; }
}
@media (max-width: 900px) {
  .kap-nav-list a[href*="order.dish.co"] { margin-top: 6px; border: 1px solid var(--kap-accent); color: var(--kap-accent); text-align: center; border-radius: var(--kap-radius); }
}

/* ========== 12. Unterstreichungen der WP-Global-Styles auf interaktiven Elementen neutralisieren ========== */
.kap-btn, .kap-order, .kap-icon-btn, .kap-nav-list a, .kap-chips a, .kap-social-links a, .kap-float a, .kap-band a, .kap-brand {
  text-decoration: none !important;
}

/* ========== 13. Hero mit Foto-Hintergrund ========== */
.kap-hero-cover { position: relative; border-bottom: 1px solid var(--kap-divider-soft); background-size: cover; background-position: center; }
.kap-hero-cover > .kap-wrap { min-height: clamp(440px, 62vh, 660px); display: flex; flex-direction: column; justify-content: center; padding-block: 72px; }
.kap-hero-cover .kap-lead { text-shadow: 0 1px 12px rgba(0,0,0,.6); }
.kap-hero-cover h1 { text-shadow: 0 2px 18px rgba(0,0,0,.65); }

/* ========== 14. Social-Icon-Buttons im Footer ========== */
.kap-social-links a { width: 44px; padding: 7px; }
.kap-social-links a svg { width: 20px; height: 20px; }

/* ========== 15. Cookie-Banner (Complianz) im Website-Design ========== */
.cmplz-cookiebanner {
  background-color: #211c19 !important;
  color: var(--kap-text) !important;
  border: 1px solid var(--kap-neutral-800) !important;
  border-radius: var(--kap-radius) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.65) !important;
  font-family: var(--kap-font) !important;
}
.cmplz-cookiebanner .cmplz-title,
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-header,
.cmplz-cookiebanner .cmplz-category-header,
.cmplz-cookiebanner .cmplz-description-statistics,
.cmplz-cookiebanner p { color: var(--kap-text) !important; background: transparent !important; }
.cmplz-cookiebanner .cmplz-divider { border-color: var(--kap-divider-soft) !important; }
.cmplz-cookiebanner .cmplz-btn {
  border-radius: var(--kap-radius) !important;
  border: 1px solid var(--kap-neutral-700) !important;
  background-color: transparent !important;
  color: var(--kap-text-70) !important;
  font-family: var(--kap-font) !important;
}
.cmplz-cookiebanner .cmplz-btn:hover { border-color: var(--kap-accent) !important; color: var(--kap-accent) !important; }
.cmplz-cookiebanner .cmplz-btn.cmplz-accept {
  background-color: var(--kap-accent) !important;
  border-color: var(--kap-accent) !important;
  color: #1a1512 !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover { background-color: var(--kap-accent-400) !important; border-color: var(--kap-accent-400) !important; }
.cmplz-cookiebanner .cmplz-links a, .cmplz-cookiebanner a { color: var(--kap-accent-300) !important; }
.cmplz-cookiebanner .cmplz-close { color: var(--kap-text) !important; }

/* ========== 16. Volle Breite für Band und Hero (Container-Begrenzung aufheben) ========== */
body { overflow-x: hidden; }
.kap-band, .kap-hero-cover { width: 100vw; margin-left: calc(50% - 50vw); }
