/*
Theme Name: AI Shop FND Style
Theme URI: https://aishop.hydrolb.com
Description: FND dual-skin (light/dark toggle) — storefy/intrade visual prototype
Author: FND Tech
Version: 1.0.0
Template: storefront
Text Domain: aishop-fnd
*/

/* ============================================
   CSS Variables — Light (default) / Dark
   ============================================ */

/* === LIGHT (default) === */
html[data-theme="light"], html:not([data-theme]) {
    --fnd-orange: #EB6100;
    --fnd-orange-dark: #C75300;
    --fnd-orange-light: #FF8533;
    --fnd-blue: #0085D0;
    --fnd-blue-dark: #006BA8;
    --fnd-blue-light: #33A3DC;

    --bg-body: #F7F8FA;
    --bg-card: #FFFFFF;
    --bg-card-hover: #FFFFFF;
    --bg-header: #FFFFFF;
    --bg-footer: #1A1F2E;
    --bg-input: #FFFFFF;

    --text-primary: #1A1F2E;
    --text-secondary: #555D6B;
    --text-dim: #8B949E;
    --text-on-header: #1A1F2E;
    --text-on-footer: #E8F0FF;
    --text-link: #0085D0;
    --text-link-hover: #EB6100;

    --border-color: #E2E5EA;
    --border-card: #E2E5EA;
    --shadow-card: 0 2px 8px rgba(0,0,0,0.06);
    --shadow-card-hover: 0 6px 20px rgba(235,97,0,0.12);

    --btn-primary-bg: #EB6100;
    --btn-primary-text: #FFFFFF;
    --btn-primary-hover: #C75300;

    --price-color: #EB6100;
    --badge-bg: #EB6100;
    --badge-text: #FFFFFF;

    --header-border: 2px solid #EB6100;
    --toggle-bg: #E2E5EA;

    color-scheme: light;
}

/* === DARK === */
html[data-theme="dark"] {
    --fnd-orange: #EB6100;
    --fnd-orange-dark: #C75300;
    --fnd-orange-light: #FF8533;
    --fnd-blue: #0085D0;
    --fnd-blue-dark: #006BA8;
    --fnd-blue-light: #5BB8E8;

    --bg-body: #0B1120;
    --bg-card: #131B2E;
    --bg-card-hover: #1A2440;
    --bg-header: #0D1525;
    --bg-footer: #080E1A;
    --bg-input: #131B2E;

    --text-primary: #E8F0FF;
    --text-secondary: #A8B4C4;
    --text-dim: #6B7A8D;
    --text-on-header: #E8F0FF;
    --text-on-footer: #E8F0FF;
    --text-link: #5BB8E8;
    --text-link-hover: #FF8533;

    --border-color: #1E2A3E;
    --border-card: #1E2A3E;
    --shadow-card: 0 2px 8px rgba(0,0,0,0.3);
    --shadow-card-hover: 0 6px 24px rgba(235,97,0,0.2);

    --btn-primary-bg: #EB6100;
    --btn-primary-text: #FFFFFF;
    --btn-primary-hover: #FF8533;

    --price-color: #FF8533;
    --badge-bg: #EB6100;
    --badge-text: #FFFFFF;

    --header-border: 2px solid #EB6100;
    --toggle-bg: #1E2A3E;

    color-scheme: dark;
}


/* ============================================
   Global Reset & Base
   ============================================ */

body,
.site {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}

body, p, span, div, td, th, li, a, button, input, textarea, select {
    font-family: 'Noto Sans SC', 'PingFang SC', system-ui, -apple-system, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.page-title,
.product_title,
.woocommerce-loop-product__title,
.entry-title {
    font-family: 'Orbitron', 'Noto Sans SC', sans-serif !important;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--text-primary) !important;
}

code, pre, .sku {
    font-family: 'JetBrains Mono', 'Courier New', monospace !important;
}

/* ============================================
   Header
   ============================================ */

.site-header,
#masthead {
    background-color: var(--bg-header) !important;
    border-bottom: var(--header-border) !important;
}

.site-branding h1 a,
.site-branding p,
.site-title a,
.site-description {
    color: var(--text-on-header) !important;
}

