/* =========================================================
   Hot Pursuit — KOSÁR (WooCommerce Cart blokk) sötét glass dizájn.
   A topbar/footer-t a functions.php injektálja (wp_body_open / wp_footer).
   A Cart blokk kliens-oldalon renderel → a standard .wc-block-* osztályokat
   célozzuk (sok !important, mert a WC blokk-CSS specifikus).
   ========================================================= */
body.hp-cart {
  --fg: #ffffff;
  --fg-muted: rgba(255, 255, 255, 0.66);
  --fg-faint: rgba(255, 255, 255, 0.42);
  --accent: #e10600;
  --rule: rgba(255, 255, 255, 0.12);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --card: rgba(255, 255, 255, 0.045);
  --field: rgba(255, 255, 255, 0.06);
  --pad-x: clamp(20px, 4vw, 56px);
  --font-display: "Oswald", "Inter", sans-serif;
  --green: #2f6b4f;
  --green-bright: #5fbf95;
  /* Sötétített shop-háttérkép (mint a mockupon) — fix, a tartalom rágördül. */
  background-color: #0a0a0a !important;
  background-image:
    linear-gradient(rgba(10, 10, 10, 0.72), rgba(10, 10, 10, 0.84)),
    url('../img/shop-bg-16x9.webp') !important;
  background-size: cover !important;
  background-position: center top !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  color: var(--fg);
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* TT5 fejléc/lábléc + router-bar rejtése (saját topbar/footer van) */
body.hp-cart header.wp-block-template-part,
body.hp-cart footer.wp-block-template-part { display: none !important; }
body.hp-cart .wp-interactivity-router-loading-bar { display: none !important; }
body.hp-cart .wp-site-blocks { padding: 0 !important; margin: 0 !important; }
body.hp-cart .wp-site-blocks > * { margin-block-start: 0 !important; margin-top: 0 !important; }

/* ---------- Topbar (shop-stílus) ---------- */
body.hp-cart .topbar {
  position: relative; z-index: 6;
  display: flex; align-items: center; justify-content: flex-end; gap: clamp(16px, 2vw, 30px);
  padding: clamp(18px, 2.6vw, 30px) var(--pad-x);
}
body.hp-cart .topbar .brand { margin-right: auto; }
body.hp-cart .brand { display: inline-flex; align-items: baseline; gap: 6px; font-family: var(--font-display); font-weight: 600; letter-spacing: 0.14em; font-size: clamp(17px, 1.5vw, 21px); text-transform: uppercase; color: #fff; text-decoration: none; }
body.hp-cart .brand__mark--accent { color: #fff; }
body.hp-cart .topnav { display: flex; align-items: center; gap: clamp(16px, 2vw, 30px); }
body.hp-cart .topnav__link { font-size: 13px; font-weight: 500; color: #fff; opacity: 0.85; text-decoration: none; transition: opacity 200ms var(--ease); }
body.hp-cart .topnav__link:hover { opacity: 1; }
body.hp-cart .topnav__icons { display: flex; align-items: center; gap: 16px; }
body.hp-cart .icon-btn { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 999px; border: 1px solid var(--rule); background: rgba(0, 0, 0, 0.25); color: #fff; }
body.hp-cart .icon-btn svg { width: 18px; height: 18px; }
body.hp-cart .icon-btn__badge { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #fff; color: #000; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
body.hp-cart .nav-toggle { display: none; border: none; background: none; color: #fff; cursor: pointer; padding: 8px 0 8px 10px; }
body.hp-cart .nav-toggle svg { width: 28px; height: 28px; display: block; stroke-width: 1.4; }

/* ---------- Footer ---------- */
/* Sticky footer: a body flex-oszlop, a tartalom kitölti a magasságot, a footer
   a viewport ALJÁRA kerül (eddig a rövid tartalom után "fent lebegett"). */
body.hp-cart { min-height: 100vh; display: flex; flex-direction: column; }
body.hp-cart .wp-site-blocks { flex: 1 0 auto; }
body.hp-cart .hp-cart-footer { margin-top: auto; }
body.hp-cart .hp-shop__footer {
  display: flex; justify-content: flex-end; align-items: center; gap: 10px;
  padding: clamp(20px, 3vw, 32px) var(--pad-x);
  border-top: 1px solid var(--rule);
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #fff;
}
body.hp-cart .hp-shop__footer a { color: #fff; opacity: 0.85; text-decoration: none; transition: opacity 200ms var(--ease); }
body.hp-cart .hp-shop__footer a:hover { opacity: 1; }
body.hp-cart .hp-shop__footer .sep { opacity: 0.5; }

/* ---------- Tartalom-konténer + "Kosár" cím ---------- */
body.hp-cart .wp-site-blocks > main,
body.hp-cart main.is-layout-constrained {
  max-width: 1240px !important; margin: 0 auto !important;
  padding: clamp(8px, 2vw, 24px) var(--pad-x) clamp(40px, 6vh, 80px) !important;
  background: transparent !important;
}
body.hp-cart .wp-block-post-title,
body.hp-cart h1.entry-title,
body.hp-cart .wc-block-cart + * h1 {
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase;
  letter-spacing: 1px; color: #fff; font-size: clamp(34px, 5vw, 56px);
  margin: clamp(16px, 3vw, 32px) 0 6px;
}

/* ---------- Cart blokk: alap ---------- */
body.hp-cart .wc-block-cart,
body.hp-cart .wp-block-woocommerce-cart { color: #fff; }
body.hp-cart .wc-block-cart__main { flex: 1 1 auto; }
/* Tételek doboz (bal) — glass kártya */
body.hp-cart .wc-block-cart-items,
body.hp-cart .wc-block-cart__main > .wc-block-cart-items,
body.hp-cart .wp-block-woocommerce-cart-line-items-block {
  background: rgba(18, 20, 24, 0.55) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 18px;
  overflow: hidden; border-collapse: separate;
  -webkit-backdrop-filter: blur(20px) saturate(1.1);
  backdrop-filter: blur(20px) saturate(1.1);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4);
}
body.hp-cart .wc-block-cart-items__header,
body.hp-cart .wc-block-cart-items__header th {
  color: var(--fg-faint) !important; text-transform: uppercase; letter-spacing: 0.14em;
  font-size: 12px; border-bottom: 1px solid var(--rule) !important; background: transparent !important;
}
body.hp-cart .wc-block-cart-items__row,
body.hp-cart .wc-block-cart-items td,
body.hp-cart .wc-block-cart-item__total,
body.hp-cart .wc-block-cart-items .wc-block-cart-items__row td {
  border-color: var(--rule) !important; background: transparent !important; color: #fff;
}
body.hp-cart .wc-block-cart-item__image img { border-radius: 12px; }
body.hp-cart .wc-block-components-product-name {
  color: #fff !important; font-weight: 600; font-size: 16px; text-decoration: none;
}
body.hp-cart .wc-block-components-product-name:hover { color: #fff !important; text-decoration: underline; }
body.hp-cart .wc-block-components-product-metadata,
body.hp-cart .wc-block-components-product-details,
body.hp-cart .wc-block-components-product-metadata__description { color: var(--fg-muted) !important; font-size: 13px; }
/* A NÉV alatti egységár elrejtve (felesleges; az ÖSSZEG oszlop mutatja). */
body.hp-cart .wc-block-cart-item__prices { display: none !important; }
/* Árak FEHÉREK (nincs autónkénti/zöld szín). */
body.hp-cart .wc-block-components-product-price,
body.hp-cart .wc-block-cart-item__total .wc-block-components-product-price {
  color: #fff !important; font-weight: 600;
}
body.hp-cart .wc-block-cart-item__total { color: #fff !important; font-weight: 700; }

/* Mennyiség-választó (+/-) */
body.hp-cart .wc-block-components-quantity-selector {
  border: 1px solid var(--rule) !important; border-radius: 10px !important; background: var(--field) !important;
}
body.hp-cart .wc-block-components-quantity-selector__button,
body.hp-cart .wc-block-components-quantity-selector__input {
  color: #fff !important; background: transparent !important;
}
body.hp-cart .wc-block-components-quantity-selector__button:hover { background: rgba(255, 255, 255, 0.08) !important; }
/* Törlés link */
body.hp-cart .wc-block-cart-item__remove-link { color: var(--fg-faint) !important; }
body.hp-cart .wc-block-cart-item__remove-link:hover { color: #fff !important; }
/* Termékkép nagyobb + lekerekített */
body.hp-cart td.wc-block-cart-item__image,
body.hp-cart .wc-block-cart-item__image { width: 96px !important; padding-right: 16px; }
body.hp-cart .wc-block-cart-item__image img { width: 100% !important; border-radius: 12px; }
/* Tétel-sor belső térköz */
body.hp-cart .wc-block-cart-items__row { padding: 18px clamp(14px, 1.6vw, 22px) !important; }
body.hp-cart .wc-block-cart-items__header { padding: 14px clamp(14px, 1.6vw, 22px) !important; }

/* ---------- Sidebar (KOSÁR ÖSSZESEN) — glass panel ---------- */
body.hp-cart .wc-block-cart__sidebar .wc-block-components-sidebar,
body.hp-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block,
body.hp-cart .wc-block-cart__sidebar > .is-large {
  background: rgba(18, 20, 24, 0.55) !important; border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 18px !important; padding: clamp(18px, 2vw, 26px) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.1); backdrop-filter: blur(20px) saturate(1.1);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4);
}
body.hp-cart .wc-block-components-totals-item,
body.hp-cart .wc-block-components-totals-item__label,
body.hp-cart .wc-block-components-totals-item__value { color: #fff !important; }
body.hp-cart .wc-block-components-totals-item__label { color: var(--fg-muted) !important; }
body.hp-cart .wc-block-components-totals-footer-item,
body.hp-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: #fff !important; font-weight: 700; font-size: 18px;
}
body.hp-cart .wc-block-components-totals-item,
body.hp-cart .wc-block-components-panel,
body.hp-cart .wc-block-components-totals-coupon { border-color: var(--rule) !important; }
/* Kupon mező */
body.hp-cart .wc-block-components-totals-coupon__button,
body.hp-cart .wc-block-components-panel__button { color: #fff !important; }
body.hp-cart .wc-block-components-text-input input,
body.hp-cart .wc-block-components-totals-coupon__input input {
  background: var(--field) !important; border: 1px solid var(--rule) !important; color: #fff !important; border-radius: 10px !important;
}
/* Tovább a pénztárhoz gomb */
body.hp-cart .wc-block-cart__submit-button,
body.hp-cart .wc-block-cart__submit-container a,
body.hp-cart .wc-block-cart__submit-container button,
body.hp-cart .wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button {
  background: #ffffff !important; color: #0a0a0a !important; border: none !important;
  border-radius: 12px !important; font-weight: 700 !important; letter-spacing: 0.04em;
  padding: 16px !important; width: 100% !important; box-shadow: none !important;
  transition: background-color 220ms var(--ease), color 220ms var(--ease);
}
body.hp-cart .wc-block-cart__submit-button:hover,
body.hp-cart .wc-block-cart__submit-container button:hover { background: var(--cart-accent, #2f6b4f) !important; color: #fff !important; }

/* Üres kosár szöveg / linkek */
body.hp-cart .wc-block-cart__empty-cart__title,
body.hp-cart .cart-empty { color: #fff; }
body.hp-cart a { color: #fff; }

/* ---------- Reszponzív ---------- */
@media (max-width: 900px) {
  body.hp-cart .nav-toggle { display: inline-flex; order: 3; }
  body.hp-cart .topbar { padding-right: 8px; }
  body.hp-cart .topnav {
    display: none; position: absolute; top: calc(100% - 6px); right: 8px;
    flex-direction: column; align-items: flex-start; gap: 0;
    min-width: 180px; padding: 6px 16px;
    background: rgba(16, 18, 20, 0.85); border: 1px solid var(--rule); border-radius: 14px;
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); z-index: 30;
  }
  body.hp-cart .topnav.is-open { display: flex; }
  body.hp-cart .topnav__link { padding: 8px 0; width: 100%; font-size: 14px; }
  /* iOS-en a fixed háttér akadozik → görgő háttér mobilon. */
  body.hp-cart { background-attachment: scroll !important; }
}
