/* Wygląd sklepu (P9). Each rule is scoped to a page body class or to the Theme Builder header (layout 104).
   The header classes (.et_pb_*_tb_header) are generated by Divi from that layout — re-check them after editing it. */

/* W1 header — cart and menu icons on one line; the cart amount fits.
   The layout positions them with negative margins, scale transforms and an absolutely placed cart button inside a
   zero-height wrapper; we drop those offsets and let the flex row centre everything. !important beats Divi's
   generated per-module styles, which use the same selectors with higher order. */
header.et-l--header .et_pb_row_1_tb_header { align-items: center; }
@media (max-width: 980px) {
  header.et-l--header .et_pb_row_1_tb_header { padding: 12px 16px !important; }
  header.et-l--header .et_pb_column_3_tb_header { flex: 1 1 0; min-width: 0; width: auto !important; }
  header.et-l--header .et_pb_column_4_tb_header { flex: 0 0 auto; width: auto !important; }
}
header.et-l--header .et_pb_column_4_tb_header {
  display: flex; align-items: center; justify-content: flex-end; gap: 12px;
  inset: auto !important; transform: none !important;
}
header.et-l--header .et_pb_text_1_tb_header { margin: 0 !important; transform: none !important; width: auto !important; }
/* The cart text module holds only the CartPops block between two empty paragraphs (WP autop) that push it down. */
header.et-l--header .et_pb_text_1_tb_header .et_pb_text_inner > p:not(:has(.cpops-launcher)) { display: none; }
header.et-l--header .cpops-launcher--inline {
  position: relative !important; inset: auto !important; width: auto !important; height: 40px !important;
  gap: 6px; padding: 0 10px !important; white-space: nowrap;
}
header.et-l--header .cpops-launcher--inline .cpops-launcher__total { white-space: nowrap; }
header.et-l--header .et_pb_code_0_tb_header {   /* keeps its left border as the divider */
  margin: 0 !important; padding: 0 0 0 12px !important; transform: none !important; width: auto !important;
}
header.et-l--header .et_pb_code_0_tb_header .et_pb_code_inner { display: flex; align-items: center; height: 40px; }
header.et-l--header .et_pb_code_0_tb_header .molti-dropdown-2 { width: 40px; height: 40px; margin: 0; }
header.et-l--header .et_pb_code_0_tb_header .molti-dropdown-2:not(.active) { transform: none; }

/* W3 menu — the orange dropdown panel (Molti section in header 104): inside the screen, right under the header,
   scrollable, compact cards. The grey Divi menu stays as it is (owner, 2026-10-10). Prefixed with the header element:
   Divi's per-module rules (.et_pb_blurb_N_tb_header.et_pb_blurb) are printed after our stylesheet. */
