/**
 * Gameify · WC Default Checkout Overrides
 * Stylar WC default-checkout med Gameify dark-theme.
 *
 * Notera: Bricks-templates "Checkout" + "Woo Checkout" (ID 494, 1024) är
 * satta till draft så de inte renderas — sidan använder WC + Bricks parent default.
 */

:root {
  --gc-fg:            var(--ink, #f2f2f2);
  --gc-fg-muted:      var(--ink-3, #b0b0b0);
  --gc-bg:            var(--bg, #0a0a0a);
  --gc-bg-elev:       #1d1d1d;
  --gc-bg-input:      rgba(255, 255, 255, .04);
  --gc-border:        rgba(255, 255, 255, .08);
  --gc-border-strong: rgba(255, 255, 255, .14);
  --gc-green:         #9ee627;
  --gc-error:         #ff5a5a;
}

/* ── Bas: säkerställ mörk bakgrund överallt ──────────────────────── */
body.woocommerce-checkout,
body.woocommerce-cart,
body.page-id-426 {
  background: var(--gc-bg);
  color: var(--gc-fg);
}

article.page,
#brx-content,
.brxe-post-content,
.brxe-container,
.brxe-section.checkout {
  background: transparent !important;
  color: var(--gc-fg);
}

/* ── Wrapper: section + container runt article (från template-parts/page.php) ── */
.gameify-page-section {
  width: 100%;
  background: transparent;
  padding: var(--space-l, 2rem) 0;
}

.gameify-page-container {
  width: 100%;
  max-width: var(--content-width, 1600px);
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}

/* Skärmar under 1600 — lägg in horisontell padding så heading + form inte
   klistras mot skärmkant. På desktop (≥1600) fyller content sin max-width. */
@media (max-width: 1599px) {
  .gameify-page-container { padding: 0 var(--space-l, 2rem); }
}
@media (max-width: 768px) {
  .gameify-page-container { padding: 0 var(--space-m, 1rem); }
}

.woocommerce {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  color: var(--gc-fg);
}

/* Bricks default "Checkout page / Tagline" — dölj (de var fallback från Bricks) */
.brxe-post-title,
article.page > .post-title,
.tagline,
.brxe-post-tagline { display: none !important; }

/* ── 2-kolumns layout: form vänster, order_review höger ──────────── */
.woocommerce form.checkout,
.woocommerce form.checkout.woocommerce-checkout {
  display: grid !important;
  grid-template-columns: var(--grid-3-2);
  gap: var(--space-l, 2rem);
  align-items: start;
  width: 100%;
}

/* Stacka tidigare — grid-3-2 gör höger-kolumnen för smal för produktnamn under ~1280px */
@media (max-width: 1280px) {
  .woocommerce form.checkout,
  .woocommerce form.checkout.woocommerce-checkout {
    grid-template-columns: 1fr;
  }
}

#customer_details { grid-column: 1; }

/* WC:s col2-set: gör inre kolumner fullbreda */
#customer_details.col2-set { display: block; }
#customer_details .col-1,
#customer_details .col-2 {
  width: 100%;
  max-width: 100%;
  float: none;
  margin: 0 0 var(--space-m, 1rem);
}

.woocommerce-checkout #order_review_heading {
  grid-column: 2;
  grid-row: 1;
  margin: 0 0 var(--space-s, .75rem);
  color: var(--gc-fg);
  font-size: var(--h4, 1.25rem);
  font-weight: 700;
}

#order_review {
  grid-column: 2;
  grid-row: 2;
  position: sticky;
  top: var(--space-l, 2rem);
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xxl, 16.875px);
  padding: var(--space-l, 2rem);
  box-sizing: border-box;
}

@media (max-width: 1280px) {
  .woocommerce-checkout #order_review_heading,
  #order_review {
    grid-column: 1;
    position: static;
  }
}

