/*
 * Solis - shared components.
 *
 * Owns the pieces every theme has in common (slider, mode toggle,
 * category tiles, WooCommerce and Otto AI Chat styling). Everything is
 * written against the --solis-* tokens each theme defines for light and
 * dark mode, so nothing here needs a dark-mode override of its own
 * except where third-party CSS hard-codes colours.
 */

/* ---------- Token fallbacks (themes override all of these) ---------- */
:root {
    --solis-bg: #ffffff;
    --solis-surface: #ffffff;
    --solis-surface-2: #f4f4f5;
    --solis-text: #18181b;
    --solis-muted: #63636b;
    --solis-border: #e4e4e7;
    --solis-accent: #2563eb;
    --solis-on-accent: #ffffff;
    --solis-accent-soft: rgba(37, 99, 235, .12);
    --solis-chat: #2563eb;
    --solis-sale: #dc2626;
    --solis-radius: 10px;
    --solis-radius-lg: 18px;
    --solis-btn-radius: var(--solis-radius);
    --solis-shadow: 0 10px 30px rgba(0, 0, 0, .08);
    --solis-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --solis-font-head: var(--solis-font-body);
    --solis-container: 1240px;
    --solis-gutter: clamp(16px, 4vw, 32px);
    --solis-tone-1: linear-gradient(135deg, #e0e7ff, #f5f3ff);
    --solis-tone-2: linear-gradient(135deg, #dcfce7, #ecfeff);
    --solis-tone-3: linear-gradient(135deg, #fee2e2, #fff7ed);
    --solis-tone-4: linear-gradient(135deg, #f1f5f9, #e2e8f0);
    --solis-slide-min-h: clamp(380px, 52vw, 560px);
    color-scheme: light;
}
html[data-theme="dark"] { color-scheme: dark; }

/* ---------- Icons & buttons ---------- */
.solis-icon { width: 1.25em; height: 1.25em; flex: none; vertical-align: middle; }

.solis-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease;
}
.solis-icon-btn:hover { background: var(--solis-surface-2); }
.solis-icon-btn .solis-icon { width: 22px; height: 22px; }

.solis-button,
.solis-chat-btn {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    padding: .85em 1.5em;
    border-radius: var(--solis-btn-radius);
    border: 1px solid var(--solis-accent);
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    font: inherit;
    font-weight: 600;
    line-height: 1.1;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, filter .15s ease, background-color .15s ease;
}
.solis-button:hover { filter: brightness(1.08); transform: translateY(-1px); color: var(--solis-on-accent); }
.solis-button--ghost { background: transparent; color: var(--solis-text); border-color: var(--solis-border); }
.solis-button--ghost:hover { color: var(--solis-text); background: var(--solis-surface-2); }

.solis-chat-btn { background: transparent; color: inherit; border-color: var(--solis-border); padding: .6em 1em; font-weight: 500; }
.solis-chat-btn:hover { background: var(--solis-surface-2); }
.solis-chat-btn[hidden] { display: none; }

:where(.solis-button, .solis-chat-btn, .solis-icon-btn, .solis-slider-btn, .solis-slider-dot):focus-visible {
    outline: 2px solid var(--solis-accent);
    outline-offset: 2px;
}

/* ---------- Mode toggle ---------- */
.solis-mode-icon-light { display: none; }
html[data-theme="dark"] .solis-mode-icon-light { display: block; }
html[data-theme="dark"] .solis-mode-icon-dark { display: none; }

/* ---------- Cart count ---------- */
.solis-cart-count {
    position: absolute;
    top: 2px;
    right: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 99px;
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}
.solis-cart-count.is-empty { display: none; }

/* ---------- Slider ---------- */
.solis-slider {
    position: relative;
    overflow: hidden;
    border-radius: var(--solis-slider-radius, var(--solis-radius-lg));
    background: var(--solis-surface-2);
    isolation: isolate;
}
.solis-slides { display: grid; }
.solis-slide {
    grid-area: 1 / 1;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    align-items: center;
    min-height: var(--solis-slide-min-h);
    opacity: 0;
    visibility: hidden;
    transition: opacity .7s ease, visibility 0s linear .7s;
    color: var(--solis-slide-text, var(--solis-text));
}
.solis-slide.is-active { opacity: 1; visibility: visible; transition: opacity .7s ease; }
.solis-slide.tone-1 { background: var(--solis-tone-1); }
.solis-slide.tone-2 { background: var(--solis-tone-2); }
.solis-slide.tone-3 { background: var(--solis-tone-3); }
.solis-slide.tone-4 { background: var(--solis-tone-4); }

.solis-slide-content {
    grid-column: 1;
    grid-row: 1;
    padding: clamp(28px, 6vw, 72px);
    padding-bottom: clamp(72px, 8vw, 96px);
    max-width: 620px;
    transform: translateY(14px);
    transition: transform .7s ease;
}
.solis-slide.is-active .solis-slide-content { transform: none; }
.solis-slide-eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--solis-accent);
}
.solis-slide-title {
    /* Follow the slide's text colour, not the page heading colour. */
    color: inherit;
    margin: 0 0 16px;
    font-family: var(--solis-font-head);
    font-size: clamp(2rem, 4.6vw, 3.6rem);
    line-height: 1.05;
    letter-spacing: -.02em;
}
.solis-slide-text { margin: 0 0 28px; font-size: clamp(1rem, 1.4vw, 1.15rem); color: var(--solis-slide-muted, var(--solis-muted)); max-width: 46ch; }

.solis-slide-media {
    grid-column: 2;
    grid-row: 1;
    position: relative;
    align-self: stretch;
    min-height: 260px;
}
.solis-slide-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Built-in artwork shown when a slide has no image. */
.solis-slide-art { position: absolute; inset: 0; }
.solis-art-item {
    position: absolute;
    display: grid;
    place-items: center;
    border-radius: var(--solis-art-radius, 50%);
    background: var(--solis-art-bg, var(--solis-surface));
    color: var(--solis-accent);
    box-shadow: var(--solis-shadow);
}
.solis-art-item .solis-icon { width: 46%; height: 46%; stroke-width: 1.2; }
.solis-art-1 { width: clamp(150px, 22vw, 280px); aspect-ratio: 1; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.solis-art-2 { width: clamp(70px, 9vw, 120px); aspect-ratio: 1; top: 12%; right: 12%; }
.solis-art-3 { width: clamp(60px, 7vw, 96px); aspect-ratio: 1; bottom: 14%; left: 10%; }
@media (prefers-reduced-motion: no-preference) {
    .solis-slide.is-active .solis-art-2 { animation: solis-float 6s ease-in-out infinite; }
    .solis-slide.is-active .solis-art-3 { animation: solis-float 7s ease-in-out infinite reverse; }
}
@keyframes solis-float { 50% { transform: translateY(-12px); } }

.solis-slider-controls {
    position: absolute;
    left: clamp(28px, 6vw, 72px);
    bottom: clamp(20px, 3vw, 32px);
    display: flex;
    align-items: center;
    gap: 8px;
    z-index: 2;
}
.solis-slider-btn {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--solis-border);
    background: var(--solis-surface);
    color: var(--solis-text);
    cursor: pointer;
}
.solis-slider-btn:hover { border-color: var(--solis-accent); color: var(--solis-accent); }
.solis-slider-btn .solis-icon { width: 18px; height: 18px; }
.solis-slider-dots { display: flex; gap: 6px; padding: 0 4px; }
.solis-slider-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 99px;
    border: 0;
    background: var(--solis-text);
    opacity: .25;
    cursor: pointer;
    transition: width .3s ease, opacity .3s ease;
}
.solis-slider-dot.is-active { width: 28px; opacity: 1; background: var(--solis-accent); }
.solis-icon-play { display: none; }
.solis-slider.is-paused .solis-icon-play { display: block; }
.solis-slider.is-paused .solis-icon-pause { display: none; }

