/* ==========================================================================
   DentStore 2026 — Custom CSS (PrestaShop 1.7 Classic child)
   Doar override-uri CSS. Fără modificări .tpl / structură.
   Mobile-first · Responsive · Optimizat
   ========================================================================== */

/* ==========================================================================
   0. THEME.CSS OVERRIDES — reguli din Classic theme.css care bat custom.css
   Adaugă aici orice regulă problematică din theme.css
   ========================================================================== */

/* Search widget — theme.css limitează la 13rem pe ≥576px */
.header-top .search-widgets,
.header-top .search-widget,
.header-top #search_widget,
.header-search-only .search-widgets,
.header-search-only .search-widget,
.header-search-only #search_widget,
.header-search-only .wbSearch {
  max-width: 707px !important;
  width: 100% !important;
  flex: 1 1 auto !important;
}

/* Container — theme.css setează width: 1140px la ≥1200px */
.container.ds-container {
  width: 100% !important;
  max-width: var(--ds-max-width) !important;
}

/* Carousel — theme.css setează height: 340px */
.carousel .carousel-inner {
  height: auto !important;
  max-height: none !important;
}

/* -----------------------------------------------------------------------
   Search form — override COMPLET via clase custom din template override
   .ds-search-form / .ds-search-input / .ds-search-btn
   ----------------------------------------------------------------------- */

