/* ==========================================================================
   WooCommerce-harmonisering
   Tilpasser WooCommerce sin egen markup (knapper, varsler, handlekurv,
   kasse, enkeltprodukt, mini-cart) til Vegår-designsystemet.
   Bruker tokens fra main.css (:root). Hand-skrevet — ikke bygget av Tailwind.
   ========================================================================== */

/* ---------- Bilde-fix ----------
   WooCommerce setter «.woocommerce-page img { height:auto }» globalt, som
   slår Tailwind sine h-10/h-full (lik/lavere spesifisitet). Gjenopprett
   høydene for våre komponenter. */
.woocommerce-page #SiteLogo img {
  height: 2.5rem !important;
  width: auto !important;
}
.woocommerce-page #SiteFooter img {
  height: 4rem !important;
  width: auto !important;
}
.woocommerce-page .mv-product-card img {
  height: 100% !important;
}
/* WooCommerce legger til en «Vis handlekurv»-lenke etter AJAX-knappen.
   Vi har toast + mini-cart-drawer, så skjul den (kort + enkeltprodukt). */
.mv-product-card a.added_to_cart,
.single-product div.product form.cart a.added_to_cart {
  display: none !important;
}

/* ---------- Knapper ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button,
.woocommerce-page .button,
.wc-block-components-button {
  background-color: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border: 0;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-family: var(--font-sans);
  letter-spacing: 0;
  padding: 0.75rem 1.5rem;
  line-height: 1.2;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .button:hover,
.woocommerce-page .button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background-color: color-mix(in oklch, var(--primary) 90%, black) !important;
  color: var(--primary-foreground) !important;
}
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--secondary) !important;
  color: var(--secondary-foreground) !important;
}
.woocommerce .button:disabled,
.woocommerce .button.disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* ---------- Varsler / meldinger ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.woocommerce .woocommerce-message {
  border-top: 0;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--foreground);
  padding: 1rem 1.25rem;
  font-size: 0.9rem;
}
.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--secondary);
}
.woocommerce-message {
  border-left: 4px solid var(--secondary);
}
.woocommerce-info {
  border-left: 4px solid var(--accent);
}
.woocommerce-error {
  border-left: 4px solid var(--destructive);
  list-style: none;
}
.woocommerce-error::before {
  color: var(--destructive);
}

/* ---------- Resultatteller + sortering (toolbar over rutenettet) ---------- */
.mv-shop-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin: 0 0 1.5rem;
}
.mv-shop-toolbar .woocommerce-result-count {
  float: none;
  margin: 0;
  color: var(--muted-foreground);
  font-size: 0.875rem;
}
.mv-shop-toolbar .woocommerce-ordering {
  float: none;
  margin: 0;
}
.mv-shop-toolbar .woocommerce-ordering select,
.mv-shop-toolbar select.orderby {
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  background: var(--card);
  color: var(--foreground);
  font-size: 0.875rem;
  padding: 0.55rem 0.75rem;
  line-height: 1.3;
  max-width: 100%;
}

/* ---------- Priser ---------- */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
  color: var(--primary);
  font-weight: 700;
  font-family: var(--font-display);
}
.woocommerce div.product p.price del,
.woocommerce ul.products li.product .price del {
  color: var(--muted-foreground);
  font-weight: 400;
  opacity: 0.7;
}