/* ── Form-sektioner (billing / shipping / additional) ─────────────── */
.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields {
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xxl, 16.875px);
  padding: var(--space-l, 2rem);
  margin: 0 0 var(--space-m, 1rem);
  box-sizing: border-box;
  width: 100%;
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
  margin: 0 0 var(--space-m, 1rem);
  color: var(--gc-fg);
  font-size: var(--h4, 1.25rem);
  font-weight: 700;
  letter-spacing: -.01em;
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--space-s, .75rem);
}

/* ── Form-rader ──────────────────────────────────────────────────── */
.woocommerce form .form-row {
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
  width: 100%;
  float: none;
}

.woocommerce form .form-row label,
.woocommerce form .form-row > label.checkbox {
  display: block;
  margin: 0 0 6px;
  color: var(--gc-fg-muted);
  font-size: var(--text-s, .9rem);
  font-weight: 500;
}

.woocommerce form .form-row .required {
  color: var(--gc-error);
  text-decoration: none;
  border: none;
}

/* ── Input-fält ──────────────────────────────────────────────────── */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
  width: 100%;
  background: var(--gc-bg-input);
  color: var(--gc-fg);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xs, 4px);
  padding: .75rem 1rem;
  font-size: var(--text-m, 1rem);
  line-height: 1.4;
  min-height: 48px;
  box-sizing: border-box;
  transition: border-color .15s ease;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--gc-border-strong);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text {
  border-color: var(--gc-error);
}

/* Select2 (land-dropdown) */
.select2-container--default .select2-selection--single {
  background: var(--gc-bg-input) !important;
  border: 1px solid var(--gc-border) !important;
  border-radius: var(--radius-xs, 4px) !important;
  min-height: 48px;
  height: 48px;
  padding: .25rem .5rem;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--gc-fg) !important;
  line-height: 36px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px; }

.select2-dropdown {
  background: var(--gc-bg-elev) !important;
  border-color: var(--gc-border) !important;
  color: var(--gc-fg);
}
.select2-results__option { color: var(--gc-fg); }
.select2-results__option--highlighted {
  background: var(--gc-green) !important;
  color: #131313 !important;
}
.select2-search--dropdown .select2-search__field {
  background: var(--gc-bg-input);
  border-color: var(--gc-border);
  color: var(--gc-fg);
}

/* ── Order review table ──────────────────────────────────────────── */
.woocommerce table.shop_table,
.shop_table,
.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-s, .9rem);
  margin: 0 0 var(--space-m, 1rem);
  background: transparent !important;
  color: var(--gc-fg) !important;
  border: none;
  table-layout: auto;
}
.woocommerce table.shop_table thead,
.woocommerce table.shop_table tbody,
.woocommerce table.shop_table tfoot,
.woocommerce table.shop_table tr {
  background: transparent !important;
  border: 0 !important;
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  background: transparent !important;
  color: var(--gc-fg) !important;
  padding: var(--space-s, .85rem) 0;
  border-bottom: 1px solid var(--gc-border);
  vertical-align: top;
}

/* Vänster cell (produkt): vänsterjusterad, ger plats */
.woocommerce table.shop_table th.product-name,
.woocommerce table.shop_table td.product-name {
  text-align: left;
  width: auto;
  padding-right: var(--space-m, 1rem);
}
/* Höger cell (delsum/pris): högerjusterad, ej krympbar */
.woocommerce table.shop_table th.product-total,
.woocommerce table.shop_table td.product-total,
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table tfoot th + td {
  text-align: right !important;
  /* white-space: nowrap; */
  /* width: 1%; */
}

/* tfoot-rader: th vänster, td höger */
.woocommerce table.shop_table tfoot th { text-align: left; font-weight: 600; }
.woocommerce table.shop_table tfoot td { font-weight: 600; }

.woocommerce table.shop_table tfoot .order-total td,
.woocommerce table.shop_table tfoot .order-total th {
  font-weight: 700;
  border-bottom: none;
  padding-top: var(--space-m, 1rem);
  font-size: var(--text-m, 1rem);
}

