/**
 * Marlu Shop - Complete Frontend Stylesheet (1:1 with Simulator)
 * Vizuálna identita slovencina.org, Google Fonts Poppins, reset pre Elementor/Témy a responzívny layout.
 */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');

/* TYPOGRAFIA A BRAND IDENTITA SLOVENCINA.ORG */
:root {
  --brand-teal: #1bb4b9;
  --brand-teal-dark: #15989d;
  --brand-teal-light: #eaf7f8;
  --brand-gold: #f5b120;
  --brand-text: #324a6d;
  --brand-heading: #1d2939;
  --brand-border: #e2e8f0;
}

/* Striktné obmedzenie Poppins a farieb IBA na koreň aplikácie Marlu Shop a jej modálne okná */
.marlu-shop-app-root,
.marlu-shop-app-root *,
.marlu-shop-app-root *::before,
.marlu-shop-app-root *::after,
.marlu-shop-modal-wrap,
.marlu-shop-modal-wrap *,
.marlu-shop-modal-wrap *::before,
.marlu-shop-modal-wrap *::after,
div[id*="modal"],
div[id*="modal"] *,
div[id*="modal"] *::before,
div[id*="modal"] *::after {
  box-sizing: border-box !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-style: normal !important;
  color-scheme: light !important;
  forced-color-adjust: none !important;

  /* Tailwind CSS preflight premenné pre dokonalé halo (ring) a tiene (shadow) zo simulátora */
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(27 180 185 / 0.18);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
}

/* Scoped Preflight pre Marlu Shop prvky s nulovou špecificitou (:where), aby neprepisoval Tailwind utility triedy */
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) * {
  border-width: 0;
  border-style: solid;
  border-color: #e2e8f0;
}

:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) button {
  font-family: inherit;
  font-size: 100%;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
  cursor: pointer;
  text-transform: none;
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
  border-style: solid;
  border-width: 0;
}

:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) button:focus {
  outline: none;
}

/* Scoped Preflight pre nadpisy a odseky (nulový margin ako v čistom Tailwind CSS) */
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) :where(h1, h2, h3, h4, h5, h6, p, ul, ol, figure) {
  margin: 0;
}

/* ==========================================================================
   KOMPLETNÁ OCHRANA PRED PREPISOVANÍM TÉMOU HELLO ELEMENTOR
   Hello Elementor reset.css nanucuje: [type=button], [type=submit], button { border: 1px solid #c36; border-radius: 3px; color: #c36; }
   Tento blok kompletne zamedzuje presakovaniu červených rámikov (#c36) a 3px zaoblenia do celého pluginu.
   ========================================================================== */
.marlu-shop-app-root button:not([class*="border-"]),
.marlu-shop-app-root [type="button"]:not([class*="border-"]),
.marlu-shop-app-root [type="submit"]:not([class*="border-"]),
.marlu-shop-modal-wrap button:not([class*="border-"]),
.marlu-shop-modal-wrap [type="button"]:not([class*="border-"]),
.marlu-shop-modal-wrap [type="submit"]:not([class*="border-"]),
div[id*="modal"] button:not([class*="border-"]),
div[id*="modal"] [type="button"]:not([class*="border-"]),
div[id*="modal"] [type="submit"]:not([class*="border-"]),
#marlu-shop-frontend-root button:not([class*="border-"]),
#marlu-shop-frontend-root [type="button"]:not([class*="border-"]),
#marlu-shop-frontend-root [type="submit"]:not([class*="border-"]) {
  border: none !important;
  outline: none !important;
}

