/*
Theme Name:   IDM Shop
Theme URI:    https://idmengineering.lt
Description:  Hello Elementor vaikinė tema shop.idmengineering.lt parduotuvei. Perima IDM Engineering firminį stilių ir pritaiko jį WooCommerce elementams, kurių Elementor globalus rinkinys nepasiekia.
Author:       IDM Engineering
Template:     hello-elementor
Version:      1.0
Text Domain:  idm-shop
*/

/* ============================================================
   FIRMINĖS SPALVOS
   Paimtos iš pagrindinės svetainės Elementor rinkinio (Kit #21).
   ============================================================ */
:root {
  --idm-fonas:     #020617;
  --idm-kortele:   #03172C;
  --idm-remelis:   #2A3850;
  --idm-antraste:  #FFFFFF;
  --idm-tekstas:   #E0E0E0;
  --idm-zalia:     #059669;
  --idm-akcentas:  #A3E635;
  --idm-mygt-tekstas: #000000;
  --idm-prigesintas:  #98A2B3;
  /* Logotipo mėlyna, RGB dalimis — kad tą pačią spalvą būtų
     galima naudoti skirtingo skaidrumo švytėjimo sluoksniams. */
  --idm-svytejimas: 59, 169, 232;
  /* Antra švytėjimo spalva — didelės galios DC stotelėms. */
  --idm-svytejimas-raudonas: 232, 90, 86;
  /* Kuria spalva švyti gaminio nuotraukos apvadas. Atskiras kintamasis
     nuo --idm-svytejimas, kad pakeitus nuotraukos apvado spalvą liktų
     melsvi visi kiti švytintys elementai: krepšelio ikona, gido rėmelis,
     pradžios puslapio ženkleliai. */
  --idm-foto-svytejimas: var(--idm-svytejimas);
}

/* ============================================================
   PAGRINDAS
   ============================================================ */
body,
.site-main,
.page-content {
  background-color: var(--idm-fonas);
  color: var(--idm-tekstas);
  font-family: Inter, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.site-title, .entry-title, .product_title {
  color: var(--idm-antraste);
  font-family: "Spline Sans", sans-serif;
}

a { color: var(--idm-akcentas); }
a:hover, a:focus { color: var(--idm-zalia); }

.site-header, .site-footer {
  background-color: var(--idm-fonas);
  color: var(--idm-tekstas);
  border-color: var(--idm-remelis);
}
.site-header .site-title a { color: var(--idm-antraste); }
.site-description { color: var(--idm-prigesintas); }

hr, .site-header { border-color: var(--idm-remelis); }

/* ============================================================
   MYGTUKAI
   Akcentinė spalva su tamsiu tekstu — kaip pagrindinėje svetainėje.
   ============================================================ */
.button,
.wp-element-button,
button,
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--idm-akcentas);
  color: var(--idm-mygt-tekstas);
  border: none;
  border-radius: 6px;
  font-family: "Spline Sans", sans-serif;
  font-weight: 600;
  transition: background-color .15s ease;
}
.button:hover,
.wp-element-button:hover,
button:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background-color: var(--idm-zalia);
  color: var(--idm-antraste);
}
.woocommerce a.button.disabled,
.woocommerce button.button:disabled {
  background-color: var(--idm-remelis);
  color: var(--idm-prigesintas);
}

/* ============================================================
   KATALOGAS
   ============================================================ */
.woocommerce ul.products li.product {
  background-color: var(--idm-kortele);
  border: 1px solid var(--idm-remelis);
  border-radius: 10px;
  padding: 1rem;
  transition: border-color .15s ease;
}
.woocommerce ul.products li.product:hover { border-color: var(--idm-akcentas); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--idm-antraste);
  font-family: "Spline Sans", sans-serif;
  font-size: 1.05rem;
}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--idm-akcentas);
  font-weight: 600;
}
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del { color: var(--idm-prigesintas); }

.woocommerce span.onsale {
  background-color: var(--idm-akcentas);
  color: var(--idm-mygt-tekstas);
}

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-breadcrumb a { color: var(--idm-prigesintas); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--idm-akcentas); }