.ds-search-form {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  height: 2.5rem !important;
  border-radius: 9999px !important;
  border: 1.5px solid #000 !important;
  background: #fff !important;
  overflow: hidden !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ds-search-input {
  order: 1 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 0.75rem !important;
  font-size: 0.95rem !important;
  color: #333 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  position: static !important;
}

.ds-search-input:focus {
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.ds-search-btn {
  order: 2 !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  -webkit-transform: none !important;
  transform: none !important;
  width: auto !important;
  height: calc(100% - 4px) !important;
  padding: 0 1.1rem !important;
  margin: 2px !important;
  background: #3b5bdb !important;
  background-color: #3b5bdb !important;
  border: none !important;
  border-radius: 9999px !important;
  color: #fff !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(30,115,190,0.35) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}

.ds-search-btn:hover {
  background: #2f49c7 !important;
  background-color: #2f49c7 !important;
}

.ds-search-btn .material-icons {
  font-size: 1.1rem !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  margin: 0 !important;
  color: #fff !important;
  pointer-events: none !important;
}

/* Material Icons — font-size fix */
#header .material-icons,
.header-top .material-icons {
  font-size: 1.25rem !important;
  width: auto !important;
  height: auto !important;
  vertical-align: middle !important;
}

/* ========================================================================== */

/* --------------------------------------------------------------------------
   1. Design tokens (single source of truth)
   -------------------------------------------------------------------------- */
:root {
  /* Colors */
  --ds-primary: #3b5bdb;
  --ds-primary-rgb: 59, 91, 219;
  --ds-primary-hover: #2f49c7;
  --ds-secondary: #F43F29;
  --ds-bg: #f5f6f8;
  --ds-card-bg: #ffffff;
  --ds-text: #1f2937;
  --ds-text-muted: #6b7280;
  --ds-border: #e5e7eb;
  --ds-white: #ffffff;

  /* Typography */
  --ds-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ds-fs-base: 16px;
  --ds-fs-sm: 14px;
  --ds-fs-lg: 1.125rem;
  --ds-fs-h2: clamp(1.25rem, 2.5vw, 1.75rem);
  --ds-fs-h1: clamp(1.75rem, 3vw, 2.25rem);
  --ds-fs-section-h2: 26px;
  --ds-fs-section-h3: 18px;
  --ds-fs-section-p: 15px;
  --ds-fw-normal: 400;
  --ds-fw-medium: 500;
  --ds-fw-semibold: 600;
  --ds-fw-bold: 700;

  /* Spacing (fluid where useful) */
  --ds-section-y: 1rem;   /* redus — era 2.5rem */
  --ds-card-pad: 1.25rem;   /* 20px */
  --ds-header-pad: 1rem;    /* 16px */
  --ds-grid-gap: 1rem;      /* 16px mobile */

  /* Radius & shadow */
  --ds-radius: 15px;
  --ds-radius-card: 15px;
  --ds-radius-pill: 9999px;
  --ds-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  --ds-shadow-hover: 0 15px 35px rgba(0, 0, 0, 0.08);
  --ds-shadow-cta: 0 8px 20px rgba(59, 91, 219, 0.25);
  --ds-shadow-cta-hover: 0 12px 24px rgba(59, 91, 219, 0.35);

  /* Motion */
  --ds-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ds-duration: 0.2s;

  /* Layout — lățime maximă site (desktop) */
  --ds-max-width: 1530px;

  /* Header — bară sub meniu */
  --ds-header-bar: #e85d3a;
}

@media (min-width: 768px) {
  :root {
    --ds-section-y: 1.5rem;
    --ds-grid-gap: 1.5rem;
  }
}

@media (max-width: 991px) {
  :root {
    --ds-radius: 10px;
    --ds-radius-card: 10px;
    --ds-fs-section-h2: 24px;
    --ds-fs-section-h3: 16px;
    --ds-fs-section-p: 14px;
  }
}

@media (min-width: 1200px) {
  :root {
    --ds-section-y: 2rem;
    --ds-grid-gap: 1.5rem;
    --ds-header-pad: 1.25rem;
  }
}

/* --------------------------------------------------------------------------
   2. Base
   -------------------------------------------------------------------------- */
body {
  font-family: var(--ds-font);
  font-size: var(--ds-fs-base);
  font-weight: var(--ds-fw-normal);
  color: var(--ds-text);
  background-color: var(--ds-bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

html {
  font-size: var(--ds-fs-base);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg {
  max-width: 100%;
  height: auto;
}

.ds-section {
  padding-block: var(--ds-section-y);
}

.ds-card {
  background-color: var(--ds-card-bg);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-card);
  box-shadow: var(--ds-shadow);
}

.ds-content-wrapper {
  min-width: 0;
}

.ds-page-content {
  padding: var(--ds-card-pad);
}

.ds-page-header,
.ds-page-footer {
  margin-bottom: var(--ds-section-y);
}

/* Focus visible for accessibility (no outline on mouse click) */
:focus-visible {
  outline: 2px solid var(--ds-primary);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ds-duration: 0.01ms;
  }
}

/* --------------------------------------------------------------------------
   2b. Layout — container max 1530px (clasa ds-container în .tpl)
   Suprascrie theme.css unde .container are width: 1140px la 1200px+
   -------------------------------------------------------------------------- */
.ds-container {
  max-width: var(--ds-max-width);
  margin-inline: auto;
}

@media (min-width: 1200px) {
  .container.ds-container {
    width: 100%;
    max-width: var(--ds-max-width);
    margin-inline: auto;
  }
}

/* --------------------------------------------------------------------------
   3. Buttons (CTA first)
   -------------------------------------------------------------------------- */
.btn-primary,
button.btn-primary {
  background-color: var(--ds-primary);
  border-color: var(--ds-primary);
  color: var(--ds-white);
  font-weight: var(--ds-fw-semibold);
  padding: 0.75rem 1.5rem;
  border-radius: var(--ds-radius-pill);
  box-shadow: var(--ds-shadow-cta);
  transition: background-color var(--ds-duration) var(--ds-ease),
              border-color var(--ds-duration) var(--ds-ease),
              transform var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
}

.btn-primary:hover,
button.btn-primary:hover {
  background-color: var(--ds-primary-hover);
  border-color: var(--ds-primary-hover);
  color: var(--ds-white);
  transform: translateY(-2px);
  box-shadow: var(--ds-shadow-cta-hover);
}

.btn-primary:active,
button.btn-primary:active {
  transform: translateY(0);
}

.btn-secondary {
  background-color: var(--ds-card-bg);
  border: 1px solid var(--ds-primary);
  color: var(--ds-primary);
  font-weight: var(--ds-fw-medium);
  padding: 0.5rem 1.25rem;
  border-radius: var(--ds-radius-pill);
  transition: background-color var(--ds-duration) var(--ds-ease),
              color var(--ds-duration) var(--ds-ease);
}

.btn-secondary:hover {
  background-color: rgba(var(--ds-primary-rgb), 0.08);
  color: var(--ds-primary-hover);
}

/* --------------------------------------------------------------------------
   4. Product cards (.product-miniature)
   -------------------------------------------------------------------------- */
.products .product-miniature,
.product-miniature {
  background: var(--ds-card-bg);
  border-radius: var(--ds-radius-card);
  box-shadow: var(--ds-shadow);
  padding: var(--ds-card-pad);
  transition: transform var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
  overflow: hidden;
}

.products .product-miniature:hover,
.product-miniature:hover {
  transform: translateY(-4px);
  box-shadow: var(--ds-shadow-hover);
}

/* Card image container — scale on hover */
.product-miniature .product-cover-link,
.product-miniature .thumbnail-container {
  display: block;
  overflow: hidden;
  border-radius: var(--ds-radius);
}

.product-miniature .product-cover-link img,
.product-miniature .thumbnail-container img {
  width: 100%;
  height: auto;
  object-fit: contain;
  transition: transform var(--ds-duration) var(--ds-ease);
}

.product-miniature:hover .product-cover-link img,
.product-miniature:hover .thumbnail-container img {
  transform: scale(1.03);
}

/* Product title */
.product-miniature .product-title a,
.product-miniature .product-title {
  font-size: var(--ds-fs-sm);
  font-weight: var(--ds-fw-medium);
  color: var(--ds-text);
  line-height: 1.35;
}

.product-miniature .product-title a:hover {
  color: var(--ds-primary);
}

/* Price — current (bold, primary) */
.product-miniature .product-price-and-shipping .price,
.product-miniature .current-price,
.product-miniature .product-price {
  font-weight: var(--ds-fw-bold);
  color: var(--ds-primary);
  font-size: var(--ds-fs-lg);
}

/* Regular price (strikethrough, muted) */
.product-miniature .regular-price {
  color: var(--ds-text-muted);
  text-decoration: line-through;
  font-size: var(--ds-fs-sm);
  font-weight: var(--ds-fw-normal);
}

/* Discount badge */
.product-miniature .discount,
.product-miniature .product-discount {
  background-color: var(--ds-secondary);
  color: var(--ds-white);
  font-weight: var(--ds-fw-bold);
  font-size: 0.75rem;
  padding: 0 0.5rem;
  height: 32px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--ds-radius);
  position: absolute;
  top: var(--ds-card-pad);
  right: var(--ds-card-pad);
}

/* CTA in card — full width on mobile */
.product-miniature .btn-primary {
  width: 100%;
}

@media (min-width: 768px) {
  .product-miniature .btn-primary {
    width: auto;
  }
}

/* Products grid spacing */
.products {
  gap: var(--ds-grid-gap);
}

/* ── DS Product Card (design Figma) ── */

/* Wrapper ocupă înălțimea celulei grid */
.ds-product-card-wrap,
.ds-product-card-wrap .js-product {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Override stiluri vechi .product-miniature pentru noul card */
.product-miniature.ds-product-card {
  padding: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: var(--ds-radius-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  flex: 1;
  transition: box-shadow 0.25s ease;
}

.product-miniature.ds-product-card:hover {
  transform: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
}

/* Zona imagine — fundal gri, colțuri rotunde sus */
.ds-card-image {
  background: #ffffff;
  border-radius: var(--ds-radius-card) var(--ds-radius-card) 0 0;
  position: relative;
  aspect-ratio: 285 / 209;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.ds-card-img-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0.25rem 1.25rem 0.25rem 1.25rem;
}

.ds-card-img-link img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transition: transform 0.25s ease;
}

.ds-product-card:hover .ds-card-img-link img {
  transform: scale(1.04);
}

/* Buton favorite */
.ds-card-fav {
  position: absolute;
  top: 12px;
  left: 14px;
  z-index: 2;
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  color: #bbb;
  line-height: 0;
  transition: color 0.15s ease;
}

.ds-card-fav:hover {
  color: #F95B52;
}

.ds-card-fav svg path {
  transition: fill 0.15s ease, stroke 0.15s ease;
}

.ds-card-fav:hover svg path {
  stroke: #F95B52;
  fill: #F95B52;
}

/* Badge reducere / nou */
.ds-card-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  background: #F43F29;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  height: 32px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  white-space: nowrap;
}

.ds-card-badge--new {
  background: #306BEE;
}

/* Corp card */
.ds-card-body {
  padding: 16px 22px 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Nume produs */
.ds-card-name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-size: 15px;
  font-weight: 600;
  color: #000;
  line-height: 22px;
  text-decoration: none;
  margin-bottom: 10px;
}

.ds-card-name:hover {
  color: #306BEE;
}

/* Disponibilitate */
.ds-card-stock {
  display: block;
  font-size: 13px;
  font-weight: 500;
  line-height: 22px;
  margin-bottom: 8px;
}

.ds-card-stock--in  { color: #009900; }
.ds-card-stock--out { color: #c00; }

/* Prețuri + Buton — wrapper comun */
.ds-card-bottom {
  display: flex;
  flex-direction: column;
  margin-top: auto;
}

/* Prețuri */
.ds-card-prices {
  display: flex;
  flex-direction: column;
}

.ds-card-old-price {
  font-size: 13px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.6);
  text-decoration: line-through;
  line-height: 22px;
}

.ds-card-price {
  font-size: 18px;
  font-weight: 700;
  color: #000;
  line-height: 22px;
  transition: color 0.25s ease;
}

.ds-product-card:hover .ds-card-price {
  color: #306BEE;
}

/* Buton Cumpără */
.ds-card-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
  height: 42px;
  border-radius: 40px;
  background: #306BEE;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  border: 1.5px solid #306BEE;
  transition: background 0.25s ease, color 0.25s ease;
  flex-shrink: 0;
}

.ds-product-card:hover .ds-card-btn {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(48, 107, 238, 0.2) 100%);
  color: #306BEE !important;
}

/* Custom scrollbar progres — ascuns pe desktop, vizibil pe mobil */
.ds-scrollbar-track {
  display: none;
  position: relative;
  height: 4px;
  background: #ebebeb;
  border-radius: 99px;
  margin-top: 12px;
  overflow: hidden;
}

.ds-scrollbar-thumb {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: #111;
  border-radius: 99px;
  transition: width 0.1s ease, left 0.1s ease;
}

/* Mobile card overrides */
@media (max-width: 991px) {
  /* Pe mobil butoanele dispar — userul swipe-ează cu scrollbar stilizat */
  .ds-carousel-btn {
    display: none !important;
  }

  /* Scrollbar custom HTML vizibil pe mobil */
  .ds-scrollbar-track {
    display: block;
  }

  /* Scrollbar nativ ascuns pe mobil (înlocuit de cel custom) */
  .ds-featured-products .ds-carousel-track-wrap {
    scrollbar-width: none;
  }
  .ds-featured-products .ds-carousel-track-wrap::-webkit-scrollbar {
    display: none;
    height: 0;
  }

  .product-miniature.ds-product-card {
    border-radius: var(--ds-radius-card);
  }

  .ds-card-image {
    border-radius: var(--ds-radius-card) var(--ds-radius-card) 0 0;
    aspect-ratio: 232 / 141;
  }

  .ds-card-body {
    padding: 12px 14px 14px;
  }

  .ds-card-name {
    font-size: 14px;
    font-weight: 500;
  }

  .ds-card-stock {
    font-size: 12px;
  }

  .ds-card-old-price {
    font-size: 13px;
  }

  .ds-card-price {
    font-size: 16px;
  }

  /* Pe mobile: prețuri stânga + buton icon dreapta pe același rând */
  .ds-card-bottom {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
  }

  /* Buton devine mic pătrat cu icon, fără text */
  .ds-card-btn {
    margin-top: 0;
    width: 46px;
    height: 38px;
    border-radius: var(--ds-radius-card);
    flex-shrink: 0;
    gap: 0;
  }

  .ds-card-btn-label {
    display: none;
  }

  .ds-card-btn-icon {
    width: 20px;
    height: 20px;
  }
}

/* --------------------------------------------------------------------------
   5. Header — Rând 1: Logo | Search | Cont | Coș   /   Rând 2: Categorii | Suna-ne
   -------------------------------------------------------------------------- */
#header {
  background-color: var(--ds-card-bg);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: none;
}

/* Bară roșie jos */
#header .header-banner {
  display: none;
}
#header .header-banner > * { display: none; }

