/* ================================================================
   ENDOSKOPS.LV — Full Brand Color Cleanup
   2026-06-13
   Brand: green #52c732 | hover #45ad2a | active #378f21
   Removes Bootstrap blue / orange/red wrong accents from shop UI.
   No PHP/DB/template/product/SEO files touched.
   ================================================================ */

/* ---- 1. CSS VARIABLES ---- */
:root {
  --en-primary: #52c732;
  --en-hover:   #45ad2a;
  --en-active:  #378f21;
  --en-light:   #f0faed;
  --en-border:  #8dd97a;
  --en-text:    #222222;
  --en-muted:   #6b7280;
}

/* ---- 2. NAVIGATION active/hover ---- */
#sp-nav .sp-megamenu-parent > li.active > a,
#sp-nav .sp-megamenu-parent > li > a:hover,
#sp-nav .sp-megamenu-parent > li > a:focus,
.sp-menu-item.active > a,
.nav.menu > li.active > a {
  color: var(--en-primary) !important;
}
.offcanvas-menu .sp-megamenu-parent li.active > a,
.offcanvas-menu ul li a:hover {
  color: var(--en-primary) !important;
  background: var(--en-light) !important;
}

/* ---- 3. SHOP LINK HOVER ---- */
.jshop a:hover, .jshop a:focus,
.productfull a:hover, .productfull a:focus,
.jshop_list_product a:hover, .jshop_list_product a:focus {
  color: var(--en-primary);
}

/* ---- 4. PRODUCT PAGE: add-to-cart button ---- */
.productfull .prod_buttons .buttons .button,
.productfull .prod_buttons button[type='submit'],
.productfull .buttons .button {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
  box-shadow: none !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  height: auto !important;
  min-height: 44px !important;
  padding: 10px 20px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}
.productfull .prod_buttons .buttons .button:hover,
.productfull .prod_buttons button[type='submit']:hover,
.productfull .buttons .button:hover {
  background: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  color: #fff !important;
}
.productfull .prod_buttons .buttons .button:focus,
.productfull .prod_buttons button[type='submit']:focus {
  outline: 2px solid var(--en-primary) !important;
  outline-offset: 2px !important;
  background: var(--en-hover) !important;
}
.productfull .prod_buttons .buttons .button:active,
.productfull .prod_buttons button[type='submit']:active {
  background: var(--en-active) !important;
  border-color: var(--en-active) !important;
}

/* ---- 5. CATEGORY / LIST PAGE: addtocart overlay ---- */
.jshop_list_product .list_product .item-wrap .item-image .addtocart,
.lib-item-wrap .item-image .addtocart {
  background: var(--en-primary) !important;
}
.jshop_list_product .list_product .item-wrap .item-image .addtocart:hover,
.lib-item-wrap .item-image .addtocart:hover,
.jshop_list_product .list_product .item-wrap:hover .item-image .addtocart,
.lib-item-wrap:hover .item-image .addtocart {
  background: var(--en-hover) !important;
}
.productfull .jshop_list_product_related .item-wrap .item-image .addtocart {
  background: var(--en-primary) !important;
}
.productfull .jshop_list_product_related .item-wrap:hover .item-image .addtocart {
  background: var(--en-hover) !important;
}