/* Počítadlo kusov – tlačidlá - a + */
.marlu-shop-app-root button[onclick*="updateQty"],
.marlu-shop-app-root div:has(> [id^="qty-"]) button {
  border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Ochrana tvarov zaoblenia pred prepísaním témou (Hello Elementor nanucuje border-radius: 3px) */
.marlu-shop-app-root .rounded-xl,
.marlu-shop-modal-wrap .rounded-xl,
#marlu-shop-frontend-root .rounded-xl,
div[id*="modal"] .rounded-xl,
div[id*="-modal"] .rounded-xl,
#dedication-modal .rounded-xl {
  border-radius: 0.75rem !important;
}
.marlu-shop-app-root .rounded-2xl,
.marlu-shop-modal-wrap .rounded-2xl,
#marlu-shop-frontend-root .rounded-2xl,
div[id*="modal"] .rounded-2xl,
div[id*="-modal"] .rounded-2xl,
#dedication-modal .rounded-2xl {
  border-radius: 1rem !important;
}
.marlu-shop-app-root .rounded-3xl,
.marlu-shop-modal-wrap .rounded-3xl,
#marlu-shop-frontend-root .rounded-3xl,
div[id*="modal"] .rounded-3xl,
div[id*="-modal"] .rounded-3xl,
#dedication-modal .rounded-3xl {
  border-radius: 1.5rem !important;
}
.marlu-shop-app-root .rounded-lg,
.marlu-shop-modal-wrap .rounded-lg,
#marlu-shop-frontend-root .rounded-lg,
div[id*="modal"] .rounded-lg,
div[id*="-modal"] .rounded-lg,
#dedication-modal .rounded-lg {
  border-radius: 0.5rem !important;
}
.marlu-shop-app-root .rounded-full,
.marlu-shop-modal-wrap .rounded-full,
#marlu-shop-frontend-root .rounded-full,
div[id*="modal"] .rounded-full,
div[id*="-modal"] .rounded-full,
#dedication-modal .rounded-full {
  border-radius: 9999px !important;
}

/* Ochrana labelov pred Elementor Kit 7 (ten nanucuje text-transform: capitalize, font-style: italic a font-weight: 400) */
.marlu-shop-app-root label,
.marlu-shop-modal-wrap label,
#marlu-shop-frontend-root label,
div[id*="modal"] label,
div[id*="-modal"] label,
#dedication-modal label {
  text-transform: none !important;
  font-style: normal !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  letter-spacing: normal !important;
}

.marlu-shop-app-root label.font-bold,
.marlu-shop-modal-wrap label.font-bold,
#marlu-shop-frontend-root label.font-bold,
div[id*="modal"] label.font-bold,
div[id*="-modal"] label.font-bold,
#dedication-modal label.font-bold {
  font-weight: 700 !important;
}

/* Skrytie prázdnych odsekov generovaných WordPress wpautop filtrom */
.marlu-shop-app-root p:empty,
.marlu-shop-modal-wrap p:empty,
#marlu-shop-frontend-root p:empty,
div[id*="modal"] p:empty,
div[id*="-modal"] p:empty,
#dedication-modal p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}



/* Formulárové prvky vnútri pluginu (s nulovou špecificitou pre nerušené fungovanie Tailwind tried) */
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) input,
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) select,
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) textarea {
  color-scheme: light;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  text-transform: none;
}

:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) input:not([type="checkbox"]):not([type="radio"]),
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) select,
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) textarea {
  background-color: #ffffff;
  color: #0f172a;
  border: 1px solid #cbd5e1;
}

:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) input::placeholder,
:where(.marlu-shop-app-root, .marlu-shop-modal-wrap, div[id*="modal"]) textarea::placeholder {
  color: #94a3b8;
}

/* Custom scrollbary */
.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* DYNAMICKÉ CENTROVANIE A ŠÍRKA KARIET PRODUKTOV V KATALÓGU */
#products-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem;
}

/* 1 produkt: vycentrovaná 1 karta, primeraná maximálna šírka */
.catalog-card-single {
  width: 100%;
  max-width: 420px;
}

/* 2 produkty: 2 vycentrované karty vedľa seba s rovnakými okrajmi po bokoch */
.catalog-card-double {
  width: 100%;
  max-width: 440px;
}
@media (min-width: 640px) {
  .catalog-card-double {
    width: calc(50% - 0.75rem);
  }
}

/* 3 a viac produktov: 3 stĺpce na desktope, 2 na tablete, neúplný riadok (napr. 4. karta) je vycentrovaný */
.catalog-card-multi {
  width: 100%;
  max-width: 380px;
}
@media (min-width: 640px) {
  .catalog-card-multi {
    width: calc(50% - 0.75rem);
  }
}
@media (min-width: 1024px) {
  .catalog-card-multi {
    width: calc(33.333% - 1rem);
  }
}

/* Prevencia nežiaducej kapitalizácie z Elementoru */
.marlu-shop-app-root,
.marlu-shop-app-root label,
.marlu-shop-app-root p,
.marlu-shop-app-root span,
.marlu-shop-app-root h1,
.marlu-shop-app-root h2,
.marlu-shop-app-root h3,
.marlu-shop-app-root h4,
.marlu-shop-app-root h5,
.marlu-shop-app-root h6 {
  text-transform: none !important;
}