/* ── RÂND 1: header-top ── */
#header .header-top {
  padding-block: var(--ds-header-pad);
  border-bottom: 1px solid var(--ds-border);
  padding: 1.12rem 0;
}

#header .header-top .container.ds-container,
#header .header-nav .container.ds-container {
  padding-left: 0.45rem;
  padding-right: 0.75rem;
}

/* Layout: Logo (stânga fix) + header-search (flex, ocupă spațiu) */
.header-row-1 {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  width: 100%;
}

.ds-mobile-burger {
  display: none;
}

/* Search ocupă spațiul disponibil, actions merg la dreapta */
.header-search-only {
  flex: 1 1 auto !important;
  max-width: 707px !important;
}

.header-actions {
  margin-left: auto;
}

#_desktop_logo {
  flex: 0 0 auto;
}

.ds-logo-title {
  margin: 0;
  line-height: 1;
}

.ds-logo-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.ds-logo-img {
  display: block;
  width: auto;
  height: 47px;
}

#_desktop_logo img {
  max-height: 47px;
  width: auto;
  display: block;
}

#_desktop_logo h1 {
  margin: 0;
  line-height: 1;
}

/* Zona search (rând 1) — arată DOAR search-ul, ascunde meniul */
.header-search-only {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  max-width: 707px;
}

/* Ascunde meniul (wbmegamenu) din rând 1 — clasa exactă */
.header-search-only #_desktop_top_menu,
.header-search-only .container_wb_megamenu {
  display: none !important;
}

/* Zona auth + coș (rând 1) — aliniat la dreapta */
.header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 2rem;
  margin-left: auto;
}

.header-quick-links {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.ds-quick-order-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  height: 2.375rem;
  padding: 0 0.95rem;
  border: 1.4px solid #151515;
  border-radius: 9999px;
  color: #151515;
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1;
  margin-right: 35px;
}

.ds-quick-order-link img {
  width: 0.92rem;
  height: 0.96rem;
  display: block;
}

.ds-favorite-link {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  gap: 0.1rem;
}

.ds-favorite-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.ds-favorite-icon img {
  width: auto;
  height: 27px;
  display: block;
}

.header-mobile-phone {
  display: none;
}

/* Cont și Coș */
.header-actions .user-info,
.header-actions [id*="user_info"] { flex: 0 0 auto; }

.header-actions .blockcart,
.header-actions [id*="cart"],
.header-actions .cart-preview { flex: 0 0 auto; }

/* Search form — 707px, border negru */
#header form[action*="search"],
#header #search_widget form,
#header .search-widget form,
#header .search-widgets form,
#header .input-group {
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 2.5rem;
  position: relative;
  border-radius: 9999px;
  border: 1.5px solid #2a2a2a;
  overflow: hidden;
  background: var(--ds-card-bg);
  transition: border-color var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
}

#header form[action*="search"]:focus-within,
#header #search_widget form:focus-within,
#header .search-widget form:focus-within {
  border-color: #000000;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1);
}

#header .search_query,
#header input[name="s"],
#header input[type="search"],
#header #search_widget input,
#header .search-widget input {
  flex: 1;
  min-width: 0;
  order: 1;
  border: 0;
  border-radius: 9999px;
  padding: 0.5rem 6.2rem 0.5rem 0.95rem;
  font-size: var(--ds-fs-base);
  background: transparent;
  height: 100%;
}

#header #search_widget i.search,
#header .search-widget i.search,
#header .search-widgets i.search {
  position: absolute;
  right: 4.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 21px;
  height: 19px;
  font-size: 0 !important;
  line-height: 1;
  color: transparent;
  z-index: 2;
  pointer-events: none;
}

#header #search_widget i.search::before,
#header .search-widget i.search::before,
#header .search-widgets i.search::before {
  content: "";
  display: block;
  width: 21px;
  height: 19px;
  background: center / contain no-repeat url("../img/icons/search_folder.svg");
}

#header #search_widget i.clear,
#header .search-widget i.clear,
#header .search-widgets i.clear {
  display: none !important;
}