/* ---- 6. CART NAVIGATION BUTTONS (was Bootstrap blue #337ab7) ---- */
.jshop .cart_buttons .btn.btn-arrow-left {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
.jshop .cart_buttons .btn.btn-arrow-left:hover {
  background: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
}
/* Fix: cart right-arrow hover was orange/red #ee3900 — not brand */
.jshop .cart_buttons .btn.btn-arrow-right:hover {
  background: var(--en-hover) !important;
}

/* ---- 7. CART TABLE HEADER (was Bootstrap blue #337ab7) ---- */
table.cart th {
  background: var(--en-primary) !important;
  color: #fff !important;
}

/* ---- 8. CHECKOUT / CART TABLE BUTTONS ---- */
#sp-component div.jshop table .button,
.jshop_cart .button {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
#sp-component div.jshop table .button:hover,
.jshop_cart .button:hover {
  background: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
}

/* ---- 9. BTN-PRIMARY (preset4 had orange border/hover — wrong for green site) ---- */
.btn-primary,
.sppb-btn-primary {
  background-color: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
}
.btn-primary:hover,
.sppb-btn-primary:hover {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
}

/* ---- 10. FORM-HORIZONTAL BTN-PRIMARY HOVER (was Bootstrap blue) ---- */
.form-horizontal .form-group .btn-primary:hover {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
}

/* ---- 11. FEATURED SLIDER BUTTON ---- */
div.featured-products .container-slider .slider .vpo-wrap .vp .item .item-info .item-content .buttons .button_buy {
  background: var(--en-primary) !important;
}
div.featured-products .container-slider .slider .vpo-wrap .vp .item:hover .item-content .buttons .button_buy {
  background: var(--en-hover) !important;
}

/* ---- 12. SEARCH BUTTON ---- */
.sp-module.jshopping-search .mod-shop-search .button {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
.sp-module.jshopping-search .mod-shop-search .button:hover {
  background: var(--en-hover) !important;
}

/* ---- 13. SHOP INPUT FOCUS (replace Bootstrap blue glow) ---- */
.jshop input[type='text']:focus,
.jshop input[type='number']:focus,
.jshop input[type='email']:focus,
.jshop select:focus,
.jshop textarea:focus,
.productfull input:focus {
  border-color: var(--en-primary) !important;
  box-shadow: 0 0 0 3px rgba(82,199,50,0.20) !important;
  outline: none !important;
}

/* ---- 14. PRICE ACCENT ---- */
.jshop_list_product .list_product .item-wrap .item-info .main-price .item-price .price,
.productfull #block_price,
.productfull .jshop_price {
  color: var(--en-primary) !important;
  font-weight: 700 !important;
  font-style: normal !important;
}

/* ---- 15. TABS active ---- */
.productfull .block-tab .nav-tabs li a:hover,
.jshop_tab ul.nav-tabs > li > a:hover { color: var(--en-primary) !important; }
.productfull .block-tab .nav-tabs li.active a,
.jshop_tab ul.nav-tabs > li.active > a {
  color: var(--en-primary) !important;
  border-bottom-color: var(--en-primary) !important;
}

/* ---- 16. MOBILE: compact quantity + button ---- */
@media (max-width: 767px) {
  .productfull .prod_buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .productfull .prod_buttons .prod_qty {
    flex-basis: 100% !important;
    width: 100% !important;
    font-size: 13px !important;
    margin-bottom: 0 !important;
  }
  .productfull .prod_buttons .prod_qty_input {
    flex: 0 0 64px !important;
    width: 64px !important;
  }
  .productfull .prod_buttons .prod_qty_input input {
    width: 64px !important;
    height: 44px !important;
    text-align: center !important;
    font-size: 15px !important;
    padding: 0 4px !important;
  }
  .productfull .prod_buttons .buttons {
    flex: 1 1 auto !important;
  }
  .productfull .prod_buttons .buttons .button,
  .productfull .prod_buttons button[type='submit'] {
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 48px !important;
    font-size: 14px !important;
    padding: 0 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}
/* ---- END ENDOSKOPS FULL BRAND COLOR CLEANUP 2026-06-13 ---- */

/* ---- 17. Contact AJAX form submit button (was Bootstrap blue) ---- */
div.contact-ajax .ctajax-element .el-ctajax-form input[type='submit'] {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
div.contact-ajax .ctajax-element .el-ctajax-form input[type='submit']:hover {
  background: var(--en-hover) !important;
}

/* =====================================================================
   ENDOSKOPS CLEAN JSHOP UI REBUILD — 017 — 20260614_1713
   018 alignment polish (card width, buy row, cart qty) — 20260614
   Replaces SESSION 006 + SESSION 006B (conflicting partial flex rules).
   Based on Hidplanet final pattern (sessions 012+013), adapted for green.
   Brand: --en-primary #52c732 | --en-hover #45ad2a | --en-active #378f21
   Availability soft green: bg #e8f5e2, text #2a7a14, border #b8e0a8
   ===================================================================== */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 1 — LISTING: EQUAL-HEIGHT FLEX CHAIN
   Actual DOM: .jshop_list_product .list_product .row > .col-md-4 > .product > .item-wrap
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Row: flex container so all columns in the same visual row stretch equally. */
.jshop_list_product .list_product .row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
}

/* Bootstrap column: flex column so .product fills full height. */
.jshop_list_product .list_product .row > [class*="col-"] {
  display: flex !important;
  flex-direction: column !important;
}

/* .product fills its column. */
.jshop_list_product .list_product .row > [class*="col-"] > .product {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* .clear.space clearfix divs: in flex context force a full-width line break. */
.jshop_list_product .list_product .row > .clear,
.jshop_list_product .list_product .row > .clear.space {
  flex: 1 0 100% !important;
  width: 100% !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* item-wrap fills .product height. */
.jshop_list_product .list_product .row > [class*="col-"] .item-wrap {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Image zone: locked to 200px height (same as inline style in product.php). */
.jshop_list_product .list_product .row > [class*="col-"] .item-image {
  height: 200px !important;
  overflow: hidden !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 2 — LISTING: ITEM-INFO FLEX COLUMN + ORDERED CHILDREN
   Order: title(1) → price(2) → badge(3) → button(4)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.jshop_list_product .list_product .row > [class*="col-"] .item-info {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 8px 10px 10px !important;
  align-items: stretch !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Default: all children auto-height, pushed to end. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > * {
  flex: 0 0 auto !important;
  order: 10 !important;
  width: 100% !important;
}

/* Title: order 1, 2-line clamp. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > h3.item-title {
  order: 1 !important;
  min-height: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin: 0 0 6px 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  border-bottom: none !important;
}

/* Price: order 2. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .main-price {
  order: 2 !important;
  margin: 0 0 4px 0 !important;
}
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .main-price .price {
  font-size: 16px !important;
  font-weight: 700 !important;
}

/* Availability badge: order 3, compact pill, auto width. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .available,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .not_available {
  order: 3 !important;
  width: auto !important;
  max-width: max-content !important;
  align-self: flex-start !important;
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 0 6px 0 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .available {
  background: #e8f5e2 !important;
  color: #2a7a14 !important;
  border: 1px solid #b8e0a8 !important;
}
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .not_available {
  background: #fde8e8 !important;
  color: #b91c1c !important;
  border: 1px solid #f5b8b8 !important;
}

/* Detail button: order 4, pinned to card bottom via margin-top:auto. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .buttons.obdm-card-buttons,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .obdm-card-buttons {
  order: 4 !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin-top: auto !important;
  padding-top: 8px !important;
  display: block !important;
}
.jshop_list_product .list_product .row > [class*="col-"] .item-info .obdm-card-buttons a.button_detail {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: center !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 5px !important;
}

/* Hide irrelevant listing card fields. */
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .price_extra_info,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .manufacturer_name,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .manufacturer_code,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .deliverytime,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .productweight,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .qty_in_stock,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .extra_fields,
.jshop_list_product .list_product .row > [class*="col-"] .item-info > .vendorinfo { display: none !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 3 — PRODUCT PAGE: PRODUCT-INFO FLEX COLUMN + ORDERING
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.productfull .product-info {
  display: flex !important;
  flex-direction: column !important;
}
.productfull .product-info > * { order: 10 !important; }
.productfull .product-info > h1.title,
.productfull .product-info > .title             { order: 1 !important; }
.productfull .product-info > .jshop_code_prod   { order: 2 !important; }
.productfull .product-info > .rating            { order: 3 !important; }
.productfull .product-info > .price             { order: 4 !important; margin-bottom: 4px !important; }
.productfull .product-info > #available_now,
.productfull .product-info > .available         { order: 5 !important; margin-bottom: 8px !important; }
.productfull .product-info > #not_available,
.productfull .product-info > .not_available     { order: 5 !important; margin-bottom: 8px !important; }
.productfull .product-info > .qty_in_stock      { order: 5 !important; margin-bottom: 4px !important; }
.productfull .product-info > .jshop_prod_description { order: 6 !important; margin-top: 0 !important; margin-bottom: 8px !important; }
.productfull .product-info > .jshop_prod_attributes  { order: 7 !important; }
.productfull .product-info > .prod_free_attribs      { order: 7 !important; }
.productfull .product-info > .prod_buttons      { order: 8 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 4 — PRODUCT PAGE: AVAILABILITY BADGE — WIDTH + PILL STYLE
   After PHP fix: only one div renders; width:auto prevents full-width bar.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.productfull .product-info > .available,
.productfull .product-info > #available_now,
.productfull .product-info > #available_now.available,
.productfull .product-info > .not_available,
.productfull .product-info > #not_available,
.productfull .product-info > #not_available.not_available {
  width: auto !important;
  max-width: max-content !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  align-self: flex-start !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
.productfull .product-info > .available,
.productfull .product-info > #available_now {
  background: #e8f5e2 !important;
  color: #2a7a14 !important;
  border: 1px solid #b8e0a8 !important;
}
.productfull .product-info > .not_available,
.productfull .product-info > #not_available {
  background: #fde8e8 !important;
  color: #b91c1c !important;
  border: 1px solid #f5b8b8 !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 5 — PRODUCT PAGE: ATTRIBUTE SELECT (div.attr-select-wrap)
   PHP fix: <label class="select-mask"> → <div class="attr-select-wrap">
   Removes preset4 pseudo-element double-arrow. Clean single chevron SVG.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

div.productfull .jshop_prod_attributes .attr-select-wrap {
  display: block !important;
  position: static !important;
  max-width: 360px !important;
  margin-bottom: 8px !important;
}
div.productfull .jshop_prod_attributes .attr-select-wrap select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C%2Fsvg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 12px !important;
  background-color: #fff !important;
  padding: 8px 36px 8px 12px !important;
  height: 44px !important;
  border: 1.5px solid #e0e0e0 !important;
  border-radius: 5px !important;
  font-size: 14px !important;
  color: #222 !important;
  cursor: pointer !important;
  width: 100% !important;
  max-width: 360px !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}
div.productfull .jshop_prod_attributes .attr-select-wrap select:focus {
  border-color: var(--en-primary) !important;
  box-shadow: 0 0 0 3px rgba(82,199,50,0.18) !important;
  outline: none !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 6 — PRODUCT PAGE: BUY ROW (qty + button, all screen sizes)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.productfull .prod_buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0 8px !important;
  padding: 0 !important;
  margin-top: 8px !important;
}
.productfull .prod_buttons .prod_qty {
  flex: 0 0 100% !important;
  width: 100% !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #444 !important;
  margin-bottom: 6px !important;
}
.productfull .prod_buttons .prod_qty_input {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  height: 44px !important;
}
.productfull .prod_buttons .prod_qty_input input.inputbox {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  width: 64px !important;
  box-sizing: border-box !important;
  padding: 0 6px !important;
  text-align: center !important;
  display: block !important;
  line-height: 44px !important;
  border: 1.5px solid var(--en-border) !important;
  border-radius: 5px !important;
}
.productfull .prod_buttons .buttons.product-buttons {
  flex: 1 1 auto !important;
  display: flex !important;
  align-items: center !important;
  height: 44px !important;
}
.productfull .prod_buttons .buttons.product-buttons button.button,
.productfull .prod_buttons .buttons.product-buttons .btn-buy {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 20px !important;
  line-height: 1 !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 7 — CART: TABLE + BUTTONS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Cart table cells vertically aligned. */
.jshop table.cart td { vertical-align: middle !important; padding: 8px !important; }
.jshop table.cart th { padding: 8px !important; font-size: 13px !important; }

/* Qty input: compact. */
#sp-component div.jshop table.cart tbody tr td .inputbox {
  width: 52px !important;
  height: 32px !important;
  text-align: center !important;
  border: 1.5px solid #e0e0e0 !important;
  border-radius: 4px !important;
  padding: 0 4px !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
}
/* Reload icon aligned with input. */
#sp-component div.jshop table.cart tbody tr td .cart_reload {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  cursor: pointer !important;
  color: #888 !important;
  font-size: 13px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

/* Qty cell: flex row so input + reload icon align vertically. */
#sp-component div.jshop table.cart tbody tr td.quantity .data {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
}

/* Remove button: outlined red, icon + text with gap. */
.jshop table.cart td.remove a.button-img {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 5px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  min-height: 30px !important;
  background: #fff !important;
  color: #cc2222 !important;
  border: 1.5px solid #cc2222 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
.jshop table.cart td.remove a.button-img::before {
  font-size: 11px !important;
  color: #cc2222 !important;
  background: none !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  border-radius: 0 !important;
  display: inline !important;
  margin: 0 !important;
}
.jshop table.cart td.remove a.button-img:hover {
  background: #cc2222 !important;
  color: #fff !important;
}
.jshop table.cart td.remove a.button-img:hover::before { color: #fff !important; }

/* Subtotal table. */
#sp-component div.jshop table.jshop_subtotal { margin-top: 8px !important; }
#sp-component div.jshop table.jshop_subtotal tr td {
  padding: 8px 12px !important;
  border: 1px solid #e5e7eb !important;
}

/* Cart bottom buttons: consistent 42px pair. */
.jshop .cart_buttons {
  margin-top: 12px !important;
  padding: 10px 0 0 !important;
  border-top: 1px solid #e5e7eb !important;
}
.jshop .cart_buttons #checkout {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.jshop .cart_buttons a.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 5px !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
}

/* Sidebar / component top alignment. */
#sp-left.col-lg-3 .sp-column { padding-top: 0 !important; }
#sp-left.col-lg-3 .sp-module { margin-top: 0 !important; padding-top: 0 !important; }
#sp-component.col-lg-9 .sp-column { padding-top: 0 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PART 8 — MOBILE: CART BUTTONS + TABLE
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 767px) {
  .jshop .cart_buttons #checkout {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  .jshop .cart_buttons #checkout .pull-left,
  .jshop .cart_buttons #checkout .pull-right {
    float: none !important;
    width: 100% !important;
  }
  .jshop .cart_buttons #checkout a.btn {
    width: 100% !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }
  .jshop table.cart {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ===== END ENDOSKOPS CLEAN JSHOP UI REBUILD 017 — 20260614_1713 ===== */

/* 021 — homepage product card availability badge */
.respl-item .item-info .hp-avail-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    background: #e8f5e2;
    color: #2a7a14;
    border: 1px solid #b8e0a8;
    margin-top: 8px;
    white-space: nowrap;
    line-height: 1.4;
    max-width: fit-content;
}

/* =====================================================================
   PHASE010 — OMNIVA NATIVE SELECT (TomSelect removed 2026-06-22)
   endoskops.lv: native #om_point hidden until AJAX populates (JS sets display:block)
   ===================================================================== */
#om_point { display: none; }
#table_shippings .shipping_form .controls select#om_point {
  width: 100%;
  max-width: 560px;
  min-height: 36px;
  border: 1.5px solid #d0d0d0;
  border-radius: 5px;
  padding: 4px 8px;
  font-size: 14px;
  color: #222;
  background: #fff;
  cursor: pointer;
  box-sizing: border-box;
}
#table_shippings .shipping_form .controls select#om_point:focus {
  border-color: #f15a24;
  box-shadow: 0 0 0 3px rgba(241,90,36,0.15);
  outline: none;
}
/* Hide residual TomSelect wrapper if cached JS creates one */
.ts-wrapper { display: none !important; }
/* ── END PHASE010 ── */

/* ================================================================
   PHASE 009A — MOBILE BUTTONS ALIGNMENT FIX
   Date: 2026-06-22
   Sites: armikus.lv + endoskops.lv (same CSS — applied to both)
   CSS-only. No PHP/DB/Omniva/email/payment/delivery changes.
   Scope: product add-to-cart, cart buttons, checkout confirm button.
   ================================================================ */

/* ---- 009A-1. BTN-BUY class — green on all states ---- */
/* (belt-and-suspenders: btn-buy sometimes rendered instead of .button) */
.productfull .prod_buttons .buttons.product-buttons .btn-buy,
.productfull .prod_buttons .buttons .btn-buy {
  background: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
.productfull .prod_buttons .buttons.product-buttons .btn-buy:hover,
.productfull .prod_buttons .buttons .btn-buy:hover,
.productfull .prod_buttons .buttons.product-buttons .btn-buy:focus,
.productfull .prod_buttons .buttons .btn-buy:focus {
  background: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  color: #fff !important;
}
.productfull .prod_buttons .buttons.product-buttons .btn-buy:active,
.productfull .prod_buttons .buttons .btn-buy:active {
  background: var(--en-active) !important;
  border-color: var(--en-active) !important;
}

/* ---- 009A-2. BTN-SUCCESS — explicit brand green ---- */
/* Cart "Checkout" link (a.btn.btn-success) and previewfinish confirm button */
.jshop .cart_buttons a.btn-success,
.jshop .cart_buttons a.btn.btn-success,
div.jshop .cart_buttons a.btn-success,
#previewfinish_btn,
#sp-component input.btn.btn-success,
#sp-component .btn-success[type="submit"],
.jshop_cart input.btn.btn-success {
  background-color: var(--en-primary) !important;
  border-color: var(--en-primary) !important;
  color: #fff !important;
}
.jshop .cart_buttons a.btn-success:hover,
.jshop .cart_buttons a.btn.btn-success:hover,
div.jshop .cart_buttons a.btn-success:hover,
#previewfinish_btn:hover,
#sp-component input.btn.btn-success:hover,
#sp-component .btn-success[type="submit"]:hover,
.jshop_cart input.btn.btn-success:hover {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  color: #fff !important;
}
.jshop .cart_buttons a.btn-success:focus,
#previewfinish_btn:focus,
#sp-component input.btn.btn-success:focus {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  outline: 2px solid var(--en-primary) !important;
  outline-offset: 2px !important;
  color: #fff !important;
}
.jshop .cart_buttons a.btn-success:active,
#previewfinish_btn:active,
#sp-component input.btn.btn-success:active {
  background-color: var(--en-active) !important;
  border-color: var(--en-active) !important;
}

/* ---- 009A-3. MOBILE PRODUCT ADD-TO-CART AREA ---- */
@media (max-width: 767px) {

  /* Qty input: widen from 64px → 84px (spec: 78–92px) */
  .productfull .prod_buttons .prod_qty_input {
    flex: 0 0 84px !important;
    width: 84px !important;
    min-width: 84px !important;
  }
  .productfull .prod_buttons .prod_qty_input input {
    width: 84px !important;
    height: 50px !important;
  }

  /* Buy button: taller for thumb tap comfort */
  .productfull .prod_buttons .buttons .button,
  .productfull .prod_buttons button[type='submit'],
  .productfull .prod_buttons .buttons.product-buttons .btn-buy,
  .productfull .prod_buttons .buttons .btn-buy {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    padding: 0 14px !important;
  }

  /* Align wrapper to same height */
  .productfull .prod_buttons .buttons.product-buttons {
    height: 50px !important;
  }

  /* ---- 009A-4. MOBILE CART BUTTONS ---- */
  .jshop .cart_buttons #checkout a.btn {
    height: 50px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
  }

  /* ---- 009A-5. MOBILE CHECKOUT CONFIRM BUTTON ---- */
  #previewfinish_btn,
  #sp-component input.btn.btn-success[type='submit'],
  .jshop_cart input.btn.btn-success {
    width: 100% !important;
    height: 52px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    display: block !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
    margin-top: 10px !important;
  }

  /* ---- 009A-6. DISABLED STATE ---- */
  #previewfinish_btn:disabled,
  #sp-component input.btn.btn-success:disabled {
    background-color: #c8ebbf !important;
    border-color: #c8ebbf !important;
    color: #6b7280 !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
  }

  /* ---- 009A-7. CART QTY CELL ALIGNMENT ---- */
  .jshop table.cart td.quantity {
    white-space: nowrap !important;
    vertical-align: middle !important;
  }
  .jshop table.cart td.quantity .inputbox {
    width: 54px !important;
    height: 36px !important;
    text-align: center !important;
    display: inline-block !important;
  }
  .jshop table.cart td.quantity .cart_reload {
    display: inline-flex !important;
    vertical-align: middle !important;
    align-items: center !important;
  }

} /* end @media (max-width: 767px) */

/* ===== END PHASE 009A — 2026-06-22 ===== */

/* ================================================================
   PHASE 009B — HIDPLANET MOBILE CART/CHECKOUT STYLE SYNC
   Date: 2026-06-22
   Sites: armikus.lv + endoskops.lv (same CSS block — applied to both)
   Reference: Hidplanet Phase036A CSS approach
   CSS-only. No PHP/DB/Omniva/email/payment/delivery changes.
   ================================================================

   Root problems fixed:
   B1 — Back button (btn-arrow-left) was GREEN = same as checkout.
        Overrides existing line 97 rule. Now neutral grey.
   B2 — Cart buttons desktop: uniform 44px sizing, 6px radius.
   B3 — Mobile cart: flex-column; checkout (pull-right) first via order;
        both buttons 48px height, full-width.
   B4 — Checkout confirm (#previewfinish_btn): stronger specificity,
        proper hover/disabled, 50px mobile full-width (match Phase036A).
   B5 — .box_button confirm area: visual separator above button.
   B6 — Checkout form checkbox alignment cleanup.
   ================================================================ */

/* ── B1: BACK BUTTON — neutral grey secondary (NOT green) ─────────── */
/* Overrides the existing Phase014 rule that made btn-arrow-left green.
   Selectors ordered from most specific to least to ensure win at all
   breakpoints. Appended → later in file → wins at equal specificity. */
.jshop .cart_buttons .btn.btn-arrow-left,
.jshop .cart_buttons a.btn.btn-arrow-left,
.jshop .cart_buttons a.btn-secondary,
div.jshop .cart_buttons .btn.btn-arrow-left,
div.jshop .cart_buttons a.btn.btn-arrow-left,
#checkout a.btn-secondary,
#checkout a.btn.btn-arrow-left {
  background:   #6b7280 !important;
  border-color: #6b7280 !important;
  color: #fff !important;
  text-shadow: none !important;
}
.jshop .cart_buttons .btn.btn-arrow-left:hover,
.jshop .cart_buttons a.btn.btn-arrow-left:hover,
.jshop .cart_buttons a.btn-secondary:hover,
div.jshop .cart_buttons .btn.btn-arrow-left:hover,
#checkout a.btn-secondary:hover,
#checkout a.btn.btn-arrow-left:hover {
  background:   #4b5563 !important;
  border-color: #4b5563 !important;
  color: #fff !important;
}
.jshop .cart_buttons .btn.btn-arrow-left:focus,
.jshop .cart_buttons a.btn-secondary:focus {
  background:   #4b5563 !important;
  border-color: #4b5563 !important;
  outline: 2px solid #6b7280 !important;
  outline-offset: 2px !important;
}

