/* Lavirax: styles that replace Tailwind v4 @utility / product-prose when using CDN */

:root {
    --color-cream: #fffbfa;
    --color-blush-50: #fdf2f3;
    --color-blush-100: #f9e2e5;
    --color-blush-200: #f3c8cd;
    --color-blush-300: #eeacb3;
    --color-blush-400: #e8a0a8;
    --color-blush-500: #d68d95;
    --color-blush-600: #b9747b;
    --color-ink-900: #2d2627;
    --color-ink-500: #8e7a7c;

    /* Shared header + footer glass surface */
    --lavirax-glass-bg: linear-gradient(
        180deg,
        rgba(253, 242, 243, 0.72) 0%,
        rgba(255, 251, 250, 0.94) 45%,
        rgba(255, 251, 250, 0.98) 100%
    );
    --lavirax-glass-border: rgba(232, 160, 168, 0.28);
    --lavirax-glass-blur: 18px;
}

/* Storefront: always light, soft premium (no system dark mode) */
html.lavirax-theme {
    color-scheme: light only;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html.lavirax-theme::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

html.lavirax-theme *::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

/* Typography: slightly heavier weights + crisper rendering (Poppins reads thin on cream bg) */
html.lavirax-theme {
    text-rendering: optimizeLegibility;
}

html.lavirax-theme body.lx-page-body {
    font-weight: 500;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
}

html.lavirax-theme .font-normal {
    font-weight: 500;
}

html.lavirax-theme .font-medium {
    font-weight: 600;
}

html.lavirax-theme .font-semibold {
    font-weight: 700;
}

html.lavirax-theme .font-bold {
    font-weight: 800;
}

html.lavirax-theme .font-extrabold {
    font-weight: 800;
}

html.lavirax-theme .text-ink-500,
html.lavirax-theme .text-ink-400 {
    font-weight: 500;
}

html.lavirax-theme .font-serif.font-semibold,
html.lavirax-theme .font-serif.font-bold {
    font-weight: 700;
}

/* Admin panel (Instrument Sans) */
body.font-instrument {
    font-weight: 500;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
}

body.font-instrument .font-normal {
    font-weight: 500;
}

body.font-instrument .font-medium {
    font-weight: 600;
}

body.font-instrument .font-semibold {
    font-weight: 700;
}

/* Navbar: footer-matched logo, compact bar (no extra padding) */
.glass-nav .lx-nav-inner {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
}

@media (min-width: 640px) {
    .glass-nav .lx-nav-inner {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }
}

body.lx-page-body {
    background-color: var(--color-cream);
    background-image:
        radial-gradient(ellipse 120% 70% at 50% -15%, rgba(253, 242, 243, 0.95), transparent 55%),
        radial-gradient(ellipse 60% 40% at 100% 0%, rgba(249, 226, 229, 0.35), transparent 50%),
        radial-gradient(ellipse 50% 35% at 0% 100%, rgba(243, 200, 205, 0.12), transparent 45%);
}

/* Desktop nav: categories dropdown — bridge padding avoids hover gap (margin mt-2 broke :hover) */
.lx-nav-categories-panel {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.lx-nav-categories:hover .lx-nav-categories-panel,
.lx-nav-categories:focus-within .lx-nav-categories-panel,
.lx-nav-categories.lx-nav-categories--open .lx-nav-categories-panel {
    opacity: 1;
    pointer-events: auto;
}

/* Nav: buttons must match link typography (browser defaults differ) */
.glass-nav nav a,
.glass-nav nav button {
    font-family: 'Poppins', ui-sans-serif, system-ui, sans-serif;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
}

/* Product card footer */
.lx-product-card-foot {
    background: linear-gradient(180deg, rgba(255, 251, 250, 0) 0%, rgba(253, 242, 243, 0.35) 100%);
}

.lx-product-card-foot .lx-product-rating svg {
    flex-shrink: 0;
}

.glass-nav,
.glass-footer {
    background: var(--lavirax-glass-bg);
    -webkit-backdrop-filter: blur(var(--lavirax-glass-blur)) saturate(1.15);
    backdrop-filter: blur(var(--lavirax-glass-blur)) saturate(1.15);
}

.glass-nav {
    border-bottom: 1px solid var(--lavirax-glass-border);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 8px 32px rgba(232, 160, 168, 0.1);
}

.glass-footer {
    border-top: 1px solid var(--lavirax-glass-border);
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.6) inset;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .glass-nav,
    .glass-footer {
        background: rgba(255, 251, 250, 0.98);
    }
}

.no-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Storefront width — phone: 3px via <main>; tablet+ padding on .lx-store-container */
@media (max-width: 639px) {
    body.lx-page-body > main,
    body.lx-page-body header .lx-store-container,
    body.lx-page-body footer .lx-store-container,
    body.lx-page-body .lx-service-bar .lx-store-container {
        padding-inline: 15px;
    }
}

.lx-store-container {
    width: 100%;
    max-width: 96rem;
    margin-inline: auto;
    padding-inline: 0;
}

@media (min-width: 640px) {
    .lx-store-container {
        padding-inline: clamp(0.75rem, 2vw, 1.25rem);
    }

    body.lx-page-body > main {
        padding-inline: 0;
    }
}

@media (min-width: 1280px) {
    .lx-store-container {
        padding-inline: 1.5rem;
    }
}

/* Category carousel: arrow inset from sm up */
@media (min-width: 640px) {
    .lx-category-carousel .lx-store-container {
        padding-inline: 2.75rem;
    }
}

@media (min-width: 1024px) {
    .lx-category-carousel .lx-store-container {
        padding-inline: 3rem;
    }
}

/* Product listing: phone 1 → tablet 2 → md 3 → desktop 4 */
.lx-product-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

@media (min-width: 640px) {
    .lx-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.125rem;
    }
}

