[section="single-product"] {
  display: grid;
  gap: var(--spacing-12);
  grid-template-columns: 60% auto;


}

[section="single-product"] [block="pd-content"] {
    display: flex;
    gap: var(--spacing-12);
    flex-direction: column;
  }

:is([section="single-product"] [block="pd-content"]) .general-info {
      padding: var(--spacing-48);
      border-radius: var(--radius-md);
      background-color: var(--color-surface-container-low);
      display: grid;
      gap: calc(var(--spacing-48) - var(--spacing-8));
    }

:is(:is([section="single-product"] [block="pd-content"]) .general-info) .price {
        display: flex;
        align-items: center;
        gap: var(--spacing-8);
        font-size: var(--price-font-size);
      }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .price) .compare-at-price {
          opacity: 0.8;
          text-decoration: line-through;
        }

:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about {
        display: grid;
        gap: var(--spacing-8);
      }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about) .title {
          font: var(--font-display-sm);
        }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about) .subtitle {
          opacity: 0.8;
          font: var(--font-body-lg);
        }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about) * {
          max-width: 100%;
        }

:is(:is([section="single-product"] [block="pd-content"]) .general-info) .inventory {
        display: flex;
        align-items: center;
        gap: var(--spacing-8);
        margin-block-start: calc((var(--spacing-48) - var(--spacing-8)) * -1);
      }

[data-inventory="out-of-stock"]:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .inventory) [ui-icon] {
          color: var(--color-outline);
        }

[data-inventory="low-stock"]:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .inventory) [ui-icon] {
          color: var(--color-error);
        }

[data-inventory="in-stock"]:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .inventory) [ui-icon] {
          color: var(--color-success);
        }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .inventory) [data-status] {
          font: var(--font-body-sm);
        }

:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta {
        display: grid;
        gap: var(--spacing-12);
        grid-template-columns: 165px auto;
      }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta) .quantity {
          display: flex;
          gap: var(--spacing-8);
        }

:is(:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta) .quantity) .value {
            flex: 2;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: var(--radius-sm);
            background-color: var(--color-background);
            font: var(--font-body-lg);
          }

:is(:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta) ui-product-button) [ui-button] {
            width: 100%;
          }

:is(:is(:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta) ui-product-button) [ui-button]):empty::before {
              content: attr(data-cta);
            }

:is([not-available]:is(:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta) ui-product-button):has([ui-button]:empty) [ui-button])::before {
                content: attr(data-out-of-stock);
              }

:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) article) img,:is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) article) iframe {
          max-width: 100%;
        }

:is([section="single-product"] [block="pd-content"]) .social-info {
      display: grid;
      gap: var(--spacing-12);
      grid-template-columns: repeat(2, 1fr);
    }

@media (min-width: 769px) {
          :is(:is([section="single-product"] [block="pd-content"]) .social-info):not(:has(li:last-child:is(:nth-child(even)))) > li:last-child {
            grid-column: 1 / 3;
          }
      }

[section="single-product"] [block="pd-media"] {
    position: sticky;
    inset-block-start: var(--spacing-12);
    border-radius: var(--radius-md);
    overflow: hidden scroll;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    height: 85vh;
    background-color: var(--color-surface-container);
  }

:is([section="single-product"] [block="pd-media"]):not(:has(.images img:nth-child(2))) {
      overflow: hidden;
    }

:is(:is([section="single-product"] [block="pd-media"]) .images) img,:is(:is([section="single-product"] [block="pd-media"]) .images) iframe {
        width: 100%;
        height: 85vh;
        object-fit: cover;
        scroll-snap-align: center;
        scroll-snap-stop: always;
        border: 1px solid var(--color-surface-container);
      }

:is(:is([section="single-product"] [block="pd-media"]) .images) > [ui-icon] {
        opacity: 0.3;
        position: absolute;
        translate: -50% -50%;
        left: 50%;
        inset-block-start: 50%;
      }

:is([section="single-product"] [block="pd-media"]) .controller {
      position: sticky;
      inset-block-end: var(--spacing-24);
      display: flex;
      justify-content: center;
    }

:is(:is([section="single-product"] [block="pd-media"]) .controller) .controller-wrapper {
        width: fit-content;
        padding: var(--spacing-8);
        border-radius: var(--radius-md);
        background-color: var(--color-background);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: var(--spacing-4);
        box-shadow:
          0 4px 6px -1px #0000001a,
          0 2px 4px -2px #0000001a;
      }

:is(:is(:is([section="single-product"] [block="pd-media"]) .controller) .controller-wrapper) > button {
          border: 0;
          outline: 0;
          width: 60px;
          height: 60px;
          cursor: pointer;
          overflow: hidden;
          border-radius: var(--radius-sm);
          box-shadow: inset 0 3px 3px #0000001a;
          transition: var(--transition-standard-default-effects);
        }