.woocommerce-Price-amount { color: var(--gc-fg); }
.woocommerce-Price-currencySymbol { color: var(--gc-fg-muted); }

/* ── Shipping methods ─────────────────────────────────────────────── */
ul#shipping_method {
  list-style: none;
  margin: 0;
  padding: 0;
}
ul#shipping_method li { margin: 0; padding: .35rem 0; }
ul#shipping_method label {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  color: var(--gc-fg);
}

/* ── Payment methods ──────────────────────────────────────────────── */
#payment,
.woocommerce-checkout-payment {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  margin-top: var(--space-m, 1rem);
  padding: 0;
}

#payment ul.payment_methods,
.wc_payment_methods {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-s, .75rem);
  border: none;
  background: transparent;
}

#payment ul.payment_methods li.wc_payment_method,
.wc_payment_method {
  background: var(--gc-bg);
  border: none !important;
  border-radius: var(--radius-s, 6px);
  padding: var(--space-m, 1rem);
  list-style: none;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: .75rem;
  row-gap: var(--space-s, .75rem);
}

#payment ul.payment_methods li.wc_payment_method > input[type="radio"] {
  grid-column: 1;
  grid-row: 1;
  margin: 0 !important;
  align-self: center;
}

#payment ul.payment_methods li.wc_payment_method > label {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  align-self: center;
}

#payment ul.payment_methods li.wc_payment_method > .payment_box,
#payment ul.payment_methods li.wc_payment_method > div {
  grid-column: 1 / -1;
  grid-row: 2;
}

#payment ul.payment_methods li.wc_payment_method > label,
.wc_payment_method > label {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 600;
  cursor: pointer;
  color: var(--gc-fg);
}

#payment .payment_box {
  background: transparent !important;
  color: var(--gc-fg);
  margin-top: var(--space-s, .75rem);
  padding: 0;
  border: none;
}
#payment .payment_box::before { display: none; }

#payment .StripeElement,
#payment .wc-stripe-elements-field {
  padding: 12px;
  background: var(--gc-bg-input);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xs, 4px);
  max-width: 100%;
}

/* Gäst-flow: dölj sparade kort + spara-kort-checkbox */
#payment .woocommerce-SavedPaymentMethods,
#payment .woocommerce-SavedPaymentMethods-saveNew { display: none; }

/* Ta bort alla vita under-borders WC default sätter mellan payment-rader */
#payment ul.payment_methods,
#payment ul.payment_methods li {
  border-top: none !important;
  border-bottom: none !important;
}

/* WC fieldsets */
.woocommerce fieldset,
#payment fieldset { border: none; padding: 0; margin: 0; }

/* ── Place order button ──────────────────────────────────────────── */
#place_order,
.woocommerce-checkout button[name="woocommerce_checkout_place_order"] {
  width: 100%;
  background: var(--gc-green) !important;
  color: #0a0a0a !important;
  border: none !important;
  padding: 1.25rem 2rem !important;
  font-size: var(--text-l, 1.125rem);
  font-weight: 700;
  border-radius: var(--radius-xs, 4px);
  cursor: pointer;
  margin-top: var(--space-m, 1rem);
  text-transform: none;
  letter-spacing: .01em;
  min-height: 60px;
  transition: opacity .15s ease, transform .1s ease;
}
#place_order:hover { opacity: .92; }
#place_order:active { transform: translateY(1px); }

