/*
 * LuckHelios theme
 * Global visual tokens and frontend overrides.
 */

:root {
    --lh-cream: #fbf7f1;
    --lh-cream-2: #f5eee3;
    --lh-paper: #fffdf9;
    --lh-ink: #2a2521;
    --lh-ink-2: #5c5349;
    --lh-ink-3: #8c8177;
    --lh-line: #eae0d2;
    --lh-line-2: #f1e9dc;
    --lh-gold: #b9862b;
    --lh-gold-light: #d8a94e;
    --lh-glow: #fbe7c6;
    --lh-glow-2: #f7d9a4;
    --lh-dark: #3b332b;
    --lh-dark-2: #4a3e30;
    --lh-radius: 14px;
    --lh-shadow: 0 6px 24px rgba(90, 70, 40, .07);
    --lh-shadow-2: 0 2px 10px rgba(90, 70, 40, .05);

    --front-accent: var(--lh-gold);
    --front-accent-2: #8a5f14;
    --front-ink: var(--lh-ink);
    --front-body: var(--lh-ink-2);
    --front-muted: var(--lh-ink-3);
    --front-line: var(--lh-line-2);
    --front-bg-soft: var(--lh-cream-2);
    --cms-primary: var(--lh-gold);
    --cms-bg: var(--lh-cream);
}

/* Base layout */
body {
    background: var(--lh-cream) !important;
    color: var(--lh-ink) !important;
}

.cms-layout,
.cms-main,
.factory-main,
.product-list-page,
.product-detail-page,
.account-page,
.contact-page,
.content-page,
.insight-page,
.service-page {
    background: var(--lh-cream) !important;
    color: var(--lh-ink) !important;
}

/* 桌面端统一内容宽度：Bootstrap container 在 xl/xxl 档对齐到 1500px */
@media (min-width: 1200px) {
    .container, .container-lg, .container-xl, .container-xxl {
        max-width: 1500px;
    }
}

/* Header and navigation */
.cms-topbar,
.navbar-cms {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line-2) !important;
}

.site-brand-center,
.site-brand-name {
    color: var(--lh-ink) !important;
}

.site-brand-center .text-primary,
.site-brand-mark {
    color: var(--lh-gold) !important;
}

.cms-nav-link {
    color: var(--lh-ink-2) !important;
}

.cms-nav-link:hover,
.cms-nav-link.active {
    color: var(--lh-gold) !important;
    background: var(--lh-glow) !important;
}

.cms-announce {
    background: linear-gradient(90deg, var(--lh-dark), var(--lh-dark-2)) !important;
    color: #f4e7ce !important;
}

/* Buttons and form controls */
.btn-primary {
    background: var(--lh-ink) !important;
    border-color: var(--lh-ink) !important;
    color: #f7ebd6 !important;
}

.btn-primary:hover {
    background: var(--lh-dark-2) !important;
    border-color: var(--lh-dark-2) !important;
}

.btn-outline-primary {
    color: var(--lh-gold) !important;
    border-color: var(--lh-gold) !important;
}

.btn-outline-primary:hover {
    background: var(--lh-gold) !important;
    color: #fff !important;
}

.form-control,
.form-select {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line) !important;
    color: var(--lh-ink) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--lh-gold-light) !important;
    box-shadow: 0 0 0 .2rem rgba(185, 134, 43, .14) !important;
}

/* Cards, tables, tabs and pagination */
.card,
.modal-content {
    border-color: var(--lh-line) !important;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--lh-ink-2);
    --bs-table-border-color: var(--lh-line-2);
}

.table thead th {
    background: var(--lh-cream-2) !important;
    color: var(--lh-ink-2) !important;
}

.category-banner {
    background: linear-gradient(140deg, var(--lh-dark), var(--lh-dark-2)) !important;
}

.category-chip {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line) !important;
    color: var(--lh-ink-2) !important;
}

.category-chip.is-active {
    background: var(--lh-ink) !important;
    border-color: var(--lh-ink) !important;
    color: #f7ebd6 !important;
}

/* Product cards */
.factory-product-card {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line-2) !important;
}

.factory-product-card .product-title {
    color: var(--lh-ink) !important;
}

.factory-product-card .price,
.product-start .product-price,
.product-price,
.product-sku-price {
    color: var(--lh-gold) !important;
}

.product-view-btn {
    background: var(--lh-ink) !important;
    border-radius: 999px !important;
    color: #f7ebd6 !important;
}

.product-sku-item.active {
    background: var(--lh-glow) !important;
    border-color: var(--lh-gold) !important;
}

/* Frontend footer */
.factory-footer {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line-2) !important;
}

.factory-footer-cols {
    display: grid;
    grid-template-columns: 2fr repeat(4, minmax(0, 1fr)) !important;
    gap: 36px !important;
}

.factory-footer-cols .ff-col {
    min-width: 0;
}

.ff-logo,
.ff-title {
    color: var(--lh-ink) !important;
}

.ff-brand-name {
    color: var(--lh-gold) !important;
}

.ff-col a,
.ff-col p {
    color: var(--lh-ink-3) !important;
}

.ff-col a:hover {
    color: var(--lh-gold) !important;
}

.factory-footer-bottom {
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
    padding: 10px 0 20px 0;
    margin: 16px 100px 0 !important;
    text-align: center !important;
}

.factory-footer-bottom .cms-copyright {
    padding: 0 !important;
    text-align: center !important;
}

.pays {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
}

.pays span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 8px !important;
    border: 1px solid var(--lh-line) !important;
    border-radius: 5px !important;
    color: var(--lh-ink-2) !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* Floating actions */
.floating-contact-toggle {
    background: var(--lh-ink) !important;
    color: #f7ebd6 !important;
}

.floating-contact-panel {
    background: var(--lh-paper) !important;
    border-color: var(--lh-line) !important;
}

.scroll-top-btn {
    background: var(--lh-gold) !important;
    color: #fff !important;
}

/* Responsive layout */
@media (max-width: 900px) {
    .factory-footer-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 28px !important;
    }
}

@media (max-width: 700px) {
    .factory-footer-cols {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .factory-footer-bottom {
        display: block !important;
    }

    .factory-footer-bottom .cms-copyright {
        text-align: center !important;
    }

    .pays {
        justify-content: center !important;
        flex-wrap: wrap !important;
        margin-top: 12px !important;
    }
}