:is(:is(:is(:is([section="single-product"] [block="pd-media"]) .controller) .controller-wrapper) > button) img {
            width: 100%;
            height: 100%;
            object-fit: cover;
          }

[aria-selected="false"]:is(:is(:is(:is([section="single-product"] [block="pd-media"]) .controller) .controller-wrapper) > button) {
            opacity: 0.5;
          }

:is(:is(:is(:is([section="single-product"] [block="pd-media"]) .controller) .controller-wrapper) > button):hover {
            opacity: 1;
          }

:is([section="single-product"] [block="pd-media"]) .pagination {
      position: absolute;
      translate: -50% -50%;
      left: 50%;
      inset-block-end: var(--spacing-16);
      display: none;
      align-items: center;
      gap: var(--spacing-8);
      justify-content: center;
    }

:is(:is([section="single-product"] [block="pd-media"]) .pagination) .page {
        width: 6px;
        height: 6px;
        border: none;
        outline: none;
        cursor: pointer;
        filter: contrast(0);
        border-radius: var(--radius-rounded);
        background-color: var(--color-on-background);
        transition: var(--transition-standard-default-effects);
      }

[aria-selected="true"]:is(:is(:is([section="single-product"] [block="pd-media"]) .pagination) .page) {
          width: 24px;
          filter: contrast(1);
        }

@media (max-width: 1024px) {
  [section="single-product"] {
    grid-template-columns: 1fr;
  }

    [section="single-product"] [block="pd-media"] {
      position: relative;
      inset-block-start: auto;
    }
}

@media (max-width: 769px) {
    [section="single-product"] [block="pd-media"] {
      height: 38vh;
    }

      :is([section="single-product"] [block="pd-media"]) .images {
        display: flex;
        overflow: scroll hidden;
        scroll-behavior: smooth;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
      }

        :is(:is([section="single-product"] [block="pd-media"]) .images) img,:is(:is([section="single-product"] [block="pd-media"]) .images) iframe {
          height: 38vh;
          min-width: 100%;
        }

      :is([section="single-product"] [block="pd-media"]) .controller {
        display: none;
      }

      :is([section="single-product"] [block="pd-media"]) .pagination {
        display: flex;
      }
      :is([section="single-product"] [block="pd-content"]) .general-info {
        padding: calc(var(--spacing-24) + var(--spacing-8));
      }
          :is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about) .title {
            font: var(--font-title-lg);
          }

          :is(:is(:is([section="single-product"] [block="pd-content"]) .general-info) .about) .subtitle {
            font: var(--font-body-md);
          }

        :is(:is([section="single-product"] [block="pd-content"]) .general-info) .cta {
          display: flex;
          flex-direction: column;
        }

        :is(:is([section="single-product"] [block="pd-content"]) .general-info) [ui-whatsapp] {
          justify-content: center;
        }

      :is([section="single-product"] [block="pd-content"]) .social-info {
        grid-template-columns: 1fr;
      }
}