@media (max-width: 800px) {
    .solis-slide { grid-template-columns: 1fr; grid-template-rows: auto 1fr; align-items: start; }
    .solis-slide-media { grid-column: 1; grid-row: 1; min-height: 210px; height: 42vw; max-height: 300px; }
    .solis-slide-content { grid-column: 1; grid-row: 2; padding: 24px 20px 80px; }
    .solis-slider-controls { left: 20px; bottom: 20px; }
    .solis-art-1 { width: 150px; }
    .solis-art-2 { width: 64px; top: 10%; right: 10%; }
    .solis-art-3 { width: 54px; bottom: 10%; left: 8%; }
}
@media (prefers-reduced-motion: reduce) {
    .solis-slide, .solis-slide-content, .solis-slider-dot { transition: none; }
}

/* ---------- Section head ---------- */
.solis-section { padding-block: clamp(40px, 6vw, 80px); }
.solis-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: clamp(20px, 3vw, 32px);
}
.solis-eyebrow {
    display: block;
    margin-bottom: 6px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--solis-accent);
}
.solis-section-title { margin: 0; font-family: var(--solis-font-head); font-size: clamp(1.5rem, 3vw, 2.3rem); line-height: 1.1; }
.solis-link-arrow { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; white-space: nowrap; color: var(--solis-text); text-decoration: none; }
.solis-link-arrow:hover { color: var(--solis-accent); }
.solis-link-arrow .solis-icon { width: 18px; height: 18px; transition: transform .15s ease; }
.solis-link-arrow:hover .solis-icon { transform: translateX(3px); }

