/* Ramki Cards — Product-card typography (Assistant / Regular 400)
   2026-10-21 v7. Presentation only; preserve v6 image framing, hover actions,
   gallery arrows, carousels, content dimensions, labels and all site-wide fonts.
   Loaded after existing storefront themes (and after v6 homepage card CSS).
*/

/* Homepage product cards: title, selling price, struck-through price,
   sale badge, and enquiry label all use the chosen reference font. */
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy,
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a,
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price,
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price del,
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-media > button.rc-enquire,
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-media > .rc-product-sale {
  font-family: 'Assistant', sans-serif !important;
  font-weight: 400 !important;
}

/* Product listing, related-product and favourites cards. Typography only;
   neither image wrappers nor icon buttons are changed. */
html body:not(.admin-body) main article.product-card,
html body:not(.admin-body) main article.product-card .product-body,
html body:not(.admin-body) main article.product-card .product-body h3,
html body:not(.admin-body) main article.product-card .product-body .price,
html body:not(.admin-body) main article.product-card .product-body .price-old,
html body:not(.admin-body) main article.product-card .product-body .moq-note,
html body:not(.admin-body) main article.product-card .product-actions .product-action-btn,
html body:not(.admin-body) main article.product-card .badge,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price-old {
  font-family: 'Assistant', sans-serif !important;
  font-weight: 400 !important;
}

/* Retain the project's dedicated Tamil glyph rendering. */
html body:not(.admin-body) article.product-card [lang="ta"],
html body main.rc-new#main-content article.rc-product [lang="ta"] {
  font-family: 'Noto Sans Tamil', sans-serif !important;
}


/* v8 | Slightly larger, King-of-Cards-style product text.
   Scoped to product cards only. Keep Assistant 400; do not affect
   photo framing, card widths, controls, spacing or global typography. */
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a {
  font-family: 'Assistant', sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price {
  font-family: 'Assistant', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price del {
  font-size: 14px !important;
  font-weight: 400 !important;
}

/* Match the same readable type scale on catalogue/related product cards. */
html body:not(.admin-body) main article.product-card .product-body h3,
html body:not(.admin-body) main article.product-card .product-body .product-name-english {
  font-family: 'Assistant', sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
html body:not(.admin-body) main article.product-card .product-body .price {
  font-family: 'Assistant', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
}
html body:not(.admin-body) main article.product-card .product-body .price-old,
html body:not(.admin-body) main article.product-card .product-body .price del {
  font-size: 14px !important;
  font-weight: 400 !important;
}

@media (min-width: 701px) and (max-width: 950px) {
  html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a,
  html body:not(.admin-body) main article.product-card .product-body h3,
  html body:not(.admin-body) main article.product-card .product-body .product-name-english {
    font-size: 16px !important;
  }
}
@media (max-width: 700px) {
  html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a,
  html body:not(.admin-body) main article.product-card .product-body h3,
  html body:not(.admin-body) main article.product-card .product-body .product-name-english {
    font-size: 15px !important;
  }
  html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price,
  html body:not(.admin-body) main article.product-card .product-body .price {
    font-size: 14px !important;
  }
  html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price del,
  html body:not(.admin-body) main article.product-card .product-body .price-old,
  html body:not(.admin-body) main article.product-card .product-body .price del {
    font-size: 12px !important;
  }
}


/* More specific than the legacy royal-catalogue theme's 14px !important
   shorthand, so the v8 sizes apply to actual catalogue cards too. */
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {
  font-family: 'Assistant', sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body .price {
  font-family: 'Assistant', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price-old,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body .price-old {
  font-family: 'Assistant', sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}
@media (min-width: 701px) and (max-width: 950px) {
  html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
  html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {font-size:16px!important;}
}
@media (max-width: 700px) {
  html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
  html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {font-size:15px!important;}
  html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price,
  html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body .price {font-size:14px!important;}
  html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price-old,
  html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body .price-old {font-size:12px!important;}
}


/* v9 — King of Cards reference product-title typography.
   Exact requested computed title: 16px / 700 / 1.3.
   Applies only to product names on all storefront product cards and viewports.
   Keeps Assistant 400 for prices and other UI; no changes to images,
   card dimensions, grid, gallery arrows, wishlist or enquiry interactions. */
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a,
html body:not(.admin-body) main article.product-card .product-body h3,
html body:not(.admin-body) main article.product-card .product-body h3 > a,
html body:not(.admin-body) main article.product-card .product-body .product-name-english,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {
  font-family: 'Assistant', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}


/* v10 | Product title subtly larger, with selling price immediately below.
   Avoid earlier reserved two-line title heights: they created a large gap for
   one-line titles. Keep the two-line clamp for long titles. Typography-only
   update; image crop, gallery, badges, wishlist, enquiry and carousel untouched. */
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  min-height: 0 !important;
  max-height: 2.6em !important;
  margin: 0 0 4px !important;
}
html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > .rc-product-price {
  margin: 0 !important;
  padding: 0 !important;
}

/* Other storefront product cards use h3 and .price, with a legacy 41px
   minimum-height on headings and a 9px top price margin. Remove that gap. */
html body:not(.admin-body) main article.product-card .product-body h3,
html body:not(.admin-body) main article.product-card .product-body h3 > a,
html body:not(.admin-body) main article.product-card .product-body .product-name-english,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {
  font-family: 'Assistant', sans-serif !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  min-height: 0 !important;
  margin-bottom: 4px !important;
}
html body:not(.admin-body) main article.product-card .product-body .price,
html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body .price,
html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body .price {
  margin-top: 0 !important;
}
@media (max-width: 700px) {
  html body main.rc-new#main-content .rc-scroll-shell > .rc-scroll-track > article.rc-product > .rc-product-copy > a,
  html body:not(.admin-body) main article.product-card .product-body h3,
  html body:not(.admin-body) main article.product-card .product-body h3 > a,
  html body:not(.admin-body) main article.product-card .product-body .product-name-english,
  html body:not(.admin-body) main.rk-royal-catalogue .catalog-products article.product-card.rk-landing-product .product-body h3,
  html body:not(.admin-body) main.product-marketplace-page .catalog-products article.product-card .product-body h3 {
    font-size: 16px !important;
  }
}