/* ── Custom radio buttons (payment + shipping methods) ────────────── */
.woocommerce-checkout input[type="radio"],
.woocommerce-cart input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  margin: 0 .75rem 0 0 !important;
  padding: 0 !important;
  border: 2px solid var(--gc-border-strong) !important;
  border-radius: 50% !important;
  background: var(--gc-bg-input) !important;
  box-sizing: border-box !important;
  cursor: pointer;
  position: relative;
  vertical-align: middle;
  flex-shrink: 0;
  flex: 0 0 22px !important;
  line-height: 1;
  display: inline-block !important;
  transition: border-color .15s ease;
}
.woocommerce-checkout input[type="radio"]:hover,
.woocommerce-cart input[type="radio"]:hover {
  border-color: var(--gc-green) !important;
}
.woocommerce-checkout input[type="radio"]:checked,
.woocommerce-cart input[type="radio"]:checked {
  border-color: var(--gc-green) !important;
}
.woocommerce-checkout input[type="radio"]:checked::after,
.woocommerce-cart input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--gc-green);
}
.woocommerce-checkout input[type="radio"]:focus-visible,
.woocommerce-cart input[type="radio"]:focus-visible {
  outline: 2px solid var(--gc-green);
  outline-offset: 2px;
}

/* ── Custom checkboxes ───────────────────────────────────────────── */
.woocommerce-checkout input[type="checkbox"],
.woocommerce-cart input[type="checkbox"],
.woocommerce-checkout input.input-checkbox,
.woocommerce-checkout .woocommerce-form__input-checkbox,
.woocommerce-checkout #terms,
.woocommerce-cart input.input-checkbox,
.woocommerce-cart .woocommerce-form__input-checkbox {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  margin: 0 .75rem 0 0 !important;
  padding: 0 !important;
  border: 2px solid var(--gc-border-strong) !important;
  border-radius: var(--radius-xs, 4px) !important;
  background: var(--gc-bg-input) !important;
  box-sizing: border-box !important;
  cursor: pointer;
  position: relative;
  vertical-align: middle;
  flex: 0 0 22px !important;
  flex-shrink: 0 !important;
  flex-basis: 22px !important;
  line-height: 1;
  display: inline-block !important;
  transition: border-color .15s ease, background .15s ease;
}
.woocommerce-checkout input[type="checkbox"]:hover,
.woocommerce-cart input[type="checkbox"]:hover,
.woocommerce-checkout #terms:hover,
.woocommerce-checkout .woocommerce-form__input-checkbox:hover {
  border-color: var(--gc-green) !important;
}
.woocommerce-checkout input[type="checkbox"]:checked,
.woocommerce-cart input[type="checkbox"]:checked,
.woocommerce-checkout #terms:checked,
.woocommerce-checkout .woocommerce-form__input-checkbox:checked {
  background: var(--gc-green) !important;
  border-color: var(--gc-green) !important;
}
.woocommerce-checkout input[type="checkbox"]:checked::after,
.woocommerce-cart input[type="checkbox"]:checked::after,
.woocommerce-checkout #terms:checked::after,
.woocommerce-checkout .woocommerce-form__input-checkbox:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid #0a0a0a;
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
  box-sizing: content-box;
}
.woocommerce-checkout input[type="checkbox"]:focus-visible,
.woocommerce-cart input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--gc-green);
  outline-offset: 2px;
}

/* Payment method labels: stora klickytor, bra alignment */
#payment ul.payment_methods li.wc_payment_method > label {
  display: flex !important;
  align-items: center;
  gap: .75rem;
  font-size: var(--text-m, 1rem);
  font-weight: 600;
  padding: .25rem 0;
  min-height: 32px;
  cursor: pointer;
  width: 100%;
}
#payment ul.payment_methods li.wc_payment_method {
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
#payment ul.payment_methods li.wc_payment_method:hover {
  background: var(--gc-bg-elev);
}

/* Shipping radios */
ul#shipping_method li label {
  display: flex;
  align-items: center;
  gap: .75rem;
  font-size: var(--text-m, 1rem);
  min-height: 32px;
}

/* "Lagre betalingsinformasjon..." och liknande WC-checkbox-labels:
   Stripe injicerar inline-styling som plockar bort font-family + radbryter.
   Force inherit av tema-font + radera oönskad font-styling. */