/* ---------- Category tiles (themes restyle via --modifier) ---------- */
.solis-cats { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.solis-cat a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px 12px;
    height: 100%;
    border-radius: var(--solis-radius);
    background: var(--solis-surface);
    border: 1px solid var(--solis-border);
    color: var(--solis-text);
    text-align: center;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.solis-cat a:hover { transform: translateY(-3px); border-color: var(--solis-accent); box-shadow: var(--solis-shadow); }
.solis-cat-media {
    display: grid;
    place-items: center;
    width: 72px;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
    background: var(--solis-accent-soft);
    color: var(--solis-accent);
}
.solis-cat-media .solis-icon { width: 34px; height: 34px; }
.solis-cat-media img { width: 100%; height: 100%; object-fit: cover; }
.solis-cat-label { font-weight: 600; }
.solis-cat-count { font-size: .8rem; color: var(--solis-muted); }

/* ---------- Perks ---------- */
.solis-perks { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.solis-perk { display: flex; align-items: center; gap: 14px; }
.solis-perk-icon { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: var(--solis-radius); background: var(--solis-accent-soft); color: var(--solis-accent); }
.solis-perk strong { display: block; font-size: .95rem; }
.solis-perk small { display: block; color: var(--solis-muted); font-size: .82rem; }

/* ---------- Post cards ---------- */
.solis-post-grid { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

.solis-notice { padding: 18px 20px; border-radius: var(--solis-radius); background: var(--solis-surface-2); color: var(--solis-muted); text-align: center; }

/* =====================================================================
   WooCommerce
   ===================================================================== */

/* Product grid: replace Woo's float layout with CSS grid. */
.woocommerce ul.products,
.woocommerce-page ul.products {
    --cols: 4;
    display: grid;
    grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
    gap: clamp(12px, 2vw, 24px);
    margin: 0 0 2em;
    padding: 0;
}
.woocommerce ul.products.columns-1 { --cols: 1; }
.woocommerce ul.products.columns-2 { --cols: 2; }
.woocommerce ul.products.columns-3 { --cols: 3; }
.woocommerce ul.products.columns-5 { --cols: 5; }
.woocommerce ul.products.columns-6 { --cols: 6; }
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none !important; }
@media (max-width: 1100px) {
    .woocommerce ul.products.columns-5, .woocommerce ul.products.columns-6 { --cols: 4; }
}
@media (max-width: 900px) {
    .woocommerce ul.products:not(.columns-1):not(.columns-2) { --cols: 3; }
}
@media (max-width: 640px) {
    /* Same specificity as the 900px rule above so this one wins. */
    .woocommerce ul.products:not(.columns-1):not(.columns-2) { --cols: 2; }
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    float: none;
    width: auto !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    position: relative;
    padding: var(--solis-card-pad, 12px);
    border-radius: var(--solis-radius);
    background: var(--solis-surface);
    border: 1px solid var(--solis-card-border, var(--solis-border));
    transition: box-shadow .2s ease, transform .2s ease;
}
.woocommerce ul.products li.product:hover { box-shadow: var(--solis-shadow); }
.woocommerce ul.products li.product a img {
    margin: 0 0 12px;
    border-radius: calc(var(--solis-radius) - 4px);
    aspect-ratio: var(--solis-product-ratio, 1);
    object-fit: cover;
    background: var(--solis-surface-2);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    padding: 0;
    margin-bottom: 6px;
    font-family: var(--solis-font-body);
    font-size: .98rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--solis-text);
}
.woocommerce ul.products li.product .price { color: var(--solis-text); font-weight: 700; font-size: 1rem; margin-bottom: 12px; }
.woocommerce ul.products li.product .button { margin-top: auto; text-align: center; }
.woocommerce ul.products li.product .star-rating { margin-bottom: 6px; }
.woocommerce ul.products li.product .added_to_cart { display: block; margin-top: 6px; text-align: center; font-size: .85rem; }
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link { color: inherit; text-decoration: none; }

.woocommerce .price del, .woocommerce .price del .amount { color: var(--solis-muted); opacity: 1; font-weight: 400; }
.woocommerce .price ins { text-decoration: none; color: var(--solis-sale); }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--solis-text); font-size: 1.4rem; font-weight: 700; }