/* ── B2: CART BUTTONS — uniform desktop sizing (Phase036A match) ───── */
.jshop .cart_buttons a.btn,
div.jshop .cart_buttons a.btn,
.jshop.cart_buttons a.btn {
  height: 44px !important;
  min-height: 44px !important;
  line-height: 1 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  border-radius: 6px !important;
  padding: 0 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Checkout button: stronger font weight for visual dominance */
.jshop .cart_buttons a.btn-success,
.jshop .cart_buttons a.btn.btn-success,
div.jshop .cart_buttons a.btn-success,
#checkout a.btn-success {
  font-weight: 700 !important;
}

/* ── B3: MOBILE CART BUTTONS — column, 48px, checkout first ────────── */
@media (max-width: 767px) {

  /* Force column layout even if Bootstrap d-flex/justify-content-between
     is set inline on #checkout div */
  .jshop .cart_buttons #checkout,
  div.jshop .cart_buttons #checkout,
  .jshop .cart_buttons div#checkout {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    justify-content: flex-start !important;
  }

  /* Kill Bootstrap float on pull-left / pull-right */
  .jshop .cart_buttons .pull-left,
  .jshop .cart_buttons .pull-right,
  div.jshop .cart_buttons .pull-left,
  div.jshop .cart_buttons .pull-right {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Checkout button (pull-right) first on mobile — primary action at top */
  .jshop .cart_buttons .pull-right,
  div.jshop .cart_buttons .pull-right {
    order: 1 !important;
  }
  /* Back button (pull-left) second on mobile — secondary action below */
  .jshop .cart_buttons .pull-left,
  div.jshop .cart_buttons .pull-left {
    order: 2 !important;
  }

  /* All cart nav buttons: full-width, 48px on mobile */
  .jshop .cart_buttons a.btn,
  div.jshop .cart_buttons a.btn,
  .jshop .cart_buttons #checkout a.btn {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    font-size: 15px !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }
}