#header #search_widget form::after,
#header .search-widget form::after,
#header .search-widgets form::after {
  content: "search";
  font-family: "Material Icons";
  position: absolute;
  right: 3px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 32px;
  border-radius: 9999px;
  background: var(--ds-primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  /* box-shadow: 0 2px 8px rgba(30, 115, 190, 0.35); */
  pointer-events: none;
}

#header .search_query::placeholder,
#header input[name="s"]::placeholder {
  color: var(--ds-text-muted);
}

/* Buton search albastru — pill complet */
#header .input-group-btn,
#header form[action*="search"] button[type="submit"],
#header #search_widget button[type="submit"],
#header .search-widget button[type="submit"],
#header .button-search {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  order: 2;
  width: auto;
  height: 2.5rem;
  padding: 0 1.25rem;
  gap: 0.4rem;
  background-color: var(--ds-primary);
  border: none;
  border-radius: 9999px;
  color: var(--ds-white);
  font-size: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
  box-shadow: 0 2px 8px rgba(30, 115, 190, 0.35);
}

#header .input-group-btn:hover,
#header .button-search:hover,
#header form[action*="search"] button[type="submit"]:hover {
  background-color: var(--ds-primary-hover);
  box-shadow: 0 4px 14px rgba(30, 115, 190, 0.45);
}

#header .input-group-btn .material-icons,
#header .button-search .material-icons,
#header form[action*="search"] button[type="submit"] .material-icons,
#header #search_widget button[type="submit"] .material-icons,
#header .search-widget button[type="submit"] .material-icons,
#header .input-group-btn svg,
#header .button-search svg {
  font-size: 1.15rem;
  width: 1.15rem;
  height: 1.15rem;
  line-height: 1;
  pointer-events: none;
  margin: 0;
}

.ds-search-btn-icon {
  width: 18px;
  height: 18px;
  display: block;
}

.ds-search-left-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 100%;
  flex: 0 0 auto;
}

@media (min-width: 992px) {
  .ds-search-left-icon {
    display: none !important;
  }
}

.ds-search-left-icon img {
  width: 21px;
  height: 19px;
  display: block;
}

/* Cont + Coș — icon deasupra, text dedesubt */
.ds-account-link,
.ds-cart-link {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.15rem !important;
  text-decoration: none !important;
  color: var(--ds-text) !important;
  transition: color var(--ds-duration) var(--ds-ease) !important;
}

.ds-account-link:hover,
.ds-cart-link:hover {
  color: var(--ds-primary) !important;
}

.ds-nav-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 27px !important;
  line-height: 1 !important;
}

.ds-nav-icon svg {
  width: auto !important;
  height: 27px !important;
  display: block !important;
}

.ds-nav-icon img {
  width: auto !important;
  height: 27px !important;
  display: block !important;
}

.ds-nav-label {
  font-size: 0.64rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  display: block !important;
}

/* Icon + badge coș */
.ds-cart-icon-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ds-cart-badge {
  position: absolute !important;
  top: -0.3rem !important;
  right: -0.4rem !important;
  min-width: 1.1rem !important;
  height: 1.1rem !important;
  padding: 0 0.2rem !important;
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  line-height: 1.1rem !important;
  text-align: center !important;
  background: var(--ds-primary) !important;
  color: #fff !important;
  border-radius: 9999px !important;
}

/* Ascunde badge când coșul e gol */
.ds-cart-badge:empty,
.ds-cart-badge[data-count="0"] {
  display: none !important;
}

.blockcart.inactive .ds-cart-badge {
  display: none !important;
}

/* ── RÂND 2: header-nav ── */
#header .header-nav {
  background-color: var(--ds-card-bg);
  border-bottom: 0px;
  padding-block: 0.1rem;
}

.header-row-2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

/* Categorii rând 2 — arată DOAR meniul, ascunde search */
.header-categories-only {
  flex: 1 1 auto;
  min-width: 0;
}

/* Ascunde search-ul din rând 2 — arată doar meniul */
.header-categories-only #search_widget,
.header-categories-only .search-widget,
.header-categories-only [id*="search_widget"],
.header-categories-only .wbSearch {
  display: none !important;
}

.header-categories-only ul,
.header-categories-only nav ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.header-categories-only a {
  font-size: var(--ds-fs-sm);
  font-weight: var(--ds-fw-medium);
  color: var(--ds-text);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  transition: color var(--ds-duration) var(--ds-ease);
}

.header-categories-only #_desktop_top_menu .top-menu > li > a {
  gap: 0.5rem;
}

.header-categories-only .ds-menu-thumb {
  width: 21px;
  height: 21px;
  object-fit: cover;
  border-radius: 7px;
  display: inline-block;
  flex: 0 0 21px;
}

.header-categories-only .ds-menu-label {
  display: inline-block;
  line-height: 1.1;
}

.header-categories-only a:hover { color: var(--ds-primary); }

