/* Lazko Core — components.css (F3-02). Only what V4 global classes cannot express. */

/* Accent words in headings: <em> inside a heading = teal, not italic */
.lzk-home-h2 em,.lzk-svc-h em,.lzk-svc-h1 em{font-style:normal;color:var(--lzk-color-text-accent)}
.lzk-home-dark .lzk-home-h2 em,.lzk-svc-dark .lzk-svc-h em{color:var(--lzk-text-brand-inverse)}

/* Section heading block: left-aligned in the 1200 grid, text kept to a readable width */
.lzk-svc-head>*{max-width:680px}

/* Placeholder text to validate with Ira */
.lzk-svc-ph{background:linear-gradient(transparent 60%,rgba(0,128,129,.14) 0);border-bottom:1px dashed var(--lzk-color-text-accent)}

/* <details> accordions: no native marker */
details>summary{list-style:none}
details>summary::-webkit-details-marker{display:none}

/* Maillot option (accordion item): radio dot + selected state */
.lzk-svc-opt-dot{position:relative}
.lzk-svc-opt-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--lzk-action-accent);transform:scale(0);transition:transform .2s}
details[open]>.lzk-svc-opt-head .lzk-svc-opt-dot{border-color:var(--lzk-action-accent)}
details[open]>.lzk-svc-opt-head .lzk-svc-opt-dot::after{transform:scale(1)}
.lzk-svc-opt[open]{border-color:var(--lzk-action-accent);background-color:var(--lzk-color-surface-default)}

/* Elementor Editor fixes: neutralize empty-view dropzones on pure indicator/icon atomic divs */
:is(.elementor-edit-mode,.elementor-editor-active) .e-atomic-element.lzk-svc-opt-dot,
.elementor-edit-mode .lzk-svc-opt-dot{width:22px!important;min-width:22px!important;max-width:22px!important;height:22px!important;min-height:22px!important;max-height:22px!important;padding:0!important;flex:0 0 22px!important}
:is(.elementor-edit-mode,.elementor-editor-active) .e-atomic-element:is(.lzk-svc-check,.lzk-svc-shield){width:20px!important;min-width:20px!important;max-width:20px!important;height:20px!important;min-height:20px!important;max-height:20px!important;padding:0!important;flex:0 0 20px!important}
:is(.elementor-edit-mode,.elementor-editor-active) .e-atomic-element.lzk-svc-faq-icon{width:32px!important;min-width:32px!important;max-width:32px!important;height:32px!important;min-height:32px!important;max-height:32px!important;padding:0!important;flex:0 0 32px!important}
:is(.elementor-edit-mode,.elementor-editor-active) :is(.lzk-svc-opt-dot,.lzk-svc-check,.lzk-svc-shield,.lzk-svc-faq-icon,.lzk-promo-dot)>.elementor-empty-view,
.elementor-edit-mode :is(.lzk-svc-opt-dot,.lzk-svc-check,.lzk-svc-shield,.lzk-svc-faq-icon,.lzk-promo-dot)>.elementor-empty-view{display:none!important;pointer-events:none!important;visibility:hidden!important}

/* FAQ +/− */
.lzk-svc-faq-icon{background:var(--lzk-action-accent) url(/wp-content/plugins/lazko-core/assets/icons/plus-white.svg) center/16px 16px no-repeat}
details[open]>summary .lzk-svc-faq-icon{background-image:url(/wp-content/plugins/lazko-core/assets/icons/minus-white.svg)}

/* Icons */
.lzk-svc-check{background:url(/wp-content/plugins/lazko-core/assets/icons/check-accent.svg) center/20px 20px no-repeat}
.lzk-svc-shield{background:url(/wp-content/plugins/lazko-core/assets/icons/shield-mint.svg) center/20px 20px no-repeat}
.lzk-svc-guide-thumb::after{content:"";position:absolute;right:16px;bottom:16px;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--lzk-action-accent);background:#fff url(/wp-content/plugins/lazko-core/assets/icons/arrow-ur-accent.svg) center/16px 16px no-repeat}