@media (min-width: 768px) {
    .lx-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .lx-product-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.25rem;
    }

    .lx-product-grid .lx-product-card-media {
        height: 12.5rem;
    }
}

/* Home — category carousel (rounded cards + nav arrows) */
.lx-category-carousel .lx-cat-track {
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.lx-category-carousel .lx-cat-track--centered {
    justify-content: center;
}

.lx-category-card {
    width: 8.75rem;
    scroll-snap-align: start;
}

@media (min-width: 640px) {
    .lx-category-card {
        width: 9.75rem;
    }
}

.lx-category-card-inner {
    display: flex;
    aspect-ratio: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(249, 226, 229, 0.9);
    background: linear-gradient(165deg, rgba(255, 251, 250, 0.98) 0%, rgba(253, 242, 243, 0.75) 100%);
    padding: 1rem 0.75rem 0.85rem;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.lx-category-card:hover .lx-category-card-inner,
.lx-category-card:focus-visible .lx-category-card-inner {
    transform: translateY(-3px);
    border-color: rgba(232, 160, 168, 0.55);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 14px 28px rgba(232, 160, 168, 0.16);
}

.lx-category-card-icon-wrap {
    display: grid;
    height: 4.25rem;
    width: 4.25rem;
    flex-shrink: 0;
    place-items: center;
    overflow: hidden;
    border-radius: 9999px;
    background: #fff;
    box-shadow:
        0 0 0 1px rgba(249, 226, 229, 0.95),
        0 6px 16px rgba(232, 160, 168, 0.12);
}

.lx-category-card-icon {
    height: 2.75rem;
    width: 2.75rem;
    object-fit: contain;
}

.lx-category-card-label {
    max-width: 100%;
    padding: 0 0.25rem;
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--color-ink-900, #2d2627);
}

.lx-cat-nav {
    position: absolute;
    top: 50%;
    z-index: 10;
    display: grid;
    height: 2.5rem;
    width: 2.5rem;
    place-items: center;
    border-radius: 9999px;
    border: 1px solid rgba(249, 226, 229, 0.95);
    background: rgba(255, 255, 255, 0.96);
    color: var(--color-ink-700, #4a4244);
    box-shadow: 0 8px 24px rgba(45, 38, 39, 0.08);
    transform: translateY(-50%);
    transition:
        background 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}

.lx-cat-nav:hover {
    background: #fff;
    color: var(--color-blush-500, #e8a0a8);
    box-shadow: 0 10px 28px rgba(232, 160, 168, 0.2);
}

.lx-cat-nav:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(232, 160, 168, 0.35);
}

.lx-cat-nav--prev {
    left: 0.35rem;
}

.lx-cat-nav--next {
    right: 0.35rem;
}

@media (max-width: 639px) {
    .lx-cat-nav {
        height: 2.125rem;
        width: 2.125rem;
    }

    .lx-cat-nav--prev {
        left: 0.15rem;
    }

    .lx-cat-nav--next {
        right: 0.15rem;
    }
}

.card-lift {
    transition:
        transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),
        box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.card-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(232, 160, 168, 0.18);
}

.product-prose {
    color: var(--color-ink-500);
    line-height: 1.75;
    font-size: 1rem;
    font-weight: 500;
    max-width: 72ch;
}
.product-prose h1,
.product-prose h2,
.product-prose h3,
.product-prose h4 {
    font-family: 'Playfair Display', ui-serif, Georgia, serif;
    color: var(--color-ink-900);
    font-weight: 700;
    line-height: 1.25;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}
.product-prose h1 {
    font-size: 2rem;
}
.product-prose h2 {
    font-size: 1.625rem;
}
.product-prose h3 {
    font-size: 1.25rem;
}
.product-prose h4 {
    font-size: 1.125rem;
}
.product-prose p {
    margin-bottom: 1rem;
}
.product-prose ul,
.product-prose ol {
    margin: 0 0 1.25rem 1.25rem;
    padding-left: 0.25rem;
}
.product-prose ul {
    list-style: disc;
}
.product-prose ol {
    list-style: decimal;
}
.product-prose li {
    margin-bottom: 0.4rem;
}
.product-prose li::marker {
    color: var(--color-blush-400);
}
.product-prose strong {
    color: var(--color-ink-900);
    font-weight: 700;
}
.product-prose em {
    font-style: italic;
}
.product-prose a {
    color: var(--color-blush-500);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}
.product-prose a:hover {
    color: var(--color-blush-600);
}
.product-prose code {
    background: var(--color-blush-50);
    color: var(--color-ink-900);
    padding: 0.15em 0.45em;
    border-radius: 0.4em;
    font-size: 0.875em;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.product-prose blockquote {
    margin: 1.25rem 0;
    padding: 0.5rem 1rem;
    border-left: 3px solid var(--color-blush-400);
    background: var(--color-blush-50);
    color: var(--color-ink-900);
    font-style: italic;
    border-radius: 0 0.5rem 0.5rem 0;
}
.product-prose img {
    border-radius: 1rem;
    margin: 1.25rem 0;
}
.product-prose hr {
    border: 0;
    border-top: 1px solid var(--color-blush-100);
    margin: 2rem 0;
}

/* Cart drawer + toast + order modal (storefront UX) */
html.lx-nav-open,
html.lx-modal-open {
    overflow: hidden;
}

.lx-cart-drawer {
    pointer-events: none;
}

.lx-cart-drawer.lx-cart-drawer--open {
    pointer-events: auto;
}

.lx-cart-drawer-backdrop {
    pointer-events: none;
}

.lx-cart-drawer-backdrop.lx-cart-drawer-backdrop--visible {
    opacity: 1 !important;
    pointer-events: auto;
}

/* Add-to-cart toast: bottom mobile, top-right desktop */
.lx-add-toast {
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    left: 50%;
    bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
    transform: translate(-50%, 12px);
}

@media (min-width: 640px) {
    .lx-add-toast {
        left: auto;
        right: max(1rem, env(safe-area-inset-right, 0px));
        bottom: auto;
        top: 5.75rem;
        transform: translate(12px, 0);
    }
}

.lx-add-toast.lx-add-toast--visible {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, 0);
}

@media (min-width: 640px) {
    .lx-add-toast.lx-add-toast--visible {
        transform: translate(0, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .lx-add-toast {
        transition-duration: 0.12s;
    }
}

/* Order thank-you modal */
.lx-order-modal-backdrop {
    animation: lx-fade-in 0.35s ease both;
}

.lx-order-modal-card {
    animation: lx-modal-up 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes lx-fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes lx-modal-up {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes lx-check-pop {
    0% {
        transform: scale(0.6);
        opacity: 0;
    }
    60% {
        transform: scale(1.06);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.lx-order-check {
    animation: lx-check-pop 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .lx-order-modal-backdrop,
    .lx-order-modal-card,
    .lx-order-check {
        animation: none !important;
    }
}

/* Checkout page — calm ambient backdrop */
.checkout-shell {
    background:
        radial-gradient(ellipse 140% 90% at 50% -30%, rgba(253, 242, 243, 0.95), transparent 52%),
        radial-gradient(ellipse 70% 50% at 100% 20%, rgba(249, 226, 229, 0.45), transparent 50%),
        radial-gradient(ellipse 55% 45% at 0% 80%, rgba(243, 200, 205, 0.18), transparent 48%),
        #fdfbfb;
}

/* Thank-you page: keep content above footer / safe areas */
.thanks-shell {
    position: relative;
    z-index: 1;
    min-height: min(72vh, calc(100dvh - 14rem));
    padding-bottom: max(2.5rem, env(safe-area-inset-bottom, 0px));
}

.thanks-shell-actions {
    padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
}

body.lx-page-body--thanks main {
    padding-bottom: max(3rem, env(safe-area-inset-bottom, 0px));
}

body.lx-page-body--thanks .glass-footer {
    margin-top: 0;
    flex-shrink: 0;
}

/* Footer service highlights bar */
.lx-service-bar-inner {
    overflow: hidden;
    border-radius: 1rem;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset;
}

.lx-service-bar-grid {
    display: grid;
    grid-template-columns: 1fr;
    margin: 0;
    list-style: none;
    padding: 0;
}

.lx-service-bar-item {
    border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.lx-service-bar-item:last-child {
    border-bottom: none;
}

@media (min-width: 640px) {
    .lx-service-bar-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lx-service-bar-item:nth-child(odd) {
        border-right: 1px solid rgba(226, 232, 240, 0.9);
    }

    .lx-service-bar-item:nth-last-child(-n + 2):nth-child(odd) {
        border-bottom: none;
    }

    .lx-service-bar-item:nth-last-child(1):nth-child(even) {
        border-bottom: none;
    }
}

@media (min-width: 1024px) {
    .lx-service-bar-grid {
        display: flex;
        flex-wrap: nowrap;
    }

    .lx-service-bar-item {
        flex: 1 1 0;
        min-width: 0;
        border-bottom: none;
        border-right: 1px solid rgba(226, 232, 240, 0.9);
    }

    .lx-service-bar-item:last-child {
        border-right: none;
    }

    .lx-service-bar-item:nth-child(odd) {
        border-right: 1px solid rgba(226, 232, 240, 0.9);
    }
}

.lx-service-bar-cell {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1.1rem 1.15rem;
    text-decoration: none;
    color: inherit;
    transition: background 0.2s ease;
}

a.lx-service-bar-cell:hover {
    background: rgba(253, 242, 243, 0.55);
}

.lx-service-bar-icon {
    display: grid;
    height: 2.75rem;
    width: 2.75rem;
    flex-shrink: 0;
    place-items: center;
    border-radius: 0.65rem;
    border: 1px solid rgba(249, 226, 229, 0.95);
    background: rgba(253, 242, 243, 0.65);
    color: #b87a82;
}

.lx-service-bar-icon svg {
    height: 1.35rem;
    width: 1.35rem;
}

.lx-service-bar-text {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.15rem;
}

.lx-service-bar-title {
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--color-ink-900, #2d2627);
}

.lx-service-bar-sub {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--color-ink-500, #6b5f61);
}

.checkout-input {
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.checkout-input:focus {
    outline: none;
    border-color: rgba(232, 160, 168, 0.85);
    box-shadow: 0 0 0 3px rgba(232, 160, 168, 0.22);
}

/* Mobile bottom nav: above floating contact (z-55), below modals */
.lx-bottom-nav button,
.lx-bottom-nav a {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

/* Wishlist panel rows — image, title, remove icon (phone + desktop) */
.lx-wishlist-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.lx-wishlist-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid rgba(249, 226, 229, 0.9);
    padding: 0.75rem 0;
}

.lx-wishlist-item:last-child {
    border-bottom: 0;
}

.lx-wishlist-item-link {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: inherit;
}

.lx-wishlist-item-link:hover .lx-wishlist-item-title {
    color: var(--color-blush-500, #d68d95);
}

.lx-wishlist-item-thumb {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 3.5rem;
    height: 3.5rem;
    overflow: hidden;
    border-radius: 0.75rem;
    background: var(--color-blush-50, #fdf2f3);
    box-shadow: inset 0 0 0 1px rgba(249, 226, 229, 0.8);
}

.lx-wishlist-item-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lx-wishlist-item-initial {
    font-family: 'Playfair Display', ui-serif, Georgia, serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-blush-300, #eeacb3);
}

.lx-wishlist-item-text {
    min-width: 0;
    flex: 1;
}

.lx-wishlist-item-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--color-ink-900, #2d2627);
}

.lx-wishlist-item-remove {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 9999px;
    background: transparent;
    color: #a89496;
    cursor: pointer;
    transition:
        color 0.15s ease,
        background-color 0.15s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.lx-wishlist-item-remove:hover {
    color: #b9747b;
    background: rgba(253, 242, 243, 0.95);
}

.lx-wishlist-item-remove:focus-visible {
    outline: 2px solid var(--color-blush-400, #e8a0a8);
    outline-offset: 2px;
}

/* Floating contact: main message FAB + WhatsApp / Messenger / Instagram shortcuts */
.lx-contact-wrap {
    position: fixed;
    z-index: 55;
    right: max(1rem, env(safe-area-inset-right, 0px));
    bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    pointer-events: none;
}

.lx-contact-wrap--above-tab {
    bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 768px) {
    .lx-contact-wrap--above-tab {
        bottom: 1.5rem;
    }
}

.lx-contact-wrap--low {
    bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 640px) {
    .lx-contact-wrap--low {
        bottom: 1.5rem;
    }
}

.lx-contact-wrap > * {
    pointer-events: auto;
}

.lx-contact-channels {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity 0.25s ease,
        transform 0.25s ease;
}

.lx-contact-wrap--channels-closed .lx-contact-channels {
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    visibility: hidden;
}

.lx-contact-dismiss {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    border: 1px solid var(--lavirax-glass-border);
    background: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    color: var(--color-ink-500);
    box-shadow: 0 4px 16px rgba(45, 38, 39, 0.08);
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

.lx-contact-dismiss svg {
    width: 0.875rem;
    height: 0.875rem;
}

.lx-contact-dismiss:hover {
    background: rgba(253, 242, 243, 0.95);
    color: var(--color-ink-900);
}

.lx-contact-channel-btn {
    display: grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 9999px;
    color: #fff;
    text-decoration: none;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.25) inset,
        0 10px 28px rgba(45, 38, 39, 0.18);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.lx-contact-channel-icon {
    display: grid;
    place-items: center;
}

.lx-contact-channel-icon svg {
    width: 1.35rem;
    height: 1.35rem;
}

.lx-contact-channel-btn--whatsapp {
    background: linear-gradient(145deg, #2bd673 0%, #25d366 100%);
}

.lx-contact-channel-btn--messenger {
    background: linear-gradient(145deg, #0099ff 0%, #0084ff 100%);
}

.lx-contact-channel-btn--instagram {
    background: linear-gradient(145deg, #f77737 0%, #c13584 50%, #833ab4 100%);
    color: #fff;
}

.lx-contact-channel-btn--instagram .lx-contact-channel-icon svg {
    stroke: #fff;
}

.lx-contact-channel-btn--email {
    background: linear-gradient(145deg, var(--color-blush-400) 0%, var(--color-blush-500) 100%);
    color: var(--color-ink-900);
}

.lx-contact-animate .lx-contact-channel-btn:hover {
    transform: scale(1.06);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.3) inset,
        0 14px 32px rgba(45, 38, 39, 0.22);
}

.lx-contact-fab {
    position: relative;
    display: grid;
    place-items: center;
    width: 3.5rem;
    height: 3.5rem;
    border: 1px solid rgba(232, 160, 168, 0.45);
    border-radius: 9999px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(253, 242, 243, 0.92) 100%);
    -webkit-backdrop-filter: blur(var(--lavirax-glass-blur)) saturate(1.15);
    backdrop-filter: blur(var(--lavirax-glass-blur)) saturate(1.15);
    color: var(--color-blush-600);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 12px 36px rgba(232, 160, 168, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

@media (min-width: 768px) {
    .lx-contact-fab {
        width: 3.25rem;
        height: 3.25rem;
    }
}

.lx-contact-fab-icon {
    width: 1.35rem;
    height: 1.35rem;
}

.lx-contact-animate .lx-contact-fab:hover {
    transform: scale(1.06);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 14px 36px rgba(232, 160, 168, 0.22);
}

@media (prefers-reduced-motion: reduce) {
    .lx-contact-channels,
    .lx-contact-channel-btn,
    .lx-contact-dismiss,
    .lx-contact-fab {
        transition: none;
    }

    .lx-contact-animate .lx-contact-channel-btn:hover,
    .lx-contact-animate .lx-contact-fab:hover {
        transform: none;
    }
}