.marlu-shop-app-root .uppercase {
  text-transform: uppercase !important;
}

/* Povoliť kurzívu výhradne pre elementy s triedou .italic */
.marlu-shop-app-root .italic,
.marlu-shop-modal-wrap .italic,
div[id*="modal"] .italic {
  font-style: italic !important;
}

/* Odkazy a tlačidlá súhlasov a podmienok (1:1 so simulátorom, neutralizácia témy Elementor) */
.marlu-shop-app-root a,
.marlu-shop-modal-wrap a,
div[id*="modal"] a {
  color: #1bb4b9 !important;
  text-decoration: underline !important;
  font-style: normal !important;
}

.marlu-shop-app-root a:hover,
.marlu-shop-modal-wrap a:hover,
div[id*="modal"] a:hover {
  color: #15989d !important;
}

/* Tlačidlá obchodných podmienok, VOP, GDPR a Reklamácií vo formulári */
.marlu-shop-app-root #order-form label button,
#order-form label button {
  display: inline !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #1bb4b9 !important;
  font-size: inherit !important;
  font-weight: 700 !important;
  font-style: normal !important;
  text-decoration: underline !important;
  line-height: inherit !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.marlu-shop-app-root #order-form label button:hover,
#order-form label button:hover {
  color: #15989d !important;
}

/* Zaškrtávacie políčka a prepínače dopravy a platieb */
.marlu-shop-app-root input[type="checkbox"],
.marlu-shop-app-root input[type="radio"] {
  width: 1rem !important;
  height: 1rem !important;
  accent-color: #1bb4b9 !important;
  cursor: pointer !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 0.25rem !important;
  margin-top: 0.125rem !important;
  flex-shrink: 0 !important;
}

.marlu-shop-app-root input[type="radio"] {
  border-radius: 9999px !important;
}

/* Hlavné objednávacie tlačidlo (Submit Button) */
.marlu-shop-app-root #submit-btn,
#submit-btn {
  background-color: #1bb4b9 !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.025em !important;
  cursor: pointer !important;
  border: none !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
  white-space: normal !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  text-align: center !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  line-height: 1.35 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 16px !important;
}

.marlu-shop-app-root #submit-btn > span,
#submit-btn > span {
  display: inline-block !important;
  text-align: center !important;
  line-height: 1.3 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
}

@media (max-width: 640px) {
  .marlu-shop-app-root #submit-btn,
  #submit-btn {
    font-size: 12px !important;
    padding: 12px 10px !important;
    letter-spacing: 0 !important;
    gap: 6px !important;
    line-height: 1.25 !important;
  }
  .marlu-shop-app-root #submit-btn svg,
  #submit-btn svg {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
  }
}

.marlu-shop-app-root #submit-btn:hover:not(:disabled),
#submit-btn:hover:not(:disabled) {
  background-color: #148f93 !important;
  color: #ffffff !important;
  border: none !important;
}

.marlu-shop-app-root #submit-btn:disabled,
#submit-btn:disabled {
  background-color: #1bb4b9 !important;
  color: #ffffff !important;
  opacity: 0.65 !important;
  cursor: not-allowed !important;
  border: none !important;
  border-radius: 0.75rem !important;
  box-shadow: none !important;
}

/* Tlačidlá na obrazovke potvrdenia objednávky (Thank you view) */
#frontend-thankyou-buttons button,
#frontend-thankyou-view button {
  border: none !important;
  outline: none !important;
}

#frontend-thankyou-buttons button:first-child {
  background-color: #1bb4b9 !important;
  color: #ffffff !important;
  border-radius: 0.75rem !important;
}

#frontend-thankyou-buttons button:first-child:hover {
  background-color: #15989d !important;
  color: #ffffff !important;
}

#frontend-thankyou-buttons button:last-child {
  background-color: #f1f5f9 !important;
  color: #334155 !important;
  border-radius: 0.75rem !important;
}

#frontend-thankyou-buttons button:last-child:hover {
  background-color: #e2e8f0 !important;
  color: #1e293b !important;
}

/* Hero Banner zarovnanie doľava podľa simulátora */
.marlu-shop-app-root #hero-banner-title,
.marlu-shop-app-root #hero-promo-text,
.marlu-shop-app-root #hero-banner-tag {
  text-align: left !important;
}