/* Iconițe categorii din wbmegamenu */
.header-categories-only .img-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Suna-ne — dreapta */
.header-phone {
  flex: 0 0 auto;
  align-self: center;
  font-size: var(--ds-fs-sm);
  font-weight: var(--ds-fw-medium);
  color: var(--ds-text);
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.header-phone > *,
.header-phone p,
.header-phone div,
.header-phone span {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

.header-phone a {
  color: var(--ds-text);
  text-decoration: none;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem;
  transition: color var(--ds-duration) var(--ds-ease);
}

.ds-phone-icon {
  width: 22px;
  height: 22px;
  display: block;
}

.header-phone a:hover { color: var(--ds-primary); }

/* Mobil */
@media (max-width: 991px) {
  #header .header-top {
    padding-block: 0.9rem 0.8rem;
    border-bottom: 0;
  }

  #header .header-top .container.ds-container {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .header-row-1 {
    display: grid;
    grid-template-columns: 2.6rem minmax(120px, 1fr) auto;
    grid-template-areas:
      "burger logo actions"
      "search search search";
    align-items: center;
    column-gap: 0.6rem;
    row-gap: 0.8rem;
  }

  .ds-mobile-burger {
    grid-area: burger;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    color: #000;
    text-decoration: none;
    width: 2.4rem;
    height: 2.4rem;
    position: relative;
  }

  .ds-mobile-burger .material-icons {
    display: none !important;
  }

  .ds-mobile-burger::before {
    content: "";
    width: 1.75rem;
    height: 0.2rem;
    background: #111;
    border-radius: 9999px;
    box-shadow: 0 0.48rem 0 #111, 0 -0.48rem 0 #111;
  }

  #_desktop_logo {
    grid-area: logo;
    min-width: 0;
  }

  .ds-logo-img {
    height: 60px;
    width: auto;
    max-width: 100%;
  }

  .header-actions {
    grid-area: actions;
    gap: 1.35rem;
    margin-left: 0;
    justify-self: end;
  }

  .header-quick-links,
  .ds-favorite-link {
    display: none !important;
  }

  .header-mobile-phone {
    display: flex;
    align-items: center;
  }

  .header-mobile-phone > * {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  .header-mobile-phone a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 2.45rem;
    height: 2.45rem;
    color: #000 !important;
    text-decoration: none !important;
  }

  .header-mobile-phone .ds-phone-icon {
    width: 2.45rem;
    height: 2.45rem;
  }

  .header-mobile-phone .ds-phone-value,
  .header-mobile-phone .ds-phone-label {
    display: none !important;
  }

  .header-mobile-phone p,
  .header-mobile-phone div,
  .header-mobile-phone span {
    font-size: 0 !important;
    line-height: 0 !important;
  }

  .header-search-only {
    grid-area: search;
    max-width: 100% !important;
  }

  .header-search-only #search_widget,
  .header-search-only .search-widget,
  .header-search-only .ds-search-widget {
    width: 100%;
    max-width: 100%;
  }

  .ds-search-form {
    height: 3.75rem !important;
    border: 3px solid #b8b8bc !important;
    border-radius: 9999px !important;
    background: #f6f6f7 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08) !important;
    padding: 0 1.1rem !important;
    overflow: hidden !important;
  }

  .ds-search-left-icon {
    width: 2.7rem;
    color: #111;
    font-size: 2.15rem;
    margin-right: 0.3rem;
    flex-shrink: 0;
  }

  .ds-search-left-icon img {
    width: 2.7rem;
    height: auto;
  }

  .ds-search-input {
    font-size: 1.12rem !important;
    color: #9ea2a8 !important;
    padding: 0 !important;
  }

  #header #search_widget input,
  #header .search-widget input,
  #header .search-widgets input {
    padding: 0.5rem 2.45rem 0.5rem 2.75rem;
  }

  #header #search_widget i.search,
  #header .search-widget i.search,
  #header .search-widgets i.search {
    left: 0.75rem;
  }

  #header #search_widget form::after,
  #header .search-widget form::after,
  #header .search-widgets form::after {
    right: 0.8rem;
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #3b5bdb;
    font-size: 2.15rem;
  }

  .ds-search-btn {
    width: 2.2rem !important;
    height: 2.2rem !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .ds-search-btn-icon {
    width: 2.05rem;
    height: 2.05rem;
  }

  .ds-nav-label {
    display: none !important;
  }

  .ds-nav-icon,
  .ds-nav-icon img {
    height: 2.45rem !important;
    width: auto !important;
  }

  #header .header-nav { display: none; }
}

/* --------------------------------------------------------------------------
   6. Footer (#footer)
   -------------------------------------------------------------------------- */
#footer {
  background-color: #f5f5f7;
  margin-top: var(--ds-section-y);
  padding-top: 0;
}

/* — Newsletter section — */
.ds-footer-nl-section {
  padding: 43px 0 38px;
  border-bottom: 1px solid #e0e0e0;
}

.ds-footer-newsletter {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 64px;
}

.ds-footer-nl-text {
  flex-shrink: 0;
  max-width: 380px;
}

.ds-footer-nl-title {
  font-size: 18px;
  font-weight: 700;
  color: #0d1017;
  margin: 0 0 4px;
  line-height: 1.4;
}

.ds-footer-nl-desc {
  font-size: 16px;
  color: #0d1017;
  margin: 0;
}

.ds-footer-nl-form { flex-shrink: 0; }

.ds-footer-nl-field {
  display: flex;
  align-items: center;
  border: 1px solid #dcdcdc;
  border-radius: 40px;
  background: #fff;
  overflow: hidden;
  height: 50px;
  width: 442px;
  max-width: 100%;
}

.ds-footer-nl-field input[type="email"] {
  flex: 1;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
  padding: 0 16px;
  font-size: 16px;
  color: #0d1017;
  height: 100%;
  border-radius: 0;
}

.ds-footer-nl-btn {
  background: #306BEE;
  color: #fff;
  border: none;
  border-radius: 40px;
  padding: 0 24px;
  height: 50px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s;
}

.ds-footer-nl-btn:hover { background: #1d59db; }

.ds-footer-nl-msg { margin-bottom: 8px; font-size: 14px; }
.ds-footer-nl-msg--error { color: var(--ds-secondary); }
.ds-footer-nl-msg--success { color: #22c55e; }

/* — Link columns — */
.ds-footer-main { padding: 55px 0 55px; }

.ds-footer-cols {
  display: flex;
  gap: 0;
}

/* Hide non-linklist modules injected into displayFooter (myaccount, contactinfo, wishlist) */
.ds-footer-cols > *:not(.ds-footer-col) {
  display: none !important;
}

.ds-footer-col { flex: 1; }

.ds-footer-col-title {
  font-size: 18px;
  font-weight: 700;
  color: #0d1017;
  margin: 0 0 14px;
  line-height: 1.4;
}

.ds-footer-col-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ds-footer-col-links li { line-height: 28px; }

.ds-footer-col-links a {
  font-size: 16px;
  color: #0d1017;
  text-decoration: none;
  transition: color 0.2s;
}

.ds-footer-col-links a:hover { color: var(--ds-primary); }

/* ISO badges */
.ds-footer-iso {
  display: flex;
  gap: 14px;
  margin-top: 18px;
}

.ds-footer-iso img {
  width: 70px;
  height: 70px;
  object-fit: contain;
}

/* — Bottom bar — */
.ds-footer-bottom {
  border-top: 1px solid #e0e0e0;
  padding: 20px 0;
}

.ds-footer-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.ds-footer-copyright {
  font-size: 16px;
  color: #0d1017;
  margin: 0;
  white-space: nowrap;
}

.ds-footer-anpc {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ds-footer-anpc img,
.ds-footer-payment img {
  height: 34px;
  object-fit: contain;
}

#footer a,
#footer a:visited {
  color: #0d1017 !important;
  transition: color 0.2s;
}

#footer a:hover { color: var(--ds-primary) !important; }

/* — Toggle button desktop: hide chevron, show title only — */
.ds-footer-col-toggle {
  display: contents; /* desktop: invisible wrapper, title/links always visible */
  background: none;
  border: none;
  padding: 0;
  text-align: left;
  cursor: default;
  width: 100%;
}

.ds-footer-col-chevron { display: none; }

@media (max-width: 991px) {
  .ds-footer-nl-section { padding: 30px 0 70px 0; }
  .ds-footer-main { padding: 0; }

  .ds-footer-newsletter {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  .ds-footer-nl-field {
    height: 36px;
  }

  .ds-footer-nl-btn {
    height: 36px;
    padding: 0 18px;
    font-size: 14px;
  }

  .ds-footer-nl-field input[type="email"] {
    font-size: 13px;
  }

  .ds-footer-nl-field,
  .ds-footer-nl-form { width: 100%; }

  /* Accordion columns */
  .ds-footer-cols {
    flex-direction: column;
    gap: 0;
  }

  .ds-footer-col {
    flex: 0 0 100%;
    border-bottom: 1px solid #e0e0e0;
  }

  .ds-footer-col-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 18px 0;
    cursor: pointer;
    background: none;
    border: none;
  }

  .ds-footer-col-title {
    font-size: 20px;
    font-weight: 500;
    margin: 0;
  }

  .ds-footer-col-chevron {
    display: block;
    flex-shrink: 0;
    transition: transform 0.2s;
  }

  .ds-footer-col-toggle[aria-expanded="true"] .ds-footer-col-chevron {
    transform: rotate(180deg);
  }

  /* Hide links by default, show on expand */
  .ds-footer-col-links {
    display: none;
    padding-bottom: 12px;
  }

  /* ISO badges hidden on mobile */
  .ds-footer-iso { display: none; }

  .ds-footer-bottom { padding-top: 70px; }

  .ds-footer-bottom-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
  }

  .ds-footer-anpc { justify-content: center; }
}

@media (max-width: 575px) {
  .ds-footer-col { flex: 0 0 100%; }
}

/* --------------------------------------------------------------------------
   7. Forms (inputs, selects)
   -------------------------------------------------------------------------- */
input:not([type="submit"]):not([type="button"]):not([type="image"]),
select,
.form-control,
.form-group input {
  border-radius: var(--ds-radius);
  border-color: var(--ds-border);
  font-size: var(--ds-fs-base);
  padding: 0.5rem 0.75rem;
  transition: border-color var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
}

input:focus,
select:focus,
.form-control:focus {
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 3px rgba(var(--ds-primary-rgb), 0.12);
}

/* --------------------------------------------------------------------------
   8. Product page (detail)
   -------------------------------------------------------------------------- */
.product-cover img,
.product-information {
  border-radius: var(--ds-radius-card);
}

.product-information .product-price .current-price,
.product-information .product-price .current-price-value {
  font-weight: var(--ds-fw-bold);
  color: var(--ds-primary);
  font-size: 1.5rem;
}

.product-information .add-to-cart .btn-primary {
  min-width: 12rem;
}

@media (max-width: 767px) {
  .product-information .add-to-cart .btn-primary {
    width: 100%;
    min-width: 0;
  }
}

/* --------------------------------------------------------------------------
   9. Sections / layout spacing
   -------------------------------------------------------------------------- */
#content-wrapper,
.main-content {
  padding-block: var(--ds-section-y);
}

/* --------------------------------------------------------------------------
   9a. Spațiu înainte de carousel — reducem padding-ul din #wrapper / #content
   -------------------------------------------------------------------------- */
#content-wrapper,
.main-content,
#wrapper {
  padding-top: 0 !important;
  margin-top: 0 !important;
  background: #ffffff !important;
}