form[ui-order-form] .cta ui-product-button > button.add-to-cart { background: linear-gradient(100deg,#C79442,#E0BF72,#B07A2E); background-color: #C79442; color: #2A322E; border-color: #C79442; }
form[ui-order-form] .cta ui-product-button > button.add-to-cart:hover { background: linear-gradient(100deg,#E0BF72,#C79442,#B07A2E); background-color: #E0BF72; border-color: #C79442; }
form[ui-order-form] .cta ui-product-button > button.add-to-cart:focus-visible { outline: 3px solid color-mix(in srgb, #C79442 35%, transparent); outline-offset: 2px; }

form[ui-order-form] .price { direction: rtl; unicode-bidi: isolate; display: flex; flex-direction: row; justify-content: flex-start; align-items: baseline; gap: var(--spacing-8); }
form[ui-order-form] .price .original-price, form[ui-order-form] .price .compare-at-price { direction: rtl; unicode-bidi: isolate; white-space: nowrap; }

form[ui-order-form] .cta > .quantity { display: none !important; }

[section="single-product"] [block="pd-content"] > form.general-info { gap: 18px; }
[section="single-product"] [block="pd-content"] > form.general-info .about { gap: 4px; }
[section="single-product"] [block="pd-content"] > form.general-info .about .title { font-size: clamp(19px, 3vw, 24px); line-height: 1.3; }
[section="single-product"] [block="pd-content"] > form.general-info .cta { display: block; }
[section="single-product"] [block="pd-content"] > form.general-info .cta ui-product-button { display: block; }
[section="single-product"] [block="pd-content"] > form.general-info .cta ui-product-button > button.add-to-cart { min-height: 50px; border-radius: 10px; font-size: 17px; font-weight: 800; }
.hayyak-order-summary { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid #E0D4C0; border-radius: 10px; background: #FFFDF8; direction: rtl; }
.hayyak-order-summary__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #5A5248; font-size: 13px; }
.hayyak-order-summary__row strong { color: #2A322E; font-weight: 800; }
.hayyak-order-summary__total { padding-block-start: 7px; border-block-start: 1px solid #DDE4E3; color: #263234; font-size: 15px; }
.hayyak-order-summary__total strong { color: #263234; font-size: 18px; }
@media (max-width: 769px) { [section="single-product"] [block="pd-content"] > form.general-info { padding: 18px; gap: 16px; } }

form[ui-order-form] .price .original-price { color: #1F292B; font-size: clamp(22px, 4vw, 30px); font-weight: 900; letter-spacing: -.01em; }
form[ui-order-form] .price .compare-at-price { color: #526466; font-size: clamp(16px, 3vw, 21px); font-weight: 800; text-decoration-thickness: 2px; text-decoration-color: #526466; }
form[ui-order-form] .price { min-height: 34px; }
.hayyak-sticky-cta { position: fixed; z-index: 50; inset-inline: 10px; inset-block-end: calc(10px + env(safe-area-inset-bottom)); display: flex; align-items: center; gap: 10px; opacity: 0; pointer-events: none; transform: translateY(120%); padding: 7px 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 7px; background: #2A322E; box-shadow: 0 8px 24px rgba(20,28,30,.28); direction: rtl; transition: opacity .25s ease, transform .25s ease; }
.hayyak-sticky-cta[data-visible] { opacity: 1; pointer-events: auto; transform: translateY(0); }
.hayyak-sticky-cta__message { flex: 1 1 auto; min-width: 0; color: #FFFFFF; text-align: right; line-height: 1.25; }
.hayyak-sticky-cta__message strong { display: block; font-size: 12px; font-weight: 900; white-space: nowrap; }
.hayyak-sticky-cta__message small { display: block; margin-block-start: 3px; color: #D9E2E1; font-size: 9px; font-weight: 600; white-space: nowrap; }
.hayyak-sticky-cta__button { flex: 0 0 min(48%, 190px); display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; border: 0; border-radius: 999px; background: linear-gradient(100deg,#C79442,#E0BF72,#B07A2E); color: #2A322E; cursor: pointer; font-size: 14px; font-weight: 900; box-shadow: 0 3px 0 #AA8647; transition: background-color .15s ease, box-shadow .15s ease; animation: none; }
.hayyak-sticky-cta__button:hover { background: #E4C37F; }
.hayyak-sticky-cta__button:active { box-shadow: 0 1px 0 #AA8647; }
.hayyak-sticky-cta__arrow { display: inline-grid; place-items: center; width: 20px; height: 20px; border: 1px solid currentColor; border-radius: 50%; font-size: 16px; line-height: 1; }
@keyframes hayyak-cta-side-shake { 0%, 100% { transform: translateX(0); } 16% { transform: translateX(-8px); } 32% { transform: translateX(8px); } 48% { transform: translateX(-6px); } 64% { transform: translateX(6px); } 80% { transform: translateX(0); } }
@media (max-width: 389px) { .hayyak-sticky-cta { gap: 6px; padding-inline: 6px; } .hayyak-sticky-cta__message strong { font-size: 11px; } .hayyak-sticky-cta__button { flex-basis: 47%; font-size: 13px; } }
@media (min-width: 900px) { .hayyak-sticky-cta { inset-inline: auto 24px; width: min(390px, calc(100vw - 48px)); } }
@media (prefers-reduced-motion: reduce) { .hayyak-sticky-cta, .hayyak-sticky-cta[data-visible] { transition: none; } .hayyak-sticky-cta__button { animation: none; transition: none; } }

.hayyak-sticky-cta__button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; letter-spacing: .01em; }
.hayyak-sticky-cta__button span:first-child { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; font-size: 18px; line-height: 1; }

.hayyak-sticky-cta {
  background: #2A322E !important;
  border: 2px solid #C79442 !important;
}
.hayyak-sticky-cta__button {
  background: linear-gradient(100deg, #C79442, #E0BF72, #B07A2E) !important;
  color: #2A322E !important;
}
.hayyak-sticky-cta__button:hover {
  background: linear-gradient(100deg, #E0BF72, #C79442, #B07A2E) !important;
}

form[ui-order-form] .price .original-price,
[section="single-product"] .price .original-price {
  color: #2A322E !important;
  font-weight: 950 !important;
  letter-spacing: -0.02em !important;
}
form[ui-order-form] .price .compare-at-price,
[section="single-product"] .price .compare-at-price {
  color: #9A9085 !important;
  font-weight: 600 !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1px !important;
  text-decoration-color: #B5ADA3 !important;
  opacity: 0.9 !important;
}
[section="single-product"] .about .title {
  color: #2A322E !important;
  font-weight: 900 !important;
}