/* ============================================================
   PREKĖS PUSLAPIS
   ============================================================ */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--idm-remelis);
  padding-left: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--idm-remelis); }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background-color: transparent;
  border: 1px solid var(--idm-remelis);
  border-bottom: none;
  border-radius: 6px 6px 0 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--idm-prigesintas); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background-color: var(--idm-kortele);
  border-color: var(--idm-akcentas);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--idm-antraste); }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }

.woocommerce div.product .product_meta { color: var(--idm-prigesintas); }
.woocommerce .stock.in-stock { color: var(--idm-zalia); }
.woocommerce .stock.out-of-stock { color: #e08a72; }

/* Specifikacijų lentelė */
.woocommerce table.shop_attributes,
.woocommerce table.shop_table {
  border-color: var(--idm-remelis);
  color: var(--idm-tekstas);
}
.woocommerce table.shop_attributes th,
.woocommerce table.shop_table th { color: var(--idm-antraste); }
.woocommerce table.shop_attributes td,
.woocommerce table.shop_attributes th,
.woocommerce table.shop_table td,
.woocommerce table.shop_table th { border-color: var(--idm-remelis); }
.woocommerce table.shop_attributes tr:nth-child(even) td,
.woocommerce table.shop_attributes tr:nth-child(even) th { background-color: rgba(255,255,255,.03); }

/* ============================================================
   FORMOS, KREPŠELIS, ATSISKAITYMAS
   ============================================================ */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
input[type="password"], input[type="search"], input[type="url"],
textarea, select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single {
  background-color: var(--idm-kortele);
  border: 1px solid var(--idm-remelis);
  color: var(--idm-tekstas);
  border-radius: 6px;
}
input:focus, textarea:focus, select:focus { border-color: var(--idm-akcentas); outline: none; }
::placeholder { color: var(--idm-prigesintas); }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--idm-tekstas); }
.select2-dropdown { background-color: var(--idm-kortele); border-color: var(--idm-remelis); color: var(--idm-tekstas); }

.woocommerce .quantity .qty {
  background-color: var(--idm-kortele);
  border: 1px solid var(--idm-remelis);
  color: var(--idm-tekstas);
}

.woocommerce-cart table.cart td.actions .coupon .input-text { min-width: 12rem; }

.woocommerce .cart_totals h2,
.woocommerce-checkout h3,
.woocommerce-billing-fields h3 { color: var(--idm-antraste); }

.woocommerce-checkout #payment,
.woocommerce .cart_totals,
.woocommerce-order-details,
.woocommerce-customer-details {
  background-color: var(--idm-kortele);
  border: 1px solid var(--idm-remelis);
  border-radius: 10px;
}
.woocommerce-checkout #payment div.payment_box { background-color: var(--idm-fonas); color: var(--idm-tekstas); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--idm-fonas); }
.woocommerce-checkout #payment ul.payment_methods { border-color: var(--idm-remelis); }

/* ============================================================
   PRANEŠIMAI
   ============================================================ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
  background-color: var(--idm-kortele);
  color: var(--idm-tekstas);
  border-top-color: var(--idm-akcentas);
}
.woocommerce-error { border-top-color: #e08a72; }
.woocommerce-message a, .woocommerce-info a { color: var(--idm-akcentas); }

/* ============================================================
   MANO PASKYRA
   ============================================================ */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid var(--idm-remelis);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a { color: var(--idm-tekstas); display: block; padding: .6rem 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { color: var(--idm-akcentas); }

/* ============================================================
   PUSLAPIAVIMAS
   ============================================================ */
.woocommerce nav.woocommerce-pagination ul { border-color: var(--idm-remelis); }
.woocommerce nav.woocommerce-pagination ul li { border-color: var(--idm-remelis); }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span { color: var(--idm-tekstas); }
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background-color: var(--idm-akcentas);
  color: var(--idm-mygt-tekstas);
}

/* ============================================================
   IŠDĖSTYMAS
   Hello Elementor turinį deda be paraščių — tamsiame fone tekstas
   atsiremia į patį kraštą.
   ============================================================ */
