/*
 * Lincs Lootcave OS — My Account
 *
 * Canonical presentation owner for the shared WooCommerce My Account shell.
 *
 * Design language:
 * - open cave canvas
 * - Concept 4 profile/navigation styling
 * - editorial typography and restrained green/gold accents
 * - separators and hierarchy instead of enclosing cards
 *
 * Endpoint-specific modules remain responsible for their own rich internals.
 */

/* =========================================================
   1. ACCOUNT FOUNDATION
========================================================= */

body.ll-account-page {
    --ll-account-gold: #d8b44a;
    --ll-account-gold-bright: #f0d879;
    --ll-account-green: #8aff00;
    --ll-account-purple: #8b4dff;

    --ll-account-text: #f5f6f8;
    --ll-account-muted: rgba(245, 246, 248, .58);
    --ll-account-muted-soft: rgba(245, 246, 248, .42);

    --ll-account-line: rgba(255, 255, 255, .075);
    --ll-account-gold-line: rgba(216, 180, 74, .18);
}

body.ll-account-page *,
body.ll-account-page *::before,
body.ll-account-page *::after {
    box-sizing: border-box;
}

/* =========================================================
   2. OPEN PAGE CANVAS
========================================================= */

body.ll-account-page .wp-site-blocks {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.ll-account-page .wp-site-blocks > main,
body.ll-account-page main.wp-block-group,
body.ll-account-page .wp-block-post-content {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.ll-account-page .woocommerce {
    width: min(calc(100% - 48px), 1480px) !important;
    max-width: 1480px !important;

    margin: 52px auto 140px !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    overflow: visible !important;
}

body.ll-account-page.logged-in .woocommerce {
    display: grid !important;
    grid-template-columns: 250px minmax(0, 1fr) !important;
    gap: clamp(38px, 4.5vw, 72px) !important;

    align-items: start !important;
}

body.ll-account-page .woocommerce::before,
body.ll-account-page .woocommerce::after {
    display: none !important;
    content: none !important;
}

/* =========================================================
   3. ACCOUNT NAVIGATION
   Concept 4 profile language expanded into the page.
========================================================= */

body.ll-account-page .woocommerce-MyAccount-navigation {
    position: sticky !important;
    top: 100px !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    float: none !important;
    clear: none !important;

    margin: 0 !important;
    padding: 0 30px 0 0 !important;

    border: 0 !important;
    border-right: 1px solid var(--ll-account-gold-line) !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    overflow: visible !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation::before {
    content: "My account";

    position: relative;

    display: flex;
    align-items: center;
    gap: 10px;

    margin: 0 0 17px !important;
    padding: 0 0 16px !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ll-account-line) !important;

    color: var(--ll-account-muted) !important;

    font-family: inherit !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;

    letter-spacing: .16em !important;
    text-transform: uppercase !important;

    text-shadow: none !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation::after {
    content: "";

    position: absolute;
    top: 5px;
    left: 78px;

    display: block !important;

    width: 34px;
    height: 1px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            var(--ll-account-green),
            transparent
        );

    box-shadow: 0 0 8px rgba(138, 255, 0, .22);
}

body.ll-account-page .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    flex-direction: column !important;

    gap: 0 !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    list-style: none !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation li {
    position: relative;

    flex: none !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ll-account-line) !important;

    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation li:first-child {
    border-top: 1px solid var(--ll-account-line) !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation a {
    position: relative;

    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    min-height: 50px !important;

    margin: 0 !important;
    padding: 0 12px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    color: rgba(245, 246, 248, .80) !important;

    font-size: 12.5px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;

    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-transform: none !important;

    box-shadow: none !important;

    transition:
        color .18s ease,
        background .18s ease,
        box-shadow .18s ease !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation a::before {
    content: "";

    width: 4px;
    height: 4px;

    flex: 0 0 4px;

    margin-right: 11px;

    border-radius: 50%;

    background: rgba(245, 246, 248, .24);

    transition:
        background .18s ease,
        box-shadow .18s ease !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation a::after {
    content: "›" !important;

    display: block !important;

    margin-left: auto;

    color: rgba(245, 246, 248, .30) !important;

    font-family: Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transition:
        color .18s ease,
        transform .18s ease !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation .is-active a,
body.ll-account-page .woocommerce-MyAccount-navigation a:hover,
body.ll-account-page .woocommerce-MyAccount-navigation a:focus-visible {
    color: #fff7d5 !important;

    background:
        linear-gradient(
            90deg,
            rgba(138, 255, 0, .08),
            rgba(139, 77, 255, .055) 58%,
            transparent
        ) !important;

    box-shadow:
        inset 2px 0 0 var(--ll-account-green) !important;

    outline: none !important;
}

body.ll-account-page .woocommerce-MyAccount-navigation .is-active a::before,
body.ll-account-page .woocommerce-MyAccount-navigation a:hover::before,
body.ll-account-page .woocommerce-MyAccount-navigation a:focus-visible::before {
    background: var(--ll-account-green);

    box-shadow: 0 0 9px rgba(138, 255, 0, .42);
}

body.ll-account-page .woocommerce-MyAccount-navigation .is-active a::after,
body.ll-account-page .woocommerce-MyAccount-navigation a:hover::after,
body.ll-account-page .woocommerce-MyAccount-navigation a:focus-visible::after {
    color: var(--ll-account-gold-bright) !important;

    transform: translateX(2px);
}

body.ll-account-page .ll-account-nav-customer-logout {
    margin-top: 10px !important;

    border-top: 1px solid rgba(255, 107, 107, .10) !important;
    border-bottom: 0 !important;
}

body.ll-account-page .ll-account-nav-customer-logout a {
    color: rgba(255, 190, 190, .70) !important;
}

body.ll-account-page .ll-account-nav-customer-logout a:hover,
body.ll-account-page .ll-account-nav-customer-logout a:focus-visible {
    color: #ffb6b6 !important;

    background:
        linear-gradient(
            90deg,
            rgba(255, 77, 77, .08),
            transparent
        ) !important;

    box-shadow:
        inset 2px 0 0 #ff7474 !important;
}

body.ll-account-page .ll-account-nav-customer-logout a:hover::before,
body.ll-account-page .ll-account-nav-customer-logout a:focus-visible::before {
    background: #ff7474;

    box-shadow: 0 0 9px rgba(255, 116, 116, .30);
}

/* =========================================================
   4. OPEN CONTENT AREA
========================================================= */

body.ll-account-page .woocommerce-MyAccount-content {
    position: relative;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    float: none !important;
    clear: none !important;

    margin: 0 !important;
    padding: 0 0 32px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    color: var(--ll-account-text) !important;

    overflow: visible !important;
}

body.ll-account-page .woocommerce-MyAccount-content::before,
body.ll-account-page .woocommerce-MyAccount-content::after {
    display: none !important;
    content: none !important;
}

body.ll-account-page .woocommerce-MyAccount-content > *:first-child {
    margin-top: 0 !important;
}

/* =========================================================
   5. SHARED TYPOGRAPHY
========================================================= */

body.ll-account-page:not(.ll-account-endpoint-collector-progress)
.woocommerce-MyAccount-content > h2,
body.ll-account-page:not(.ll-account-endpoint-collector-progress)
.woocommerce-MyAccount-content > h3,
body.ll-account-page:not(.ll-account-endpoint-collector-progress)
.ll-notifications-page > h2 {
    margin: 0 0 24px !important;

    color: #fff7df !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(2rem, 3vw, 2.75rem) !important;
    font-weight: 700 !important;
    line-height: 1.04 !important;

    letter-spacing: -.03em !important;
    text-transform: none !important;

    text-shadow: 0 0 28px rgba(216, 180, 74, .08);
}

body.ll-account-page .woocommerce-MyAccount-content p {
    color: rgba(245, 246, 248, .72);
}

body.ll-account-page .woocommerce-MyAccount-content a:not(.button) {
    color: var(--ll-account-gold-bright);
}

body.ll-account-page:not(.ll-account-endpoint-collector-progress)
.woocommerce-Addresses .woocommerce-Address-title h3,
body.ll-account-page:not(.ll-account-endpoint-collector-progress)
.woocommerce-MyAccount-content > form fieldset legend {
    color: var(--ll-account-gold-bright) !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;
}

/* =========================================================
   6. STANDARD WOOCOMMERCE ENDPOINT SURFACES
   Keep useful inner structure without enclosing the page.
========================================================= */

body.ll-account-page .woocommerce-MyAccount-content table.shop_table {
    width: 100% !important;

    margin: 24px 0 !important;

    border: 0 !important;
    border-collapse: collapse !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;
}

body.ll-account-page .woocommerce-MyAccount-content table.shop_table th,
body.ll-account-page .woocommerce-MyAccount-content table.shop_table td {
    padding: 16px 12px !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ll-account-line) !important;

    background: transparent !important;

    color: rgba(245, 246, 248, .78) !important;
}

body.ll-account-page .woocommerce-MyAccount-content table.shop_table th {
    color: var(--ll-account-muted) !important;

    font-size: 10px !important;
    font-weight: 900 !important;

    letter-spacing: .13em !important;
    text-transform: uppercase !important;
}

body.ll-account-page .woocommerce-Addresses {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 36px !important;

    margin-top: 26px !important;
}

body.ll-account-page .woocommerce-Addresses .woocommerce-Address {
    width: auto !important;
    float: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;
}

body.ll-account-page .woocommerce-Addresses .woocommerce-Address-title {
    margin-bottom: 14px !important;
    padding-bottom: 12px !important;

    border-bottom: 1px solid var(--ll-account-line) !important;
}

body.ll-account-page .woocommerce-MyAccount-content fieldset {
    margin: 28px 0 0 !important;
    padding: 24px 0 0 !important;

    border: 0 !important;
    border-top: 1px solid var(--ll-account-line) !important;

    background: transparent !important;
}

body.ll-account-page .woocommerce-MyAccount-content fieldset legend {
    padding: 0 12px 0 0 !important;
}

body.ll-account-page .woocommerce-MyAccount-content .form-row {
    margin-bottom: 18px !important;
}

body.ll-account-page .woocommerce-MyAccount-content label {
    color: rgba(245, 246, 248, .68) !important;

    font-size: 11px !important;
    font-weight: 850 !important;

    letter-spacing: .08em !important;
}

body.ll-account-page .woocommerce-MyAccount-content input.input-text,
body.ll-account-page .woocommerce-MyAccount-content input[type="text"],
body.ll-account-page .woocommerce-MyAccount-content input[type="email"],
body.ll-account-page .woocommerce-MyAccount-content input[type="password"],
body.ll-account-page .woocommerce-MyAccount-content input[type="tel"],
body.ll-account-page .woocommerce-MyAccount-content select,
body.ll-account-page .woocommerce-MyAccount-content textarea {
    border: 1px solid rgba(255, 255, 255, .10) !important;
    border-radius: 10px !important;

    background: rgba(5, 7, 12, .48) !important;

    color: var(--ll-account-text) !important;

    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

body.ll-account-page .woocommerce-MyAccount-content input:focus,
body.ll-account-page .woocommerce-MyAccount-content select:focus,
body.ll-account-page .woocommerce-MyAccount-content textarea:focus {
    border-color: rgba(138, 255, 0, .38) !important;

    outline: none !important;

    box-shadow:
        0 0 0 2px rgba(138, 255, 0, .06) !important;
}

/* =========================================================
   7. NOTIFICATIONS
   Flat editorial feed rather than cards inside a card.
========================================================= */

body.ll-account-page .ll-notifications-page {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;
}

body.ll-account-page .ll-notifications-list {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
}

body.ll-account-page .ll-notification-card {
    position: relative !important;

    margin: 0 !important;
    padding: 24px 0 !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ll-account-line) !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    overflow: visible !important;

    transform: none !important;

    transition:
        opacity .18s ease,
        border-color .18s ease,
        background .18s ease !important;
}

body.ll-account-page .ll-notification-card:first-child {
    border-top: 1px solid var(--ll-account-line) !important;
}

body.ll-account-page .ll-notification-card:hover {
    transform: none !important;

    border-color: rgba(216, 180, 74, .20) !important;

    background:
        linear-gradient(
            90deg,
            rgba(216, 180, 74, .025),
            transparent 45%
        ) !important;

    box-shadow: none !important;
}

body.ll-account-page .ll-notification-card.is-unread {
    padding-left: 18px !important;

    background:
        linear-gradient(
            90deg,
            rgba(138, 255, 0, .055),
            rgba(139, 77, 255, .025) 32%,
            transparent 62%
        ) !important;

    box-shadow:
        inset 2px 0 0 var(--ll-account-green) !important;
}

body.ll-account-page .ll-notification-card.is-read {
    opacity: .72 !important;
}

body.ll-account-page .ll-notification-card.is-read:hover {
    opacity: .94 !important;
}

body.ll-account-page .ll-notification-card__header {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;

    gap: 18px !important;

    margin: 0 0 9px !important;
}

body.ll-account-page .ll-notification-card__badge {
    display: inline-flex !important;
    align-items: center !important;

    min-height: 0 !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    color: var(--ll-account-green) !important;

    font-size: 9px !important;
    font-weight: 900 !important;

    letter-spacing: .14em !important;
    text-transform: uppercase !important;

    box-shadow: none !important;
}

body.ll-account-page .ll-notification-card__title {
    margin: 0 !important;

    color: #fff7df !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(1.1rem, 1.6vw, 1.35rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    letter-spacing: -.015em !important;
}

body.ll-account-page .ll-notification-card__message {
    margin: 0 0 8px !important;

    color: rgba(245, 246, 248, .72) !important;

    line-height: 1.65 !important;
}

body.ll-account-page .ll-notification-card__date {
    margin: 0 !important;

    color: var(--ll-account-muted-soft) !important;

    font-size: .82rem !important;
}

body.ll-account-page .ll-notification-card__footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 16px !important;

    margin-top: 13px !important;
}

body.ll-account-page .ll-notification-card__action,
body.ll-account-page .ll-notification-card__read-action {
    margin: 0 !important;
}

body.ll-account-page .ll-notification-card__action a,
body.ll-account-page .ll-notification-card__read-action a {
    color: var(--ll-account-gold-bright) !important;

    font-size: .86rem !important;
    font-weight: 750 !important;

    text-decoration: none !important;
}

body.ll-account-page .ll-notification-card__action a:hover,
body.ll-account-page .ll-notification-card__read-action a:hover {
    color: #fff1ad !important;

    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* =========================================================
   8. RICH ENDPOINT OWNERSHIP
========================================================= */

body.ll-account-page.ll-account-endpoint-collector-progress
.woocommerce-MyAccount-content {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    overflow: visible !important;
}

/* =========================================================
   9. TABLET
========================================================= */

@media (max-width: 1180px) and (min-width: 901px) {
    body.ll-account-page .woocommerce {
        width: min(calc(100% - 28px), 1480px) !important;
    }

    body.ll-account-page.logged-in .woocommerce {
        grid-template-columns: 218px minmax(0, 1fr) !important;
        gap: 30px !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation {
        padding-right: 22px !important;
    }
}

/* =========================================================
   10. MOBILE + SMALL TABLET
========================================================= */

@media (max-width: 900px) {
    body.ll-account-page .woocommerce,
    body.ll-account-page.logged-in .woocommerce {
        display: flex !important;
        flex-direction: column !important;

        width: 100% !important;
        max-width: 100% !important;

        gap: 28px !important;

        margin: 24px auto 120px !important;
        padding: 0 18px 100px !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;
        box-shadow: none !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation {
        position: relative !important;
        top: auto !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 0 22px !important;

        border: 0 !important;
        border-bottom: 1px solid var(--ll-account-gold-line) !important;
        border-radius: 0 !important;

        background: transparent !important;
        box-shadow: none !important;

        overflow: visible !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation::after {
        top: 5px;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation ul {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 0 18px !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation li:nth-child(2) {
        border-top: 1px solid var(--ll-account-line) !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation a {
        min-height: 48px !important;

        padding: 0 10px !important;

        font-size: 12px !important;
    }

    body.ll-account-page .ll-account-nav-customer-logout {
        margin-top: 0 !important;
    }

    body.ll-account-page .woocommerce-MyAccount-content {
        margin: 0 !important;
        padding: 0 0 24px !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;
        box-shadow: none !important;
    }

    body.ll-account-page.ll-account-endpoint-collector-progress
    .woocommerce-MyAccount-content {
        padding: 0 !important;
    }

    body.ll-account-page .woocommerce-Addresses {
        grid-template-columns: 1fr !important;

        gap: 28px !important;
    }
}

/* =========================================================
   11. SMALL MOBILE
========================================================= */

@media (max-width: 560px) {
    body.ll-account-page .woocommerce,
    body.ll-account-page.logged-in .woocommerce {
        margin-top: 18px !important;

        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation {
        padding-bottom: 18px !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation ul {
        grid-template-columns: 1fr !important;

        gap: 0 !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation li:nth-child(2) {
        border-top: 0 !important;
    }

    body.ll-account-page .woocommerce-MyAccount-navigation a {
        min-height: 46px !important;

        padding: 0 9px !important;
    }

    body.ll-account-page .woocommerce-MyAccount-content {
        padding: 0 2px 20px !important;
    }

    body.ll-account-page .ll-notification-card {
        padding: 20px 0 !important;
    }

    body.ll-account-page .ll-notification-card.is-unread {
        padding-left: 13px !important;
    }

    body.ll-account-page .ll-notification-card__header,
    body.ll-account-page .ll-notification-card__footer {
        align-items: flex-start !important;
        flex-wrap: wrap !important;
    }
}

/* =========================================================
   12. ACCESSIBILITY
========================================================= */

@media (prefers-reduced-motion: reduce) {
    body.ll-account-page .woocommerce-MyAccount-navigation a,
    body.ll-account-page .woocommerce-MyAccount-navigation a::before,
    body.ll-account-page .woocommerce-MyAccount-navigation a::after,
    body.ll-account-page .ll-notification-card {
        transition: none !important;
    }
}