.marlu-shop-app-root #hero-banner-tag {
  display: inline-flex !important;
  margin-right: auto !important;
}

/* ==========================================================================
   OCHRANA TLAČIDIEL PRED ELEMENTOR KIT-7 (:hover, :focus, :active)
   Elementor Kit nanucuje .elementor-kit-7 button:hover, button:focus { color: #1BB4B9; }
   Toto spôsobovalo, že text tlačidiel v spodnej tyrkysovej lište po kliknutí/prechode myšou
   zmenil farbu na tyrkysovú (#1BB4B9), čím splynul s tyrkysovým pozadím lišty.
   ========================================================================== */

/* Spodná CTA lišta v detaile produktu (Späť na ponuku + Prejsť k objednávke) */
.marlu-shop-app-root .bg-gradient-to-r button,
#marlu-shop-frontend-root .bg-gradient-to-r button {
  outline: none !important;
  box-shadow: none !important;
}

/* 1. Tlačidlo "← Späť na ponuku" */
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="closeProductDetail"],
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="closeProductDetail"] {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.2) !important;
  border: none !important;
  border-radius: 0.75rem !important;
}
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:hover,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:focus,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:active,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:hover,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:focus,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="closeProductDetail"]:active {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.35) !important;
  text-decoration: none !important;
}

/* 2. Žlté CTA tlačidlo "🛒 Prejsť k objednávke" v spodnej lište */
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="orderFromDetail"],
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="openWaitlistModal"],
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="orderFromDetail"],
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="openWaitlistModal"] {
  color: #020617 !important; /* text-slate-950 */
  background-color: #f5b120 !important;
  border: none !important;
  border-radius: 0.75rem !important;
}
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:hover,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:focus,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:hover,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:focus,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:hover,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:focus,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:hover,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:focus {
  color: #020617 !important;
  background-color: #e09e13 !important;
  text-decoration: none !important;
}
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:active,
.marlu-shop-app-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:active,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="orderFromDetail"]:active,
#marlu-shop-frontend-root .bg-gradient-to-r button[onclick*="openWaitlistModal"]:active {
  color: #020617 !important;
  background-color: #d18f0a !important;
  transform: scale(0.96) !important;
}

/* 3. Všeobecná ochrana farieb textu tlačidiel: biele a tmavé tlačidlá nikdy nesmú prebrať tyrkysový text od Elementoru */
.marlu-shop-app-root button.text-white:hover,
.marlu-shop-app-root button.text-white:focus,
.marlu-shop-app-root button.text-white:active,
#marlu-shop-frontend-root button.text-white:hover,
#marlu-shop-frontend-root button.text-white:focus,
#marlu-shop-frontend-root button.text-white:active {
  color: #ffffff !important;
}

.marlu-shop-app-root button.text-slate-950:hover,
.marlu-shop-app-root button.text-slate-950:focus,
.marlu-shop-app-root button.text-slate-950:active,
#marlu-shop-frontend-root button.text-slate-950:hover,
#marlu-shop-frontend-root button.text-slate-950:focus,
#marlu-shop-frontend-root button.text-slate-950:active {
  color: #020617 !important;
}

/* Horné tlačidlo návratu "← Späť na ponuku pomôcok" v detaile tovaru */
#frontend-detail-view button[onclick*="closeProductDetail"].bg-white {
  color: #324a6d !important;
}
#frontend-detail-view button[onclick*="closeProductDetail"].bg-white:hover,
#frontend-detail-view button[onclick*="closeProductDetail"].bg-white:focus {
  color: #1bb4b9 !important;
  background-color: #f8fafc !important;
}


/* Packeta vyberač a červené tlačidlá */
#packeta-selection-box button,
#selected-packeta-point button,
#packeta-widget-modal .bg-rose-600 {
  background-color: #dc2626 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}

#packeta-selection-box button:hover,
#selected-packeta-point button:hover {
  background-color: #b91c1c !important;
}

/* Autentická pätička Marlu Shop */
#frontend-site-footer button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.25rem !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  color: #334155 !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  font-style: normal !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

#frontend-site-footer button:hover {
  color: #1bb4b9 !important;
}