@media (max-width: 980px) {
  header.et-l--header .molti-dropdown-2-content {
    left: 0 !important; right: 0 !important; width: auto !important; box-sizing: border-box;
    top: var(--sl-header-bottom, 72px) !important;
    max-height: calc(100vh - var(--sl-header-bottom, 72px) - 8px) !important; overflow-y: auto !important;
    padding: 16px !important;
  }
  header.et-l--header .molti-dropdown-2-content .et_pb_row { width: 100% !important; max-width: none !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_column { margin-bottom: 16px !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_text { margin-bottom: 8px !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_text h3 { font-size: 12px !important; letter-spacing: 1px; padding-bottom: 4px !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_module.et_pb_blurb { padding: 12px 14px !important; margin-bottom: 8px !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_main_blurb_image { margin-bottom: 0 !important; }
  header.et-l--header .molti-dropdown-2-content .et_pb_module_header {
    font-size: 15px !important; letter-spacing: normal !important; padding-bottom: 2px !important;
  }
  header.et-l--header .molti-dropdown-2-content .et_pb_blurb_description { font-size: 13px !important; line-height: 1.4 !important; }
}

/* W6 account — errors are restored to the visible login form in shop-look.php; mark them as errors at a glance */
body.woocommerce-account .woocommerce-error { border-left: 4px solid #d63638 !important; }

/* W7 cart — quantity is fixed (sold individually / "1" from energy-certificate-form), so "Zaktualizuj koszyk" never
   becomes active (owner: hide it);
   compact remove row; coupon field and button of one height, side by side or stacked on narrow phones. */
body.woocommerce-cart form.woocommerce-cart-form:not(:has(input.qty:not([type="hidden"]))) button[name="update_cart"] {
  display: none !important;   /* only while no line has an editable quantity */
}
body.woocommerce-cart table.cart td.product-remove { padding-top: 6px !important; padding-bottom: 6px !important; min-height: 0 !important; }
body.woocommerce-cart table.cart td.product-remove::before { display: none; }
body.woocommerce-cart .coupon { display: flex !important; flex-wrap: wrap; gap: 8px; align-items: stretch; float: none !important; }
body.woocommerce-cart .coupon #coupon_code,
body.woocommerce-cart .coupon button[name="apply_coupon"] {
  height: 48px !important; min-height: 48px; margin: 0 !important; box-sizing: border-box; padding-top: 0 !important; padding-bottom: 0 !important;
}
body.woocommerce-cart .coupon #coupon_code {
  flex: 1 1 200px; width: auto !important; background: #fff !important; border: 1px solid #c9c9c9 !important; border-radius: 6px;
}
@media (max-width: 480px) {
  body.woocommerce-cart .coupon #coupon_code,
  body.woocommerce-cart .coupon button[name="apply_coupon"] { flex: 1 1 100%; width: 100% !important; }
}

/* W8 checkout (A5) — the Molti terms checkbox is a borderless grey dot on a grey box; the consent text is 11 px grey
   capitals. !important beats Molti's checkbox and label rules. */
body.woocommerce-checkout input#terms {
  appearance: none !important; -webkit-appearance: none !important; box-sizing: border-box;
  width: 24px !important; height: 24px !important; flex: 0 0 24px; margin: 0 10px 0 0 !important; vertical-align: top;
  border: 2px solid #1d1d1f !important; border-radius: 5px !important; background: #fff !important; cursor: pointer;
}
body.woocommerce-checkout input#terms:checked {
  background: #ff8057 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12l5 5 9-10' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E") center / 18px no-repeat !important;
  border-color: #ff8057 !important;
}
body.woocommerce-checkout input#terms:focus-visible { outline: 3px solid #1d1d1f; outline-offset: 2px; }
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label.checkbox { display: flex !important; align-items: flex-start; }
body.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text {
  text-transform: none !important; letter-spacing: normal !important; color: #1d1d1f !important;
  font-size: 15px !important; line-height: 1.5 !important; font-weight: 400 !important;
}
body.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text a { font-weight: 600; }
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { margin-bottom: 20px !important; }

/* W9 thank-you (A4) — the checkout Theme Builder template ("Sprawdz Checkout Zam") also draws the order-received page;
   its "Formularz zamówienia" title sat on top of "Dziękujemy…". The overview list becomes one column on phones. */
body.woocommerce-order-received .et_pb_heading_0_tb_body { display: none !important; }
/* The thank-you line was pulled up (-75px) and boxed in white to sit under that title; with the title gone it
   becomes the page heading inside the grey card. */
body.woocommerce-order-received p.woocommerce-thankyou-order-received {
  margin: 0 0 16px !important; padding: 24px 0 0 !important; background: transparent !important;
}
@media (max-width: 767px) {
  body.woocommerce-order-received ul.woocommerce-order-overview {
    display: flex !important; flex-direction: column; gap: 12px; padding-left: 0 !important; margin-left: 0 !important;
  }
  body.woocommerce-order-received ul.woocommerce-order-overview > li {
    border-right: 0 !important; margin: 0 !important; padding: 0 !important; float: none !important; width: 100% !important;
  }
}