.site-header > div,
.site-footer > div,
.site-main {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.site-main { padding-block: 2rem 4rem; }
.site-header { padding-block: 1.25rem; border-bottom: 1px solid var(--idm-remelis); }
.site-footer { padding-block: 1.5rem; border-top: 1px solid var(--idm-remelis); }

/* Prekės nuotrauka tamsiame fone */
.woocommerce div.product div.images img,
.woocommerce ul.products li.product img {
  background-color: var(--idm-kortele);
  border-radius: 8px;
}

/* ============================================================
   ANTRAŠTĖ IR PORAŠTĖ (UAE šablonai)
   ============================================================ */
.ehf-header { border-bottom: 1px solid var(--idm-remelis); }
.ehf-header + .site-main,
.ehf-template-hello-elementor .site-main { padding-top: 2rem; }

/* UAE navigacijos meniu firminėmis spalvomis */
.hfe-nav-menu .menu-item a.hfe-menu-item,
.hfe-nav-menu .menu-item a.hfe-sub-menu-item {
  color: var(--idm-tekstas);
  font-family: "Spline Sans", sans-serif;
  font-weight: 500;
}
.hfe-nav-menu .menu-item a.hfe-menu-item:hover,
.hfe-nav-menu .menu-item.current-menu-item a.hfe-menu-item { color: var(--idm-akcentas); }
.hfe-nav-menu .sub-menu { background-color: var(--idm-kortele); border: 1px solid var(--idm-remelis); }
.hfe-menu-toggle, .hfe-nav-menu-icon { color: var(--idm-tekstas); }
.hfe-nav-menu__layout-horizontal .hfe-nav-menu { gap: .35rem; }

/* Krepšelio piktograma */
.hfe-cart-menu-wrap-default .hfe-cart-count,
.hfe-cart-menu-wrap-default .hfe-cart-container { color: var(--idm-akcentas); }

/* ============================================================
   LANKYTOJO IP — kairysis apatinis kampas
   ============================================================ */
/*
 * Kairysis apatinis kampas. Abu ženkleliai guli viename stulpelyje, todėl
 * tarpą tarp jų tvarko `gap`, o ne skaičiuoti pikseliai — dingus vienam
 * kitas tiesiog nusileidžia į jo vietą.
 */
.idm-apacia {
  position: fixed;
  left: 14px;
  bottom: 14px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .4rem;
}

.idm-ip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .3rem .6rem;
  border: 1px solid var(--idm-remelis);
  border-radius: 5px;
  background-color: rgba(3, 23, 44, .88);
  color: var(--idm-tekstas);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .74rem;
  line-height: 1.3;
  letter-spacing: .02em;
  backdrop-filter: blur(4px);
  opacity: .82;
  transition: opacity .15s ease;
}
.idm-ip:hover { opacity: 1; }
.idm-ip__zyme {
  color: var(--idm-akcentas);
  font-weight: 500;
  font-size: .68rem;
  letter-spacing: .08em;
}
@media (max-width: 480px) {
  .idm-apacia { left: 8px; bottom: 8px; gap: .3rem; }
  .idm-ip { font-size: .68rem; }
}

/* ============================================================
   PREKIŲ APRAŠYMAI IR PIRKIMO GIDAS
   ============================================================ */

.idm-preke h3,
.idm-gidas h2,
.idm-gidas h3,
.idm-palyginimas h2 {
  color: var(--idm-antraste);
  font-family: 'Spline Sans', 'Inter', system-ui, sans-serif;
  letter-spacing: -.01em;
}

.idm-preke h3 {
  font-size: 1.15rem;
  margin: 2.25rem 0 .85rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--idm-remelis);
}
.idm-preke h3:first-child { margin-top: 0; }

.idm-paantraste {
  color: var(--idm-akcentas);
  font-weight: 600;
  letter-spacing: .01em;
  margin-bottom: .5rem;
}

/* --- Specifikacijų lentelės --- */