/* Skrytie duplicitnej žltej pätičky šablóny Elementor na stránkach e-shopu */
body:has(#marlu-shop-frontend-root) #site-footer,
body:has(#marlu-shop-frontend-root) footer.site-footer,
body:has(#marlu-shop-frontend-root) .site-footer {
  display: none !important;
}

/* Modálne okná */
.marlu-shop-app-root .fixed,
div[id*="-modal"],
div[id*="modal"] {
  z-index: 999999 !important;
}

/* ==========================================================================
   MODÁLNE OKNO OSOBNÉ VENOVANIE & PRVKY VENOVANIA V KATALÓGU (1:1 SO SIMULÁTOROM)
   ========================================================================== */

/* 1. Záhlavie a texty modálu venovania */
#dedication-modal .bg-gradient-to-r {
  background: linear-gradient(to right, #6b21a8, #7e22ce, #4338ca) !important;
  color: #ffffff !important;
}

#dedication-modal h3 {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 0 !important;
  text-transform: none !important;
  font-style: normal !important;
}

#dedication-modal p.text-purple-200,
#dedication-modal .text-purple-200 {
  color: #e9d5ff !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  text-transform: none !important;
  font-style: normal !important;
}

#dedication-modal button.text-2xl {
  background: transparent !important;
  border: none !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  padding: 4px !important;
}
#dedication-modal button.text-2xl:hover {
  color: #ffffff !important;
}

/* 2. Karta zhrnutia produktu v modále */
#dedication-modal #dedication-modal-prod-name {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
  text-transform: none !important;
}

#dedication-modal #dedication-modal-prod-qty {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  margin-top: 2px !important;
}

/* 3. Label a vstupné polia modálu venovania */
#dedication-modal label {
  text-transform: none !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  color: #1e293b !important;
}

#dedication-modal label span.text-purple-600 {
  color: #9333ea !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: none !important;
}

#dedication-modal input[type="text"],
#dedication-modal select {
  border-radius: 0.75rem !important; /* rounded-xl (12px) */
  border: 1px solid #d8b4fe !important; /* border-purple-300 */
  background-color: #ffffff !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #0f172a !important;
  padding: 8px 12px !important;
  box-shadow: none !important;
  outline: none !important;
  text-transform: none !important;
  font-style: normal !important;
}

#dedication-modal input[type="text"]:focus,
#dedication-modal select:focus {
  border-color: #a855f7 !important;
  box-shadow: 0 0 0 2px rgba(168, 85, 247, 0.4) !important;
  outline: none !important;
}

#dedication-modal input[type="text"]::placeholder {
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

/* 4. Zákonné poučenie v modále */
#dedication-modal .bg-amber-50 {
  background-color: #fffbeb !important;
  border: 1px solid #fde68a !important;
  border-radius: 1rem !important;
  color: #78350f !important;
  font-size: 10px !important;
  line-height: 1.45 !important;
}
#dedication-modal .bg-amber-50 strong {
  color: #78350f !important;
  font-weight: 700 !important;
}

/* 5. Tlačidlá v spodnej časti modálu */
#dedication-modal button[onclick*="closeDedicationModal"]:not(.text-2xl) {
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
  border-radius: 0.75rem !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
  transition: all 0.15s ease-in-out !important;
}
#dedication-modal button[onclick*="closeDedicationModal"]:not(.text-2xl):hover,
#dedication-modal button[onclick*="closeDedicationModal"]:not(.text-2xl):focus {
  background-color: #f8fafc !important;
  color: #0f172a !important;
  border-color: #94a3b8 !important;
}

#dedication-modal button[type="submit"] {
  background: linear-gradient(to right, #6b21a8, #4338ca) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0.75rem !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  padding: 10px 16px !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  transition: all 0.15s ease-in-out !important;
}
#dedication-modal button[type="submit"]:hover,
#dedication-modal button[type="submit"]:focus {
  background: linear-gradient(to right, #581c87, #3730a3) !important;
  color: #ffffff !important;
}
#dedication-modal button[type="submit"]:active {
  transform: scale(0.96) !important;
}

/* 6. Tlačidlá venovania na kartách produktov v katalógu a detaile tovaru */
.marlu-shop-app-root button[onclick*="openDedicationModal"],
#marlu-shop-frontend-root button[onclick*="openDedicationModal"],
#marlu-shop-container button[onclick*="openDedicationModal"],
#frontend-catalog-view button[onclick*="openDedicationModal"] {
  border-radius: 0.75rem !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

