/*
 * Fashion storefront theme.
 * Scoped to body.storefront-theme-fashion so merchant dashboard / shared CSS
 * cannot override tenant typography. Uses the same --storefront-* names as
 * grocery and furniture so a future theme editor can drive every family.
 */

body.storefront-theme-fashion {
  --storefront-page-bg: #ffffff;
  --storefront-surface: #ffffff;
  --storefront-surface-soft: #faf8f6;
  --storefront-border: #e8e4e0;

  --storefront-text-heading: #1a1a1a;
  --storefront-text-body: #5c5c5c;
  --storefront-text-muted: #8a8a8a;
  --storefront-text-subtle: #a3a3a3;
  --storefront-text-inverse: #ffffff;

  --storefront-text-link: #1a1a1a;
  --storefront-text-link-hover: var(--color-primary);
  --storefront-text-section-title: #1a1a1a;
  --storefront-text-section-subtitle: #5c5c5c;
  --storefront-text-section-kicker: var(--color-primary);

  --storefront-text-product-title: #222222;
  --storefront-text-product-category: #6f6f6f;
  --storefront-text-product-meta: #8a8a8a;
  --storefront-text-price-current: var(--color-primary);
  --storefront-text-price-previous: #a0a0a0;

  --storefront-action-bg: var(--color-primary);
  --storefront-action-text: #ffffff;
  --storefront-action-hover-bg: var(--color-primary);
  --storefront-focus-ring: rgba(var(--color-primary-rgb), 0.24);

  --storefront-nav-strip-bg: transparent;

  --storefront-category-tile-bg: #ffffff;
  --storefront-category-tile-tint: #faf8f6;
  --storefront-category-tile-accent: #fdc040;

  --color-dark: var(--storefront-text-heading);
  --color-gray-1: var(--storefront-text-muted);
  --color-gray-2: var(--storefront-text-body);
  --border: var(--storefront-border);

  background: var(--storefront-page-bg);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .wrapper,
body.storefront-theme-fashion .main-panel,
body.storefront-theme-fashion .main-panel > .content,
body.storefront-theme-fashion .page-inner {
  background: var(--storefront-page-bg);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .new-product.bg-color .content {
  background: transparent;
}

body.storefront-theme-fashion :is(h1, h2, h3, h4, h5, h6, .title, .title-sm, .title-md, .category-title) {
  color: var(--storefront-text-heading);
}

body.storefront-theme-fashion :is(p, .text, .text-lg, .ratings-total) {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .text-dark:not([style]) {
  color: var(--storefront-text-body) !important;
}

body.storefront-theme-fashion .text-muted:not([style]),
body.storefront-theme-fashion .color-medium:not([style]) {
  color: var(--storefront-text-muted) !important;
}

body.storefront-theme-fashion .text-white:not([style]) {
  color: var(--storefront-text-inverse) !important;
}

body.storefront-theme-fashion .sub-title.color-primary:not([style]) {
  color: var(--storefront-text-section-kicker);
}

body.storefront-theme-fashion :is(a, .nav-link, .menu-link) {
  color: var(--storefront-text-link);
}

body.storefront-theme-fashion :is(a, .nav-link, .menu-link):is(:hover, :focus, .active) {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .header .header-top {
  background: var(--storefront-surface);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .header .header-middle,
body.storefront-theme-fashion .mobile-navbar {
  background: var(--storefront-nav-strip-bg);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .mobile-menu {
  background: var(--storefront-surface);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .header .header-top :is(li, p, a),
body.storefront-theme-fashion .header .header-middle :is(.nav-link, .menu-link) {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .header .header-middle :is(.nav-link, .menu-link):is(:hover, :focus, .active),
body.storefront-theme-fashion .header .header-top a:is(:hover, :focus) {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .menu :is(.setting-dropdown, .cart-dropdown, .submenu, .mega-dropdown, .category-dropdown) {
  background: var(--storefront-surface);
  color: var(--storefront-text-body);
  border-color: var(--storefront-border);
}

body.storefront-theme-fashion :is(
  .j2p-category-section-title,
  .j2p-flash-section-title,
  .j2p-tab-section-title
) {
  color: var(--storefront-text-section-title);
}

body.storefront-theme-fashion .video-banner.video-banner-2 :is(.title, .j2p-video-section-title) {
  color: var(--storefront-text-inverse);
}

body.storefront-theme-fashion :is(
  .j2p-category-section-subtitle,
  .j2p-flash-section-subtitle,
  .j2p-tab-section-subtitle,
  .j2p-video-section-subtitle,
  .j2p-video-section-text
) {
  color: var(--storefront-text-section-subtitle);
}

body.storefront-theme-fashion .home-slider.home-slider-3 .slider-content :is(.title, h1) {
  color: var(--storefront-text-heading);
}

body.storefront-theme-fashion .home-slider.home-slider-3 .slider-content .text-lg {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .home-slider.home-slider-3 .slider-content .product-price > span.h2,
body.storefront-theme-fashion .home-slider.home-slider-3 .slider-content .product-price .h2 {
  color: var(--storefront-text-price-current);
}

body.storefront-theme-fashion .home-slider.home-slider-3 .slider-content .product-price .h3.color-medium {
  color: var(--storefront-text-price-previous) !important;
}

body.storefront-theme-fashion .home-slider .product-thumb .product-title,
body.storefront-theme-fashion .home-slider .product-thumb .product-title a {
  color: var(--storefront-text-product-title);
}

body.storefront-theme-fashion .home-slider .product-thumb .new-price {
  color: var(--storefront-text-price-current);
}

body.storefront-theme-fashion .section-title .title {
  color: var(--storefront-text-section-title);
}

body.storefront-theme-fashion .banner-sm .banner-content,
body.storefront-theme-fashion .banner-sm .content-inner {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .new-product.bg-color {
  background: var(--storefront-surface-soft);
}

body.storefront-theme-fashion .category-3 .category-item {
  background: var(--storefront-surface);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .category-3 .category-item :is(h3, .category-title, .category-title a) {
  color: var(--storefront-text-product-title);
}

body.storefront-theme-fashion .category-3 .category-item a:hover :is(h3, .category-title) {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .category-3 .category-item .color-medium {
  color: var(--storefront-text-product-meta) !important;
}

body.storefront-theme-fashion .product-default,
body.storefront-theme-fashion .product-default-3,
body.storefront-theme-fashion .quick-view-modal .modal-content {
  background: var(--storefront-surface);
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .product-default .product-title,
body.storefront-theme-fashion .product-default .product-title a,
body.storefront-theme-fashion .product-default-3 .product-title,
body.storefront-theme-fashion .product-default-3 .product-title a {
  color: var(--storefront-text-product-title);
}

body.storefront-theme-fashion .product-default:hover .product-title,
body.storefront-theme-fashion .product-default:hover .product-title a,
body.storefront-theme-fashion .product-default-3:hover .product-title,
body.storefront-theme-fashion .product-default-3:hover .product-title a {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .product-default .product-category,
body.storefront-theme-fashion .product-default .product-category a,
body.storefront-theme-fashion .product-default-3 .product-category,
body.storefront-theme-fashion .product-default-3 .product-category a {
  color: var(--storefront-text-product-category);
}

body.storefront-theme-fashion .product-default .product-category a:hover,
body.storefront-theme-fashion .product-default-3 .product-category a:hover {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .product-default .ratings-total,
body.storefront-theme-fashion .product-default-3 .ratings-total {
  color: var(--storefront-text-product-meta);
}

body.storefront-theme-fashion .product-default .product-price .new-price,
body.storefront-theme-fashion .product-default-3 .product-price .new-price {
  color: var(--storefront-text-price-current);
}

body.storefront-theme-fashion .product-default .product-price .old-price,
body.storefront-theme-fashion .product-default-3 .product-price .old-price,
body.storefront-theme-fashion .line_through {
  color: var(--storefront-text-price-previous);
}

body.storefront-theme-fashion .tabs-navigation .nav .nav-link {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .tabs-navigation .nav .nav-link:is(:hover, .active) {
  color: var(--storefront-action-text);
  background: var(--storefront-action-bg);
  border-color: var(--storefront-action-bg);
}

body.storefront-theme-fashion .btn-primary {
  color: var(--storefront-action-text);
  background-color: var(--storefront-action-bg);
  border-color: var(--storefront-action-bg);
}

body.storefront-theme-fashion .btn-primary:is(:hover, :focus, :active) {
  color: var(--storefront-action-text);
  background-color: var(--storefront-action-hover-bg);
  border-color: var(--storefront-action-hover-bg);
  box-shadow: 0 0 0 0.2rem var(--storefront-focus-ring);
}

body.storefront-theme-fashion .btn-icon {
  color: var(--storefront-text-link);
}

body.storefront-theme-fashion .btn-icon:is(:hover, :focus, .active) {
  color: var(--storefront-action-text);
  background-color: var(--storefront-action-bg);
}

body.storefront-theme-fashion .product-countdown .count {
  color: var(--storefront-text-heading);
  border-color: var(--storefront-border);
  background: var(--storefront-surface-soft);
}

body.storefront-theme-fashion .product-countdown .count-period {
  color: var(--storefront-text-muted);
}

body.storefront-theme-fashion .featured.featured-2 .featured-item .content h5:not([style]) {
  color: var(--storefront-text-heading);
}

body.storefront-theme-fashion .featured.featured-2 .featured-item .content p.text-sm:not([style]) {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .footer-area,
body.storefront-theme-fashion .footer-fashion,
body.storefront-theme-fashion .copy-right-area {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .footer-area .footer-widget :is(h3, .title),
body.storefront-theme-fashion .footer-area .footer-widget .j2p-footer-links-title,
body.storefront-theme-fashion .footer-area .footer-widget .j2p-footer-subscriber-title {
  color: var(--storefront-text-heading);
}

body.storefront-theme-fashion .footer-area .footer-widget :is(p, li, span):not(.social-link span),
body.storefront-theme-fashion .footer-area .footer-widget a,
body.storefront-theme-fashion .copy-right-content,
body.storefront-theme-fashion .copy-right-content a,
body.storefront-theme-fashion .show-more-footer {
  color: var(--storefront-text-body);
}

body.storefront-theme-fashion .footer-area .footer-widget a:hover,
body.storefront-theme-fashion .copy-right-content a:hover,
body.storefront-theme-fashion .show-more-footer:hover {
  color: var(--storefront-text-link-hover);
}

body.storefront-theme-fashion .skeleton {
  --skeleton-base: #f0eeeb;
  --skeleton-highlight: #faf9f7;
}

/* Flash sale — keep original layout; only fix Slick stacking that hid the slider frame / pill shapes. */
body.storefront-theme-fashion .new-product.bg-color .product-slider {
  isolation: isolate;
}

body.storefront-theme-fashion .new-product.bg-color .product-slider::before,
body.storefront-theme-fashion .new-product.bg-color .product-slider::after {
  z-index: 0;
}

body.storefront-theme-fashion .new-product.bg-color .product-slider :is(.slick-list, .slick-track) {
  position: relative;
  z-index: 1;
}

body.storefront-theme-fashion .new-product.bg-color .product-default-3 .product-img {
  overflow: visible;
}