.woocommerce span.onsale {
    min-width: 0;
    min-height: 0;
    padding: 4px 10px;
    line-height: 1.4;
    border-radius: 99px;
    background: var(--solis-sale);
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    top: 18px;
    left: 18px;
    right: auto;
    margin: 0;
}
.woocommerce ul.products li.product .onsale { top: 20px; left: 20px; right: auto; margin: 0; }

.woocommerce .star-rating span::before, .woocommerce p.stars a { color: var(--solis-star, #f59f00); }
.woocommerce .star-rating::before { color: var(--solis-border); }

/* Buttons */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
    padding: .8em 1.3em;
    border-radius: var(--solis-btn-radius);
    border: 1px solid var(--solis-accent);
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    font-family: inherit;
    font-weight: 600;
    line-height: 1.2;
    transition: filter .15s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    filter: brightness(1.1);
}
.woocommerce a.button:disabled, .woocommerce button.button:disabled, .woocommerce button.button.alt.disabled,
.woocommerce button.button:disabled[disabled], .woocommerce button.button.alt:disabled[disabled] {
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    opacity: .5;
}
.woocommerce ul.products li.product .button {
    background: var(--solis-loop-btn-bg, var(--solis-surface-2));
    border-color: var(--solis-loop-btn-border, var(--solis-border));
    color: var(--solis-loop-btn-text, var(--solis-text));
}
.woocommerce ul.products li.product .button:hover {
    background: var(--solis-accent);
    border-color: var(--solis-accent);
    color: var(--solis-on-accent);
    filter: none;
}

/* Forms */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity .qty,
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce .woocommerce-ordering select,
.woocommerce-page .select2-container--default .select2-selection--single,
.woocommerce-product-search input[type="search"] {
    padding: .7em .9em;
    border: 1px solid var(--solis-border);
    border-radius: calc(var(--solis-radius) - 2px);
    background: var(--solis-surface);
    color: var(--solis-text);
    font: inherit;
}
.woocommerce-page .select2-container--default .select2-selection--single { height: auto; }
.woocommerce-page .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--solis-text); padding: 0; line-height: 1.5; }
.woocommerce-page .select2-container--default .select2-selection--single .select2-selection__arrow { top: 50%; transform: translateY(-50%); }
.select2-dropdown { background: var(--solis-surface); border-color: var(--solis-border); color: var(--solis-text); }
.select2-container--default .select2-search--dropdown .select2-search__field { background: var(--solis-surface-2); color: var(--solis-text); border-color: var(--solis-border); }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--solis-accent); color: var(--solis-on-accent); }
.select2-container--default .select2-results__option[aria-selected="true"] { background: var(--solis-surface-2); }
.woocommerce form .form-row label { color: var(--solis-text); }
.woocommerce .quantity .qty { width: 4.5em; padding-inline: .4em; text-align: center; }