/* ---------- Enkeltprodukt ---------- */
.woocommerce div.product {
  display: grid;
  gap: 2.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .woocommerce div.product {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
  }
  .woocommerce div.product .woocommerce-product-gallery {
    width: 100% !important;
    margin-bottom: 0 !important;
  }
  .woocommerce div.product .summary {
    width: 100% !important;
    margin-bottom: 0 !important;
  }
  /* Faner og relaterte produkter går i full bredde under */
  .woocommerce div.product .woocommerce-tabs,
  .woocommerce div.product .related,
  .woocommerce div.product .upsells {
    grid-column: 1 / -1;
  }
}
.woocommerce div.product .woocommerce-product-gallery {
  border-radius: var(--radius-xl);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--muted);
}
.woocommerce div.product .product_title {
  font-family: var(--font-display);
  letter-spacing: -0.015em;
  color: var(--primary);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
}
.woocommerce div.product .summary > .price {
  font-size: 1.75rem;
  margin-top: 0.75rem;
}
.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--foreground);
  opacity: 0.85;
  line-height: 1.6;
  margin-top: 1rem;
  margin-bottom: 1.75rem; /* luft mellom beskrivelse og kjøpsknapp */
}
/* Ekstra luft over kjøps-skjemaet (antall + Legg i handlekurv) */
.woocommerce div.product form.cart {
  margin-top: 1.75rem;
  margin-bottom: 1.5rem;
}

/* Antall-velger (− / +) */
.mv-qty {
  display: inline-flex;
  align-items: stretch;
  height: 3rem;
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--card);
  width: auto;
}
.mv-qty .mv-qty-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  flex: none;
  border: 0;
  background: transparent;
  color: var(--primary);
  cursor: pointer;
  padding: 0;
  transition: background-color 0.15s ease;
}
.mv-qty .mv-qty-btn:hover {
  background: var(--muted);
}
.mv-qty .mv-qty-btn:active {
  background: color-mix(in oklch, var(--accent) 50%, transparent);
}
.mv-qty input.qty {
  width: 3rem !important;
  height: auto !important;
  min-height: 100%;
  border: 0 !important;
  border-left: 1px solid var(--border) !important;
  border-right: 1px solid var(--border) !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center;
  font-weight: 600;
  color: var(--foreground);
  padding: 0 !important;
  -moz-appearance: textfield;
  appearance: textfield;
}
.mv-qty input.qty::-webkit-outer-spin-button,
.mv-qty input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.mv-qty--readonly {
  width: auto;
}
.mv-qty--readonly input.qty {
  border: 0 !important;
}

/* Enkeltprodukt: still antall + «Legg i handlekurv» på samme linje */
.single-product div.product form.cart:not(.variations_form),
.single-product div.product .woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.single-product div.product form.cart .single_add_to_cart_button {
  height: 3rem;
  display: inline-flex;
  align-items: center;
}

/* Faner */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  margin: 0;
  padding: 0 0 0.25rem;
  border-bottom: 1px solid var(--border);
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before {
  border-bottom-color: var(--border);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0 1.25rem 0 0;
  padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
  display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--muted-foreground);
  font-weight: 600;
  font-family: var(--font-display);
  padding: 0.75rem 0;
  display: inline-block;
  border-bottom: 2px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--primary);
  border-bottom-color: var(--secondary);
}
/* Fane-panel: lesbar typografi + luft */
.woocommerce div.product .woocommerce-tabs .panel {
  margin: 0;
  padding-top: 1.75rem;
  max-width: 46rem;
  color: var(--foreground);
  font-size: 1rem;
  line-height: 1.75;
}
.woocommerce div.product .woocommerce-tabs .panel > h2 {
  font-family: var(--font-display);
  color: var(--primary);
  font-size: 1.5rem;
  letter-spacing: -0.015em;
  margin: 0 0 0.75rem;
}
.woocommerce div.product .woocommerce-tabs .panel p {
  margin: 0 0 1rem;
}
.woocommerce div.product .woocommerce-tabs .panel p:last-child {
  margin-bottom: 0;
}
.woocommerce div.product .woocommerce-tabs .panel a {
  color: var(--primary);
  text-underline-offset: 3px;
  text-decoration: underline;
}

/* Relaterte produkter / mersalg — seksjon + overskrift */
.woocommerce div.product .related,
.woocommerce div.product .upsells {
  margin-top: 1rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--border);
}
.woocommerce .related > h2,
.woocommerce .upsells > h2,
.woocommerce .cross-sells > h2 {
  font-family: var(--font-display);
  color: var(--primary);
  font-size: 1.75rem;
  letter-spacing: -0.015em;
  margin: 0 0 1.5rem;
}