#payment .form-row,
#payment .woocommerce-SavedPaymentMethods-saveNew label,
.woocommerce-form__label-for-checkbox,
.woocommerce-checkout label,
.woocommerce-cart label {
  font-family: inherit !important;
  font-style: normal !important;
  display: flex;
  align-items: center;
  gap: .75rem;
  color: var(--gc-fg);
  cursor: pointer;
  font-size: var(--text-s, .9rem);
  line-height: 1.4;
}

/* Spacing mellan flera checkboxes (t.ex. terms + spara-kort) */
.woocommerce-checkout .form-row + .form-row,
.woocommerce-checkout p.form-row + p.form-row {
  margin-top: var(--space-s, .75rem) !important;
}

/* ── Terms & checkboxes ──────────────────────────────────────────── */
.woocommerce-terms-and-conditions-wrapper {
  margin: var(--space-l, 1.5rem) 0 var(--space-m, 1rem);
  color: var(--gc-fg);
}
.woocommerce-terms-and-conditions {
  background: var(--gc-bg-input);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xs, 4px);
  padding: var(--space-m, 1rem);
  color: var(--gc-fg-muted);
  font-size: var(--text-s, .9rem);
  margin-bottom: var(--space-s, .75rem);
}
.woocommerce-form__label-for-checkbox {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  color: var(--gc-fg);
}
/* .woocommerce-form__input-checkbox övergrips av globala input[type="checkbox"]-reglerna ovan */

/* ── Notices ─────────────────────────────────────────────────────── */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
  background: var(--gc-bg-elev);
  color: var(--gc-fg);
  border-left: 3px solid var(--gc-green);
  padding: var(--space-s, .75rem) var(--space-m, 1rem);
  margin: 0 0 var(--space-m, 1rem);
  border-radius: var(--radius-xs, 4px);
  list-style: none;
}
.woocommerce-notices-wrapper .woocommerce-error { border-left-color: var(--gc-error); }

/* ── Stripe iframes (Klarna form, etc.) ───────────────────────────── */
#payment iframe,
.woocommerce-checkout iframe { max-width: 100% !important; }

/* Express Checkout (Google Pay / Apple Pay) — dölj, vi använder bara Klarna + Kort */
#wc-stripe-express-checkout-element,
#wc-stripe-express-checkout-separator,
.wc-stripe-product-checkout-container,
.wc-stripe-express-checkout-element,
.wc-stripe-payment-request-button-separator,
.wc-stripe-payment-request-wrapper { display: none !important; }

/* "— ELLER —" separator från Stripe Express Checkout */
#wc-stripe-express-checkout-button-separator,
#wc-stripe-express-checkout-separator,
.wc-stripe-express-checkout-separator,
[class*="express-checkout-separator"],
[id*="express-checkout-separator"] { display: none !important; }

/* ── Force checkbox/radio shape ─────────────────────────────────────
   Wrappas i @layer bricks så reglerna VINNER över andra layered rules
   som annars tvingar display:inline på inputs. (Bricks parent + ACSS
   loadar sin CSS i @layer bricks.) */
@layer bricks {
  html body.woocommerce-checkout input[type="checkbox"],
  html body.woocommerce-checkout input[type="radio"],
  html body.woocommerce-cart input[type="checkbox"],
  html body.woocommerce-cart input[type="radio"] {
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }
}

/* ─────────────────────────────────────────────────────────────────────
   ORDER RECEIVED (THANK YOU) — Bricks Frames-template alpha
   Bilden från användaren visade ljus/grå bg på info-rutan; mörka ner.
   ─────────────────────────────────────────────────────────────────── */

.fr-woo-thankyou-section-alpha,
.fr-woo-thankyou-section-alpha__inner,
.fr-woo-thankyou-section-alpha__info,
.fr-woo-thankyou-section-alpha__details,
[class*="fr-woo-thankyou"] {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--gc-fg) !important;
}

