/* ============================================================
   MODUL X1 — informarea „peste stoc" (coș, mini-coș, checkout)

   Fișier SEPARAT de `modx1-frontend.css`, din două motive:

   1. `modx1-frontend.css` se încarcă doar cu modulul vizual pornit, iar tot ce e acolo e
      scopat sub `.modul-x1-active`. Informarea de aici e o regulă COMERCIALĂ — se afișează
      și cu restilizarea oprită (vezi comentariul din `ModX1_Checkout`). Dacă stilul ar sta
      în frontend.css, o dezactivare temporară a restilizării ar lăsa un text gol pe pagină.
   2. Se încarcă numai când comutatorul „Comenzi peste stoc" e pornit, deci magazinele care
      nu-l folosesc nu iau nimic în plus.

   Selectoarele NU sunt scopate pe `.modul-x1-active`, deliberat.
   ============================================================ */

.modx1-bo {
  --modx1-bo-ink:    #8a5106;
  --modx1-bo-bg:     #fff8ed;
  --modx1-bo-border: #f6ddb4;
  --modx1-bo-accent: #e08a10;
  box-sizing: border-box;
  font-family: inherit;
}

/* Iconul (ceas = „termen de livrare"). Ca imagine de fundal pe ::before, ca să nu depindem
   de setul de iconuri al temei — rezerva trebuie să funcționeze și pe altă temă decât
   Flatsome (vezi regula 13 din CLAUDE.md). */
.modx1-bo::before {
  content: "";
  flex: 0 0 auto;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e08a10' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.4V12l3 1.9'/%3E%3C/svg%3E");
}

/* ---------- COȘ: informarea lungă, sub numele produsului ---------- */
.modx1-bo--cart {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 8px 0 0;
  padding: 9px 12px 9px 10px;
  background: var(--modx1-bo-bg);
  border: 1px solid var(--modx1-bo-border);
  border-left: 3px solid var(--modx1-bo-accent);
  border-radius: 8px;
  color: var(--modx1-bo-ink);
  font-size: 12.5px;
  line-height: 1.55;
  font-weight: 400;
}
.modx1-bo--cart::before {
  width: 16px;
  height: 16px;
  background-size: 16px 16px;
  margin-top: 1px;
}

/* ---------- MINI-COȘ + CHECKOUT: eticheta scurtă ----------
   Rază mică, nu pastilă: în mini-coș (~300px) textul se rupe pe două rânduri, iar un
   `border-radius: 999px` pe o casetă de două rânduri arată deformat. */
.modx1-bo--mini,
.modx1-bo--checkout {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin: 6px 0 0;
  padding: 4px 8px 4px 7px;
  background: var(--modx1-bo-bg);
  border: 1px solid var(--modx1-bo-border);
  border-radius: 6px;
  color: var(--modx1-bo-ink);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .01em;
  text-align: left;
  text-transform: none;
  white-space: normal;
}
.modx1-bo--mini::before,
.modx1-bo--checkout::before {
  width: 13px;
  height: 13px;
  background-size: 13px 13px;
}

/* Mini-coșul Flatsome centrează zona de cantitate; eticheta trebuie să rămână pe rândul ei,
   aliniată la stânga, sub controlul de cantitate al temei. */
.widget_shopping_cart .modx1-bo--mini,
.woocommerce-mini-cart .modx1-bo--mini { clear: both; }

/* Eticheta scurtă pe care o punem în locul celei standard WooCommerce („Available on
   backorder"). Tema o randează ca `.backorder_notification`; îi dăm aceeași notă vizuală. */
.woocommerce-cart .backorder_notification,
.woocommerce-checkout .backorder_notification {
  margin: 6px 0 0;
  color: #8a5106;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}