/* FIX: WooCommerce sin clearfix (::before/::after, display:table) blir
   grid-elementer i .mv-product-grid og dytter kortene én kolonne mot høyre.
   Nøytraliser dem. */
.mv-product-grid::before,
.mv-product-grid::after {
  content: none !important;
  display: none !important;
}

/* ---------- Omtaler (reviews) ---------- */
/* Stjerner: tomme i sage, fylte i moss */
.woocommerce #reviews .mv-stars .star-rating {
  font-size: 1.05em;
  margin: 0;
  line-height: 1;
}
.woocommerce #reviews .mv-stars .star-rating::before {
  color: var(--accent);
  opacity: 1;
}
.woocommerce #reviews .mv-stars .star-rating span::before {
  color: var(--secondary);
}
.woocommerce #reviews .mv-reviews-summary .mv-stars .star-rating {
  font-size: 1.3em;
}

/* Liste-reset (overstyrer WC sin .commentlist) */
.woocommerce #reviews ol.commentlist.mv-reviews,
.mv-reviews {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mv-reviews li {
  margin: 0;
  padding: 0;
  list-style: none;
  border: 0;
  background: none;
}
.mv-reviews li::before,
.mv-reviews li::after {
  content: none;
}
.mv-review-text p {
  margin: 0 0 0.75rem;
}
.mv-review-text p:last-child {
  margin-bottom: 0;
}

/* Omtaleskjema */
#review_form .comment-reply-title,
#review_form .mv-review-form-title {
  display: block;
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--primary);
  margin: 0 0 0.4rem;
}
#review_form .comment-notes {
  font-size: 0.85rem;
  color: var(--muted-foreground);
  margin: 0 0 1.25rem;
}
#review_form .comment-form-rating label,
#review_form .comment-form-comment label,
#review_form .comment-form-author label,
#review_form .comment-form-email label {
  display: block;
  font-weight: 500;
  color: var(--foreground);
  margin-bottom: 0.4rem;
  font-size: 0.9rem;
}
#review_form .comment-form-author,
#review_form .comment-form-email,
#review_form .comment-form-comment,
#review_form .comment-form-rating {
  margin: 0 0 1.1rem;
}
#review_form input[type="text"],
#review_form input[type="email"],
#review_form textarea {
  width: 100%;
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  background: var(--background);
  color: var(--foreground);
  padding: 0.65rem 0.8rem;
  font-size: 0.95rem;
  line-height: 1.5;
}
#review_form input[type="text"]:focus,
#review_form input[type="email"]:focus,
#review_form textarea:focus {
  outline: 2px solid var(--ring);
  outline-offset: 1px;
}
@media (min-width: 641px) {
  #review_form .comment-form-author,
  #review_form .comment-form-email {
    display: inline-block;
    width: calc(50% - 0.5rem);
    vertical-align: top;
  }
  #review_form .comment-form-author {
    margin-right: 0.9rem;
  }
}
/* Interaktive stjerner (JS bytter ut <select>) */
#review_form p.stars {
  margin: 0;
  line-height: 1;
}
#review_form p.stars a {
  font-size: 1.5em;
  margin-right: 2px;
}
#review_form p.stars a::before {
  color: var(--accent);
}
#review_form p.stars:hover a::before,
#review_form p.stars.selected a.active::before,
#review_form p.stars.selected a:not(.active)::before {
  color: var(--secondary);
}
#review_form p.stars a:hover ~ a::before,
#review_form p.stars.selected a.active ~ a::before {
  color: var(--accent);
}
/* Fallback-select om JS ikke kjører */
#review_form #rating {
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  background: var(--card);
  padding: 0.55rem 0.75rem;
  color: var(--foreground);
}
#review_form .comment-form-cookies-consent {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  font-size: 0.8rem;
  color: var(--muted-foreground);
  margin: 0 0 1rem;
}
#review_form .form-submit {
  margin: 0.25rem 0 0;
}
#review_form .form-submit input[type="submit"] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border: 0;
  border-radius: var(--radius-sm);
  font-weight: 600;
  padding: 0.85rem 1.75rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