.marlu-shop-app-root button[onclick*="openDedicationModal"].bg-purple-50,
#marlu-shop-frontend-root button[onclick*="openDedicationModal"].bg-purple-50,
#marlu-shop-container button[onclick*="openDedicationModal"].bg-purple-50,
#frontend-catalog-view button[onclick*="openDedicationModal"].bg-purple-50 {
  background-color: #faf5ff !important;
  border: 1px solid #d8b4fe !important;
  color: #3b0764 !important;
}
.marlu-shop-app-root button[onclick*="openDedicationModal"].bg-purple-50:hover,
#marlu-shop-frontend-root button[onclick*="openDedicationModal"].bg-purple-50:hover,
#marlu-shop-container button[onclick*="openDedicationModal"].bg-purple-50:hover,
#frontend-catalog-view button[onclick*="openDedicationModal"].bg-purple-50:hover {
  background-color: #f3e8ff !important;
  border-color: #c084fc !important;
  color: #3b0764 !important;
}

/* Tlačidlo "Upraviť" pri nastavenom venovaní v karte produktu */
.marlu-shop-app-root button[onclick*="openDedicationModal"].text-\[10px\],
#marlu-shop-frontend-root button[onclick*="openDedicationModal"].text-\[10px\],
#marlu-shop-container button[onclick*="openDedicationModal"].text-\[10px\],
#frontend-catalog-view button[onclick*="openDedicationModal"].text-\[10px\] {
  background-color: #ffffff !important;
  border: 1px solid #d8b4fe !important;
  color: #7e22ce !important;
  border-radius: 0.375rem !important;
  padding: 2px 8px !important;
}
.marlu-shop-app-root button[onclick*="openDedicationModal"].text-\[10px\]:hover,
#marlu-shop-frontend-root button[onclick*="openDedicationModal"].text-\[10px\]:hover,
#marlu-shop-container button[onclick*="openDedicationModal"].text-\[10px\]:hover,
#frontend-catalog-view button[onclick*="openDedicationModal"].text-\[10px\]:hover {
  background-color: #faf5ff !important;
  color: #581c87 !important;
}

/* Tlačidlo zrušenia venovania v odznaku karty produktu */
.marlu-shop-app-root button[onclick*="removeDedication"],
#marlu-shop-frontend-root button[onclick*="removeDedication"],
#marlu-shop-container button[onclick*="removeDedication"],
#frontend-catalog-view button[onclick*="removeDedication"] {
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
  padding: 0 4px !important;
}
.marlu-shop-app-root button[onclick*="removeDedication"]:hover,
#marlu-shop-frontend-root button[onclick*="removeDedication"]:hover,
#marlu-shop-container button[onclick*="removeDedication"]:hover,
#frontend-catalog-view button[onclick*="removeDedication"]:hover {
  color: #e11d48 !important;
}

/* Všetky emotikony v celom modále a venovaniach: striktne rovné (nie kurzíva) */
#dedication-modal span,
#dedication-modal button,
.marlu-shop-app-root button[onclick*="openDedicationModal"] span {
  font-style: normal !important;
}

/* ==========================================================================
   MODÁL: KONTAKT & ZÁKAZNÍCKA PODPORA (#contact-modal) (1:1 SO SIMULÁTOROM)
   ========================================================================== */
#contact-modal .bg-slate-900 {
  padding: 16px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 58px !important;
  box-sizing: border-box !important;
}
#contact-modal .bg-slate-900 h3 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #ffffff !important;
}
#contact-modal .bg-slate-900 p {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 11px !important;
  color: #94a3b8 !important;
  line-height: 1.3 !important;
}
#contact-modal .bg-slate-900 p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Tlačidlo zatvorenia krížikom v hlavičke (x) */
#contact-modal .bg-slate-900 button,
#contact-modal .bg-slate-900 button[onclick*="closeContactModal"],
#contact-modal button.text-2xl {
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font-size: 24px !important;
  line-height: 1 !important;
  padding: 4px !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}
#contact-modal .bg-slate-900 button:hover,
#contact-modal .bg-slate-900 button[onclick*="closeContactModal"]:hover,
#contact-modal button.text-2xl:hover {
  color: #ffffff !important;
}