.idm-specs {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 1rem;
  font-size: .95rem;
  line-height: 1.55;
}
.idm-specs th,
.idm-specs td {
  padding: .7rem .9rem;
  border: 1px solid var(--idm-remelis);
  text-align: left;
  vertical-align: top;
}
.idm-specs thead th {
  background-color: rgba(163, 230, 53, .07);
  color: var(--idm-antraste);
  font-weight: 600;
  white-space: nowrap;
}
.idm-specs tbody th {
  width: 34%;
  color: var(--idm-antraste);
  font-weight: 600;
  background-color: rgba(255, 255, 255, .025);
}
.idm-specs tbody td { color: var(--idm-tekstas); }
.idm-specs tbody tr:hover td,
.idm-specs tbody tr:hover th { background-color: rgba(163, 230, 53, .05); }

/* Skaičių stulpeliai lygiuojasi */
.idm-specs thead th + th ~ th,
.idm-specs tbody td { font-variant-numeric: tabular-nums; }

.idm-specs--platus tbody th { width: auto; white-space: nowrap; }
.idm-specs--platus a { text-decoration: none; }
.idm-specs--platus a:hover { text-decoration: underline; }

/* --- Sąrašai --- */

.idm-pliusai,
.idm-zinoti {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}
.idm-pliusai li,
.idm-zinoti li {
  position: relative;
  padding-left: 1.65rem;
  margin-bottom: .6rem;
  color: var(--idm-tekstas);
  line-height: 1.6;
}
.idm-pliusai li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .55em;
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background-color: var(--idm-akcentas);
}
.idm-zinoti li::before {
  content: '!';
  position: absolute;
  left: 0;
  top: 0;
  width: 1.1rem;
  height: 1.1rem;
  line-height: 1.1rem;
  text-align: center;
  font-size: .78rem;
  font-weight: 700;
  border-radius: 50%;
  color: var(--idm-mygt-tekstas);
  background-color: var(--idm-akcentas);
}
.idm-zinoti strong { color: var(--idm-antraste); }

/* --- Pastabos --- */

.idm-past,
.idm-rinka {
  font-size: .87rem;
  line-height: 1.6;
  color: var(--idm-prigesintas);
}
.idm-rinka {
  margin-top: 1.5rem;
  padding: .85rem 1rem;
  border-left: 3px solid var(--idm-zalia);
  background-color: rgba(5, 150, 105, .07);
}
.idm-rinka strong { color: var(--idm-tekstas); }

/* --- Kaina pagal užklausą --- */

.idm-uzklausa {
  color: var(--idm-akcentas);
  font-weight: 600;
}

.idm-uzklausa-blokas {
  margin: 1.25rem 0 1.5rem;
  padding: 1.1rem 1.25rem;
  border: 1px solid var(--idm-remelis);
  border-radius: 10px;
  background-color: var(--idm-kortele);
}
.idm-uzklausa-blokas p {
  margin: 0 0 .9rem;
  color: var(--idm-tekstas);
  font-size: .95rem;
}

.idm-mygtukas--didelis { font-size: 1.02rem; padding: .8rem 1.5rem; }

/* --- Pirkimo gidas parduotuvės viršuje --- */

.idm-gidas {
  margin: 0 0 2.5rem;
  padding: 1.5rem 1.6rem;
  border-radius: 12px;
  background-color: var(--idm-kortele);
  /* Blyškus mėlynas švytėjimas aplink rėmą — platesnis ir silpnesnis nei
     ties ženkliukais, nes plotas didelis: stipresnis imtų rėžti akį. */
  border: 1px solid rgba(var(--idm-svytejimas), .38);
  box-shadow:
    0 0 0 1px rgba(var(--idm-svytejimas), .10),
    0 0 26px rgba(var(--idm-svytejimas), .15),
    0 0 64px rgba(var(--idm-svytejimas), .08);
}
.idm-gidas > h2 { margin-top: 0; font-size: 1.35rem; }
.idm-gidas p { color: var(--idm-tekstas); }