/* --------------------------------------------------------------------------
   9b. Carousel / Slider — override theme.css (.carousel .carousel-inner { height: 340px })
   -------------------------------------------------------------------------- */
.carousel {
  border-radius: var(--ds-radius-card) !important;
  overflow: hidden !important;
}

.carousel .carousel-inner {
  height: auto !important;
  border-radius: var(--ds-radius-card) !important;
  overflow: hidden !important;
}

.carousel .carousel-item,
.carousel .item {
  height: auto !important;
}

.carousel img {
  width: 100%;
  height: auto !important;
  max-height: none !important;
  object-fit: unset;
}

/* Slider wbimageslider */
.homeslider-container {
  margin-bottom: 0;
  overflow: visible !important;
  max-height: none !important;
}

.homeslider {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

.homeslider li {
  height: auto !important;
  max-height: none !important;
}

/* Slide activ — lasă înălțimea naturală a imaginii */
.homeslider li.rslides_on {
  position: relative !important;
  height: auto !important;
}

.homeslider img {
  display: block;
  width: 100%;
  height: auto !important;
  max-height: none !important;
  object-fit: contain;
}

/* --------------------------------------------------------------------------
   10. Featured Products Carousel
   -------------------------------------------------------------------------- */

/* Section wrapper */
.ds-featured-products {
  padding: 2rem 0;
}

/* Header: titlu + butoane nav */
.ds-featured-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.ds-featured-title {
  font-size: 1.5rem;
  font-weight: var(--ds-fw-semibold);
  color: var(--ds-text-dark);
  margin: 0;
}

/* Butoane prev/next */
.ds-carousel-nav {
  display: flex;
  gap: 0.5rem;
}

/* Wrapper relativ pentru butoane flotante */
.ds-carousel-wrap {
  position: relative;
}

.ds-carousel-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 54px;
  border: 1.5px solid #ddd;
  border-radius: 8px;
  background: #fff;
  color: #111;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.10);
  transition: background var(--ds-duration) var(--ds-ease),
              border-color var(--ds-duration) var(--ds-ease),
              box-shadow var(--ds-duration) var(--ds-ease);
  /* Desktop: flotant pe margini, centrat vertical pe carusel */
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.ds-carousel-prev {
  left: -22px;
}

.ds-carousel-next {
  right: -22px;
}

.ds-carousel-btn:hover:not(:disabled) {
  background: var(--ds-primary);
  border-color: var(--ds-primary);
  color: #fff;
  box-shadow: 0 4px 12px rgba(48,107,238,0.25);
}

.ds-carousel-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

/* Wrapper ascunde overflow; track = banda care rulează */
.ds-featured-products .ds-carousel-track-wrap {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  width: 100%;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch;
  /* Desktop: scrollbar ascuns */
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.ds-featured-products .ds-carousel-track-wrap::-webkit-scrollbar {
  display: none;
  height: 0;
}

.ds-featured-products {
  container-type: inline-size;
  container-name: featured-products;
  overflow: visible;
}

.ds-carousel-wrap {
  position: relative;
}

.ds-featured-products .ds-carousel-track {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-template-rows: 1fr !important;
  grid-template-columns: none !important;
  grid-auto-columns: calc((100cqw - 4 * 1rem) / 5) !important;
  gap: 1rem !important;
  width: max-content !important;
  min-width: 100% !important;
  min-height: 0;
}

.ds-carousel-track::-webkit-scrollbar {
  display: none;
}

.ds-featured-products .ds-carousel-item {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  min-width: 0;
}

.ds-carousel-item,
.ds-carousel-item > *,
.ds-carousel-item .js-product,
.ds-carousel-item [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  float: none !important;
}

/* Footer – buton "Vezi toate" */
.ds-featured-footer {
  margin-top: 1.5rem;
  text-align: center;
}

.ds-view-all {
  padding: 0.6rem 2rem;
  border-radius: var(--ds-radius-pill);
  font-weight: var(--ds-fw-medium);
}

@container featured-products (max-width: 1199px) {
  .ds-featured-products .ds-carousel-track {
    grid-auto-columns: calc((100cqw - 3 * 1rem) / 4) !important;
  }
}

@container featured-products (max-width: 991px) {
  .ds-featured-products .ds-carousel-track {
    grid-auto-columns: calc((100cqw - 2 * 1rem) / 3) !important;
  }
}

@container featured-products (max-width: 767px) {
  .ds-featured-products .ds-carousel-track {
    grid-auto-columns: calc((100cqw - 0.5rem) / 1.5) !important;
  }
}

@container featured-products (max-width: 575px) {
  .ds-featured-products .ds-carousel-track {
    grid-auto-columns: calc((100cqw - 0.5rem) / 1.5) !important;
  }
}

/* --------------------------------------------------------------------------
   11. Links (accent)
   -------------------------------------------------------------------------- */
a {
  color: var(--ds-primary);
  transition: color var(--ds-duration) var(--ds-ease);
}

a:hover {
  color: var(--ds-primary-hover);
}

/* Body text links only (not nav) — optional: restrict to .content a if needed */
.content a:not(.btn) {
  color: var(--ds-primary);
  text-underline-offset: 2px;
}

.content a:not(.btn):hover {
  color: var(--ds-primary-hover);
}

/* --------------------------------------------------------------------------
   12. Produse pe categorii
   -------------------------------------------------------------------------- */

.ds-cat-section {
  margin-top: 30px;
  margin-bottom: 30px;
}

.ds-cat-wrap {
  background: #f5f5f7;
  border-radius: 15px;
  padding: 30px;
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
}

.ds-cat-intro {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
}

.ds-cat-title {
  margin: 0;
  font-size: var(--ds-fs-section-h2);
  font-weight: 600;
  line-height: 1.2;
  color: #000;
}

.ds-cat-intro p {
  margin: 0;
  font-size: var(--ds-fs-section-p);
  line-height: 1.55;
  color: #2e2e2e;
}

.ds-cat-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.ds-cat-card {
  position: relative;
  min-height: 300px;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: linear-gradient(165deg, #0f6f95 0%, #0f4f83 45%, #0a2d5f 100%);
}

.ds-cat-card-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ds-cat-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 24, 46, 0.12) 10%, rgba(7, 24, 46, 0.82) 100%);
}

