/**
 * HALFTONE PRODUCT FIXES - CRITICAL OVERRIDES
 *
 * These fixes ensure 1:1 visual match with design requirements:
 * - Black button (100% width, no shadow)
 * - Hidden prices/variants/tax info
 * - Proper modal trigger
 * - Pickup availability under button
 *
 * Version: 1.0.0 - 2026-01-30
 */

/* ===================================================================
   HALFTONE PRODUCT DETECTION
   Target only products with halftone_product tag
   =================================================================== */

/* Only apply when body has halftone-product class or data attribute */
body[data-halftone-product='true'],
.product-page:has(.halftone-overlay-trigger) {
  /* ===================================================================
     BUTTON STYLING - ACCENT, 100% WIDTH
     =================================================================== */

  /* Primary button selector - strongest specificity */
  #start-editing.button--solid,
  a#start-editing.button.button--solid,
  .product__cart-actions a#start-editing,
  .button-holder a#start-editing.button--solid {
    background-color: var(--color-text, #111827) !important;
    color: #ffffff !important;
    width: 100% !important;
    box-shadow: none !important;
    text-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 16px 24px !important;
    text-align: center !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
  }

  /* Hover state - slightly lighter */
  #start-editing.button--solid:hover,
  a#start-editing.button--solid:hover,
  .product__cart-actions a#start-editing:hover,
  .button-holder a#start-editing.button--solid:hover {
    background-color: var(--color-text, #111827) !important;
    opacity: 0.85 !important;
  }

  /* Active/focus states */
  #start-editing.button--solid:focus,
  a#start-editing.button--solid:focus {
    outline: 2px solid var(--color-text, #111827) !important;
    outline-offset: 2px !important;
  }

  /* Remove any inherited theme button styles */
  .product__cart-actions .button-holder,
  .product__cart-actions .button-holder > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* ===================================================================
     HIDE PRICE ELEMENTS
     =================================================================== */

  /* Hide all price-related elements */
  .product__price,
  .product__price-container,
  .product__price--original,
  .product__price--compare,
  .product__price--unit,
  .product__price-reviews,
  .product__extras,
  .product__policies,
  .product__sku,
  .product__barcode,
  .product__vendor,
  #product-price-[id] .product__price,
  span.product__price,
  .product__price.text-size--larger {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -99999px !important;
  }

  /* ===================================================================
     HIDE VARIANT PICKER
     =================================================================== */

  /* Hide variant picker completely */
  product-variants,
  .product-variants,
  .variant-picker,
  .product__variant-quantity,
  .variant-quantity,
  .product-variants[data-hide-variants='true'] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
  }

  /* Hide variant quantity labels */
  .variant-quantity-product {
    display: none !important;
  }

  /* ===================================================================
     HIDE TAX INFO ("inklusive steuer")
     =================================================================== */

  /* Target tax info specifically */
  .product__extras,
  .product__policies,
  .product__extras .text-size--smaller,
  [data-product-policies],
  .product__policies:has-text('inklusive steuer'),
  .product__policies:has-text('include taxes') {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  /* Hide any policy text under product title */
  .product__header .product__extras {
    display: none !important;
  }

  /* ===================================================================
     PICKUP AVAILABILITY - POSITION UNDER BUTTON
     =================================================================== */

  /* Move pickup availability under button */
  pickup-availability,
  .product__pickup-availabilities,
  .pickup-availability-preview {
    display: block !important;
    margin-top: 16px !important;
    margin-bottom: 0 !important;
    padding: 12px 0 !important;
    border-top: 1px solid #e5e5e5 !important;
    border-bottom: none !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
  }

  /* Ensure pickup availability is after the button */
  .product__cart-actions ~ pickup-availability,
  .button-holder ~ pickup-availability {
    display: block !important;
    position: relative !important;
    margin-top: 16px !important;
  }

  /* Style pickup availability banner to look like inline text */
  .store-availability-container {
    padding: 8px 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
  }

  .store-availability-information__title {
    font-size: 14px !important;
    color: #666 !important;
    margin: 0 !important;
  }

  /* ===================================================================
     HIDE QUANTITY SELECTOR (if present)
     =================================================================== */

  .product__quantity,
  input[name='quantity'].product__quantity,
  .product__cart-actions input[type='number'] {
    display: none !important;
  }

  /* ===================================================================
     HIDE DYNAMIC CHECKOUT BUTTONS
     =================================================================== */

  .shopify-payment-button,
  .shopify-payment-button__button,
  .shopify-payment-button__more-options,
  .shopify-payment-terms {
    display: none !important;
  }

  /* ===================================================================
     PRODUCT LAYOUT ADJUSTMENTS
     =================================================================== */

  /* Ensure product header shows only title */
  .product__header {
    margin-bottom: 20px !important;
  }

  .product__title {
    display: block !important;
    margin-bottom: 8px !important;
  }

  /* Remove extra spacing when elements are hidden */
  .product__offers {
    min-height: auto !important;
  }

  /* ===================================================================
     MODAL TRIGGER BUTTON CONTAINER
     =================================================================== */

  .button-holder {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .product__cart-actions .button-holder {
    display: block !important;
    width: 100% !important;
  }
}

/* ===================================================================
   MOBILE SPECIFIC FIXES
   =================================================================== */

@media (max-width: 768px) {
  body[data-halftone-product='true'],
  .product-page:has(.halftone-overlay-trigger) {
    /* Button mobile fixes - CRITICAL */
    #start-editing.button--solid,
    a#start-editing.button.button--solid,
    .button-holder a#start-editing.button--solid {
      width: 100% !important;
      padding: 16px 24px !important;
      font-size: 14px !important;
      background-color: var(--color-text, #111827) !important;
      color: #ffffff !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      border: none !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      letter-spacing: 0.5px !important;
      text-transform: uppercase !important;
      min-height: 52px !important;
      position: relative !important;
      z-index: 10 !important;
      overflow: visible !important;
    }

    #start-editing.button--solid:hover,
    a#start-editing.button--solid:hover {
      background-color: var(--color-text, #111827) !important;
      opacity: 0.85 !important;
    }

    /* Pickup availability mobile spacing */
    pickup-availability {
      margin-top: 12px !important;
      padding: 10px 0 !important;
    }

    /* Ensure no horizontal scroll but allow button to be visible */
    .product__cart-actions {
      overflow: visible !important;
      width: 100% !important;
      position: relative !important;
      z-index: 10 !important;
    }

    /* Button holder full width and visible */
    .button-holder {
      width: 100% !important;
      padding: 0 !important;
      margin: 0 !important;
      overflow: visible !important;
      position: relative !important;
      z-index: 10 !important;
    }

    /* Fix title overlapping button */
    .product__header {
      position: relative !important;
      z-index: 1 !important;
      overflow: visible !important;
    }

    .product__title {
      position: relative !important;
      z-index: 1 !important;
    }
  }
}

/* ===================================================================
   MOBILE GALLERY - SECOND SLIDE PEEK (Anschnitt)
   Ensures the next slide is partially visible on mobile
   =================================================================== */

@media screen and (max-width: 835px) {
  /* Reduce gallery item width so next slide peeks through */
  body[data-halftone-product='true'] .product-gallery .product-gallery__item,
  body[data-halftone-product='true'] .product-gallery__item.smaller-lap--smart-width {
    width: calc(100vw - 20px * 2 - 45px) !important;
    margin-right: 0px;
    padding-left: 20px;
  }

  /* Don't affect single-image galleries */
  body[data-halftone-product='true'] .product-gallery[data-size='1'] .product-gallery__item {
    width: calc(100vw - var(--grid-padding) * 2) !important;
    margin-right: 0;
  }

  /* Ensure scroll padding accounts for the peek */
  body[data-halftone-product='true'] .product-gallery .product-gallery__items {
    scroll-padding-left: var(--grid-padding);
  }
}

/* ===================================================================
   PRINT STYLES - ENSURE CLEAN PRINT
   =================================================================== */

@media print {
  body[data-halftone-product='true'] {
    .product__price,
    .product__extras,
    product-variants {
      display: none !important;
    }

    #start-editing {
      display: none !important;
    }
  }
}