.idm-zingsniai {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1.1rem;
  margin: 1.4rem 0 0;
  padding: 0;
  list-style: none;
  counter-reset: idm-zingsnis;
}
.idm-zingsniai li {
  counter-increment: idm-zingsnis;
  padding: 1rem 1.1rem;
  border: 1px solid var(--idm-remelis);
  border-radius: 10px;
  background-color: rgba(255, 255, 255, .02);
}
.idm-zingsniai li::before {
  content: counter(idm-zingsnis);
  display: inline-block;
  margin-bottom: .55rem;
  width: 1.7rem;
  height: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  font-weight: 700;
  border-radius: 50%;
  color: var(--idm-mygt-tekstas);
  background-color: var(--idm-akcentas);
}
.idm-zingsniai strong {
  display: block;
  margin-bottom: .35rem;
  color: var(--idm-antraste);
}
.idm-zingsniai span {
  display: block;
  font-size: .9rem;
  line-height: 1.55;
  color: var(--idm-tekstas);
}

/* --- Palyginimo lentelė po tinkleliu --- */

.idm-palyginimas {
  clear: both;
  margin: 3rem 0 0;
  padding-top: 2rem;
  border-top: 1px solid var(--idm-remelis);
}
.idm-palyginimas h2 { font-size: 1.3rem; margin: 0 0 1rem; }

/* Siaurame ekrane lentelė slenka pati, puslapis — ne */
.idm-palyginimas__slinktis {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* Toks pat blyškus mėlynas švytėjimas kaip aplink pirkimo gidą. */
  border: 1px solid rgba(var(--idm-svytejimas), .38);
  border-radius: 12px;
  box-shadow:
    0 0 0 1px rgba(var(--idm-svytejimas), .10),
    0 0 26px rgba(var(--idm-svytejimas), .15),
    0 0 64px rgba(var(--idm-svytejimas), .08);
}

/*
 * Lentelė jau turi savo langelių kraštines, o rėmelį dabar piešia apvalkalas —
 * todėl nuimam kraštinę nuo pačių išoriausių langelių, kad ties kraštu
 * nesusidarytų dviguba linija.
 */
.idm-palyginimas__slinktis .idm-specs { border-collapse: collapse; }
.idm-palyginimas__slinktis .idm-specs tr > *:first-child { border-left: 0; }
.idm-palyginimas__slinktis .idm-specs tr > *:last-child { border-right: 0; }
.idm-palyginimas__slinktis .idm-specs thead tr:first-child > * { border-top: 0; }
.idm-palyginimas__slinktis .idm-specs tbody tr:last-child > * { border-bottom: 0; }

@media (max-width: 640px) {
  .idm-specs tbody th { width: 42%; }
  .idm-gidas { padding: 1.15rem 1rem; }
  .idm-preke h3 { font-size: 1.05rem; }
}

/* ============================================================
   SIAURAS EKRANAS: niekas neturi platinti puslapio
   ============================================================ */

/* WooCommerce didinimo sluoksnis įdeda img su fiksuotu dideliu pločiu. */
.woocommerce div.product div.images img,
.woocommerce div.product div.images .zoomImg {
  max-width: 100%;
  height: auto;
}

@media (max-width: 720px) {
  /* Antraščių nowrap yra vienintelis dalykas, neleidęs lentelėms susitraukti. */
  .idm-specs thead th { white-space: normal; }
  .idm-specs th,
  .idm-specs td { padding: .55rem .6rem; font-size: .86rem; }
  .idm-specs tbody th { width: 38%; }

  /* Palyginimo lentelė lieka plati, bet slenka savo dėžėje, o ne kartu su puslapiu. */
  .idm-specs--platus { min-width: 560px; }
}

/* ============================================================
   GAMINIŲ NUOTRAUKOS
   Gamintojų nuotraukos yra baltame fone. Tamsioje temoje jos
   rodomos kaip šviesi plytelė — taip baltas fonas atrodo
   sąmoningas sprendimas, o ne iškirptas kvadratas.
   ============================================================ */

.woocommerce ul.products li.product a img,
.woocommerce div.product div.images img {
  background-color: #FFFFFF;
  border-radius: 10px;
}

