/*
 * BrightMind Hub — Access Page
 * Independent page stylesheet.
 * Scoped to .access-page to avoid conflicts with app.css.
 */

.access-page,
.access-page * {
    box-sizing: border-box;
}

.access-page {
    width: min(1080px, 94%) !important;
    max-width: 1080px !important;
    margin: 0 auto !important;
    padding: 34px 0 58px !important;
    color: #17301f !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.access-shell {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 380px !important;
    gap: 28px !important;
    align-items: stretch !important;
}

.access-resource-panel {
    min-width: 0 !important;
    padding: 8px 0 !important;
}

.access-kicker {
    display: inline-block !important;
    margin: 0 0 8px !important;
    color: #15803d !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
}

.access-page h1 {
    margin: 0 !important;
    color: #123b25 !important;
    font-size: 27px !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
}

.access-lead,
.access-heading p {
    margin: 10px 0 0 !important;
    color: #63736a !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.resource-preview,
.access-selected-resource {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 22px !important;
    padding: 16px !important;
    background: #fff !important;
    border: 1px solid #dce7df !important;
    border-radius: 11px !important;
}

.resource-preview-icon,
.selected-resource-icon,
.library-file-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 54px !important;
    height: 54px !important;
    border: 1px solid #b9dcc6 !important;
    border-radius: 9px !important;
    background: #f1faf4 !important;
    color: #166534 !important;
    font-size: 9px !important;
    font-weight: 900 !important;
}

.resource-preview-content,
.selected-resource-content,
.library-resource-body {
    min-width: 0 !important;
}

.resource-label {
    display: block !important;
    margin: 0 0 5px !important;
    color: #15803d !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
}

.resource-preview h2,
.access-selected-resource h2 {
    margin: 0 !important;
    color: #173d27 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

.resource-price,
.selected-resource-price {
    display: inline-block !important;
    margin-top: 6px !important;
    color: #166534 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.access-note {
    margin-top: 13px !important;
    padding: 12px 14px !important;
    border-left: 3px solid #15803d !important;
    background: #f5faf6 !important;
    color: #68776f !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
}

.access-note strong {
    color: #285337 !important;
}

.access-account-card {
    padding: 24px !important;
    background: #fff !important;
    border: 1px solid #dce7df !important;
    border-radius: 13px !important;
    box-shadow: 0 9px 28px rgba(15,50,28,.06) !important;
}

.access-card-kicker {
    display: block !important;
    margin-bottom: 7px !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .1em !important;
}

.access-account-card h2 {
    margin: 0 !important;
    color: #173d27 !important;
    font-size: 19px !important;
    line-height: 1.25 !important;
}

.access-account-card p {
    margin: 8px 0 20px !important;
    color: #6b7971 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

.access-actions {
    display: grid !important;
    gap: 8px !important;
}

.access-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-height: 39px !important;
    padding: 9px 12px !important;
    border-radius: 8px !important;
    font-family: inherit !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    text-align: center !important;
    transition: .15s ease !important;
}

.access-btn:hover {
    transform: translateY(-1px) !important;
}

.access-btn-primary {
    border: 1px solid #15803d !important;
    background: #15803d !important;
    color: #fff !important;
}

.access-btn-primary:hover {
    border-color: #166534 !important;
    background: #166534 !important;
}

.access-btn-secondary {
    border: 1px solid #d0ddd4 !important;
    background: #fff !important;
    color: #245333 !important;
}

.access-btn-secondary:hover {
    background: #f4f9f5 !important;
    border-color: #aac5b2 !important;
}

.access-heading {
    margin-bottom: 18px !important;
}

.access-selected-resource {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding: 14px 16px !important;
}

.access-section-label {
    margin: 0 0 10px !important;
    color: #5c6d63 !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .1em !important;
}

.choice-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

.choice-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    padding: 19px !important;
    background: #fff !important;
    border: 1px solid #dce7df !important;
    border-radius: 11px !important;
}

