/* ===========================================================================
   OG SCENTS — MOBILE CART & CHECKOUT  (single, complete, replaces all others)

   IN ogs-modules.php REMOVE these three:
       'cart-checkout-mobile-fix'
       'cart-checkout-mobile-wide'
       'cart-checkout-mobile-align'
   and register this ONE, last:
       'cart-checkout-mobile'

   Desktop (>=1000px) is untouched — everything here is inside the media query
   except the overflow lock, which is safe at all sizes.
   =========================================================================== */

/* --- overflow lock: nothing may create sideways scroll, any screen ---
   The html/body line that used to sit here has been removed. Overflow is
   now owned in exactly one place: zz-final.css. --- */
.woocommerce-cart img, .woocommerce-checkout img,
.woocommerce-cart table, .woocommerce-checkout table { max-width: 100%; }

@media (max-width: 999px) {

/* ======================================================================
   1. PAGE FRAME — one gutter, perfectly centred, nothing offset
   ====================================================================== */
  .woocommerce-cart .ogs-page,
  .woocommerce-checkout .ogs-page,
  .woocommerce-cart .ogs-page__wrap,
  .woocommerce-checkout .ogs-page__wrap,
  .woocommerce-cart .ogs-page__content,
  .woocommerce-checkout .ogs-page__content,
  .woocommerce-cart .ogs-page__head,
  .woocommerce-checkout .ogs-page__head,
  .woocommerce-cart .woocommerce,
  .woocommerce-checkout .woocommerce,
  .woocommerce-checkout form.checkout,
  .woocommerce-cart form.woocommerce-cart-form {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    float: none !important;
    box-sizing: border-box !important;
  }
  /* the ONLY place padding lives */
  .woocommerce-cart .ogs-page__wrap,
  .woocommerce-checkout .ogs-page__wrap {
    padding: calc(var(--ogs-chrome, 78px) + 24px) 18px 60px !important;
  }

  /* page title */
  .woocommerce-cart .ogs-page__head,
  .woocommerce-checkout .ogs-page__head { padding: 0 0 18px !important; }
  .woocommerce-cart .ogs-page__head h1,
  .woocommerce-checkout .ogs-page__head h1 {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 300; letter-spacing: -.03em; line-height: 1;
    font-size: clamp(36px, 11vw, 52px) !important;
    margin: 0 !important;
  }

/* ======================================================================
   2. STACK — single column, order summary first
   ====================================================================== */
  .ogs-co__grid, .ogs-cartpg__layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 26px !important;
    width: 100% !important;
  }
  .ogs-co__details, .ogs-co__aside,
  .ogs-cartpg__items, .ogs-cartpg__totals {
    width: 100% !important; max-width: 100% !important;
    position: static !important; float: none !important; margin: 0 !important;
    min-width: 0 !important;
  }
  .ogs-co__aside { order: -1 !important; }
  .ogs-cartpg__cols { display: none !important; }

/* ======================================================================
   3. TEXT — never break mid-word, anywhere
   ====================================================================== */
  .woocommerce-cart, .woocommerce-cart *,
  .woocommerce-checkout, .woocommerce-checkout * {
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;
  }