/* ── B4: CHECKOUT CONFIRM BUTTON — Phase036A match ─────────────────── */
/* Stronger selectors to beat existing 009A rules at same specificity */
#comjshopPrev #previewfinish_btn,
.jshop_cart #previewfinish_btn,
input#previewfinish_btn,
#previewfinish_btn {
  background-color: var(--en-primary) !important;
  border-color: var(--en-active) !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  cursor: pointer !important;
}

#comjshopPrev #previewfinish_btn:not(:disabled):hover,
#comjshopPrev #previewfinish_btn:not(:disabled):focus,
#comjshopPrev #previewfinish_btn:not(:disabled):active,
input#previewfinish_btn:not(:disabled):hover,
input#previewfinish_btn:not(:disabled):focus,
input#previewfinish_btn:not(:disabled):active,
#previewfinish_btn:not(:disabled):hover,
#previewfinish_btn:not(:disabled):focus,
#previewfinish_btn:not(:disabled):active {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  color: #fff !important;
  outline: none !important;
  box-shadow: none !important;
}

#previewfinish_btn:disabled,
input#previewfinish_btn:disabled,
#previewfinish_btn[disabled],
input#previewfinish_btn[disabled] {
  background-color: #b8d8b8 !important;
  border-color: #9cc89c !important;
  color: #6b7280 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

@media (max-width: 767px) {
  #previewfinish_btn,
  input#previewfinish_btn,
  #comjshopPrev #previewfinish_btn,
  .jshop_cart #previewfinish_btn {
    width: 100% !important;
    height: 50px !important;
    min-height: 50px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    letter-spacing: 0.02em !important;
    display: block !important;
    box-sizing: border-box !important;
    margin-top: 0 !important;
  }
}