.ds-cat-icon-box {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.93);
  display: grid;
  place-items: center;
  z-index: 2;
}

.ds-cat-icon-box img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.ds-cat-card-content {
  position: relative;
  z-index: 2;
  padding: 20px 16px 16px;
  color: #fff;
}

.ds-cat-card-content h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.22;
}

.ds-cat-card-content p {
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.96);
  display: -webkit-box;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ds-cat-card-detail {
  color: rgba(255, 255, 255, 0.86) !important;
}

.ds-cat-card-actions {
  margin-top: 14px;
}

.ds-cat-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  color: #fff !important;
  text-decoration: none !important;
  font-size: 14px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(2px);
}

.ds-cat-btn:hover {
  color: #fff !important;
  border-color: #fff;
  background: rgba(255, 255, 255, 0.2);
}

@media (max-width: 1199px) {
  .ds-cat-wrap {
    grid-template-columns: 1fr;
  }

  .ds-cat-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ds-cat-section {
    margin-top: 20px;
    margin-bottom: 24px;
  }

  .ds-cat-wrap {
    padding: 16px;
    gap: 12px;
  }

  .ds-cat-title {
    font-size: 28px;
  }

  .ds-cat-intro p {
    font-size: 14px;
  }

  .ds-cat-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ds-cat-card {
    min-height: 250px;
  }

  .ds-cat-card-content h3 {
    font-size: 20px;
  }
}

/* --------------------------------------------------------------------------
   13. Cursurile noastre + Ultimele articole
   -------------------------------------------------------------------------- */

/* Section wrapper */
.ds-ca-section {
  background: #f5f5f7;
  padding: 60px calc(50vw - 50%) 50px;
  margin-top: var(--ds-section-y);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Two-column grid */
.ds-ca-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: stretch;
}

.ds-ca-courses {
  display: flex;
  flex-direction: column;
}

/* Column header */
.ds-ca-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 40px;
}

.ds-ca-title {
  font-size: var(--ds-fs-section-h2);
  font-weight: 700;
  color: #000;
  margin: 0;
  white-space: nowrap;
}

.ds-ca-badge-active {
  background: #F43F29;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 5px 14px;
  border-radius: 6px;
  white-space: nowrap;
}

/* View all link */
.ds-ca-viewall {
  margin-top: 18px;
  text-align: right;
}

.ds-ca-viewall a {
  color: #306BEE !important;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none !important;
}

.ds-ca-viewall a:hover {
  text-decoration: underline !important;
}

/* ── Course card ── */
.ds-course-card {
  background: #fff;
  border-radius: 15px;
  overflow: hidden;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.ds-course-card-body {
  display: flex;
  gap: 20px;
  padding: 30px 30px 35px;
  flex: 1;
  align-items: flex-start;
  align-items: flex-start;
}

.ds-course-thumb {
  flex: 0 0 52%;
  aspect-ratio: 270 / 204;
  border-radius: 12px;
  overflow: hidden;
}

.ds-course-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ds-course-detail {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.ds-course-date {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 15px;
  color: #000;
  margin-bottom: 10px;
}

.ds-course-date img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.ds-course-name {
  font-size: 24px;
  font-weight: 600;
  color: #000;
  line-height: 1.3;
  margin: 0 0 20px;
}

.ds-course-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #00a88e;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  padding: 10px 22px;
  border-radius: 20px;
  text-decoration: none !important;
  transition: background 0.2s;
  align-self: flex-start;
  margin-top: auto;
}

.ds-course-cta:hover { background: #008f78; }

/* Meta bar */
.ds-course-meta-wrap {
  padding: 0 30px 30px;
}

.ds-course-meta {
  border: 1px solid #ddd;
  border-radius: 12px;
  display: flex;
  align-items: center;
  height: 72px;
  overflow: hidden;
}

.ds-course-meta-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 14px;
  min-width: 0;
}

.ds-course-meta-avatar-item {
  flex: 1.6 !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px;
}

.ds-course-meta-label {
  font-size: 13px;
  color: #000;
  font-weight: 400;
  line-height: 1.3;
  white-space: nowrap;
}

.ds-course-meta-value {
  font-size: 15px;
  font-weight: 600;
  color: #13a3a1;
  line-height: 1.3;
  margin: 0;
  white-space: nowrap;
}

.ds-course-meta-num {
  font-size: 17px;
  font-weight: 800;
}

.ds-course-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.ds-course-meta-sep {
  width: 1px;
  height: 46px;
  background: #ddd;
  flex-shrink: 0;
}

/* ── Articles ── */
.ds-articles-layout {
  display: flex;
  gap: 20px;
  align-items: stretch;
}

.ds-article-featured {
  position: relative;
  display: block;
  border-radius: 15px;
  overflow: hidden;
  text-decoration: none !important;
  flex: 0 0 49%;
  height: 426px;
  align-self: flex-start;
}

.ds-article-featured img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ds-article-featured-title {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 46px 16px 18px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.65));
  margin: 0;
}