/* ======================================================================
   4. CARDS
   ====================================================================== */
  .ogs-co__step--order,
  .ogs-cartpg__totals .cart_totals {
    width: 100% !important; box-sizing: border-box !important;
    background: #F5F2EC !important;
    border: 1px solid rgba(15,14,12,.12) !important;
    border-radius: 12px !important;
    padding: 22px 18px !important;
    margin: 0 !important;
  }
  .ogs-co__stephead {
    display: flex !important; align-items: baseline; gap: 12px;
    margin: 0 0 18px !important; padding-bottom: 14px;
    border-bottom: 1px solid rgba(15,14,12,.12);
  }
  .ogs-co__num { font-family: "Fraunces",Georgia,serif; font-style: italic; color: #C4506A; font-size: 15px; }
  .ogs-co__stephead h3 {
    font-family: "Fraunces",Georgia,serif; font-weight: 400 !important;
    font-size: 22px !important; margin: 0 !important;
  }
  .ogs-co__step { margin: 0 0 30px !important; }

/* ======================================================================
   5. ORDER SUMMARY ROWS
   ====================================================================== */
  .ogs-review, .woocommerce-checkout-review-order-table {
    display: block !important; width: 100% !important; border: 0 !important; margin: 0 !important;
  }
  .ogs-review thead { display: none !important; }
  .ogs-review tbody, .ogs-review tfoot { display: block !important; width: 100% !important; }

  .ogs-review tbody tr {
    display: flex !important; align-items: flex-start !important;
    gap: 14px !important; width: 100% !important;
    padding: 15px 0 !important;
    border-bottom: 1px solid rgba(15,14,12,.1) !important;
  }
  .ogs-review td { display: block !important; border: 0 !important; padding: 0 !important; background: none !important; }

  /* thumb */
  .ogs-review__thumb { flex: 0 0 58px !important; width: 58px !important; }
  .ogs-review__imgwrap { position: relative; display: block; width: 58px; }
  .ogs-review__imgwrap img {
    width: 58px !important; height: 75px !important;
    object-fit: cover !important; border-radius: 6px !important;
    display: block !important; margin: 0 !important;
    mix-blend-mode: multiply; background: #fff;
  }
  .ogs-review__qtybubble {
    position: absolute !important; top: -7px !important; right: -7px !important;
    width: 21px !important; height: 21px !important;
    display: grid !important; place-items: center !important;
    background: #0F0E0C !important; color: #fff !important;
    border-radius: 50% !important; font-size: 10px !important; z-index: 2;
  }
  /* kit has no photo — brand tile instead of grey placeholder */
  .ogs-review__imgwrap img[src*="placeholder"] { opacity: 0; }
  .ogs-review__imgwrap:has(img[src*="placeholder"]) {
    background: linear-gradient(135deg, rgba(232,120,142,.18), rgba(232,120,142,.06));
    border-radius: 6px;
  }
  .ogs-review__imgwrap:has(img[src*="placeholder"])::after {
    content: "✦"; position: absolute; inset: 0;
    display: grid; place-items: center; color: #C4506A; font-size: 20px;
  }

  /* name — takes all remaining width */
  .ogs-review__name { flex: 1 1 auto !important; min-width: 0 !important; }
  .ogs-review__name > span {
    display: block !important;
    font-family: "Fraunces",Georgia,serif;
    font-size: 15px !important; line-height: 1.3 !important; color: #0F0E0C !important;
  }
  .ogs-review__kitflag {
    display: inline-block; margin-top: 6px; font-style: normal;
    font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase;
    background: #E8788E; color: #fff; padding: 3px 9px; border-radius: 9999px;
  }
  /* the 8 scents — compact, capped, faded */
  .ogs-review__name dl.variation {
    display: block !important; margin: 6px 0 0 !important;
    font-size: 10.5px !important; line-height: 1.5 !important; color: #6B665E !important;
    max-height: 4.4em; overflow: hidden; position: relative;
  }
  .ogs-review__name dl.variation dt { display: none !important; }
  .ogs-review__name dl.variation dd,
  .ogs-review__name dl.variation dd p { margin: 0 !important; display: inline !important; }
  .ogs-review__name dl.variation::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.3em;
    background: linear-gradient(transparent, #F5F2EC);
  }

  /* price */
  .ogs-review__total {
    flex: 0 0 auto !important; white-space: nowrap !important;
    font-family: "Fraunces",Georgia,serif; font-size: 15px !important;
    padding-top: 1px;
  }

/* ======================================================================
   6. TOTALS
   ====================================================================== */
  .ogs-review tfoot tr,
  .ogs-cartpg__totals tr {
    display: flex !important; justify-content: space-between !important;
    align-items: baseline !important; gap: 18px !important;
    width: 100% !important; padding: 13px 0 !important;
    border-bottom: 1px solid rgba(15,14,12,.08) !important;
  }
  .ogs-review tfoot th, .ogs-review tfoot td,
  .ogs-cartpg__totals th, .ogs-cartpg__totals td {
    display: block !important; width: auto !important; flex: 0 0 auto !important;
    border: 0 !important; padding: 0 !important; background: none !important;
    font-size: 14px !important; font-weight: 400 !important;
    text-transform: none !important; letter-spacing: 0 !important;
    white-space: nowrap !important; text-align: left !important;
  }
  .ogs-review tfoot td, .ogs-cartpg__totals td { text-align: right !important; }
  .ogs-review tfoot .order-total,
  .ogs-cartpg__totals .order-total { border-bottom: 0 !important; padding-top: 16px !important; }
  .ogs-review tfoot .order-total th, .ogs-review tfoot .order-total td,
  .ogs-cartpg__totals .order-total th, .ogs-cartpg__totals .order-total td {
    font-family: "Fraunces",Georgia,serif; font-size: 23px !important; color: #0F0E0C !important;
  }
  .ogs-cartpg__totals h2 {
    font-family: "Fraunces",Georgia,serif; font-weight: 400 !important;
    font-size: 21px !important; margin: 0 0 14px !important;
  }
  .ogs-cartpg__totals table { display: block !important; width: 100% !important; border: 0 !important; margin: 0 !important; }
  .ogs-cartpg__totals tbody { display: block !important; width: 100% !important; }

/* ======================================================================
   7. BUTTONS — full width, never overflow
   ====================================================================== */
  #place_order,
  .ogs-cartpg__totals .checkout-button,
  .woocommerce .cart_totals .checkout-button {
    display: block !important; width: 100% !important; max-width: 100% !important;
    box-sizing: border-box !important;
    background: #E8788E !important; border: 1px solid #E8788E !important; color: #fff !important;
    border-radius: 9999px !important;
    padding: 18px 14px !important;
    font-size: 11.5px !important; letter-spacing: .12em !important;
    text-transform: uppercase; text-align: center !important;
    white-space: normal !important; line-height: 1.3 !important;
    margin: 16px 0 0 !important;
  }
  .ogs-cartpg__totals .wc-proceed-to-checkout { padding: 0 !important; }

/* ======================================================================
   8. NOTICES + COUPON
   ====================================================================== */
  .woocommerce-info, .woocommerce-message, .woocommerce-error,
  .woocommerce-form-coupon-toggle, .woocommerce-form-coupon-toggle .woocommerce-info {
    display: block !important; width: 100% !important; max-width: 100% !important;
    box-sizing: border-box !important; margin: 0 0 20px !important;
    padding: 14px 16px !important;
    font-size: 13px !important; line-height: 1.5 !important; text-align: left !important;
    border-radius: 10px !important;
  }
  .woocommerce-form-coupon-toggle .woocommerce-info {
    background: #F5F2EC !important; border: 1px solid rgba(15,14,12,.12) !important;
    border-left: 3px solid #E8788E !important; color: #0F0E0C !important;
  }
  .woocommerce-info::before, .woocommerce-message::before, .woocommerce-error::before { display: none !important; }

  .ogs-cartpg__actions { display: flex !important; flex-direction: column !important; gap: 10px !important; padding-top: 22px !important; }
  .ogs-cartpg__coupon { display: flex !important; flex-direction: column !important; gap: 10px !important; width: 100% !important; min-width: 0 !important; }
  .ogs-cartpg__coupon .input-text, .ogs-cartpg__coupon .ogs-btn,
  .ogs-cartpg__actions .ogs-btn {
    width: 100% !important; box-sizing: border-box !important;
    padding: 14px 18px !important; font-size: 14px !important;
    border-radius: 9999px !important; text-align: center;
  }
  .ogs-cartpg__update { display: none !important; }

/* ======================================================================
   9. FORM FIELDS
   ====================================================================== */
  .woocommerce form .form-row,
  .woocommerce form .form-row-first,
  .woocommerce form .form-row-last,
  .woocommerce form .form-row-wide {
    width: 100% !important; float: none !important; margin: 0 0 16px !important; padding: 0 !important;
  }
  .woocommerce form .form-row label {
    display: block !important; margin: 0 0 7px !important;
    font-size: 10px !important; letter-spacing: .14em; text-transform: uppercase; color: #6B665E !important;
  }
  .woocommerce .form-row input.input-text,
  .woocommerce .form-row textarea,
  .woocommerce .form-row select,
  .woocommerce .form-row .select2-selection {
    width: 100% !important; box-sizing: border-box !important;
    font-size: 16px !important; padding: 15px 16px !important;
    border: 1px solid rgba(15,14,12,.14) !important; border-radius: 10px !important;
    background: #fff !important; height: auto !important; box-shadow: none !important;
  }
  .woocommerce .form-row .select2-selection { padding: 11px 16px !important; }
  .woocommerce .form-row input.input-text:focus,
  .woocommerce .form-row textarea:focus,
  .woocommerce .form-row select:focus {
    border-color: #E8788E !important; box-shadow: 0 0 0 3px rgba(232,120,142,.15) !important;
  }
  .woocommerce-billing-fields > h3 { display: none !important; }
  .woocommerce-additional-fields > h3 {
    font-family: "Fraunces",Georgia,serif; font-weight: 400 !important;
    font-size: 18px !important; margin: 24px 0 14px !important;
  }

/* payment */
  #payment, #payment ul.payment_methods, #payment ul.payment_methods li, #payment .place-order {
    width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
  }
  #payment ul.payment_methods { border: 0 !important; padding: 0 !important; margin: 0 0 16px !important; }
  #payment ul.payment_methods li {
    list-style: none; background: #fff; border: 1px solid rgba(15,14,12,.12);
    border-radius: 10px; padding: 15px 16px; margin: 0 0 10px !important;
  }
  .woocommerce-privacy-policy-text, .woocommerce-privacy-policy-text p {
    display: block !important; width: 100% !important;
    font-size: 11.5px !important; line-height: 1.55 !important; text-align: left !important;
  }
  .ogs-co__trust {
    margin: 16px 0 0 !important; text-align: center;
    font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: #6B665E;
  }