/*
 * Švytintis apvadas aplink baltą plytelę.
 * Trys sluoksniai: plona linija, kuri apibrėžia kraštą, ir du platesni
 * išsklidę žiedai, kurie duoda švytėjimą. Numatytoji spalva paimta iš
 * logotipo mėlynos, todėl derinasi su antrašte ir neveržiasi su žaliu
 * akcentu. Didelės galios DC stotelėms ji pakeičiama raudona — žr. žemiau.
 */
.woocommerce ul.products li.product a img,
.woocommerce div.product div.images .flex-viewport,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
  box-shadow:
    0 0 0 2px rgba(var(--idm-foto-svytejimas), .90),
    0 0 12px 1px rgba(var(--idm-foto-svytejimas), .60),
    0 0 30px 6px rgba(var(--idm-foto-svytejimas), .32);
  transition: box-shadow .2s ease;
}

/*
 * Didelės galios DC stotelės švyti raudonai.
 *
 * Spalva keičiama vienu kintamuoju, todėl visi trys švytėjimo sluoksniai —
 * katalogo plytelė, prekės nuotrauka ir miniatiūros — pasikeičia kartu.
 *
 * Pirmoji taisyklė būtina: prekės puslapyje klasė kabo ant <body>, tad be
 * jos raudoną spalvą paveldėtų ir „Panašūs produktai“ plytelės, kurios gali
 * būti visai kitos prekės. Antroji, siauresnė, tą paveldėjimą nugali.
 */
.woocommerce ul.products li.product {
  --idm-foto-svytejimas: var(--idm-svytejimas);
}
body.idm-raudonas,
.woocommerce ul.products li.product.idm-raudonas {
  --idm-foto-svytejimas: var(--idm-svytejimas-raudonas);
}

/*
 * Kai prekė turi kelias nuotraukas, WooCommerce apgaubia jas FlexSlider
 * elementu .flex-viewport su overflow:hidden — jis nukerpa vidinio
 * elemento švytėjimą. Todėl baltą plytelę ir apvadą duodam jam pačiam,
 * o vidinis lieka skaidrus. Kai nuotrauka viena, .flex-viewport nesukuriamas
 * ir apvadą rodo pats __wrapper (abu aprašyti aukščiau).
 */
.woocommerce div.product div.images .flex-viewport {
  border-radius: 12px;
  background-color: #FFFFFF;
}
.woocommerce div.product div.images .flex-viewport .woocommerce-product-gallery__wrapper {
  box-shadow: none;
  background-color: transparent;
}

.woocommerce ul.products li.product:hover a img {
  box-shadow:
    0 0 0 2px rgba(var(--idm-foto-svytejimas), 1),
    0 0 18px 2px rgba(var(--idm-foto-svytejimas), .80),
    0 0 42px 10px rgba(var(--idm-foto-svytejimas), .45);
}

.woocommerce div.product div.images {
  border-radius: 12px;
  background-color: transparent;
}

/* Didinimo piktograma baltame fone turi būti tamsi. */
.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
  background-color: rgba(2, 6, 23, .72);
  color: #FFFFFF;
  border-radius: 50%;
}

/* ------------------------------------------------------------
   Prekės nuotraukų galerija
   WooCommerce miniatiūros po pagrindine nuotrauka. Fonas baltas,
   kaip ir pačių nuotraukų, kad eilutė atrodytų kaip viena juosta.
   ------------------------------------------------------------ */

/*
 * WooCommerce šiam sąrašui nustato overflow:hidden — jis nukerpa
 * miniatiūrų švytėjimą. Atstatom matomumą ir paliekam tarpo, kad
 * švytėjimas turėtų kur išsilieti ir nenusikirstų ties eilutės kraštu.
 */