/* Tables */
.woocommerce table.shop_table { border-color: var(--solis-border); border-radius: var(--solis-radius); border-collapse: separate; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color: var(--solis-border); }
.woocommerce table.shop_table tbody th, .woocommerce table.shop_table tfoot td, .woocommerce table.shop_table tfoot th { border-color: var(--solis-border); }
.woocommerce-cart .cart-collaterals .cart_totals table { border-color: var(--solis-border); }
.woocommerce table.shop_table img { width: 64px; border-radius: 6px; }

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error,
.woocommerce-noreviews, p.no-comments {
    background: var(--solis-surface-2);
    color: var(--solis-text);
    border-top-color: var(--solis-accent);
    border-radius: var(--solis-radius);
}
.woocommerce-error { border-top-color: var(--solis-sale); }
.woocommerce-message::before, .woocommerce-info::before { color: var(--solis-accent); }
.woocommerce-message .button, .woocommerce-info .button { float: right; }

/* Single product */
.woocommerce div.product .product_title { font-family: var(--solis-font-head); font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.15; margin-bottom: .4em; }
.woocommerce div.product div.images img { border-radius: var(--solis-radius); }
.woocommerce div.product div.images .flex-control-thumbs { display: flex; gap: 8px; margin-top: 8px; }
.woocommerce div.product div.images .flex-control-thumbs li { width: auto; flex: 1; }
.woocommerce div.product div.images .flex-control-thumbs li img { border-radius: 6px; }
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.woocommerce div.product form.cart.variations_form { display: block; }
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; gap: 10px; }
.woocommerce div.product form.cart div.quantity { margin: 0; float: none; }
.woocommerce div.product form.cart .button { float: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin-bottom: 1.5em; display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid var(--solis-border); }
.woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { display: block; padding: .7em 1em; color: var(--solis-muted); font-weight: 600; border-bottom: 2px solid transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--solis-text); border-bottom-color: var(--solis-accent); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: transparent; }
.woocommerce div.product .stock { color: var(--solis-in-stock, #2b8a3e); }
.woocommerce div.product .out-of-stock { color: var(--solis-sale); }
.woocommerce .product_meta { font-size: .9rem; color: var(--solis-muted); }
.woocommerce .product_meta > span { display: block; }
.woocommerce #reviews #comments ol.commentlist li .comment-text { border-color: var(--solis-border); border-radius: var(--solis-radius); }
.woocommerce #reviews #comments ol.commentlist li img.avatar { background: var(--solis-surface-2); border-color: var(--solis-border); }
.woocommerce table.variations select { min-width: 160px; padding: .5em; border-radius: 6px; border: 1px solid var(--solis-border); background: var(--solis-surface); color: var(--solis-text); }

/* Checkout */
.woocommerce-checkout #payment, .woocommerce-checkout #payment div.payment_box { background: var(--solis-surface-2); color: var(--solis-text); border-radius: var(--solis-radius); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--solis-surface-2); }
.woocommerce-checkout #payment ul.payment_methods { border-bottom-color: var(--solis-border); }
.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register { border-color: var(--solis-border); border-radius: var(--solis-radius); }

/* My account */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0 0 2em; padding: 0; border: 1px solid var(--solis-border); border-radius: var(--solis-radius); overflow: hidden; }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display: block; padding: .8em 1em; color: var(--solis-text); text-decoration: none; border-bottom: 1px solid var(--solis-border); }
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child a { border-bottom: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: var(--solis-accent-soft); color: var(--solis-accent); font-weight: 600; }

/* Pagination, ordering, breadcrumb */
.woocommerce nav.woocommerce-pagination ul { border: 0; display: inline-flex; gap: 6px; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
    min-width: 40px;
    padding: .6em .8em;
    border-radius: var(--solis-radius);
    border: 1px solid var(--solis-border);
    color: var(--solis-text);
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover { background: var(--solis-accent); border-color: var(--solis-accent); color: var(--solis-on-accent); }
.woocommerce .woocommerce-breadcrumb { color: var(--solis-muted); font-size: .85rem; margin-bottom: 1.5em; }
.woocommerce .woocommerce-breadcrumb a { color: var(--solis-muted); }
.woocommerce .woocommerce-result-count { color: var(--solis-muted); }
.woocommerce-products-header__title { font-family: var(--solis-font-head); }

/* Widgets in shop sidebar */
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background: var(--solis-accent); }
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content { background: var(--solis-border); }