#review_form .form-submit input[type="submit"]:hover {
  background: color-mix(in oklch, var(--primary) 90%, black) !important;
}

/* ---------- Handlekurv-tabell ---------- */
.woocommerce table.shop_table {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  border-collapse: separate;
  overflow: hidden;
}
.woocommerce table.shop_table th {
  font-family: var(--font-display);
  color: var(--primary);
}
.woocommerce table.shop_table td,
.woocommerce table.shop_table th {
  border-top: 1px solid var(--border);
  padding: 1rem;
}
.woocommerce .cart_totals h2,
.woocommerce-cart .cart-collaterals h2,
.woocommerce-checkout #order_review_heading {
  font-family: var(--font-display);
  color: var(--primary);
  font-size: 1.5rem;
  letter-spacing: -0.015em;
}
.woocommerce a.remove {
  color: var(--destructive) !important;
  border: 1px solid var(--border);
}
.woocommerce a.remove:hover {
  background: var(--destructive) !important;
  color: var(--destructive-foreground) !important;
}

/* Kupong / coupon */
.woocommerce .cart .coupon .input-text {
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  padding: 0.6rem 0.75rem;
}

/* ---------- Kasse (checkout) ---------- */
.woocommerce form .form-row label,
.woocommerce-checkout label {
  color: var(--foreground);
  font-weight: 500;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout input.input-text,
.woocommerce .select2-container--default .select2-selection--single,
.woocommerce form .form-row .select2-selection {
  border: 1px solid var(--input) !important;
  border-radius: var(--radius-sm);
  background: var(--card);
  color: var(--foreground);
  padding: 0.65rem 0.75rem;
  min-height: 3rem;
  line-height: 1.4;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  outline: 2px solid var(--ring);
  outline-offset: 1px;
}
.woocommerce-checkout #payment,
.woocommerce .woocommerce-checkout-review-order {
  background: var(--muted);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.woocommerce-checkout #payment ul.payment_methods {
  border-bottom-color: var(--border);
}
.woocommerce-checkout #payment div.payment_box {
  background: var(--card);
  color: var(--foreground);
}
.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--card);
}

/* ---------- Mini-handlekurv (drawer) ----------
   Egen mal: woocommerce/cart/mini-cart.php. Disse reglene nuller ut
   WooCommerce sine standard .product_list_widget-stiler. */
/* #CartDrawer-prefiks slår WooCommerce sin «ul.product_list_widget { padding:0 }» */
#CartDrawer .mv-mini-cart {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  margin: 0;
  padding: 0 1.25rem;
  list-style: none;
  /* Mykere scroll: ingen «scroll-chaining» til siden bak, momentum på touch */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}
.mv-mini-cart li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mv-mini-cart li::before,
.mv-mini-cart li::after {
  display: none !important;
  content: none !important;
}
.mv-mini-cart .mv-cart-line {
  display: flex;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}
/* Fjerning pågår: dim + deaktiver varen, vis spinner over den
   (erstatter WooCommerce sin svarte blockUI-overlay). */
.mv-cart-line.is-removing {
  position: relative;
  pointer-events: none;
}
.mv-cart-line.is-removing > * {
  opacity: 0.3;
  transition: opacity 0.15s ease;
}
.mv-cart-line.is-removing::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.5rem;
  height: 1.5rem;
  border: 2px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: mv-spin 0.7s linear infinite;
}
@keyframes mv-spin {
  to {
    transform: rotate(360deg);
  }
}
/* Produktbilde fyller boksen (overstyrer WC sin float:right; width:32px) */
.mv-cart-thumb {
  display: block;
  height: 6rem;
  width: 6rem;
  flex: none;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--muted);
}
.mv-cart-thumb img {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  float: none !important;
  object-fit: cover;
}
/* Fjern-lenke (×) — #CartDrawer for å slå WooCommerce sin standard a.remove */
#CartDrawer a.remove.mv-cart-remove {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.25rem;
  width: 2.25rem;
  flex: none;
  border: 0 !important;
  border-radius: var(--radius-md);
  font-size: 1.35rem;
  line-height: 1;
  font-weight: 400;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  text-decoration: none;
}
#CartDrawer a.remove.mv-cart-remove:hover {
  color: var(--destructive) !important;
  background: var(--muted) !important;
}