.woocommerce div.product div.images .flex-control-thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin: 1rem 0 0;
  padding: 4px;
  overflow: visible;
  list-style: none;
}
/* Penki elementai su .7rem tarpais: 5 × (20% − .56rem) + 4 × .7rem = 100 % */
.woocommerce div.product div.images .flex-control-thumbs li {
  flex: 0 0 calc(20% - .56rem);
  margin: 0;
  list-style: none;
}
.woocommerce div.product div.images .flex-control-thumbs li img {
  width: 100%;
  height: auto;
  background-color: #FFFFFF;
  border-radius: 8px;
  opacity: .6;
  cursor: pointer;
  transition: opacity .15s ease, box-shadow .15s ease;
  box-shadow:
    0 0 0 1px rgba(var(--idm-foto-svytejimas), .55),
    0 0 8px rgba(var(--idm-foto-svytejimas), .28);
}

/* Pasirinkta ir užvesta — ryškesnis tas pats švytėjimas, todėl galerija
   lieka vienos spalvos, o pasirinkimas vis tiek aiškus. */
.woocommerce div.product div.images .flex-control-thumbs li img:hover,
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
  opacity: 1;
  box-shadow:
    0 0 0 2px rgba(var(--idm-foto-svytejimas), 1),
    0 0 14px 2px rgba(var(--idm-foto-svytejimas), .65);
}

/* Galerija turi savo baltą plytelę — išorinis konteineris jos nedubliuoja. */
.woocommerce div.product div.images.woocommerce-product-gallery {
  background-color: transparent;
  overflow: visible;
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
  background-color: #FFFFFF;
  border-radius: 12px;
  overflow: hidden;
}

/* ============================================================
   LIKUTIS SANDĖLYJE
   Spalva neša informaciją: žalia — yra, gintarinė — baigiasi,
   raudona — nėra. Taškas prieš tekstą tą patį pasako iš karto,
   dar neperskaičius skaičiaus.
   ============================================================ */

.idm-likutis {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin: .35rem 0 .75rem;
  font-size: .88rem;
  font-weight: 500;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}

.idm-likutis__taskas {
  flex: 0 0 auto;
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background-color: currentColor;
}