.ds-articles-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ds-article-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  text-decoration: none !important;
  padding: 17px 0;
}

.ds-article-item + .ds-article-item {
  border-top: 1px solid #eee;
}

.ds-article-item img {
  width: 111px;
  height: 106px;
  object-fit: cover;
  border-radius: 12px;
  flex-shrink: 0;
}

.ds-article-item {
  color: #000 !important;
}

.ds-article-item p {
  font-size: 15px;
  font-weight: 500;
  color: #000 !important;
  line-height: 1.5;
  margin: 0;
}

.ds-article-item:hover p { color: #306BEE !important; }

/* Mobile */
@media (max-width: 991px) {
  .ds-ca-badge-active {
    display: none;
  }

  .ds-ca-section {
    padding: 30px calc(50vw - 50%) 30px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  .ds-ca-row {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* ── Course card mobile ── */
  .ds-course-card-body {
    flex-direction: column;
    padding: 0;
    gap: 0;
  }

  .ds-course-thumb {
    flex: 0 0 auto;
    width: 100%;
    height: 200px;
    border-radius: 15px 15px 0 0;
    aspect-ratio: unset;
  }

  .ds-course-detail {
    padding: 16px 18px 18px;
  }

  .ds-course-name { font-size: 20px; line-height: 1.3; }

  .ds-course-cta {
    width: 100%;
    justify-content: center;
    margin-top: 16px;
  }

  /* Meta bar → vertical rows */
  .ds-course-meta-wrap { padding: 0 16px 16px; }

  .ds-course-meta {
    border: 1px solid #d2d2d2 !important;
    border-radius: 18px !important;
    background: #fff;
    overflow: hidden !important;
    height: auto;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0 12px;
    padding: 12px 14px;
  }

  .ds-course-meta-sep { display: none; }

  .ds-course-meta-item {
    flex: 0 0 auto;
    width: calc(100% - 84px);
    margin-left: 84px;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid #d9d9d9;
  }

  .ds-course-meta-item:last-child { border-bottom: none; }

  .ds-course-meta-avatar-item {
    order: -1;
    width: 100%;
    margin-left: 0;
    flex: 0 0 100% !important;
    gap: 28px;
    padding: 0 0 10px;
    border-bottom: 1px solid #d9d9d9;
  }

  .ds-course-meta-avatar-item .ds-course-meta-value {
    color: #111 !important;
    font-size: 19px;
    font-weight: 700;
  }

  .ds-course-meta-label {
    min-width: 68px;
    color: #1c1c1c;
    font-size: 16px;
  }

  .ds-course-meta-value {
    font-size: 15px;
    color: #2e9f9f;
  }

  .ds-course-meta-num { font-size: 15px; }

  .ds-course-avatar {
    width: 56px;
    height: 56px;
  }

  /* ── Articles mobile ── */
  .ds-articles-layout {
    flex-direction: column;
    gap: 0;
  }

  .ds-article-featured {
    flex: 0 0 auto;
    width: 100%;
    height: 220px;
    border-radius: 15px;
    margin-bottom: 4px;
  }

  .ds-articles-list { gap: 0; }
}

/* --------------------------------------------------------------------------
  14. Ce oferim
   -------------------------------------------------------------------------- */

.ds-offers-section {
  margin-top: 34px;
  margin-bottom: 10px;
}

.ds-offers-card {
  position: relative;
  background: #f5f5f7;
  border-radius: 15px;
  padding: 50px 25px 50px;
  overflow: hidden;
}

.ds-offers-card::before,
.ds-offers-card::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.ds-offers-card::before {
  width: 760px;
  height: 500px;
  right: -96px;
  top: 0;
  border-radius: 10px;
  background: linear-gradient(142deg, rgba(250, 250, 250, 0.3) 51%, rgba(19, 163, 161, 0.3) 99%);
  border: 0;
}

.ds-offers-card::after {
  width: 652px;
  height: 499px;
  right: -215px;
  top: 0;
  border: 1px solid rgba(19, 163, 161, 0.18);
}

.ds-offers-title {
  margin: 0 0 40px;
  font-size: var(--ds-fs-section-h2);
  font-weight: 600;
  color: #000;
  line-height: 1.2;
}

.ds-offers-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 42px;
  align-items: center;
}

.ds-offers-left {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ds-offer-row {
  display: grid;
  grid-template-columns: 253px 286px;
  gap: 18px;
  align-items: center;
}

.ds-offer-row-offset {
  margin-left: 248px;
  margin-top: -6px;
}

.ds-offers-right {
  display: grid;
  grid-template-columns: 253px 286px;
  gap: 18px;
  align-items: stretch;
}

.ds-offers-right-list {
  display: flex;
  flex-direction: column;
  gap: 22px;
  justify-content: center;
}

.ds-offer-image {
  border-radius: 10px;
  overflow: hidden;
}

.ds-offer-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ds-offer-image-sm {
  width: 253px;
  height: 166px;
}

.ds-offer-image-md {
  width: 253px;
  height: 170px;
}

.ds-offer-image-lg {
  width: 253px;
  height: 331px;
}

.ds-offer-copy h3 {
  margin: 0 0 4px;
  font-size: var(--ds-fs-section-h3);
  font-weight: 700;
  color: #000;
  line-height: 1.45;
}

.ds-offer-copy p {
  margin: 0;
  font-size: var(--ds-fs-section-p);
  font-weight: 400;
  line-height: 1.66;
  color: #000;
}

.ds-offer-copy-lg {
  font-size: 16px !important;
}

.ds-offer-check {
  color: #306BEE;
  font-weight: 700;
  margin-right: 6px;
}

@media (max-width: 991px) {
  .ds-offers-section {
    margin-top: 24px;
  }

  .ds-offers-card {
    border-radius: 15px;
    padding: 18px 14px;
  }

  .ds-offers-card::before,
  .ds-offers-card::after {
    display: none;
  }

  .ds-offers-title {
    font-size: 28px;
    margin-bottom: 14px;
  }

  .ds-offers-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .ds-offers-left,
  .ds-offers-right-list {
    gap: 12px;
  }

  .ds-offer-row,
  .ds-offers-right {
    grid-template-columns: 120px 1fr;
    gap: 12px;
  }

  .ds-offer-row-offset {
    margin-left: 0;
    margin-top: 0;
  }

  .ds-offer-image-sm,
  .ds-offer-image-md,
  .ds-offer-image-lg {
    width: 120px;
    height: 84px;
  }

  .ds-offer-copy h3 {
    font-size: 16px;
    margin-bottom: 2px;
  }

  .ds-offer-copy p {
    font-size: 14px;
    line-height: 1.45;
  }
}