#contact-modal a[href^="mailto:"] {
  background-color: #1bb4b9 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  border-radius: 0.75rem !important; /* rounded-xl (12px) */
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}
#contact-modal a[href^="mailto:"]:hover,
#contact-modal a[href^="mailto:"]:focus {
  background-color: #148f93 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}
#contact-modal a[href^="mailto:"] * {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* 2. Karta: Telefonický kontakt (striktne zarovnané doľava podľa simulátora) */
#contact-modal .p-4.rounded-2xl.bg-slate-50 {
  text-align: left !important;
}
#contact-modal .p-4.rounded-2xl.bg-slate-50 p {
  text-align: left !important;
  margin: 0 !important;
}
#contact-modal .p-4.rounded-2xl.bg-slate-50 > div {
  justify-content: flex-start !important;
}
#contact-modal #contact-phone-box {
  justify-content: flex-start !important;
}

#contact-modal #btn-reveal-phone,
#contact-modal button[onclick*="revealCustomerPhone"] {
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
  border-radius: 0.75rem !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}
#contact-modal #btn-reveal-phone:hover,
#contact-modal #btn-reveal-phone:focus,
#contact-modal button[onclick*="revealCustomerPhone"]:hover,
#contact-modal button[onclick*="revealCustomerPhone"]:focus {
  background-color: #f8fafc !important;
  color: #0f172a !important;
  border-color: #94a3b8 !important;
}

#contact-modal a[href^="tel:"] {
  background-color: #d1fae5 !important;
  border: 1px solid #6ee7b7 !important;
  color: #022c22 !important;
  border-radius: 0.75rem !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
#contact-modal a[href^="tel:"]:hover {
  background-color: #a7f3d0 !important;
  color: #022c22 !important;
  text-decoration: none !important;
}

/* Tlačidlo Zatvoriť v spodnej lište modálu */
#contact-modal .bg-slate-50 button[onclick*="closeContactModal"],
#contact-modal div.bg-slate-50 > button {
  background-color: #e2e8f0 !important;
  color: #334155 !important;
  border: none !important;
  border-radius: 0.75rem !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 6px 16px !important;
}
#contact-modal .bg-slate-50 button[onclick*="closeContactModal"]:hover,
#contact-modal .bg-slate-50 button[onclick*="closeContactModal"]:focus,
#contact-modal div.bg-slate-50 > button:hover,
#contact-modal div.bg-slate-50 > button:focus {
  background-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   MODÁL: OBCHODNÉ PODMIENKY & ZÁKONNÉ DOKUMENTY (#terms-modal)
   ========================================================================== */
#terms-modal button[onclick*="switchTermsTab"] {
  border-radius: 0.5rem !important;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
#terms-modal button[onclick*="switchTermsTab"].bg-white {
  background-color: #ffffff !important;
  color: #134e4a !important;
  border: 1px solid #5eead4 !important;
}
#terms-modal button[onclick*="switchTermsTab"]:not(.bg-white) {
  background-color: rgba(226, 232, 240, 0.8) !important;
  color: #334155 !important;
  border: 1px solid transparent !important;
}
#terms-modal button[onclick*="switchTermsTab"]:not(.bg-white):hover {
  background-color: #ffffff !important;
  color: #0f172a !important;
}

#terms-modal button[onclick*="closeTermsModal"]:not(.text-2xl),
#terms-modal .bg-slate-50 button[onclick*="closeTermsModal"] {
  background-color: #1e293b !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0.5rem !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 8px 20px !important;
}
#terms-modal button[onclick*="closeTermsModal"]:not(.text-2xl):hover,
#terms-modal .bg-slate-50 button[onclick*="closeTermsModal"]:hover {
  background-color: #0f172a !important;
  color: #ffffff !important;
}

#terms-modal .bg-slate-900 button,
#terms-modal .bg-slate-900 button[onclick*="closeTermsModal"],
#terms-modal button.text-2xl {
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font-size: 24px !important;
  line-height: 1 !important;
  padding: 4px !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}
#terms-modal .bg-slate-900 button:hover,
#terms-modal .bg-slate-900 button[onclick*="closeTermsModal"]:hover,
#terms-modal button.text-2xl:hover {
  color: #ffffff !important;
}

/* ==========================================================================
   MODÁL: WAITLIST (#waitlist-modal)
   ========================================================================== */
