/* Additional theme styles for WordPress-specific components
 * (header scroll state, mobile-menu panel animation, WooCommerce overrides).
 * The main Tailwind + custom Lumme rules come from lumme-compiled.css. */

/* --- Header scroll state (JS toggles .is-scrolled) --- */
.lumme-header { background: transparent; }
.lumme-header.is-scrolled {
    background: rgba(25, 25, 25, 0.72);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* --- Mobile menu panel (JS toggles .is-open) --- */
.lumme-mobile-panel {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 500ms ease, opacity 500ms ease;
}
.lumme-mobile-panel.is-open {
    max-height: 620px;
    opacity: 1;
}

/* Nav lists reset (they use ul/li) */
.lumme-nav-item { list-style: none; }
.lumme-footer-menu li { list-style: none; }
.lumme-footer-menu a {
    display: inline-block;
    color: rgba(242, 242, 242, 0.75);
    font-family: "Spectral", serif;
    font-weight: 300;
    transition: color 320ms ease;
}
.lumme-footer-menu a:hover { color: var(--lumme-cream); }

/* --- WooCommerce styling --- */
.lumme-woo,
.lumme-woo-page {
    color: var(--lumme-paper);
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: rgba(42, 41, 41, 0.55);
    border: 1px solid rgba(207, 198, 178, 0.12);
    padding: 20px;
    border-radius: 6px;
    transition: all 500ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.woocommerce ul.products li.product:hover {
    border-color: rgba(243, 240, 226, 0.35);
    transform: translateY(-2px);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: "Forum", serif;
    color: var(--lumme-cream) !important;
    font-size: 1.35rem !important;
    padding: 12px 0 6px !important;
}
.woocommerce ul.products li.product .price {
    color: var(--lumme-taupe) !important;
    font-family: "Spectral", serif;
    font-weight: 300;
}
.woocommerce div.product .product_title {
    font-family: "Forum", serif;
    color: var(--lumme-cream);
    font-size: 3rem;
    line-height: 1;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--lumme-taupe) !important;
    font-family: "Forum", serif;
    font-size: 1.75rem;
}
.woocommerce div.product .woocommerce-tabs .tabs {
    border-bottom: 1px solid rgba(207, 198, 178, 0.15);
}
.woocommerce div.product .woocommerce-tabs .tabs li.active a {
    color: var(--lumme-cream) !important;
}
.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
    background: transparent;
    color: var(--lumme-paper);
    border: 1px solid rgba(207, 198, 178, 0.15);
}
.woocommerce table.shop_table th {
    color: var(--lumme-taupe) !important;
    font-family: "Roboto Serif", serif;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.72rem;
}
.woocommerce .cart-collaterals .cart_totals h2,
.woocommerce-checkout #order_review_heading,
.woocommerce h2,
.woocommerce h3 {
    font-family: "Forum", serif;
    color: var(--lumme-cream);
}
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background: var(--lumme-cream) !important;
    color: var(--lumme-ink) !important;
    border: 0 !important;
    border-radius: 999px !important;
    padding: 12px 22px !important;
    font-family: "Roboto Serif", serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.22em !important;
    font-size: 0.75rem !important;
    transition: transform 350ms ease, box-shadow 350ms ease !important;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 30px -10px rgba(243, 240, 226, 0.35) !important;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.select2-container--default .select2-selection--single {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(207, 198, 178, 0.35) !important;
    border-radius: 0 !important;
    color: var(--lumme-paper) !important;
    padding: 12px 2px !important;
    font-family: "Spectral", serif !important;
}
.woocommerce form .form-row label {
    color: var(--lumme-taupe) !important;
    font-family: "Roboto Serif", serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.22em !important;
    font-size: 0.72rem !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    color: var(--lumme-paper);
    background: transparent;
    border: 1px solid rgba(207, 198, 178, 0.2);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--lumme-cream);
    color: var(--lumme-ink);
}
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
    background: rgba(42, 41, 41, 0.7) !important;
    color: var(--lumme-paper) !important;
    border-top: 3px solid var(--lumme-taupe) !important;
}
.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid rgba(207, 198, 178, 0.15);
    font-family: "Roboto Serif", serif;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.72rem;
    color: var(--lumme-paper);
}
.woocommerce-MyAccount-navigation li.is-active a {
    color: var(--lumme-cream);
}

/* Comments */
.comments-area { color: var(--lumme-paper); }
.comment-list, .children { list-style: none; padding: 0; margin: 0; }
.comment-body {
    background: rgba(42, 41, 41, 0.55);
    border: 1px solid rgba(207, 198, 178, 0.12);
    padding: 20px;
    margin-bottom: 16px;
    border-radius: 6px;
}
.comment-form input, .comment-form textarea {
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(207, 198, 178, 0.35);
    color: var(--lumme-paper);
    padding: 12px 2px;
    width: 100%;
    font-family: "Spectral", serif;
}
.comment-form .submit {
    background: var(--lumme-cream);
    color: var(--lumme-ink);
    border: 0;
    border-radius: 999px;
    padding: 12px 22px;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.75rem;
    cursor: pointer;
}

/* Screen reader */
.screen-reader-text {
    border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
    height: 1px; margin: -1px; overflow: hidden; padding: 0;
    position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* WP block alignment */
.alignwide { max-width: 1200px; margin-left: auto; margin-right: auto; }
.alignfull { width: 100vw; margin-left: calc(50% - 50vw); }

/* Gutenberg base */
.wp-block-image img { max-width: 100%; height: auto; }

/* Editor palette classes (matching add_theme_support('editor-color-palette')) */
.has-ink-color        { color: #191919; }
.has-ink-2-color      { color: #2a2929; }
.has-cream-color      { color: #f3f0e2; }
.has-taupe-color      { color: #cfc6b2; }
.has-paper-color      { color: #f2f2f2; }
.has-ink-background-color    { background-color: #191919; }
.has-ink-2-background-color  { background-color: #2a2929; }
.has-cream-background-color  { background-color: #f3f0e2; }
.has-taupe-background-color  { background-color: #cfc6b2; }
.has-paper-background-color  { background-color: #f2f2f2; }

/* Nav-menu <ul> reset (WP adds classes we don't need) */
.menu, .lumme-mobile-nav, .lumme-footer-menu { list-style: none; margin: 0; padding: 0; }