/* ── B5: CONFIRM AREA / .box_button — clean visual separator ────────── */
.jshop_cart .box_button,
#comjshopPrev .box_button,
.jshop .box_button {
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid #e5e7eb !important;
}

/* ── B6: CHECKOUT FORM — checkbox alignment cleanup ─────────────────── */
/* Ensure checkbox + label rows don't float awkwardly on mobile */
@media (max-width: 767px) {
  #comjshopPrev .row_agb,
  #comjshopPrev .row_no_return,
  .jshop_cart .row_agb,
  .jshop_cart .row_no_return {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  #comjshopPrev .row_agb input[type="checkbox"],
  #comjshopPrev .row_no_return input[type="checkbox"],
  .jshop_cart .row_agb input[type="checkbox"],
  .jshop_cart .row_no_return input[type="checkbox"] {
    flex-shrink: 0 !important;
    margin-top: 3px !important;
    width: 16px !important;
    height: 16px !important;
  }
}

/* ── END PHASE009B — 2026-06-22 ── */

/* ================================================================
   PHASE 009C — REAL CART/CHECKOUT HIDPLANET BASIS FIX
   Date: 2026-06-23
   Sites: armikus.lv + endoskops.lv (same CSS block — applied to both)
   Reference: Hidplanet Phase 010 "CLEAN JSHOP UI REBUILD" CSS
   CSS-only. No PHP/DB/Omniva/email/payment/delivery changes.
   ================================================================

   Diagnosis (Phase 009C Task 4):
   After DOM inspection of live cart with real product:
   - 009A/009B cart button CSS: WORKING (confirmed grey back, green checkout,
     column flex, order 1/2 applied, 48px height)
   - ROOT CAUSE of "rough" appearance: product image in cart has
     width: 200px (JoomShopping default) — not constrained.
     Hidplanet Phase 010 applies max-height:60px / max-width:80px.
     This rule is NOT in the current Armikus/Endoskops custom.css.
   - All other cart table internals (qty flex, remove button, reload
     icon, subtotal, cart buttons) are already correctly styled.
   - Previewfinish (#previewfinish_btn) CSS deployed in 009A/009B,
     verified ID is unique and !important selectors are in place.

   Fixes in this phase:
   C1 — Cart product image: max-height 60px / max-width 80px / auto
   C2 — Cart table cells: reinforced TD padding and vertical-align
   C3 — Cart table headers: font-size 12px, compact
   C4 — Subtotal table: compact border style
   C5 — Mobile cart: overflow-x guard + block display
   C6 — Previewfinish page: .box_button + #comjshopPrev refinement
        (belt-and-suspenders; existing rules reinforced)
   ================================================================ */

/* ── C1: CART PRODUCT IMAGE — constrain to Hidplanet standard ───── */
/* Hidplanet Phase010: max-height:60px; max-width:80px; width:auto  */
/* Current state: width:200px (JoomShopping default) — NOT constrained */
.jshop table.cart .jshop_img_description_center img.jshop_img,
.jshop table.cart img.jshop_img,
#sp-component div.jshop table.cart img.jshop_img {
  max-height: 60px !important;
  max-width:  80px !important;
  width:  auto !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
}

/* ── C2: CART TABLE CELLS — compact, aligned (Hidplanet Phase010) ─ */
.jshop table.cart td,
#sp-component div.jshop table.cart tbody tr td {
  padding: 8px 8px !important;
  vertical-align: middle !important;
}
.jshop table.cart th {
  padding: 6px 8px !important;
  font-size: 12px !important;
  vertical-align: middle !important;
}

/* ── C3: CART TABLE — block on mobile for overflow scroll ────────── */
/* Confirmed already block via 009A; reinforced here */
@media (max-width: 767px) {
  .jshop table.cart {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ── C4: SUBTOTAL TABLE — clean compact borders ──────────────────── */
#sp-component div.jshop table.jshop_subtotal {
  margin-top: 8px !important;
}
#sp-component div.jshop table.jshop_subtotal tr td {
  padding: 8px 12px !important;
  border: 1px solid #e5e7eb !important;
  vertical-align: middle !important;
}

/* ── C5: PREVIEWFINISH CONFIRM BLOCK — reinforced (Hidplanet basis) ─ */
/* .box_button: the div wrapping the confirm button in previewfinish.php */
.box_button,
.jshop_cart .box_button,
#comjshopPrev .box_button,
div.jshop .box_button {
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1.5px solid #e5e7eb !important;
}

/* Confirm button: redundant reinforcement of 009A/009B rules.
   Using full selector chain to win against any remaining overrides. */
#comjshopPrev input#previewfinish_btn,
.jshop_cart input#previewfinish_btn,
#sp-component input#previewfinish_btn,
input#previewfinish_btn {
  background-color: var(--en-primary) !important;
  border-color: var(--en-active) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  cursor: pointer !important;
}

#comjshopPrev input#previewfinish_btn:not(:disabled):hover,
#comjshopPrev input#previewfinish_btn:not(:disabled):focus,
input#previewfinish_btn:not(:disabled):hover,
input#previewfinish_btn:not(:disabled):focus {
  background-color: var(--en-hover) !important;
  border-color: var(--en-hover) !important;
  color: #fff !important;
  outline: none !important;
}

input#previewfinish_btn:disabled,
input#previewfinish_btn[disabled] {
  background-color: #b8d8b8 !important;
  border-color: #9cc89c !important;
  color: #6b7280 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

@media (max-width: 767px) {
  input#previewfinish_btn,
  #comjshopPrev input#previewfinish_btn,
  .jshop_cart input#previewfinish_btn {
    width: 100% !important;
    height: 50px !important;
    min-height: 50px !important;
    border-radius: 8px !important;
    display: block !important;
    box-sizing: border-box !important;
    margin-top: 0 !important;
  }
}

