/* Islamite Store — fixes and phone layout on top of the theme (loaded last). */

/* ---- Utilities -------------------------------------------------------- */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
html, body { overflow-x: clip; }
img { max-width: 100%; }

/* ---- Headings that became real h1/h2 for search engines keep the theme's look */
.tf-page-title h1.heading,
.flat-title h2.title,
.wrap-slider .box-content h2.heading { margin: 0; }
.tf-product-info-title h1 { font-size: 28px; line-height: 1.2; margin: 0; font-weight: 400; }
.blog-detail-main-heading h1.title { margin: 0; }

/* ---- Product cards ------------------------------------------------------ */
/* Touch screens never hover: skip the second (hover) photo entirely. */
@media (hover: none) {
  .card-product .product-img .img-hover { display: none; }
}

/* ---- Phones ------------------------------------------------------------- */
@media (max-width: 1199px) {
  /* The header has no room for the currency picker; it's in the menu and footer. */
  .nav-icon .nav-currency { display: none !important; }
}

@media (max-width: 767px) {
  /* 16px stops iPhones zooming in when a field is tapped. */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),
  select, textarea { font-size: 16px !important; }

  /* Headings: compact but readable. */
  .tf-page-title { padding: 36px 0 30px; }
  .tf-page-title h1.heading { font-size: 30px; line-height: 1.1; }
  .tf-product-info-title h1 { font-size: 22px; line-height: 1.25; }
  .flat-title { margin-bottom: 22px; }
  .flat-title .title { font-size: 24px; line-height: 1.15; }
  .flat-title .sub-title { font-size: 14px; }

  /* Product cards: two icons (cart + wishlist) instead of four crowding the photo. */
  .card-product .list-product-btn .js-compare-toggle,
  .card-product .list-product-btn .quickview { display: none; }
  .card-product .list-product-btn .box-icon { width: 36px; height: 36px; }
  .card-product .card-product-info .title { font-size: 14px; line-height: 1.35; }

  /* Section rhythm: 40-48px instead of the desktop spacing. */
  .flat-spacing-4, .flat-spacing-5, .flat-spacing-6, .flat-spacing-7 { padding-top: 44px; padding-bottom: 44px; }
  .flat-spacing-5.pt_0, .flat-spacing-4.pt_0 { padding-top: 0; }

  /* Hero: shorter, text stays clear of the photo. */
  .tf-slideshow .wrap-slider { height: 440px; }
  .tf-slideshow .wrap-slider img { height: 100%; object-fit: cover; object-position: 70% center; }
  .wrap-slider .box-content h1,
  .wrap-slider .box-content .heading { font-size: 34px; line-height: 1.1; }

  /* Footer: comfortable tap targets. */
  .footer .footer-menu_item, .footer .footer-menu-list a { line-height: 2.2; }
  .footer-bottom .text-end { text-align: left !important; margin-top: 10px; }
}

/* ---- Checkout ------------------------------------------------------------ */
/* Labels already say "*" or "(optional)"; the theme's automatic star doubled it. */
.form-checkout label::after { content: none; }
.checkout-nav { margin-bottom: 32px; gap: 12px; }
@media (max-width: 575px) {
  /* City full width, then State + Pincode side by side. */
  .form-checkout .box.grid-3 { grid-template-columns: 1fr 1fr; gap: 14px 12px; }
  .form-checkout .box.grid-3 > :first-child { grid-column: 1 / -1; }
  .checkout-nav .tf-btn { flex: 1; justify-content: center; }
}