.idm-likutis--yra   { color: var(--idm-zalia); }
.idm-likutis--maza  { color: #E0A82E; }
.idm-likutis--nera  { color: #E08A72; }

/* Prekės puslapyje kiek ryškesnis */
.idm-likutis--didelis {
  margin: .6rem 0 1rem;
  font-size: .98rem;
}
.idm-likutis--didelis .idm-likutis__taskas {
  width: .6rem;
  height: .6rem;
}

/* Kataloge likutis eina tarp kainos ir mygtuko — tarpai tolygūs */
.woocommerce ul.products li.product .idm-likutis { margin-bottom: .85rem; }

/* ============================================================
   „IDM ENGINEERING ♥ CLIENTS“
   Pora IP ženkleliui kairėje: ta pati juostelė, tas pats fonas
   ir kraštinė, tik dešiniajame kampe. Iš pavyzdžio perimta mintis,
   bet spalvos pritaikytos tamsiam fonui — vietoj juodo teksto
   ant balto fono šviesus tekstas ant tamsios juostelės.
   ============================================================ */

.idm-klientai {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin: 0;
  padding: .3rem .7rem;
  border: 1px solid var(--idm-remelis);
  border-radius: 5px;
  background-color: rgba(3, 23, 44, .88);
  color: var(--idm-tekstas);
  font-family: 'Spline Sans', 'Inter', system-ui, sans-serif;
  font-size: .74rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
  backdrop-filter: blur(4px);
  opacity: .85;
  /* Ženklelis yra dekoratyvus ir guli virš turinio — praleidžia paspaudimus
     pro save, kad neuždengtų po juo esančių nuorodų. Dėl to jam nededam
     :hover būsenos: ji vis tiek niekada nesuveiktų. */
  pointer-events: none;
}

.idm-klientai__sirdis {
  width: .95em;
  height: .95em;
  flex: 0 0 auto;
  /* Raudona pašviesinta — pavyzdžio #E8323C tamsiame fone atrodytų purvina */
  fill: #FF4D57;
  filter: drop-shadow(0 0 5px rgba(255, 77, 87, .45));
}

@media (max-width: 480px) {
  .idm-klientai {
    font-size: .64rem;
    letter-spacing: .05em;
    padding: .25rem .5rem;
  }
}

/* ============================================================
   MYGTUKAS „Į VIRŠŲ“
   Dešinysis apatinis kampas laisvas — ženkleliai perkelti į kairę,
   todėl mygtukas sėdi pačiame kampe. Tamsus žiedas aplink žalią
   apskritimą atskiria jį nuo po juo atsidūrusio turinio.
   ============================================================ */

/*
 * Klasė kartojama sąmoningai. Elementor rinkinys turi taisyklę
 * `.elementor-kit-6 button { border-radius: 6px }` — ji specifiškesnė už
 * paprastą `.idm-virsun` ir mygtuką paverstų suapvalintu kvadratu.
 * Dviguba klasė pralenkia ją nenaudojant `!important`, todėl prireikus
 * stilių vis dar galima perrašyti.
 */
.idm-virsun.idm-virsun {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 9998;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: var(--idm-akcentas);
  color: var(--idm-mygt-tekstas);
  cursor: pointer;
  box-shadow:
    0 0 0 6px rgba(2, 6, 23, .55),
    0 4px 14px rgba(2, 6, 23, .5);
  /* Paslėptas taip, kad nei matytųsi, nei gaudytų paspaudimus,
     nei būtų pasiekiamas klaviatūra, kol puslapis viršuje. */
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s, background-color .15s ease;
}

.idm-virsun.idm-virsun--matomas {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.idm-virsun.idm-virsun:hover { background-color: #B6F04A; }
.idm-virsun.idm-virsun:active { transform: translateY(1px); }
.idm-virsun.idm-virsun:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 4px; }

.idm-virsun svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 480px) {
  .idm-virsun.idm-virsun { right: 8px; bottom: 8px; width: 42px; height: 42px; }
  .idm-virsun svg { width: 20px; height: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .idm-virsun.idm-virsun { transition: opacity .01ms, visibility .01ms; }
}

/* ============================================================
   ŽENKLIUKAI TITULINIAME PUSLAPYJE
   Blyškus mėlynas švytėjimas aplink „11 kW AC“, „Type 2“ ir kitus
   ženkliukus. Taisyklė apribota `#idm-home` — klasė `chip` per daug
   bendrinė, kad ją keistume visoje svetainėje. ID kartu suteikia
   pakankamą specifiškumą, kad pralenktų importuoto turinio stilius.
   ============================================================ */

/*
 * Klasė kartojama: importuotas turinys turi savo taisyklę tokiu pat
 * selektoriumi `#idm-home .chip` su `border: 1px solid var(--line-2)`,
 * o jo `<style>` įterptas po temos stiliumi — esant vienodam specifiškumui
 * laimėtų jis. Dviguba klasė tai išsprendžia be `!important`.
 */
#idm-home .chip.chip {
  border-color: rgba(var(--idm-svytejimas), .45);
  box-shadow:
    0 0 8px rgba(var(--idm-svytejimas), .25),
    0 0 18px rgba(var(--idm-svytejimas), .12);
}

/* ============================================================
   KREPŠELIO IKONĖLĖ ANTRAŠTĖJE
   Ikonėlę sudaro dvi dalys: dėžutė (pats elementas) ir rankenėlė
   (::after). Todėl naudojamas `drop-shadow`, o ne `box-shadow` —
   pirmasis seka tikrą nupieštą formą su visomis pseudo dalimis,
   antrasis apšviestų tik stačiakampį aplink jas.
   ============================================================ */

.hfe-cart-count {
  filter:
    drop-shadow(0 0 3px rgba(var(--idm-svytejimas), .65))
    drop-shadow(0 0 8px rgba(var(--idm-svytejimas), .40));
  transition: filter .2s ease;
}

.hfe-site-header-cart:hover .hfe-cart-count {
  filter:
    drop-shadow(0 0 4px rgba(var(--idm-svytejimas), .95))
    drop-shadow(0 0 13px rgba(var(--idm-svytejimas), .60));
}

@media (prefers-reduced-motion: reduce) {
  .hfe-cart-count { transition: none; }
}