.main-navigation a,
.main-navigation ul li a,
.site-header-cart a,
.site-header-cart .count {
    color: var(--text-on-header) !important;
}
.main-navigation a:hover,
.site-header-cart a:hover {
    color: var(--fnd-orange) !important;
}

/* ============================================
   Links
   ============================================ */

a {
    color: var(--text-link) !important;
    transition: color 0.2s ease;
}
a:hover {
    color: var(--text-link-hover) !important;
}
/* Don't override button link colors */
a.button,
.woocommerce a.button,
a.added_to_cart,
.button a {
    color: var(--btn-primary-text) !important;
}

/* ============================================
   Buttons
   ============================================ */

.button,
button[type="submit"],
input[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
a.added_to_cart {
    background-color: var(--btn-primary-bg) !important;
    color: var(--btn-primary-text) !important;
    border-color: var(--btn-primary-bg) !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    text-shadow: none !important;
    transition: all 0.2s ease !important;
}
.button:hover,
button[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce button.button.alt:hover,
a.added_to_cart:hover {
    background-color: var(--btn-primary-hover) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(235, 97, 0, 0.3) !important;
}

/* ============================================
   Prices
   ============================================ */

.price,
.woocommerce-Price-amount,
.amount,
ins .woocommerce-Price-amount {
    color: var(--price-color) !important;
    font-family: 'JetBrains Mono', 'Noto Sans SC', monospace !important;
    font-weight: 700 !important;
}
del .woocommerce-Price-amount {
    color: var(--text-dim) !important;
    font-weight: 400 !important;
}

/* ============================================
   Product Cards (Shop / Archive)
   ============================================ */

.products li.product,
ul.products li.product {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-card) !important;
    border-radius: 10px !important;
    padding: 16px !important;
    box-shadow: var(--shadow-card);
    transition: all 0.25s ease !important;
}
.products li.product:hover {
    border-color: var(--fnd-orange) !important;
    box-shadow: var(--shadow-card-hover) !important;
    transform: translateY(-3px);
    background: var(--bg-card-hover) !important;
}

.products li.product .woocommerce-loop-product__title,
.products li.product h2 {
    color: var(--text-primary) !important;
    font-family: 'Noto Sans SC', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

/* Product images — breathing room on dark bg */
.products li.product img,
.woocommerce-product-gallery img {
    border-radius: 8px;
    background: var(--bg-card) !important;
}

/* On-sale badge */
.onsale {
    background: var(--badge-bg) !important;
    color: var(--badge-text) !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
}

/* Star ratings */
.star-rating span::before {
    color: var(--fnd-orange) !important;
}

/* ============================================
   Single Product Page
   ============================================ */

.single-product div.product {
    color: var(--text-primary) !important;
}
.single-product .product_title {
    color: var(--text-primary) !important;
    font-size: 28px !important;
}
.single-product .woocommerce-product-details__short-description,
.single-product .product_meta {
    color: var(--text-secondary) !important;
}
.woocommerce-tabs ul.tabs li {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}
.woocommerce-tabs ul.tabs li.active {
    border-bottom-color: var(--bg-body) !important;
}
.woocommerce-tabs ul.tabs li a {
    color: var(--text-secondary) !important;
}
.woocommerce-tabs ul.tabs li.active a {
    color: var(--fnd-orange) !important;
}
.woocommerce-Tabs-panel {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Quantity input */
.quantity input[type="number"] {
    background: var(--bg-input) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* ============================================
   Cart & Checkout
   ============================================ */

.woocommerce table.cart,
.woocommerce-cart table.cart {
    background: var(--bg-card) !important;
}
.woocommerce table.cart td,
.woocommerce table.cart th {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
.cart_totals,
.woocommerce-checkout #payment {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    border-radius: 8px !important;
}
.cart_totals h2,
.woocommerce-checkout h3 {
    color: var(--text-primary) !important;
}
/* Checkout form fields */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
    background: var(--bg-input) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
.woocommerce form .form-row label {
    color: var(--text-secondary) !important;
}

/* ============================================
   Sidebar & Widgets
   ============================================ */

.widget {
    background: var(--bg-card) !important;
    border-radius: 8px !important;
    padding: 16px !important;
    border: 1px solid var(--border-color) !important;
    margin-bottom: 16px !important;
}
.widget-title,
.widget h2 {
    color: var(--text-primary) !important;
    border-bottom: 2px solid var(--fnd-orange) !important;
    padding-bottom: 8px !important;
}
.widget a {
    color: var(--text-link) !important;
}
.widget_price_filter .price_slider_wrapper .ui-widget-content {
    background: var(--border-color) !important;
}
.widget_price_filter .ui-slider .ui-slider-range,
.widget_price_filter .ui-slider .ui-slider-handle {
    background: var(--fnd-orange) !important;
}

/* ============================================
   Footer
   ============================================ */

.site-footer {
    background: var(--bg-footer) !important;
    color: var(--text-on-footer) !important;
}
.site-footer a {
    color: var(--fnd-blue-light) !important;
}
.site-footer a:hover {
    color: var(--fnd-orange) !important;
}
/* Hide WP/WooCommerce credit */
.site-info,
.footer-credits,
a[href*="wordpress.org"],
a[href*="woocommerce.com"],
.powered-by-wp,
.storefront-handheld-footer-bar .site-info,
.site-credit,
#wp-admin-bar-wp-logo {
    display: none !important;
}
.site-footer .site-info {
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* ============================================
   Breadcrumbs & Pagination
   ============================================ */

.woocommerce-breadcrumb {
    color: var(--text-dim) !important;
}
.woocommerce-breadcrumb a {
    color: var(--text-link) !important;
}
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
    background: var(--bg-card) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}
.woocommerce-pagination ul li span.current {
    background: var(--fnd-orange) !important;
    color: #fff !important;
    border-color: var(--fnd-orange) !important;
}

/* ============================================
   Messages & Notices
   ============================================ */

.woocommerce-message,
.woocommerce-info {
    border-top-color: var(--fnd-orange) !important;
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
}
.woocommerce-message::before {
    color: var(--fnd-orange) !important;
}
.woocommerce-error {
    border-top-color: #e74c3c !important;
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
}

/* ============================================
   Search
   ============================================ */

.site-search input[type="search"],
.widget_product_search input[type="search"],
input[type="search"] {
    background: var(--bg-input) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* ============================================
   Dokan Store Pages
   ============================================ */

.dokan-store-wrap {
    color: var(--text-primary) !important;
}
.dokan-store-header {
    background: linear-gradient(135deg, var(--fnd-orange) 0%, var(--fnd-blue) 100%) !important;
}
.dokan-store-tabs {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}
.dokan-store-tabs li a {
    color: var(--text-secondary) !important;
}
.dokan-store-tabs li.active a,
.dokan-store-tabs li.current a {
    color: var(--fnd-orange) !important;
    border-bottom-color: var(--fnd-orange) !important;
}

/* ============================================
   Theme Toggle Button
   ============================================ */

#fnd-theme-toggle {
    position: fixed;
    top: 80px;
    right: 20px;
    z-index: 99999;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px solid var(--fnd-orange);
    background: var(--bg-card);
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
#fnd-theme-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 20px rgba(235, 97, 0, 0.3);
}

/* ============================================
   Storefront handheld footer bar
   ============================================ */

.storefront-handheld-footer-bar {
    background: var(--bg-header) !important;
    border-top: 1px solid var(--border-color) !important;
}
.storefront-handheld-footer-bar ul li a {
    color: var(--text-primary) !important;
}

/* Mini-cart widget */
.widget_shopping_cart {
    background: var(--bg-card) !important;
}
.widget_shopping_cart .total {
    border-top-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* ============================================
   Content pages
   ============================================ */

.hentry,
.type-page,
.type-post {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}

.entry-content {
    color: var(--text-primary) !important;
}
.entry-content p,
.entry-content li {
    color: var(--text-secondary) !important;
}

/* Result count & ordering */
.woocommerce-result-count,
.woocommerce-ordering select {
    color: var(--text-secondary) !important;
    background: var(--bg-input) !important;
    border-color: var(--border-color) !important;
}