/* Footer: oppsummering + knapper */
.mv-mini-cart-footer {
  flex: none;
  border-top: 1px solid var(--border);
  background: color-mix(in oklch, var(--muted) 55%, transparent);
  padding: 1.25rem;
}
.mv-mini-cart-empty {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1.25rem;
}
/* Robust flex-layout for drawer-innholdet — også etter fragment-bytte
   (AJAX legger inn en ny .widget_shopping_cart_content uten inline-klasser). */
#CartDrawer .widget_shopping_cart_content {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

/* Antall-velger (− [n] +) i mini-handlekurven */
.mv-cart-qty {
  display: inline-flex;
  align-items: stretch;
  height: 2rem;
  border: 1px solid var(--input);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--card);
}
.mv-cart-qty.is-busy {
  opacity: 0.5;
  pointer-events: none;
}
.mv-cart-qty-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  border: 0;
  background: transparent;
  color: var(--primary);
  cursor: pointer;
  padding: 0;
  transition: background-color 0.15s ease;
}
.mv-cart-qty-btn:hover {
  background: var(--muted);
}
.mv-cart-qty-val {
  min-width: 2.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--foreground);
}

/* Mini-cart-drawer under WP-adminlinjen (kun innloggede) */
body.admin-bar .cart-drawer {
  top: 46px;
}
@media screen and (min-width: 783px) {
  body.admin-bar .cart-drawer {
    top: 32px;
  }
}

/* Større trykkmål på mobil/touch — drawer + blokk-kurv */
@media (max-width: 768px) {
  .mv-cart-qty {
    height: 2.6rem;
  }
  .mv-cart-qty-btn {
    width: 2.6rem;
  }
  .mv-cart-qty-val {
    min-width: 2.5rem;
    font-size: 0.95rem;
  }
  #CartDrawer a.remove.mv-cart-remove {
    height: 2.6rem;
    width: 2.6rem;
    font-size: 1.55rem;
  }
  /* WooCommerce blokk-kurv sin antall-velger */
  .wc-block-components-quantity-selector {
    max-width: 9rem !important;
  }
  .wc-block-components-quantity-selector__button {
    min-width: 2.6rem;
    min-height: 2.6rem;
  }
  .wc-block-components-quantity-selector__input {
    min-height: 2.6rem;
  }
}

/* ---------- Min konto (My Account) ---------- */
/* Layout: sidemeny + innhold (kun når navigasjonen finnes, dvs. innlogget) */
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 2.5rem;
  align-items: start;
}
/* WooCommerce sin clearfix (::before/::after, display:table) blir grid-elementer
   og forskyver kolonnene — nøytraliser dem (samme felle som .mv-product-grid). */
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::before,
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::after {
  content: none !important;
  display: none !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
}
@media (max-width: 768px) {
  .woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

/* Navigasjonsmeny som ren liste (ingen punkter) */
.woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--card);
}
.woocommerce-MyAccount-navigation li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border-bottom: 1px solid var(--border);
}
.woocommerce-MyAccount-navigation li::before,
.woocommerce-MyAccount-navigation li::after {
  content: none !important;
}
.woocommerce-MyAccount-navigation li:last-child {
  border-bottom: 0;
}
.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 0.8rem 1.1rem;
  color: var(--foreground);
  font-weight: 500;
  text-decoration: none !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.woocommerce-MyAccount-navigation li a:hover {
  background: var(--muted);
  color: var(--primary);
}
.woocommerce-MyAccount-navigation li.is-active a {
  background: var(--primary);
  color: var(--primary-foreground);
  font-weight: 600;
}