/* Hair finder (e-tabs): selected chip */
.lzk-svc-hair[aria-selected="true"]{border-color:var(--lzk-action-accent);background-color:var(--lzk-ref-color-canvas,#edf4f1)}
.lzk-svc-tabs-pill [aria-selected="true"]{background-color:var(--lzk-color-action-primary);color:#fff}
.lzk-svc-tabs-pill [aria-selected="true"] *{color:#fff}

/* Hover affordances */
.lzk-svc-price-row:hover .lzk-svc-price-arrow{transform:translateX(3px)}
.lzk-svc-guide:hover{transform:translateY(-2px)}

/* Scroll / motion */
@media (prefers-reduced-motion:reduce){.lzk-svc-opt-dot::after,.lzk-svc-price-arrow,.lzk-svc-guide{transition:none!important}}

/* Hair finder swatches (e-tab cannot hold children). .e-con.x beats Elementor's .e-con::before overlay. */
.e-con.lzk-svc-hair{justify-content:space-between}
.e-con.lzk-svc-hair::before{content:"";display:block;position:static;inset:auto;flex:0 0 40px;width:40px;height:40px;border:0;border-radius:50%;opacity:1;box-shadow:inset 0 0 0 1px rgba(8,43,43,.15)}
.lzk-svc-hair-menu>.e-con:nth-child(1)::before{background:#1d1612}
.lzk-svc-hair-menu>.e-con:nth-child(2)::before{background:#7a5236}
.lzk-svc-hair-menu>.e-con:nth-child(3)::before{background:#d9b26f}
.lzk-svc-hair-menu>.e-con:nth-child(4)::before{background:#ecebe6}
/* 0.2.27: finder on soins visage/corps pages = skin types, no hair-colour swatches */
.single-lzk_soin_visage .lzk-svc-hair-menu>.e-con::before,.single-lzk_soin_corps .lzk-svc-hair-menu>.e-con::before,.page-id-183 .lzk-svc-hair-menu>.e-con::before,.page-id-195 .lzk-svc-hair-menu>.e-con::before,.page-id-202 .lzk-svc-hair-menu>.e-con::before,.page-id-231 .lzk-svc-hair-menu>.e-con::before,.page-id-235 .lzk-svc-hair-menu>.e-con::before{display:none}
@media (max-width:767px){.e-con.lzk-svc-hair::before{flex-basis:32px;width:32px;height:32px}}
.e-con.lzk-svc-hair:not([aria-selected="true"]):hover{background-color:#fff;border-color:var(--lzk-action-accent)}

/* Accent words on dark sections */
.lzk-svc-on-dark em,.lzk-svc-on-dark em *{color:var(--lzk-text-brand-inverse,#c7e0da)}

/* Accordion option header: the Atomic title wrapper must take the free width (otherwise it shrinks to content on mobile) */
.lzk-svc-opt-head>.e-accordion-item-title-base{flex:1 1 0%;min-width:0}
.lzk-svc-opt-head .lzk-svc-opt-row{width:100%}
.lzk-svc-opt-head>.e-con:not(.e-accordion-item-title-base){flex:0 0 auto;width:auto}
/* Accordion option footer: link left, action buttons right */
.lzk-svc-opt-foot{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px}
.lzk-svc-opt-foot>.lzk-svc-fine{margin-right:auto}
.lzk-svc-opt-foot>.lzk-button:first-of-type{margin-left:auto}
@media (max-width:767px){
	.lzk-svc-opt-foot{flex-direction:column;align-items:stretch;gap:10px}
	.lzk-svc-opt-foot>.lzk-svc-fine{margin-right:0}
	.lzk-svc-opt-foot>.lzk-button:first-of-type{margin-left:0}
}
@media (max-width:767px){.e-con.lzk-svc-hair{justify-content:flex-start}}

/* CALC-SIMPLE: forfait choice belongs to the existing summary; no global overrides. */
.lzk-epilator-summary .lzk-epilator-tiers{grid-template-columns:minmax(0,1fr);gap:8px;margin:20px 0 14px}
.lzk-epilator-summary .lzk-epilator-tier{display:grid;grid-template-columns:16px minmax(0,1fr) auto;align-items:center;gap:3px 10px;min-height:78px;padding:12px;border-radius:12px}
.lzk-epilator-summary .lzk-epilator-tier-name{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0;font-size:13px;font-weight:600}
.lzk-epilator-summary .lzk-epilator-tier>strong{grid-column:3;grid-row:1;font-size:20px;text-align:right}
.lzk-epilator-summary .lzk-epilator-tier-unit{grid-column:2 / -1;grid-row:2;font-size:11px}
.lzk-epilator-summary .lzk-epilator-radio{position:static;grid-column:1;grid-row:1 / span 2;width:14px;height:14px}
.lzk-epilator-summary .lzk-epilator-recommended{position:static;padding:2px 7px;line-height:1.4;font-size:9px}
.lzk-epilator-summary .lzk-epilator-status{margin-top:12px;padding-top:0;border-top:0}
.lzk-epilator-summary .lzk-epilator-total{margin-top:20px}



/* CALC-COMBINED: native checkboxes around the existing anatomy, no alternate input mode. */
.lzk-epilator-anatomy-controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;margin:24px 0 12px}
.lzk-epilator-anatomy-controls .lzk-epilator-switch{margin:0;flex:1;max-width:240px}.lzk-epilator-anatomy-controls .lzk-epilator-side{max-width:180px}
.lzk-epilator-anatomy{display:grid;grid-template-columns:minmax(0,1fr) 160px minmax(0,1fr);gap:14px;align-items:stretch;min-width:0}
.lzk-epilator-anatomy-side{position:relative;min-width:0;z-index:1}.lzk-epilator-anatomy-group{position:absolute;left:0;right:0}
.lzk-epilator-anatomy-map{min-width:0}.lzk-epilator-anatomy-map .lzk-epilator-map{height:630px;width:100%;max-height:none;min-height:0;margin:0}
.lzk-epilator-anatomy .lzk-epilator-group-arms{top:22%}.lzk-epilator-anatomy .lzk-epilator-group-axillae{top:25%}.lzk-epilator-anatomy .lzk-epilator-group-belly{top:40%}.lzk-epilator-anatomy .lzk-epilator-group-maillot{top:56%}.lzk-epilator-anatomy .lzk-epilator-group-legs{top:65%}
.lzk-epilator-anatomy .lzk-epilator-choice{font-size:12px;padding:10px 8px;gap:7px;min-height:48px;background:white}.lzk-epilator-anatomy .lzk-epilator-choice:has(input:checked){background:#eaf5ef}
.lzk-epilator-anatomy .lzk-epilator-choice small{font-size:11px}.lzk-epilator-anatomy .lzk-epilator-choice>span{overflow-wrap:normal}
.lzk-epilator-anatomy .lzk-epilator-leader{pointer-events:none}.lzk-epilator-sif-caption{font-size:11px;line-height:1.5;margin:6px 0 0;color:var(--ep-forest)}
.lzk-epilator-sif-zone{fill:var(--ep-teal);fill-opacity:.55;stroke:var(--ep-forest);stroke-width:.6}
.lzk-epilator-anatomy-face .lzk-epilator-map{height:420px}.lzk-epilator-anatomy-face .lzk-epilator-group-belly{top:45%}.lzk-epilator-anatomy-face .lzk-epilator-group-maillot{top:63%}
@media(max-width:1023px){.lzk-epilator .lzk-epilator-grid{grid-template-columns:minmax(0,1fr)}.lzk-epilator-summary{position:static}}

/* ==========================================================================
   F6-04 · Accessibility & WCAG AA Enhancements
   ========================================================================== */

/* 1. LatePoint Contrast Enhancements (WCAG 1.4.3 AA: >= 4.5:1) */
.latepoint-w .latepoint-desc-content,
.latepoint-w .os-item-child-count,
.latepoint-w .os-category-item-desc,
.latepoint-w .os-service-item-desc,
.latepoint-w .latepoint-step-desc {
  color: #475069 !important;
}

/* 2. Keyboard Navigation & Visible Focus (WCAG 2.4.7 AA) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex="0"]:focus-visible {
  outline: 2px solid #004443 !important;
  outline-offset: 2px !important;
}

/* Exception: In accordance with Vasile's explicit design decision, suppress aggressive focus ring inside mobile drawer */
.lzk-nav-drawer *:focus-visible {
  outline: none !important;
}

/* 3. Global Accessible Reduced Motion (WCAG 2.3.3 AA) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* 4. Accessible Touch Targets (WCAG 2.5.5 / 2.5.8) */
@media (max-width: 1024px) {
  .lzk-nav-frame a.e-con,
  .lzk-nav-frame button {
    min-width: 44px;
    min-height: 44px;
  }
}

/* CALC-DIAG-CTA: spacing only; primary/secondary reuse the existing button styles. */
.lzk-epilator-diagnostic{margin-top:18px}

/* ==========================================================================
   METHOD / DIAGNOSTIC 2x2 SELECTOR (Refactored from database custom_css)
   Clean implementation conforming to Rule §5 (Zero CSS in database)
   ========================================================================== */

/* 1. Meniu taburi (stânga) */
.lzk-method-selector-tabs .e-tabs-menu,
.lzk-method-selector-tabs .e-tabs-menu-base,
.lzk-svc-finder .e-tabs-menu,
.lzk-svc-finder .e-tabs-menu-base,
.e-3c3dcf03-ebce .e-tabs-menu,
.e-3c3dcf03-ebce .e-tabs-menu-base {
  align-content: start;
}

/* 2. Butoane tab / carduri din stânga */
.lzk-method-selector-tab,
.lzk-svc-hair,
.lzk-svc-finder [data-element_type="e-tab"],
.lzk-svc-finder .e-tab-base,
.lzk-svc-finder .e-tab,
.e-3c3dcf03-ebce [data-element_type="e-tab"],
.e-3c3dcf03-ebce .e-tab-base,
.e-3c3dcf03-ebce .e-tab {
  position: relative !important;
  transition: border-color 0.2s ease, background-color 0.2s ease !important;
}

/* Bifă de selecție activă în colțul din dreapta sus */
.lzk-method-selector-tab::after,
.lzk-svc-hair::after,
.lzk-svc-finder [data-element_type="e-tab"]::after,
.lzk-svc-finder .e-tab-base::after,
.lzk-svc-finder .e-tab::after,
.e-3c3dcf03-ebce [data-element_type="e-tab"]::after,
.e-3c3dcf03-ebce .e-tab-base::after,
.e-3c3dcf03-ebce .e-tab::after {
  content: "" !important;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 7px !important;
  height: 12px !important;
  border-right: 2px solid #007c7c !important;
  border-bottom: 2px solid #007c7c !important;
  transform: rotate(45deg) !important;
  opacity: 0 !important;
  transition: opacity 0.2s ease !important;
  pointer-events: none !important;
}

/* Stare activă selectată */
.lzk-method-selector-tab.e--selected,
.lzk-svc-hair.e--selected,
.lzk-svc-finder [data-element_type="e-tab"].e--selected,
.lzk-svc-finder .e-tab-base.e--selected,
.lzk-svc-finder .e-tab.e--selected,
.e-3c3dcf03-ebce [data-element_type="e-tab"].e--selected,
.e-3c3dcf03-ebce .e-tab-base.e--selected,
.e-3c3dcf03-ebce .e-tab.e--selected {
  border-color: #007c7c !important;
  background-color: #eaf3ef !important;
  outline: none !important;
}

.lzk-method-selector-tab.e--selected::after,
.lzk-svc-hair.e--selected::after,
.lzk-svc-finder [data-element_type="e-tab"].e--selected::after,
.lzk-svc-finder .e-tab-base.e--selected::after,
.lzk-svc-finder .e-tab.e--selected::after,
.e-3c3dcf03-ebce [data-element_type="e-tab"].e--selected::after,
.e-3c3dcf03-ebce .e-tab-base.e--selected::after,
.e-3c3dcf03-ebce .e-tab.e--selected::after {
  opacity: 1 !important;
}

/* Focus vizibil accesibil */
.lzk-method-selector-tab:focus-visible,
.lzk-svc-hair:focus-visible,
.lzk-svc-finder [data-element_type="e-tab"]:focus-visible,
.lzk-svc-finder .e-tab-base:focus-visible,
.lzk-svc-finder .e-tab:focus-visible,
.e-3c3dcf03-ebce [data-element_type="e-tab"]:focus-visible,
.e-3c3dcf03-ebce .e-tab-base:focus-visible,
.e-3c3dcf03-ebce .e-tab:focus-visible {
  outline: 2px solid #007c7c !important;
  outline-offset: 4px !important;
}

/* Animație imagine la hover */
.lzk-method-selector-tab img,
.lzk-svc-hair img,
.lzk-svc-finder [data-element_type="e-tab"] img,
.lzk-svc-finder .e-tab-base img,
.lzk-svc-finder .e-tab img,
.e-3c3dcf03-ebce [data-element_type="e-tab"] img,
.e-3c3dcf03-ebce .e-tab-base img,
.e-3c3dcf03-ebce .e-tab img {
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .lzk-method-selector-tab:hover img,
  .lzk-svc-hair:hover img,
  .lzk-svc-finder [data-element_type="e-tab"]:hover img,
  .lzk-svc-finder .e-tab-base:hover img,
  .lzk-svc-finder .e-tab:hover img,
  .e-3c3dcf03-ebce [data-element_type="e-tab"]:hover img,
  .e-3c3dcf03-ebce .e-tab-base:hover img,
  .e-3c3dcf03-ebce .e-tab:hover img {
    transform: scale(1.08) translate(-1px, -1px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lzk-method-selector-tab img,
  .lzk-svc-hair img,
  .lzk-svc-finder [data-element_type="e-tab"] img,
  .lzk-svc-finder .e-tab-base img,
  .lzk-svc-finder .e-tab img,
  .e-3c3dcf03-ebce [data-element_type="e-tab"] img,
  .e-3c3dcf03-ebce .e-tab-base img,
  .e-3c3dcf03-ebce .e-tab img {
    transition: none !important;
    transform: none !important;
  }
}

/* 3. Butoane acțiune din cardul din dreapta */
.lzk-svc-finder .e-tabs-content-area button:focus-visible,
.lzk-svc-finder .e-tabs-content-area a:focus-visible,
.lzk-svc-finder .e-tabs-content-area-base button:focus-visible,
.lzk-svc-finder .e-tabs-content-area-base a:focus-visible,
.e-3c3dcf03-ebce .e-tabs-content-area button:focus-visible,
.e-3c3dcf03-ebce .e-tabs-content-area a:focus-visible,
.e-3c3dcf03-ebce .e-tabs-content-area-base button:focus-visible,
.e-3c3dcf03-ebce .e-tabs-content-area-base a:focus-visible {
  outline: 2px solid #ffffff !important;
  outline-offset: 4px !important;
}