/* ── C6: CHECKOUT STEP1 FORM — customer info field cleanup ──────── */
/* Prevent fields from being over-wide on mobile */
@media (max-width: 767px) {
  #comjshop .control-group,
  .checkout-form .control-group,
  .form-group {
    margin-bottom: 10px !important;
  }
  #comjshop input[type="text"],
  #comjshop input[type="email"],
  #comjshop input[type="tel"],
  .checkout-form input[type="text"],
  .checkout-form input[type="email"],
  .checkout-form input[type="tel"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ── END PHASE009C — 2026-06-23 ── */
/* ===================================================================
   Phase 009D — Final Mobile Cart/Checkout Parity Fix
   Applied: 2026-06-23
   Sites: endoskops.lv + armikus.lv
   Scope: mobile cart button order + checkout confirm button width
   Total: 48 lines
   =================================================================== */

/* ── D1: Cart button order — back first (top), checkout second (bottom)
        Matches current Hidplanet layout.
        Overrides 009B B3 which had checkout first / back second.         ── */
@media (max-width: 767px) {
  .jshop .cart_buttons .pull-left,
  .jshop .cart_buttons a.btn-secondary,
  .jshop .cart_buttons a.btn-arrow-left {
    order: 1 !important;
  }
  .jshop .cart_buttons .pull-right,
  .jshop .cart_buttons a.btn-success,
  .jshop .cart_buttons a.btn-arrow-right {
    order: 2 !important;
  }
}

/* ── D2: Checkout confirm button — full-width on mobile.
        #previewfinish_btn is inside .box_button which can be width-constrained
        by its parent checkout summary column.                             ── */
@media (max-width: 767px) {
  .jshop .box_button,
  .jshop div.box_button {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 !important;
  }
  #previewfinish_btn,
  input#previewfinish_btn,
  .jshop input[type="submit"]#previewfinish_btn {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ── D1-FIX: Cart button order with #checkout ID for unambiguous override ── */
@media (max-width: 767px) {
  .jshop .cart_buttons #checkout > .pull-left {
    order: 1 !important;
  }
  .jshop .cart_buttons #checkout > .pull-right {
    order: 2 !important;
  }
}
/* ===================================================================
   Phase 009E — Desktop Checkout/Cart Parity Fix
   Applied: 2026-06-23 | endoskops.lv + armikus.lv
   Scope: CSS-only — desktop + tablet checkout form polish
   Fixes: form inputs 172px→100%, textarea 320px→100%,
          confirm button 169px/35px→280px/50px, card borders+padding
   =================================================================== */

/* ── E1: Form inputs full-width inside .controls
        JoomShopping CSS constrains inputs to ~172px.
        .controls div is 630px with room — fill it.            ── */
.form-horizontal .controls input,
.form-horizontal .controls input.form-control,
.form-horizontal .controls input[type="text"],
.form-horizontal .controls input[type="email"],
.form-horizontal .controls input[type="tel"],
.form-horizontal .controls input[type="password"],
.form-horizontal .controls select,
.form-horizontal .controls select.form-control,
.form-horizontal .controls select.inputbox {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ── E2: Textarea — full-width, taller, clean appearance ── */
textarea#order_add_info,
textarea[name="order_add_info"],
.jshop textarea.inputbox {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 90px !important;
  height: auto !important;
  box-sizing: border-box !important;
  display: block !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  border: 1px solid #cbd5e0 !important;
  border-radius: 5px !important;
  resize: vertical !important;
}

/* ── E3: Checkout section cards — visible border, rounded, white ── */
#comjshopAddr.card,
#paymentBlock.card,
#shippingBlock.card,
#comjshopPrev.card {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06) !important;
  margin-bottom: 20px !important;
  padding: 0 !important;
}

/* ── E4: Card inner body — padding ── */
#comjshopAddr > div,
#paymentBlock > div,
#shippingBlock > div,
#comjshopPrev > div {
  padding: 24px !important;
}

/* ── E5: Section headings inside cards ── */
#comjshopAddr h5,
#paymentBlock h5,
#shippingBlock h5,
#comjshopPrev h5 {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1a202c !important;
  margin: 0 0 16px 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #edf2f7 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* ── E6: Form field vertical rhythm ── */
.jshop .form-horizontal .control-group {
  margin-bottom: 12px !important;
  clear: both !important;
  overflow: hidden !important;
}

/* ── E7: Desktop input polish (≥768px) ── */
@media (min-width: 768px) {
  .form-horizontal .controls input.form-control,
  .form-horizontal .controls input[type="text"],
  .form-horizontal .controls input[type="email"],
  .form-horizontal .controls input[type="tel"],
  .form-horizontal .controls select.form-control,
  .form-horizontal .controls select.inputbox {
    height: 40px !important;
    border: 1px solid #cbd5e0 !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    background: #fafafa !important;
  }
  .form-horizontal .controls input.form-control:focus,
  .form-horizontal .controls input[type="text"]:focus,
  .form-horizontal .controls input[type="email"]:focus,
  .form-horizontal .controls input[type="tel"]:focus,
  .form-horizontal .controls select.form-control:focus,
  .form-horizontal .controls select.inputbox:focus {
    border-color: #52c732 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(82, 199, 50, .12) !important;
    outline: none !important;
  }
}

/* ── E8: Confirm button — centered, prominent, professional ── */
.box_button {
  width: 100% !important;
  max-width: 100% !important;
  text-align: center !important;
  padding: 24px 0 8px !important;
  margin: 0 !important;
  clear: both !important;
  box-sizing: border-box !important;
}

#previewfinish_btn,
input#previewfinish_btn,
input#previewfinish_btn.btn-success {
  min-width: 280px !important;
  width: auto !important;
  height: 50px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  padding: 0 48px !important;
  border-radius: 6px !important;
  letter-spacing: 0.3px !important;
  display: inline-block !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  vertical-align: middle !important;
}

/* ── E9: Payment logos — consistent height ── */
.jshop_payment_method p img,
#paymentBlock img {
  max-height: 28px !important;
  width: auto !important;
  vertical-align: middle !important;
}

/* ── E10: Tablet label/controls width (768–1024px) ── */
@media (min-width: 768px) and (max-width: 1024px) {
  .form-horizontal .control-label {
    width: 120px !important;
    padding-top: 8px !important;
  }
  .form-horizontal .controls {
    margin-left: 140px !important;
  }
}

/* ── E11: Desktop cart table — vertical-align + cell spacing ── */
@media (min-width: 768px) {
  .jshop table.cart td {
    vertical-align: middle !important;
    padding: 12px !important;
    border-bottom: 1px solid #f0f4f8 !important;
  }
  .jshop table.cart th {
    padding: 10px 12px !important;
    font-size: 12px !important;
    letter-spacing: 0.5px !important;
    font-weight: 700 !important;
  }
}

/* ── E12: Checkout form top margin reset ── */
#sp-component form.form-horizontal {
  margin-top: 0 !important;
}

/* ── END PHASE 009E ── */

/* =====================================================================
   PHASE 009F — EXACT HIDPLANET CHECKOUT/CART VISUAL PARITY
   2026-06-23 | armikus.lv + endoskops.lv
   Ported from Hidplanet: PHASE032C + PHASE001B + PHASE032F +
   PHASE032G + PHASE033A + PHASE036A (adapted for --en-primary)
   CSS-only except previewfinish.php + menu.php template updates.
   ===================================================================== */

/* ── 009F-A: GREEN CHECKOUT BUTTONS (matches Hidplanet #43a047) ─────── */
#comjshop .btn-success,
#comjshopPrev .btn-success,
.jshop .btn-success,
.checkout_shipping_block .btn-success,
.jshop a.btn-success {
  background-color: #43a047 !important;
  border-color: #388e3c !important;
  color: #fff !important;
}
#comjshop .btn-success:hover,
#comjshop .btn-success:focus,
#comjshopPrev .btn-success:hover,
#comjshopPrev .btn-success:focus,
.jshop .btn-success:hover,
.jshop .btn-success:focus,
.checkout_shipping_block .btn-success:hover,
.checkout_shipping_block .btn-success:focus,
.jshop a.btn-success:hover,
.jshop a.btn-success:focus {
  background-color: #2e7d32 !important;
  border-color: #2e7d32 !important;
  color: #fff !important;
}
#comjshop .btn-success:disabled,
#comjshop .btn-success[disabled],
#comjshopPrev .btn-success:disabled,
#comjshopPrev .btn-success[disabled],
.jshop .btn-success:disabled,
.jshop .btn-success[disabled],
.checkout_shipping_block .btn-success:disabled {
  background-color: #b8d8b8 !important;
  border-color: #9cc89c !important;
  color: #6b7280 !important;
  cursor: not-allowed !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

/* ── 009F-B: TERMS CARD (matches Hidplanet .p32-terms-card) ─────────── */
.p32-terms-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 14px 18px;
  margin: 16px 0 14px 0;
}
.p32-terms-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid #f3f4f6;
}
.p32-terms-row:last-child { border-bottom: none; }
.p32-terms-cb {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  cursor: pointer;
  accent-color: #43a047;
}
.p32-terms-label {
  font-size: 14px;
  color: #374151;
  line-height: 1.5;
  cursor: pointer;
  font-weight: 400;
  margin: 0;
}
.p32-terms-link { color: var(--en-primary) !important; text-decoration: underline; }
.p32-terms-link:hover { color: var(--en-hover) !important; }
.p32-btn-hint { font-size: 13px; color: #6b7280; margin-bottom: 8px; }

/* ── 009F-C: TERMS CARD UPGRADE (matches .p32e-terms-card) ──────────── */
.p32e-terms-card {
  border-radius: 8px !important;
  padding: 16px 20px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
}
.p32e-terms-card .p32-terms-row {
  padding: 4px 0 !important;
  gap: 8px !important;
}
.p32-terms-cb {
  width: 16px !important;
  height: 16px !important;
  margin-top: 3px !important;
}
.p32-terms-label {
  font-size: 13px !important;
  color: #374151 !important;
  line-height: 1.4 !important;
}
.p32-btn-hint {
  font-size: 12px !important;
  color: #9ca3af !important;
  margin-bottom: 6px !important;
}

/* ── 009F-D: SHIPPING FORM (matches Hidplanet PHASE032C) ────────────── */
#shippingBlock.card,
#shippingBlock { overflow: visible; }
#table_shippings .shipping_form .control-group { margin-bottom: 12px; }
#table_shippings .shipping_form .control-label {
  display: block;
  width: auto;
  float: none;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 4px;
  text-align: left;
  padding-top: 0;
}
#table_shippings .shipping_form .controls { margin-left: 0; }
#table_shippings .shipping_form select.form-control,
#table_shippings .shipping_form input.form-control {
  width: 100%;
  max-width: 560px;
}