/* Orderinfo-grid (Ordrenummer / Dato / E-post / Totalt / Betalingsmåte) */
.fr-woo-thankyou-section-alpha__info,
.fr-woo-thankyou-section-alpha .woocommerce-order-overview,
.fr-woo-thankyou-section-alpha ul.order_details,
.fr-woo-thankyou-section-alpha ul.woocommerce-order-overview,
body.woocommerce-order-received ul.order_details,
body.woocommerce-order-received .woocommerce-order-overview {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-l, 2rem);
  margin: var(--space-l, 2rem) 0;
  color: var(--gc-fg) !important;
}

/* Explicit ingen bakgrund på Bricks Frames-info-boxen + dess li-items + customer-details-section */
.fr-woo-thankyou-alpha.brxe-woocommerce-checkout-thankyou .woocommerce-order-overview.order_details,
.fr-woo-thankyou-alpha .woocommerce-order-overview.order_details,
.fr-woo-thankyou-alpha .woocommerce-order-overview.order_details li,
.fr-woo-thankyou-alpha section.woocommerce-customer-details,
.fr-woo-thankyou-section-alpha .woocommerce-order-overview.order_details,
.fr-woo-thankyou-section-alpha .woocommerce-order-overview.order_details li,
.fr-woo-thankyou-section-alpha section.woocommerce-customer-details {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* Luft mellan orderöversikt och orderdetaljer-sektionen nedanför */
.fr-woo-thankyou-alpha.brxe-woocommerce-checkout-thankyou .woocommerce-order-overview.order_details,
.fr-woo-thankyou-alpha .woocommerce-order-overview.order_details,
.fr-woo-thankyou-section-alpha .woocommerce-order-overview.order_details {
  margin-bottom: var(--space-xl, 3rem) !important;
}
body.woocommerce-order-received ul.order_details li,
body.woocommerce-order-received .woocommerce-order-overview li {
  border: 0 !important;
  padding: 0 !important;
  color: var(--gc-fg) !important;
}
body.woocommerce-order-received ul.order_details li strong,
body.woocommerce-order-received .woocommerce-order-overview li strong {
  color: var(--gc-fg) !important;
  font-weight: 700;
  display: block;
  margin-top: .25rem;
}

/* Generella WC order-received-rubriker och text */
body.woocommerce-order-received,
body.woocommerce-order-received .woocommerce,
body.woocommerce-order-received .woocommerce-order {
  color: var(--gc-fg);
}
body.woocommerce-order-received h1,
body.woocommerce-order-received h2,
body.woocommerce-order-received h3 {
  color: var(--gc-fg);
}
body.woocommerce-order-received .woocommerce-thankyou-order-received {
  color: var(--gc-fg) !important;
}

/* Customer details + order table */
body.woocommerce-order-received .woocommerce-customer-details address,
body.woocommerce-order-received .woocommerce-order-details {
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xxl, 16.875px);
  padding: var(--space-l, 2rem);
  color: var(--gc-fg);
}

/* Bricks Frames inner heading */
[class*="fr-woo-thankyou"] h1,
[class*="fr-woo-thankyou"] h2,
[class*="fr-woo-thankyou"] h3,
[class*="fr-woo-thankyou"] p,
[class*="fr-woo-thankyou"] span,
[class*="fr-woo-thankyou"] strong { color: var(--gc-fg) !important; }

/* ── Compare-modul: dölj på checkout + cart ──────────────────────── */
body.woocommerce-checkout #gcmp,
body.woocommerce-checkout .gcmp-bar,
body.woocommerce-checkout .gcmp-modal,
body.woocommerce-checkout [aria-label="Produktsammenligning"],
body.woocommerce-cart #gcmp,
body.woocommerce-cart .gcmp-bar,
body.woocommerce-cart .gcmp-modal,
body.woocommerce-cart [aria-label="Produktsammenligning"] { display: none !important; }