/* Innhold */
.woocommerce-MyAccount-content {
  color: var(--foreground);
}
.woocommerce-MyAccount-content p {
  line-height: 1.7;
}
.woocommerce-MyAccount-content > h2,
.woocommerce-MyAccount-content > h3,
.woocommerce-MyAccount-content legend {
  font-family: var(--font-display);
  color: var(--primary);
  letter-spacing: -0.015em;
  font-size: 1.35rem;
  font-weight: 700;
  margin: 0 0 1rem;
}
.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-button) {
  color: var(--primary);
  text-underline-offset: 3px;
}
/* «Bestill nytt»/oversikt-tabeller arver .shop_table-stilen over */
.woocommerce-account .woocommerce-orders-table__cell,
.woocommerce-account .woocommerce-table--order-downloads td {
  vertical-align: middle;
}

/* ---------- Kasse/Handlekurv-blokker (Gutenberg) ----------
   Blokkene bruker WordPress sin admin-blåfarge for fokus/aktiv-tilstand.
   Map den til Vegår-grønn, og match felt/overskrifter med resten. */
.wc-block-checkout,
.wp-block-woocommerce-cart,
.wc-block-components-form,
.wc-block-checkout__sidebar {
  --wp-admin-theme-color: var(--primary);
  --wp-admin-theme-color-darker-10: var(--primary);
  --wp-admin-theme-color-darker-20: var(--primary);
}
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select .wc-block-components-select__container,
.wc-block-components-address-form input,
.wc-block-components-quantity-selector {
  border-color: var(--input) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--card);
}
.wc-block-components-text-input.is-active label,
.wc-block-components-checkout-step__description a,
.wc-block-checkout a:not(.wc-block-components-button) {
  color: var(--primary);
}
.wc-block-components-checkout-step__title,
.wc-block-components-title,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-title {
  font-family: var(--font-display) !important;
  color: var(--primary) !important;
  letter-spacing: -0.015em;
}
.wc-block-components-checkout-step__title-number {
  background: var(--secondary) !important;
  color: var(--secondary-foreground) !important;
}
.wc-block-checkout__sidebar .wc-block-components-totals-wrapper,
.wp-block-woocommerce-checkout-order-summary-block {
  border-color: var(--border) !important;
  border-radius: var(--radius-lg);
}

/* ----- Moderne kort-look for kurv/kasse-blokkene ----- */

/* Overskrifter i display-font */
.wc-block-cart__totals-title,
.wp-block-woocommerce-cart-order-summary-heading-block {
  font-family: var(--font-display) !important;
  color: var(--primary) !important;
  letter-spacing: -0.01em;
  font-weight: 700;
}

/* Kolonne-header i varelisten */
.wc-block-cart-items__header {
  font-size: 0.72rem !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted-foreground) !important;
  border-bottom: 1px solid var(--border) !important;
  font-weight: 600;
}

/* Produktbilder */
.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img {
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background: var(--muted);
}

/* Produktnavn + radskiller */
.wc-block-components-product-name {
  font-weight: 600 !important;
  color: var(--primary) !important;
}
.wc-block-cart-items__row {
  border-color: var(--border) !important;
}
.wc-block-cart-item__product .wc-block-components-product-metadata {
  color: var(--muted-foreground);
}

/* Antall-velger → samme look som ellers (− [n] +) */
.wc-block-components-quantity-selector {
  border: 1px solid var(--input) !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden;
  max-width: 7.5rem;
  background: var(--card);
}
.wc-block-components-quantity-selector::after {
  display: none !important;
}
.wc-block-components-quantity-selector__input {
  font-weight: 600;
  color: var(--foreground);
}
.wc-block-components-quantity-selector__button {
  color: var(--primary) !important;
  font-weight: 600;
}
.wc-block-components-quantity-selector__button:hover {
  background: var(--muted) !important;
}

