/**
 * SwissFans 3.0 — Shop / Marketplace UI
 * Flag: shop_ui_v2 (+ ui_v2)
 * UI only. Preserve legacy IDs, data-*, forms, AJAX hooks (#moreType, cats).
 */
body.sf-shop-v2 {
  --sf-v2-bg: #0e071a;
  --sf-v2-card: #181025;
  --sf-v2-card-soft: #1d142c;
  --sf-v2-line: rgba(255, 255, 255, 0.08);
  --sf-v2-border: rgba(225, 34, 146, 0.2);
  --sf-v2-text: #ffffff;
  --sf-v2-muted: #c4b8d4;
  --sf-v2-pink: #e12292;
  --sf-v2-radius: 18px;
  --sf-v2-shadow: 0 12px 32px rgba(8, 2, 18, 0.42);
  background-color: var(--sf-v2-bg);
  background-image:
    radial-gradient(ellipse 90% 50% at 50% -10%, rgba(225, 34, 146, 0.2), transparent 62%),
    linear-gradient(180deg, #150a24 0%, #0e071a 48%, #0b0614 100%);
  background-repeat: no-repeat;
  background-size: 100% auto;
  color: var(--sf-v2-text);
}

body.sf-shop-v2 .wrapper.shop_menu_wrapper,
body.sf-shop-v2 .shop_main_wrapper,
body.sf-shop-v2 .shop_main_wrapper_container {
  background: transparent !important;
  color: var(--sf-v2-text);
}

body.sf-shop-v2 .wrapper.shop_menu_wrapper {
  max-width: 1480px !important;
  width: min(100%, 1480px) !important;
  margin-inline: auto !important;
  padding: 0.55rem 1.5rem 2.75rem !important;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
  gap: 1.15rem;
  align-items: start;
}

body.sf-shop-v2 .header + .wrapper.shop_menu_wrapper,
body.sf-shop-v2 .wrapper.shop_menu_wrapper {
  margin-top: 0.35rem !important;
}

@media (max-width: 900px) {
  body.sf-shop-v2 .wrapper.shop_menu_wrapper {
    grid-template-columns: 1fr;
  }
}

body.sf-shop-v2 .shopping_left_menu,
body.sf-shop-v2 .i_shopping_menu_wrapper {
  background: var(--sf-v2-card) !important;
  border: 1px solid var(--sf-v2-border) !important;
  border-radius: var(--sf-v2-radius) !important;
  box-shadow: var(--sf-v2-shadow);
  padding: 0.75rem;
  color: var(--sf-v2-text) !important;
}

body.sf-shop-v2 .i_shop_title,
body.sf-shop-v2 .product_category_title {
  color: var(--sf-v2-text) !important;
  font-weight: 750;
  letter-spacing: -0.02em;
  margin-bottom: 0.85rem;
  background: var(--sf-v2-card) !important;
  border: 1px solid var(--sf-v2-line) !important;
  border-radius: 14px !important;
  padding: 0.85rem 1rem !important;
  box-shadow: var(--sf-v2-shadow);
}

body.sf-shop-v2 .i_sp_menu_box {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 42px;
  margin: 0.2rem 0;
  padding: 0.55rem 0.7rem !important;
  border-radius: 12px !important;
  color: var(--sf-v2-muted) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
}

body.sf-shop-v2 .i_sp_menu_box.active_p,
body.sf-shop-v2 .i_sp_menu_box:hover {
  background: rgba(225, 34, 146, 0.12) !important;
  color: var(--sf-v2-text) !important;
  border-color: rgba(225, 34, 146, 0.2) !important;
}

body.sf-shop-v2 .product_wrapper,
body.sf-shop-v2 .product_detail_container,
body.sf-shop-v2 .settings_box_container {
  color: var(--sf-v2-text);
}

body.sf-shop-v2 .product_card,
body.sf-shop-v2 .i_product_box,
body.sf-shop-v2 .product_item,
body.sf-shop-v2 .s_p_product_container,
body.sf-shop-v2 .s_p_product_wrapper {
  background: var(--sf-v2-card-soft) !important;
  border: 1px solid var(--sf-v2-line) !important;
  border-radius: var(--sf-v2-radius) !important;
  box-shadow: var(--sf-v2-shadow);
  overflow: hidden;
  color: var(--sf-v2-text) !important;
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 220ms ease, border-color 220ms ease;
}

body.sf-shop-v2 .s_p_product_container {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  margin: 0 !important;
}

body.sf-shop-v2 .product_card:hover,
body.sf-shop-v2 .i_product_box:hover,
body.sf-shop-v2 .product_item:hover,
body.sf-shop-v2 .s_p_product_container:hover {
  transform: translateY(-3px);
  border-color: rgba(225, 34, 146, 0.35) !important;
  box-shadow: 0 18px 40px rgba(8, 2, 18, 0.5);
}

body.sf-shop-v2 .product_card img,
body.sf-shop-v2 .product_image img,
body.sf-shop-v2 .s_p_product_container img,
body.sf-shop-v2 .product_image .timp {
  object-fit: cover !important;
  width: 100% !important;
  height: 190px !important;
  display: block;
}

body.sf-shop-v2 .s_p_details {
  background: linear-gradient(180deg, rgba(29, 20, 44, 0.96), #181025) !important;
  border-top: 1px solid var(--sf-v2-line) !important;
  padding: 0.85rem 0.9rem 1rem !important;
  color: var(--sf-v2-text) !important;
}

body.sf-shop-v2 .s_p_title,
body.sf-shop-v2 .s_p_title a {
  color: var(--sf-v2-text) !important;
  font-weight: 650;
  font-size: 0.92rem;
  letter-spacing: -0.01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.sf-shop-v2 .s_p_product_type {
  color: var(--sf-v2-muted) !important;
  font-size: 0.78rem !important;
  margin-top: 0.25rem;
}

body.sf-shop-v2 .ishopping_wrapper_in {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap: 1rem !important;
  align-items: stretch;
  flex-wrap: unset !important;
}

body.sf-shop-v2 .buyProduct,
body.sf-shop-v2 .addToCart,
body.sf-shop-v2 .purchaseProduct {
  background: linear-gradient(180deg, #f02aa6, #d91b87) !important;
  color: #fff !important;
  border-radius: 999px !important;
  min-height: 44px;
  border: none !important;
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(225, 34, 146, 0.35);
}

body.sf-shop-v2 .product_price,
body.sf-shop-v2 .s_p_price {
  color: #ff8fd0 !important;
  font-weight: 750 !important;
  font-size: 1.05rem !important;
  margin-top: 0.45rem;
  background: transparent !important;
}

body.sf-shop-v2 input,
body.sf-shop-v2 select,
body.sf-shop-v2 textarea {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--sf-v2-line);
  color: var(--sf-v2-text);
  border-radius: 12px;
  min-height: 44px;
}

@media (max-width: 640px) {
  body.sf-shop-v2 .ishopping_wrapper_in {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

/* ─── Product detail page (themes/default/layouts/product.php) ───
   The base stylesheet's .h_product_title etc. were authored for a light
   theme (#65676b on white); on the dark sf-shop-v2 background that reads as
   pale, low-contrast, "unfinished skeleton" text. Bring these in line with
   the same white/muted palette already used for the listing cards above. */
body.sf-shop-v2 .h_product_title {
  color: var(--sf-v2-text) !important;
}

body.sf-shop-v2 .s_p_owner_cont,
body.sf-shop-v2 .i_unm_product,
body.sf-shop-v2 .product__description,
body.sf-shop-v2 .owner_not_text,
body.sf-shop-v2 .s__p,
body.sf-shop-v2 .s_p_live_not,
body.sf-shop-v2 .s_p_p_before,
body.sf-shop-v2 .s_social {
  color: var(--sf-v2-text) !important;
}

body.sf-shop-v2 .product__d_all,
body.sf-shop-v2 .product_details_right_in .s_p_product_type {
  color: var(--sf-v2-muted) !important;
}

body.sf-shop-v2 .s_p_live_not,
body.sf-shop-v2 .s_p_p_download {
  background: var(--sf-v2-card-soft) !important;
  border: 1px solid var(--sf-v2-line) !important;
  border-radius: 12px !important;
}

/* Buy button on the product detail page — align to the exact brand accent
   gradient used elsewhere in the v2 UI (was a slightly-off #c31d8e/#a224a1). */
body.sf-shop-v2 .buy__myproduct {
  background: linear-gradient(135deg, #e91e8c, #8b2fc9) !important;
}

@media (prefers-reduced-motion: reduce) {
  body.sf-shop-v2 *,
  body.sf-shop-v2 *::before,
  body.sf-shop-v2 *::after {
    transition: none !important;
    animation: none !important;
  }
}