/* ─────────────────────────────────────────────────────────────────────
   CART-SIDA (/handlekurv/) — WC default cart-render
   ─────────────────────────────────────────────────────────────────── */

/* Layout: cart-table vänster (2fr), collaterals (totals) höger (1fr) */
body.woocommerce-cart .woocommerce {
  display: grid;
  grid-template-columns: var(--grid-3-1);
  gap: var(--space-l, 2rem);
  align-items: start;
}

/* Tom varukorg: Bricks Frames-mallen (fr-woo-empty-cart-alpha) er en egen brxe-section.
   Nullstill griden til block så den ikke havner i 3fr-kolonnen med en tom 1fr-kolonne ved siden. */
body.woocommerce-cart .woocommerce:has(.wc-empty-cart-message) {
  display: block;
}

body.woocommerce-cart .woocommerce > form.woocommerce-cart-form,
body.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper {
  grid-column: 1;
}

/* cart-collaterals: använd display:contents så cross-sells och cart_totals
   blir direkta grid-syskon till cart-form */
body.woocommerce-cart .cart-collaterals {
  display: contents;
}

body.woocommerce-cart .cart_totals {
  grid-column: 2;
  grid-row: 1;
  width: 100% !important;
  margin: 0;
  position: sticky;
  top: var(--space-m, 2rem);
}

/* Dölj cross-sells helt på cart-sidan (de skapade sticky-glitch + compare-overlap) */
body.woocommerce-cart .cross-sells,
body.woocommerce-cart .cart-collaterals .cross-sells {
  display: none !important;
}

@media (max-width: 1280px) {
  body.woocommerce-cart .woocommerce { grid-template-columns: 1fr; }
  body.woocommerce-cart .cart_totals { position: static; grid-column: 1; grid-row: auto; }
}

/* Cart-tabellens cellinnehåll */
body.woocommerce-cart table.shop_table.cart {
  background: transparent !important;
  border: none;
}
body.woocommerce-cart table.shop_table.cart th,
body.woocommerce-cart table.shop_table.cart td {
  padding: var(--space-s, .85rem);
  vertical-align: middle;
  color: var(--gc-fg) !important;
  background: transparent !important;
}

body.woocommerce-cart table.shop_table.cart .product-thumbnail img {
  width: 64px;
  height: auto;
  border-radius: var(--radius-xs, 4px);
}

body.woocommerce-cart table.shop_table.cart .product-name a {
  color: var(--gc-fg);
  text-decoration: none;
  font-weight: 500;
}
body.woocommerce-cart table.shop_table.cart .product-name a:hover { color: var(--gc-green); }

body.woocommerce-cart table.shop_table.cart .product-price,
body.woocommerce-cart table.shop_table.cart .product-subtotal {
  text-align: right;
  white-space: nowrap;
}

form.cart .quantity,
form.woocommerce-cart-form .quantity {
  width: 150px;
}

body.woocommerce-cart table.shop_table.cart .product-quantity input.qty,
body.woocommerce-cart .quantity input.qty {
  background: var(--gc-bg-input);
  border: 1px solid var(--gc-border);
  color: var(--gc-fg);
  border-radius: var(--radius-xs, 4px);
  padding: .35rem .5rem;
  width: 100%;
  min-height: 38px;
  text-align: center;
}

body.woocommerce-cart table.shop_table.cart .product-remove a {
  color: var(--gc-fg-muted) !important;
  text-decoration: none;
  font-size: 18px;
}
body.woocommerce-cart table.shop_table.cart .product-remove a:hover { color: var(--gc-error) !important; }

/* Cart actions-rad (Tøm, Oppdater) — våra knappar via gameify-clear-cart-pluginen */
body.woocommerce-cart td.actions,
body.woocommerce-cart .woocommerce-cart-form .actions {
  padding: var(--space-m, 1rem) 0 !important;
  border-bottom: none !important;
}