/* Fjern-lenke */
.wc-block-cart-item__remove-link {
  color: var(--muted-foreground) !important;
}
.wc-block-cart-item__remove-link:hover {
  color: var(--destructive) !important;
}

/* Oppsummerings-sidebar som kort */
.wc-block-cart__sidebar.wc-block-components-sidebar,
.wp-block-woocommerce-checkout-order-summary-block {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-xl) !important;
  background: var(--card) !important;
  padding: 1.5rem !important;
}
@media (min-width: 1000px) {
  .wc-block-cart__sidebar.wc-block-components-sidebar {
    position: sticky;
    top: 90px;
  }
}

/* Totals-linjer */
.wc-block-components-totals-item__label {
  color: var(--muted-foreground);
}
.wc-block-components-totals-footer-item {
  font-family: var(--font-display);
  color: var(--primary);
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-weight: 700;
}

/* «Legg til rabattkoder»-veksleren (lenke-stil) — grønn tekst */
.wc-block-components-panel__button {
  color: var(--primary) !important;
}
/* «Bruk»-knappen for rabattkode er en fylt grønn knapp → hvit tekst
   (uten dette ble grønn tekst usynlig på grønn bakgrunn) */
.wc-block-components-totals-coupon__button {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
}
.wc-block-components-totals-coupon__button:hover {
  background: color-mix(in oklch, var(--primary) 90%, black) !important;
  color: var(--primary-foreground) !important;
}

/* «Fortsett til kassen»-knapp i kurven */
.wc-block-cart__submit-button {
  border-radius: var(--radius-sm) !important;
  font-weight: 600 !important;
  padding: 0.9rem 1.5rem !important;
}

/* Generelt skjul WC sin standard sidebar (vi fjernet den i PHP også) */
.woocommerce-page .widget-area.shop-sidebar {
  display: none;
}

/* ============================================================
   Knappe-feedback: trykk-respons + lasting (spinner + deaktivert)
   ============================================================ */