/* ── 009F-E: PICKUP ARTEFACT FIX ────────────────────────────────────── */
#table_shippings .shipping_form_active {
  padding: 12px 0 4px 24px;
  border-left: 3px solid #e5e7eb;
  margin-left: 4px;
  margin-top: 6px;
  overflow: visible;
}
#table_shippings .shipping_form_active.shipping_form_empty {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ── 009F-F: REQUIRED FIELD ERROR ───────────────────────────────────── */
.jshop_register .controls input.form-control.p32c-error,
.jshop_register .controls select.form-control.p32c-error {
  border-color: #dc2626 !important;
  background-color: #fff5f5 !important;
}
.p32c-inline-err { font-size: 12px; color: #dc2626; margin-top: 3px; }
.p32c-warning {
  font-size: 13px;
  color: #7f1d1d;
  background: #fef2f2;
  border: 1px solid #fca5a5;
  border-radius: 4px;
  padding: 8px 12px;
  margin-bottom: 10px;
  max-width: 480px;
}

/* ── 009F-G: CONFIRM BUTTON AREA ────────────────────────────────────── */
.p32e-confirm-area {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e5e7eb;
}
#previewfinish_btn.p32e-confirm-btn,
.p32e-confirm-btn {
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  border-radius: 9px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  margin-top: 0 !important;
}

/* ── 009F-H: CONFIRM CARD TITLE ─────────────────────────────────────── */
.p32f-card-title {
  font-size: 15px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 12px 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #f3f4f6;
  letter-spacing: 0.01em;
}

/* ── 009F-I: FULL-WIDTH PFINISH_COMMENT ─────────────────────────────── */
.pfinish_comment_block {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
a.policy,
.p32-terms-link {
  text-transform: none !important;
  font-weight: 400 !important;
  color: var(--en-primary) !important;
}

/* ── 009F-J: ADDRESS BILLING FORM STACKED LABELS ────────────────────── */
#comjshopAddr .control-label {
  float: none !important;
  width: 100% !important;
  text-align: left !important;
  padding-top: 0 !important;
  margin-bottom: 4px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  white-space: normal !important;
}
#comjshopAddr .controls { margin-left: 0 !important; }
#comjshopAddr .controls input.form-control,
#comjshopAddr .controls select.form-control,
#comjshopAddr .controls textarea.form-control {
  max-width: 480px !important;
}

/* ── 009F-K: CUSTOMER INFO HEADING + FIELD RHYTHM ───────────────────── */
#comjshopAddr .address_block h5 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin: 0 0 14px 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #f3f4f6 !important;
  letter-spacing: 0.01em !important;
}
#comjshopAddr .control-group { margin-bottom: 10px !important; }
#comjshopAddr .control-label { margin-bottom: 3px !important; }
#comjshopAddr .control-label label {
  font-size: 13px !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
}
#comjshopAddr .controls input.form-control,
#comjshopAddr .controls select.form-control {
  height: 36px !important;
  border: 1px solid #d1d5db !important;
  border-radius: 5px !important;
  font-size: 14px !important;
  color: #111827 !important;
}
#comjshopAddr .controls input.form-control:focus,
#comjshopAddr .controls select.form-control:focus {
  border-color: var(--en-primary) !important;
  box-shadow: 0 0 0 2px rgba(82,199,50,0.12) !important;
  outline: none !important;
}

/* ── 009F-L: CHECKOUT STEP STEPPER (matches Hidplanet PHASE001B) ─────── */
nav.p1b-stepper#jshop_menu_order {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  border: none !important;
  border-bottom: 2px solid #f3f4f6 !important;
  border-radius: 0 !important;
  padding: 14px 24px 16px !important;
  margin-bottom: 20px !important;
  gap: 0 !important;
}
.p1b-step {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}
.p1b-step__num {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  background: #f3f4f6 !important;
  color: #9ca3af !important;
  border: 1.5px solid #d1d5db !important;
  transition: background 0.2s, color 0.2s !important;
}
.p1b-step__label {
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
}
.p1b-step__label .not_active_step,
.p1b-step__label .not_active_step a {
  color: #9ca3af !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}
span.p1b-connector {
  display: block !important;
  width: 28px !important;
  height: 2px !important;
  background: #e5e7eb !important;
  flex-shrink: 0 !important;
  margin: 0 6px !important;
  border-radius: 1px !important;
}
.p1b-step--prev .p1b-step__num {
  background: #9ca3af !important;
  color: #fff !important;
  border-color: #9ca3af !important;
}
.p1b-step--prev .p1b-step__label .not_active_step,
.p1b-step--prev .p1b-step__label .not_active_step a {
  color: #6b7280 !important;
}
.p1b-step--prev .p1b-step__label .not_active_step a:hover {
  color: var(--en-primary) !important;
  text-decoration: underline !important;
}
.p1b-step--active .p1b-step__num {
  background: var(--en-primary) !important;
  color: #fff !important;
  border-color: var(--en-primary) !important;
  box-shadow: 0 0 0 3px rgba(82,199,50,0.15) !important;
}
.p1b-step--active .p1b-step__label .active_step,
.p1b-step--active .p1b-step__label #active_step {
  color: #111827 !important;
  font-weight: 700 !important;
  font-size: 13px !important;
}

@media (max-width: 767px) {
  nav.p1b-stepper#jshop_menu_order {
    padding: 10px 16px 12px !important;
    justify-content: center !important;
    overflow-x: hidden !important;
    gap: 0 !important;
  }
  nav.p1b-stepper .jshop_order_step { display: flex !important; }
  .p1b-step { gap: 0 !important; }
  .p1b-step__num { width: 24px !important; height: 24px !important; font-size: 11px !important; }
  .p1b-step--prev .p1b-step__label,
  .p1b-step--next .p1b-step__label { display: none !important; }
  .p1b-step--active .p1b-step__label { margin-left: 7px !important; }
  .p1b-step--active .p1b-step__label .active_step,
  .p1b-step--active .p1b-step__label #active_step { font-size: 12px !important; }
  span.p1b-connector {
    flex: 1 !important;
    min-width: 10px !important;
    max-width: 36px !important;
    width: auto !important;
    margin: 0 4px !important;
  }
}