#waitlist-modal button[type="submit"] {
  background: linear-gradient(to right, #e11d48, #d97706) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0.75rem !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
#waitlist-modal button[type="submit"]:hover,
#waitlist-modal button[type="submit"]:focus {
  background: linear-gradient(to right, #be123c, #b45309) !important;
  color: #ffffff !important;
}

#waitlist-modal button[onclick*="closeWaitlistModal"]:not(.text-2xl) {
  background-color: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
  border-radius: 0.75rem !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
#waitlist-modal button[onclick*="closeWaitlistModal"]:not(.text-2xl):hover {
  background-color: #f8fafc !important;
  color: #0f172a !important;
}

/* ==========================================================================
   GLOBÁLNA OCHRANA VŠETKÝCH ODKAZOV A TLAČIDIEL V RÁMCI MARLU SHOP PRED ELEMENTOROM
   Elementor Kit 7 nanucuje .elementor-kit-7 a { color: #7A9AA2; } a a:hover { color: #CAA100; }
   ========================================================================== */
.marlu-shop-app-root a.text-white,
.marlu-shop-app-root a.text-white *,
.marlu-shop-modal-wrap a.text-white,
.marlu-shop-modal-wrap a.text-white *,
div[id*="modal"] a.text-white,
div[id*="modal"] a.text-white * {
  color: #ffffff !important;
  text-decoration: none !important;
}

.marlu-shop-app-root a.text-white:hover,
.marlu-shop-app-root a.text-white:hover *,
.marlu-shop-modal-wrap a.text-white:hover,
.marlu-shop-modal-wrap a.text-white:hover *,
div[id*="modal"] a.text-white:hover,
div[id*="modal"] a.text-white:hover * {
  color: #ffffff !important;
  text-decoration: none !important;
}

.marlu-shop-app-root a[class*="bg-[#1bb4b9]"],
.marlu-shop-app-root a[class*="bg-[#1bb4b9]"] *,
.marlu-shop-modal-wrap a[class*="bg-[#1bb4b9]"],
.marlu-shop-modal-wrap a[class*="bg-[#1bb4b9]"] *,
div[id*="modal"] a[class*="bg-[#1bb4b9]"],
div[id*="modal"] a[class*="bg-[#1bb4b9]"] * {
  color: #ffffff !important;
  text-decoration: none !important;
}

.marlu-shop-app-root a[class*="bg-[#1bb4b9]"]:hover,
.marlu-shop-app-root a[class*="bg-[#1bb4b9]"]:hover *,
.marlu-shop-modal-wrap a[class*="bg-[#1bb4b9]"]:hover,
.marlu-shop-modal-wrap a[class*="bg-[#1bb4b9]"]:hover *,
div[id*="modal"] a[class*="bg-[#1bb4b9]"]:hover,
div[id*="modal"] a[class*="bg-[#1bb4b9]"]:hover * {
  color: #ffffff !important;
  text-decoration: none !important;
}




/* Tlačový štýl A4 */
@page {
  size: A4 portrait;
  margin: 8mm 12mm;
}
@media print {
  #wpadminbar,
  #site-header,
  #site-footer,
  .site-header,
  .site-footer,
  header:not(.print-header),
  footer:not(.print-footer),
  #frontend-site-header,
  #frontend-site-footer,
  #frontend-catalog-view,
  #frontend-detail-view,
  #mobile-nav-dropdown,
  .print\:hidden,
  .no-print,
  #frontend-thankyou-buttons,
  button {
    display: none !important;
    visibility: hidden !important;
  }
  html, body {
    background: #ffffff !important;
    color: #0f172a !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  #frontend-thankyou-view {
    display: block !important;
    visibility: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }
}

/* ==========================================================================
   TranslatePress: Vlajka slobodného Ruska (biela-modrá-biela ⬜🟦⬜)
   Nahradenie štátnej vlajky RF v plávajúcom prepínači aj v navigačnom menu.
   ========================================================================== */
img.trp-flag-image[src*="ru_RU"],
img.trp-flag-image[src*="/ru.png"],
img.trp-flag-image[src*="/ru.svg"],
img.trp-flag-image[alt="ru_RU"],
img.trp-flag-image[alt*="Russian"],
#trp-floater-ls a[title*="Russ"] img.trp-flag-image,
#trp-floater-ls a[title="ru_RU"] img.trp-flag-image,
.trp-language-wrap a[title*="Russ"] img.trp-flag-image {
  content: url('flag-free-russia.svg') !important;
}