/* Cart/checkout blocks: mostly inherit currentColor; fix the hard-coded surfaces. */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-form .wc-block-components-text-input input {
    background: var(--solis-surface) !important;
    color: var(--solis-text) !important;
    border-color: var(--solis-border) !important;
}
.wc-block-components-text-input label,
.wc-blocks-components-select .wc-blocks-components-select__label { color: var(--solis-muted) !important; }
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-mini-cart-footer-block .wc-block-components-button {
    background: var(--solis-accent);
    color: var(--solis-on-accent);
    border-radius: var(--solis-btn-radius);
}
.wc-block-components-panel, .wc-block-components-totals-wrapper,
.wc-block-cart-items, .wc-block-components-order-summary { border-color: var(--solis-border) !important; }
.wc-block-components-radio-control__option, .wc-block-checkout__shipping-method-option { color: var(--solis-text); }
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted { box-shadow: inset 0 0 0 1.5px var(--solis-accent); }
.wc-block-components-product-badge, .wc-block-components-sale-badge { background: var(--solis-surface); color: var(--solis-text); }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"],
.wc-block-components-radio-control .wc-block-components-radio-control__input { background: var(--solis-surface); border-color: var(--solis-muted); }
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--solis-text); }

@media (max-width: 768px) {
    .woocommerce-message .button, .woocommerce-info .button { float: none; display: block; margin-top: .6em; }
    .woocommerce table.shop_table_responsive tr, .woocommerce-page table.shop_table_responsive tr { border-bottom: 1px solid var(--solis-border); }
    .woocommerce table.shop_table_responsive tr:nth-child(2n) td { background: transparent; }
}

/* =====================================================================
   Otto AI Chat
   Otto's widget ships light-only colours; map its surfaces to the theme
   tokens so it follows light/dark mode and matches each theme's type.
   ===================================================================== */
.oac-widget { font-family: var(--solis-font-body); }
/* Otto's panel sets display:flex, which beats the hidden attribute its
   script uses to close it; keep it closable on older Otto versions. */
.oac-panel[hidden] { display: none; }
.oac-panel { background: var(--solis-surface); color: var(--solis-text); border: 1px solid var(--solis-border); border-radius: var(--solis-radius-lg); }
.oac-messages { background: var(--solis-surface-2); }
.oac-msg-assistant { background: var(--solis-surface); color: var(--solis-text); border-color: var(--solis-border); }
.oac-quick-actions { background: var(--solis-surface); border-bottom-color: var(--solis-border); }
.oac-form { border-top-color: var(--solis-border); background: var(--solis-surface); }
.oac-input { background: var(--solis-surface-2); color: var(--solis-text); border-color: var(--solis-border); font-family: inherit; }
.oac-input::placeholder { color: var(--solis-muted); }
.oacw-quick-action { background: var(--solis-surface); font-family: inherit; }
.oacw-card input, .oacw-card textarea { background: var(--solis-surface-2); color: var(--solis-text); border-color: var(--solis-border); }
html[data-theme="dark"] .oac-toggle,
html[data-theme="dark"] .oac-panel { box-shadow: 0 12px 40px rgba(0, 0, 0, .55); }

/* Keep the chat bubble clear of the open mobile drawer. */
body.solis-drawer-open .oac-widget { visibility: hidden; }

/* ---------- Listing facts (styles with listing_facts, e.g. Haven) ---------- */
.solis-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--solis-muted); font-size: .88rem; }
.solis-fact { display: inline-flex; align-items: center; gap: 6px; }
.solis-fact .solis-icon { width: 17px; height: 17px; flex: none; }
.solis-facts--single { margin: 0 0 20px; padding: 14px 0; border-block: 1px solid var(--solis-border); font-size: .95rem; color: var(--solis-text); }
.solis-facts--single .solis-icon { width: 20px; height: 20px; color: var(--solis-accent); }