/* Coupon-form */
body.woocommerce-cart .coupon {
  display: flex;
  gap: var(--space-s, .5rem);
}
body.woocommerce-cart .coupon input[name="coupon_code"] {
  background: var(--gc-bg-input);
  border: 1px solid var(--gc-border);
  color: var(--gc-fg);
  border-radius: var(--radius-xs, 4px);
  padding: .65rem 1rem;
  min-height: 44px;
}

/* Cart-totals box höger */
body.woocommerce-cart .cart_totals {
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xxl, 16.875px);
  padding: var(--space-l, 2rem);
  width: 100% !important;
}

body.woocommerce-cart .cart_totals h2 {
  margin: 0 0 var(--space-m, 1rem);
  color: var(--gc-fg);
  font-size: var(--h4, 1.25rem);
  font-weight: 700;
}

body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
  background: transparent !important;
  color: var(--gc-fg) !important;
  padding: var(--space-s, .75rem) 0 !important;
  border-bottom: 1px solid var(--gc-border) !important;
}
body.woocommerce-cart .cart_totals table.shop_table td { text-align: right; }
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td {
  font-weight: 700;
  font-size: var(--text-m, 1rem);
  border-bottom: none !important;
}

/* Checkout-knapp */
body.woocommerce-cart .wc-proceed-to-checkout {
  margin-top: var(--space-m, 1rem);
  padding: 0;
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  width: 100% !important;
  background: var(--gc-green) !important;
  color: #0a0a0a !important;
  border: none;
  padding: 1rem 1.5rem !important;
  font-weight: 700;
  font-size: var(--text-m, 1rem);
  border-radius: var(--radius-xs, 4px);
  text-align: center;
  text-decoration: none;
  display: block;
  text-transform: none;
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover { opacity: .9; }

/* Cross-sells: rutnät av produkt-cards */
body.woocommerce-cart .cross-sells h2 {
  color: var(--gc-fg);
  font-size: var(--h3, 1.5rem);
  font-weight: 700;
  margin: 0 0 var(--space-m, 1rem);
}
body.woocommerce-cart .cross-sells ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-m, 1rem);
  list-style: none;
  margin: 0;
  padding: 0;
}
@media (max-width: 1024px) { body.woocommerce-cart .cross-sells ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { body.woocommerce-cart .cross-sells ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { body.woocommerce-cart .cross-sells ul.products { grid-template-columns: 1fr; } }

body.woocommerce-cart .cross-sells ul.products li.product {
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-s, 6px);
  padding: var(--space-m, 1rem);
  margin: 0 !important;
  width: 100% !important;
  list-style: none;
}
body.woocommerce-cart .cross-sells ul.products li.product img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-xs, 4px);
}
body.woocommerce-cart .cross-sells ul.products li.product .woocommerce-loop-product__title,
body.woocommerce-cart .cross-sells ul.products li.product h2,
body.woocommerce-cart .cross-sells ul.products li.product h3 {
  color: var(--gc-fg);
  font-size: var(--text-m, 1rem);
  margin: var(--space-s, .75rem) 0;
}
body.woocommerce-cart .cross-sells ul.products li.product .price {
  color: var(--gc-green);
  font-weight: 600;
}

/* Empty cart-vy */
body.woocommerce-cart .cart-empty {
  background: var(--gc-bg-elev);
  border: 1px solid var(--gc-border);
  border-radius: var(--radius-xxl, 16.875px);
  padding: var(--space-xl, 3rem);
  text-align: center;
  color: var(--gc-fg);
}
body.woocommerce-cart .return-to-shop a {
  display: inline-block;
  background: var(--gc-green);
  color: #0a0a0a !important;
  padding: .75rem 1.5rem;
  border-radius: var(--radius-xs, 4px);
  text-decoration: none;
  font-weight: 600;
  margin-top: var(--space-m, 1rem);
}

/* Tangentbords-fokus (a11y) */
#place_order:focus-visible,
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }