/* ===== Phone shop "app" look (shop, category and product pages): Roboto, white page, flat cards ===== */
@media (max-width: 900px) {
  html:not([lang^="ar"]) body.cg.woocommerce, html:not([lang^="ar"]) body.cg.woocommerce-page {
    --cg-serif: "Roboto", system-ui, sans-serif; --cg-sans: "Roboto", system-ui, sans-serif;
    --theme-font-family: "Roboto", system-ui, sans-serif;
    font-family: "Roboto", system-ui, sans-serif;
  }
  html:not([lang^="ar"]) body.cg.woocommerce .cg-logo { font-family: "Playfair Display", Georgia, serif; }
  body.cg.woocommerce, body.cg.woocommerce-page, body.cg.woocommerce #main-container, body.cg.woocommerce-page #main-container { background: #fff; }
  body.cg.woocommerce .cg-header, body.cg.woocommerce-page .cg-header { background: #fff; border-bottom: 1px solid #e6e6e6; }

  /* Breadcrumb bar: one grey line that scrolls sideways, current page in bold */
  .woocommerce .hero-section, .woocommerce-page .hero-section { background: #f3f3f3 !important; margin: 0 !important; padding: 0 !important; }
  .woocommerce .hero-section .entry-header { padding: 10px 16px !important; min-height: 0 !important; }
  .ct-breadcrumbs { display: block; white-space: nowrap; overflow-x: auto; scrollbar-width: none; font-size: 13px !important; text-transform: none !important; letter-spacing: 0 !important; }
  .ct-breadcrumbs::-webkit-scrollbar { display: none; }
  .ct-breadcrumbs a, .ct-breadcrumbs span { color: #7b7b7b !important; font-weight: 400; }
  .ct-breadcrumbs .last-item, .ct-breadcrumbs .last-item span { color: #111 !important; font-weight: 700; }

  /* ---------- Product page ---------- */
  .single-product main, .single-product .site-main { background: #fff; }
  .single-product .woocommerce-product-gallery { position: relative; background: #fff; }
  .single-product .flexy-arrow-prev, .single-product .flexy-arrow-next, .single-product .flexy-pills { display: none !important; }
  .single-product .woocommerce-product-gallery .flexy-items img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #fff; }
  .cg-progress { display: flex; height: 3px; background: #e3e3e3; }
  .cg-progress span { flex: 1; }
  .cg-progress span.on { background: #1d2b27; }
  .cg-similar { position: absolute; inset-inline-start: 14px; bottom: 16px; z-index: 5; display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 0; border-radius: 999px; padding: 9px 14px; font: 400 14px "Roboto", sans-serif; color: #111; box-shadow: 0 2px 10px rgba(0,0,0,.18); cursor: pointer; }

  .single-product .entry-summary { padding: 14px 16px 0 !important; }
  .cg-brand { font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .2px; color: #111; margin: 0 0 2px; }
  .single-product .entry-summary .entry-title, .single-product .product_title { font-family: "Roboto", sans-serif; font-weight: 400; font-size: 16px !important; line-height: 1.35; margin: 0 0 6px; color: #111; }
  .cg-sku { font-size: 12px; color: #444; margin: 0 0 10px; }
  .single-product .entry-summary .price { font-family: "Roboto", sans-serif; font-size: 22px !important; font-weight: 700; color: var(--cg-sale); margin: 4px 0 0; }
  .single-product .entry-summary .price ins { text-decoration: none; background: none; color: var(--cg-sale); }
  .single-product .entry-summary .price del { font-size: 15px; font-weight: 400; color: #444; opacity: 1; margin-inline-start: 6px; }
  .single-product .entry-summary .price .cg-off { display: block; width: max-content; margin: 8px 0 0; border-radius: 2px; font-size: 14px; padding: 6px 8px; }
  .single-product .entry-summary > .woocommerce-product-details__short-description { font-size: 14px; line-height: 1.55; color: #333; border-top: 1px solid #e6e6e6; margin-top: 14px; padding-top: 12px; }
  .single-product .cg-assure > div { background: #fff; border: 1px solid #e6e6e6; border-radius: 4px; }
  .single-product .cg-acc { margin-inline: -16px; border-top-color: #eceff1; }
  .single-product .cg-acc__item summary { font-size: 16px; font-weight: 700; }

  /* Buy bar: quantity dropdown + wide button */
  .single-product form.cart:not(.variations_form), .single-product form.variations_form .woocommerce-variation-add-to-cart { padding: 10px 16px 12px; border-top: 1px solid #e6e6e6; gap: 12px; }
  .single-product .quantity.cg-qty-on { position: relative; width: 84px; height: 48px; border: 1px solid #cfcfcf !important; border-radius: 4px; background: #fff; flex: 0 0 84px; }
  .single-product .quantity.cg-qty-on > *:not(.cg-qty) { display: none !important; }
  .single-product .quantity .cg-qty { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: transparent url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 12 8%22%3E%3Cpath d=%22M1 1.5l5 5 5-5%22 fill=%22none%22 stroke=%22%23333%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") no-repeat right 12px center / 12px; padding: 0 28px 0 14px; font: 500 16px "Roboto", sans-serif; color: #111; appearance: none; -webkit-appearance: none; border-radius: 4px; }
  [dir="rtl"] .single-product .quantity .cg-qty { background-position: left 12px center; padding: 0 14px 0 28px; }
  .single-product form.cart .single_add_to_cart_button, .single-product form.variations_form .single_add_to_cart_button { border-radius: 4px !important; min-height: 48px; font: 700 16px "Roboto", sans-serif; letter-spacing: 0; text-transform: none; }

  /* ---------- Category / shop listing ---------- */
  .archive.woocommerce .hero-section { background: #fff !important; }
  .archive.woocommerce .hero-section .page-title, .archive.woocommerce .hero-section h1 { font-size: 18px !important; font-weight: 700; text-align: center; }
  .archive.woocommerce .hero-section .entry-header { padding: 14px 16px 2px !important; text-align: center; }
  .woo-listing-top { margin: 0; }
  .woo-listing-top .woocommerce-result-count { display: block !important; text-align: center; font-size: 14px; color: #555; margin: 0 0 10px; }
  .cg-catstrip { background: #fff; box-shadow: 0 6px 14px -12px rgba(0,0,0,.35); margin-inline: -20px; padding: 12px 20px; }
  .cg-catstrip i, .cg-catstrip img { background: #f1f1f1; border-color: #e3e3e3; color: #555; }
  .cg-catstrip a { font-size: 13px; }
  .woocommerce ul.products { --cw: calc((100vw - 52px) / 2); gap: 18px 12px !important; }
  .woocommerce ul.products li.product { border: 0; border-radius: 0; background: #fff; padding: 0 0 6px; overflow: visible; }
  .woocommerce ul.products li.product img { border-radius: 4px; background: #fff; object-fit: contain; }
  .woocommerce ul.products li.product .cg-brand { margin: 8px 0 1px; font-size: 13px; }
  .woocommerce ul.products li.product .cg-pill { position: absolute; inset-inline-start: 0; top: calc(var(--cw) - 24px); margin: 0; border-radius: 0; background: #1d2b27; color: #fff; font-size: 12px; font-weight: 500; padding: 4px 8px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px; font-weight: 400; margin: 0 0 4px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .woocommerce ul.products li.product .price { margin: 0; padding: 0; font-size: 15px; font-weight: 700; color: var(--cg-sale); }
  .woocommerce ul.products li.product .price del { display: inline; font-size: 12px; font-weight: 400; color: #555; margin-inline-start: 4px; }
  .woocommerce ul.products li.product .price .cg-off { display: block; width: max-content; margin: 6px 0 0; border-radius: 2px; font-size: 13px; padding: 5px 7px; }
  .woocommerce ul.products li.product .price:not(:has(del)) { color: #111; }
  .woocommerce ul.products li.product .button.add_to_cart_button, .woocommerce ul.products li.product .button.product_type_simple, .woocommerce ul.products li.product .button.product_type_variable { inset-inline-end: 8px; top: calc(var(--cw) - 46px); bottom: auto; width: 40px; height: 40px; }
  .cg-sortbar button { font-family: "Roboto", sans-serif; }
}

@media (max-width: 900px) {
  .woocommerce .hero-section, .woocommerce-page .hero-section { width: 100vw; max-width: none; margin-inline: calc(50% - 50vw) !important; }
  .single-product .product .entry-summary, .single-product .entry-summary-items { margin-top: 0 !important; padding-top: 12px !important; }
  .single-product .woocommerce-product-gallery, .single-product .ct-product-gallery-container { margin-bottom: 0 !important; }
  .single-product .product > .ct-container, .single-product .ct-container[data-vertical-spacing] { row-gap: 0 !important; }
}

@media (max-width: 900px) {
  .woo-listing-top .woocommerce-result-count { text-align: center !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; color: #555 !important; width: 100%; margin: 12px 0 4px !important; }
}

/* Header on phones: first row burger, logo, tools; second row search */
@media (max-width: 900px) {
  .cg-header__row { flex-wrap: wrap !important; row-gap: 10px; padding-bottom: 10px; }
  .cg-search { order: 10; flex: 1 0 100%; }
  .cg-search input[type="search"] { height: 42px; border-radius: 6px; border-color: #1d2b27; }
  .cg-search button { inset-inline-end: 0; top: 0; height: 42px; width: 46px; border-radius: 0 6px 6px 0; }
  [dir="rtl"] .cg-search button { border-radius: 6px 0 0 6px; }
}

/* Space between the photo (and its tag chip) and the product title now that there is no brand line */
@media (max-width: 900px) {
  .woocommerce ul.products li.product .woocommerce-loop-product__title { margin-top: 10px !important; padding-inline: 2px; }
  .woocommerce ul.products li.product .price { padding-inline: 2px; }
}

/* Quantity dropdown reads "Qty: 1" so it is easy to spot in the pinned bar */
@media (max-width: 900px) {
  .single-product .quantity.cg-qty-on { width: 118px; flex: 0 0 118px; }
  .single-product .quantity .cg-qty { font-size: 15px; padding-inline-end: 30px; }
}

/* ===== Tighter product page: less empty space between items ===== */
.single-product .entry-summary-items > *, .single-product .entry-summary > * { --product-element-spacing: 14px !important; }
.single-product .entry-summary-items > .price { --product-element-spacing: 10px !important; }
.single-product .entry-summary .price { margin-block: 2px 0; }
.single-product .woocommerce-product-details__short-description { margin: 10px 0 0 !important; padding-top: 10px; }
.single-product .cg-vt table.variations { margin: 0 !important; }
.single-product .cg-vt .cg-vt__head { margin: 12px 0 8px; }
.single-product .cg-vt .cg-vt__group + .cg-vt__group .cg-vt__head { margin-top: 14px; }
.single-product .cg-vt .reset_variations { margin-top: 4px; }
.single-product .single_variation_wrap, .single-product .woocommerce-variation { margin: 0 !important; }
.single-product .product_meta { margin-top: 12px !important; padding-top: 0 !important; }
.single-product .cg-assure { margin: 12px 0 8px; gap: 8px; }
.single-product .cg-pays { padding-top: 2px; }
.single-product .cg-disclaimer { font-size: 13px; line-height: 1.6; color: #666; margin: 12px 0 0; }
@media (max-width: 900px) {
  .single-product .entry-summary { padding-top: 10px !important; }
  .single-product .cg-acc { margin-top: 14px; }
}

/* Accordion rows run exactly edge to edge */
@media (max-width: 900px) {
  .single-product .cg-acc { width: 100vw; max-width: 100vw; margin-inline: calc(50% - 50vw) !important; }
}

/* Product meta: SKU is a small muted line below the buy controls; categories are already in the breadcrumb */
.single-product .product_meta { font-size: 13px; color: #71717a; }
.single-product .product_meta .sku_wrapper, .single-product .product_meta .sku_wrapper .sku { color: #71717a; font-weight: 400; text-transform: none; letter-spacing: 0; }
.single-product .product_meta .posted_in, .single-product .product_meta .tagged_as { display: none; }
/* Category strip circles hold photos */
.cg-catstrip i { display: flex; align-items: center; justify-content: center; color: #8a918f; }
.cg-catstrip i svg { width: 26px; height: 26px; }

/* The theme forces meta lines to block, so the hidden categories line needs !important */
.single-product .product_meta .posted_in, .single-product .product_meta .tagged_as { display: none !important; }