/* ---------- Viewing requests (Solis Core, Haven) ---------- */
.solis-viewing-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.solis-viewing-actions .button.alt { padding: 14px 26px; }
.solis-viewing-actions .solis-chat-btn { padding: 12px 20px; }
.solis-viewing-notice { flex: 1 0 100%; margin: 0 0 4px; padding: 12px 14px; border-radius: var(--solis-radius); background: var(--solis-accent-soft); color: var(--solis-text); }
.solis-viewing-notice--error { background: color-mix(in srgb, var(--solis-sale) 14%, transparent); }
html.solis-viewing-is-open { overflow: hidden; }

.solis-viewing {
    width: min(640px, calc(100% - 32px));
    max-height: calc(100% - 32px);
    padding: 0;
    border: 1px solid var(--solis-border);
    border-radius: var(--solis-radius-lg);
    background: var(--solis-surface);
    color: var(--solis-text);
    box-shadow: var(--solis-shadow);
}
.solis-viewing::backdrop { background: rgba(10, 14, 18, .55); backdrop-filter: blur(2px); }
.solis-viewing-inner { position: relative; padding: clamp(20px, 4vw, 32px); }
.solis-viewing-close {
    position: absolute; top: 12px; right: 12px;
    display: grid; place-items: center; width: 40px; height: 40px;
    border: 0; border-radius: 50%; background: transparent; color: var(--solis-muted); cursor: pointer;
}
.solis-viewing-close:hover { background: var(--solis-accent-soft); color: var(--solis-text); }
.solis-viewing-title { margin: 0 44px 6px 0; font-size: clamp(1.5rem, 3vw, 2rem); }
.solis-viewing-property { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; margin: 0 0 20px; padding-bottom: 16px; border-bottom: 1px solid var(--solis-border); color: var(--solis-muted); }
.solis-viewing-property strong { color: var(--solis-text); }
.solis-viewing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.solis-viewing-field { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 0; }
.solis-viewing-field--wide { grid-column: 1 / -1; }
.solis-viewing-field > label,
.solis-viewing-types legend { font-size: .8rem; font-weight: 600; color: var(--solis-text); }
.solis-viewing-field input,
.solis-viewing-field select,
.solis-viewing-field textarea {
    width: 100%; min-height: 44px; padding: 10px 12px; font: inherit; color: var(--solis-text);
    background: var(--solis-bg); border: 1px solid var(--solis-border); border-radius: var(--solis-btn-radius);
}
.solis-viewing-field textarea { resize: vertical; }
.solis-viewing-field input:focus-visible,
.solis-viewing-field select:focus-visible,
.solis-viewing-field textarea:focus-visible { outline: 2px solid var(--solis-accent); outline-offset: 1px; }
.solis-viewing-types { border: 0; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 18px; }
.solis-viewing-types legend { width: 100%; padding: 0; margin-bottom: 6px; }
.solis-viewing-types label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; }
.solis-viewing-types input, .solis-viewing-consent input { width: 18px; height: 18px; accent-color: var(--solis-accent); flex: none; }
.solis-viewing-consent { margin: 18px 0 0; font-size: .85rem; color: var(--solis-muted); }
.solis-viewing-consent label { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.solis-viewing-consent a { color: inherit; }
.solis-viewing-error { margin: 14px 0 0; padding: 10px 12px; border-radius: var(--solis-radius); background: color-mix(in srgb, var(--solis-sale) 14%, transparent); color: var(--solis-text); }
.solis-viewing-submit { margin-top: 18px; width: 100%; padding: 14px 20px; }
.solis-viewing-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.solis-viewing-done { text-align: center; padding: 12px 0 4px; }
.solis-viewing-done h3 { margin: 0 0 8px; font-size: 1.5rem; }
.solis-viewing-done h3:focus { outline: none; }
.solis-viewing-done p { margin: 0 auto 20px; max-width: 42ch; color: var(--solis-muted); }
@media (max-width: 560px) {
    .solis-viewing-grid { grid-template-columns: 1fr; }
    .solis-viewing { width: 100%; max-width: none; max-height: 100%; margin: auto 0 0; border-radius: var(--solis-radius-lg) var(--solis-radius-lg) 0 0; }
}