/* ======================================================================
   10. CART ITEM ROWS
   ====================================================================== */
  .ogs-cartpg__item {
    display: grid !important;
    grid-template-columns: 88px minmax(0,1fr) !important;
    grid-template-areas: "thumb meta" "line line" !important;
    gap: 4px 14px !important;
    padding: 18px 0 !important;
    border-bottom: 1px solid rgba(15,14,12,.1) !important;
    align-items: start !important;
    width: 100% !important; box-sizing: border-box !important;
  }
  .ogs-cartpg__item.is-kit {
    background: rgba(232,120,142,.06) !important;
    border-radius: 10px !important;
    padding: 18px 14px !important;
    margin-bottom: 6px !important;
  }
  .ogs-cartpg__thumb { grid-area: thumb; width: 88px !important; }
  .ogs-cartpg__thumb img {
    width: 88px !important; height: auto !important; aspect-ratio: 3/4;
    object-fit: cover !important; border-radius: 6px !important; display: block !important;
    mix-blend-mode: multiply; background: #F5F2EC;
  }
  .ogs-cartpg__meta {
    grid-area: meta; min-width: 0 !important;
    display: flex !important; flex-direction: column; align-items: flex-start; gap: 5px;
  }
  .ogs-cartpg__name {
    font-family: "Fraunces",Georgia,serif; font-size: 17px !important;
    line-height: 1.25 !important; color: #0F0E0C !important; text-decoration: none;
  }
  .ogs-cartpg__unit { font-size: 13px !important; color: #6B665E !important; }
  .ogs-cartpg__kitflag {
    font-style: normal; font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase;
    background: #E8788E; color: #fff; padding: 3px 9px; border-radius: 9999px;
  }
  .ogs-cartpg__meta dl.variation {
    margin: 3px 0 0 !important; font-size: 10.5px !important; line-height: 1.5 !important;
    color: #6B665E !important; max-height: 4.4em; overflow: hidden; position: relative;
  }
  .ogs-cartpg__meta dl.variation dt { display: none !important; }
  .ogs-cartpg__meta dl.variation dd,
  .ogs-cartpg__meta dl.variation dd p { margin: 0 !important; display: inline !important; }
  .ogs-cartpg__qty, .ogs-qty {
    display: inline-flex !important; align-items: center;
    border: 1px solid rgba(15,14,12,.14); border-radius: 9999px; background: #fff;
    overflow: hidden; margin: 8px 0 0 !important; justify-self: start !important;
  }
  .ogs-qty__btn { width: 40px; height: 42px; font-size: 17px; color: #6B665E; background: none; border: 0; }
  .ogs-qty .qty, .ogs-qty input.qty {
    width: 44px !important; border: 0 !important; background: none !important;
    text-align: center; font-size: 15px !important; padding: 0 !important;
    -moz-appearance: textfield; appearance: textfield;
  }
  .ogs-qty .qty::-webkit-inner-spin-button, .ogs-qty .qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
  .ogs-cartpg__remove {
    font-size: 10px !important; letter-spacing: .12em; text-transform: uppercase;
    color: #6B665E !important; border-bottom: 1px solid rgba(15,14,12,.14);
    padding-bottom: 2px; margin-top: 8px !important; text-decoration: none;
  }
  .ogs-cartpg__line {
    grid-area: line; justify-self: stretch !important; text-align: right !important;
    font-family: "Fraunces",Georgia,serif; font-size: 18px !important;
    margin-top: 12px !important; padding-top: 12px !important;
    border-top: 1px dashed rgba(15,14,12,.14) !important;
  }

/* ======================================================================
   11. keep floating buttons off these pages
   ====================================================================== */
  .woocommerce-cart .ogsbk-launch, .woocommerce-cart .ogslive-offer,
  .woocommerce-checkout .ogsbk-launch, .woocommerce-checkout .ogslive-offer { display: none !important; }
}

/* small phones */
@media (max-width: 380px) {
  .woocommerce-cart .ogs-page__wrap, .woocommerce-checkout .ogs-page__wrap { padding: calc(var(--ogs-chrome, 78px) + 20px) 14px 50px !important; }
  .ogs-co__step--order, .ogs-cartpg__totals .cart_totals { padding: 18px 15px !important; }
  .ogs-review__thumb { flex-basis: 52px !important; width: 52px !important; }
  .ogs-review__imgwrap, .ogs-review__imgwrap img { width: 52px !important; }
  .ogs-review__imgwrap img { height: 68px !important; }
  .ogs-cartpg__item { grid-template-columns: 76px minmax(0,1fr) !important; }
  .ogs-cartpg__thumb, .ogs-cartpg__thumb img { width: 76px !important; }
}