.choice-card.featured {
    border-color: #b9dcc6 !important;
    box-shadow: 0 5px 18px rgba(15,50,28,.04) !important;
}

.choice-card-top {
    min-height: 63px !important;
}

.choice-badge {
    display: inline-block !important;
    margin-bottom: 7px !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
    background: #eaf7ee !important;
    color: #166534 !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    letter-spacing: .07em !important;
}

.choice-badge.individual {
    background: #f4f7f5 !important;
    color: #5d6d64 !important;
}

.choice-card h2 {
    margin: 0 !important;
    color: #173d27 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

.choice-description {
    min-height: 38px !important;
    margin: 10px 0 13px !important;
    color: #6c7972 !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
}

.choice-price {
    color: #123b25 !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: -.03em !important;
}

.choice-price small {
    margin-right: 4px !important;
    color: #718078 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.choice-meta {
    margin: 8px 0 16px !important;
    color: #7a8880 !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
}

.choice-card .access-btn {
    margin-top: auto !important;
}

.access-payment-note {
    display: flex !important;
    gap: 8px !important;
    align-items: baseline !important;
    margin: 16px 0 35px !important;
    padding: 11px 13px !important;
    background: #f5faf6 !important;
    border: 1px solid #dcebe0 !important;
    border-radius: 8px !important;
    color: #68776f !important;
    font-size: 10px !important;
    line-height: 1.5 !important;
}

.access-payment-note strong {
    flex: 0 0 auto !important;
    color: #28603a !important;
    font-size: 10px !important;
}

.access-library-heading {
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 20px !important;
    margin: 0 0 12px !important;
}

.access-library-heading h2 {
    margin: 0 !important;
    color: #173d27 !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

.access-view-all {
    flex: 0 0 auto !important;
    color: #15803d !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.access-view-all:hover {
    color: #166534 !important;
}

.access-resource-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.library-resource-card {
    display: flex !important;
    gap: 11px !important;
    min-width: 0 !important;
    padding: 12px !important;
    background: #fff !important;
    border: 1px solid #dfe8e2 !important;
    border-radius: 9px !important;
}

.library-resource-card.is-current {
    border-color: #9bc7aa !important;
    background: #fbfefc !important;
}

.library-file-icon {
    width: 43px !important;
    height: 43px !important;
    border-radius: 7px !important;
    font-size: 7px !important;
}

.library-resource-body {
    flex: 1 1 auto !important;
}

.library-resource-body h3 {
    margin: 0 !important;
    color: #173d27 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 800 !important;
}

.library-resource-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin-top: 9px !important;
}

.library-price {
    color: #166534 !important;
    font-size: 10px !important;
    font-weight: 800 !important;
}

.library-resource-footer a {
    color: #15803d !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.library-resource-footer a:hover {
    text-decoration: underline !important;
}

.current-label {
    color: #7a8880 !important;
    font-size: 9px !important;
    font-weight: 700 !important;
}

.access-empty {
    grid-column: 1 / -1 !important;
    padding: 25px !important;
    text-align: center !important;
    border: 1px dashed #cbd9d0 !important;
    border-radius: 10px !important;
    color: #718078 !important;
    font-size: 12px !important;
}

@media (max-width: 900px) {
    .access-shell {
        grid-template-columns: 1fr !important;
    }

    .access-account-card {
        max-width: 560px !important;
    }

    .choice-grid,
    .access-resource-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 560px) {
    .access-page {
        width: 94% !important;
        padding: 24px 0 38px !important;
    }

    .access-page h1 {
        font-size: 23px !important;
    }

    .choice-grid,
    .access-resource-grid {
        grid-template-columns: 1fr !important;
    }

    .access-library-heading {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 6px !important;
    }

    .access-payment-note {
        flex-direction: column !important;
        gap: 3px !important;
    }
}