/* ── 009F-M: PRODUCT BUY BUTTON GREEN (matches Hidplanet PHASE036A A1) ─ */
.productfull .prod_buttons .buttons.product-buttons .btn-buy,
.productfull .prod_buttons .buttons .btn-buy {
  background-color: #43a047 !important;
  border-color: #388e3c !important;
  color: #fff !important;
}
.productfull .prod_buttons .buttons.product-buttons .btn-buy:hover,
.productfull .prod_buttons .buttons.product-buttons .btn-buy:focus,
.productfull .prod_buttons .buttons.product-buttons .btn-buy:active,
.productfull .prod_buttons .buttons .btn-buy:hover,
.productfull .prod_buttons .buttons .btn-buy:focus,
.productfull .prod_buttons .buttons .btn-buy:active {
  background-color: #2e7d32 !important;
  border-color: #2e7d32 !important;
  color: #fff !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ── 009F-N: CART CHECKOUT BUTTON GREEN (matches Hidplanet PHASE036A A2) */
.jshop .cart_buttons a.btn-success,
.jshop .cart_buttons a.btn.btn-success,
#checkout a.btn-success,
.cart_buttons a.btn.btn-success {
  background-color: #43a047 !important;
  border-color: #388e3c !important;
  color: #fff !important;
  text-shadow: none !important;
}
.jshop .cart_buttons a.btn-success:hover,
.jshop .cart_buttons a.btn-success:focus,
#checkout a.btn-success:hover,
#checkout a.btn-success:focus,
.cart_buttons a.btn.btn-success:hover,
.cart_buttons a.btn.btn-success:focus {
  background-color: #2e7d32 !important;
  border-color: #2e7d32 !important;
  color: #fff !important;
}

/* ── 009F-O: CART BUTTONS UNIFORM SIZING (matches Hidplanet PHASE036A A3) */
.jshop .cart_buttons a.btn,
.cart_buttons a.btn {
  height: 44px !important;
  min-height: 44px !important;
  line-height: 1 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  border-radius: 6px !important;
  padding: 0 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
@media (max-width: 767px) {
  .jshop .cart_buttons #checkout,
  .cart_buttons #checkout {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
  }
  .jshop .cart_buttons .pull-left,
  .jshop .cart_buttons .pull-right,
  .cart_buttons .pull-left,
  .cart_buttons .pull-right {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .jshop .cart_buttons a.btn,
  .cart_buttons a.btn {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    font-size: 15px !important;
    border-radius: 6px !important;
    display: flex !important;
  }
}

/* ── 009F-P: MOBILE PRODUCT BUY 48px (matches Hidplanet PHASE036A A4) ─ */
@media (max-width: 767px) {
  .productfull .prod_buttons .prod_qty_input input.inputbox,
  .productfull .prod_buttons .prod_qty_input input[name="quantity"] {
    width: 84px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    font-size: 17px !important;
    border-radius: 6px !important;
    border: 1.5px solid #d0d0d0 !important;
    box-sizing: border-box !important;
    -webkit-appearance: textfield !important;
    appearance: textfield !important;
  }
  .productfull .prod_buttons .prod_qty_input {
    flex: 0 0 84px !important;
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    margin-right: 10px !important;
    align-items: flex-start !important;
  }
  .productfull .prod_buttons .buttons.product-buttons .btn-buy {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 6px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
  }
}

/* ── 009F-Q: MOBILE CART QTY (matches Hidplanet PHASE036A A5) ────────── */
@media (max-width: 767px) {
  .jshop table.cart td.quantity {
    white-space: nowrap !important;
    vertical-align: middle !important;
  }
  .jshop table.cart td.quantity .inputbox,
  #sp-component div.jshop table.cart tbody tr td .inputbox {
    width: 54px !important;
    height: 36px !important;
    min-height: 36px !important;
    text-align: center !important;
    font-size: 14px !important;
    border: 1px solid #d0d0d0 !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
    padding: 0 4px !important;
    vertical-align: middle !important;
  }
  .jshop table.cart td.quantity .cart_reload,
  #sp-component div.jshop table.cart tbody tr td .cart_reload {
    vertical-align: middle !important;
    margin-left: 5px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}

/* ── 009F-R: CONFIRM BUTTON FINAL (matches Hidplanet PHASE036A A6) ───── */
#previewfinish_btn,
input#previewfinish_btn,
#previewfinish_btn.p32e-confirm-btn {
  background-color: #43a047 !important;
  border-color: #388e3c !important;
  color: #fff !important;
}
#previewfinish_btn:not(:disabled):hover,
#previewfinish_btn:not(:disabled):focus,
#previewfinish_btn:not(:disabled):active,
input#previewfinish_btn:not(:disabled):hover,
input#previewfinish_btn:not(:disabled):focus {
  background-color: #2e7d32 !important;
  border-color: #2e7d32 !important;
  color: #fff !important;
  outline: none !important;
}
#previewfinish_btn:disabled,
input#previewfinish_btn:disabled {
  background-color: #b8d8b8 !important;
  border-color: #9cc89c !important;
  color: #6b7280 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}
@media (max-width: 767px) {
  #previewfinish_btn,
  input#previewfinish_btn {
    width: 100% !important;
    height: 50px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    letter-spacing: 0.02em !important;
    display: block !important;
    box-sizing: border-box !important;
  }
}

/* ── 009F-S: CONFIRM AREA VISUAL SEPARATOR ───────────────────────────── */
.jshop_cart .box_button,
#comjshopPrev .box_button,
.jshop .box_button {
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid #e5e7eb !important;
}

/* ── END PHASE 009F — 2026-06-23 ── */

/* ── 009F FIX: HIGH-SPECIFICITY BUTTON OVERRIDES ────────────────────── */
/* Needed because 009B uses double-ID #comjshopPrev #previewfinish_btn (2,0,0) */
/* which beats (1,1,0). Must use (2,1,0) or later cascade. */

/* Full-width, block, green confirm button inside card */
#comjshopPrev #previewfinish_btn.p32e-confirm-btn,
#comjshopPrev #previewfinish_btn {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  height: 52px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  border-radius: 9px !important;
  background-color: #43a047 !important;
  border-color: #388e3c !important;
  color: #fff !important;
  cursor: pointer !important;
  margin-top: 0 !important;
}
#comjshopPrev #previewfinish_btn:not(:disabled):hover,
#comjshopPrev #previewfinish_btn:not(:disabled):focus {
  background-color: #2e7d32 !important;
  border-color: #2e7d32 !important;
}
/* Disabled state — must beat 009B's active-state (2,0,0) with (2,0,1) */
#comjshopPrev #previewfinish_btn:disabled,
#comjshopPrev #previewfinish_btn[disabled] {
  background-color: #b8d8b8 !important;
  border-color: #9cc89c !important;
  color: #6b7280 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* Force confirm-area to be full-width block */
.p32e-confirm-area {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Mobile: same */
@media (max-width: 767px) {
  #comjshopPrev #previewfinish_btn.p32e-confirm-btn,
  #comjshopPrev #previewfinish_btn {
    height: 50px !important;
    font-size: 15px !important;
  }
}
/* ── END 009F FIX ── */

/* ════════════════════════════════════════════════════════════════════════
   PHASE 009G — REMOVE EMPTY PICKUP / NO-DELIVERY ARTIFACT — 2026-06-23
   Source: #shipping_form_1.shipping_form_active (pickup/no-delivery form)
   shows border-left: 3px solid #e5e7eb + padding 12px/4px even when empty.
   Fix: zero out border/padding/margin on active form with no child elements.
   CSS-only. No PHP changes.
   ════════════════════════════════════════════════════════════════════════ */

/* Primary: :has(*) — hides any active shipping form with no child elements
   (targets pickup when selected; does NOT affect Omniva/courier forms) */
#table_shippings .shipping_form_active:not(:has(*)) {
  border-left: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Fallback: target pickup shipping form ID directly
   (shipping_method 1 = no-delivery/pickup, always empty) */
#shipping_form_1.shipping_form_active {
  border-left: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* ── END PHASE 009G ── */