/* Mykt trykk på alle handlingsknapper */
.mv-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wc-block-components-button,
.single_add_to_cart_button,
.add_to_cart_button {
  transition: transform 0.12s ease, background-color 0.2s ease,
    color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.mv-btn:active:not(.is-loading),
.woocommerce a.button:active,
.woocommerce button.button:active,
.woocommerce input.button:active,
.wc-block-components-button:active,
.single_add_to_cart_button:active,
.add_to_cart_button:active {
  transform: translateY(1px) scale(0.985);
}

/* Lasting: skjul teksten, vis en ren spinner, deaktiver knappen.
   (Erstatter også WooCommerce sin egen «.loading»-glyph.)
   .woocommerce-prefiks for å slå knappe-harmoniseringens !important-farge. */
.mv-btn.is-loading,
.add_to_cart_button.loading,
.woocommerce a.button.is-loading,
.woocommerce button.button.is-loading,
.woocommerce input.button.is-loading,
.woocommerce a.button.alt.is-loading,
.woocommerce button.button.alt.is-loading,
.woocommerce input.button.alt.is-loading,
.woocommerce a.button.loading,
.woocommerce button.button.loading,
.woocommerce input.button.loading,
.woocommerce button.single_add_to_cart_button.is-loading {
  position: relative !important;
  color: transparent !important;
  opacity: 1 !important;
  pointer-events: none;
}
.mv-btn.is-loading::after,
.add_to_cart_button.loading::after,
.woocommerce a.button.is-loading::after,
.woocommerce button.button.is-loading::after,
.woocommerce input.button.is-loading::after,
.woocommerce a.button.alt.is-loading::after,
.woocommerce button.button.alt.is-loading::after,
.woocommerce input.button.alt.is-loading::after,
.woocommerce a.button.loading::after,
.woocommerce button.button.loading::after,
.woocommerce input.button.loading::after,
.woocommerce button.single_add_to_cart_button.is-loading::after {
  content: "" !important;
  position: absolute;
  inset: 0;
  margin: auto !important;
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid oklch(1 0 0 / 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  background: none !important;
  animation: mv-spin 0.7s linear infinite;
  font-size: 0 !important;
  opacity: 1;
}
/* Sekundær-/outline-knapper har lys bakgrunn og grønn tekst (.text-primary).
   Den hvite spinneren blir usynlig der — bruk grønn spinner i stedet. */
.mv-btn.text-primary.is-loading::after {
  border-color: oklch(0.32 0.06 145 / 0.25);
  border-top-color: var(--primary);
}

/* ============================================================
   Hurtigkasse (Vipps express-checkout — blokk-kassen)
   Plugin-en (woo-vipps) viser en liten, venstrejustert SVG-knapp
   i en full-bredde boks. På desktop ser det ubalansert ut («halv
   boks»). Vi sentrerer knappen i naturlig størrelse og strammer
   inn luften, slik at hurtigkasse-boksen leses som tilsiktet.
   Klassene under finnes i plugin-/blokk-markupen på kassesiden.
   ============================================================ */

/* Sentrer Vipps-knappen i hurtigkasse-boksen */
.wc-block-components-express-payment__event-buttons {
  margin: 0;
}
#express-payment-method-vippsexpress,
.vipps-express-container {
  display: flex;
  justify-content: center;
}

/* Selve knappen: behold SVG-en i naturlig størrelse, sentrert,
   med samme trykk-/hover-respons som resten av knappene.
   VIKTIG: .button-harmoniseringen («.woocommerce-page .button»)
   legger grønn bakgrunn + ramme/skygge med !important. Den grønne
   bakgrunnen lyste gjennom rundt SVG-en og så ut som en svart/grønn
   kant — derfor må vi nulle bakgrunn/ramme/skygge med !important her. */
.vipps-express-container a.vipps-express-checkout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  min-height: 0 !important;
  border-radius: var(--radius-sm);
  transition: transform 0.12s ease, opacity 0.2s ease;
}
.vipps-express-container a.vipps-express-checkout img {
  display: block;
  width: auto;
  height: auto;
  max-height: 3rem;
  max-width: 100%;
  margin: 0;
}
.vipps-express-container a.vipps-express-checkout:hover {
  opacity: 0.92;
}
.vipps-express-container a.vipps-express-checkout:active {
  transform: translateY(1px) scale(0.985);
}
/* Nettleserens standard fokusramme er nær-svart (rgb(16,16,16)) og dukket
   opp som en «rar svart kant» etter klikk. Erstatt med tema-ring, og bare
   for tastatur-fokus (ingen ramme ved muse-klikk). */
.vipps-express-container a.vipps-express-checkout:focus {
  outline: none;
}
.vipps-express-container a.vipps-express-checkout:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}

/* Stram inn boksen rundt knappen — lik luft på alle fire sider, slik at
   knappen (særlig i full bredde på mobil) ikke klistrer seg til kantene. */
.wc-block-components-express-payment__content {
  padding: 0.75rem !important;
}

/* «Hurtigkasse»-tittel + «Eller fortsett nedenfor»-skille → tema-tokens */
.wc-block-components-express-payment__title {
  font-family: var(--font-display);
  color: var(--muted-foreground);
}
.wc-block-components-express-payment-continue-rule {
  color: var(--muted-foreground);
}

/* Mobil: la Vipps-knappen gå i full bredde (matcher CTA-en nederst).
   SVG-en er 300×44 (~6,8:1), så full bredde blir ~52px høy — fin CTA-høyde. */
@media (max-width: 768px) {
  #express-payment-method-vippsexpress,
  .vipps-express-container,
  .vipps-express-container a.vipps-express-checkout {
    width: 100%;
  }
  .vipps-express-container a.vipps-express-checkout img {
    width: 100%;
    height: auto;
    max-height: none;
  }
}
