/* Cart page is scoped so existing LensLoop global styles, flyout and Rx views remain intact. */
.ll-cart-page {
    --ll-ink: #1d2b28;
    --ll-green: #203f37;
    --ll-muted: #697a72;
    --ll-line: #dde5df;
    --ll-soft: #eff5f1;
    max-width: 1260px;
    margin: 0 auto;
    padding: 28px 24px 80px;
    color: var(--ll-ink)
}

    .ll-cart-page * {
        box-sizing: border-box
    }

    .ll-cart-page button, .ll-cart-page select {
        font: inherit
    }

    .ll-cart-page a {
        color: inherit
    }

.ll-cart-steps {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
    margin: 0 0 32px
}

    .ll-cart-steps > div {
        border-top: 5px solid #dee3df;
        padding: 13px 3px 4px;
        display: flex;
        gap: 11px;
        align-items: center;
        color: #8d9992;
        font-size: 14px
    }

        .ll-cart-steps > div.active {
            border-color: var(--ll-green);
            color: var(--ll-ink);
            font-weight: 700
        }

    .ll-cart-steps b {
        display: grid;
        place-items: center;
        background: #e3e8e4;
        color: #88948c;
        width: 27px;
        height: 27px;
        border-radius: 50%;
        flex: none
    }

    .ll-cart-steps .active b {
        background: var(--ll-green);
        color: white
    }

.ll-cart-grid {
    display: grid;
    grid-template-columns: minmax(0,1.7fr) minmax(310px,.95fr);
    gap: 26px
}

.ll-cart-main, .ll-cart-side {
    min-width: 0
}

.ll-cart-page h1 {
    font-size: 34px;
    letter-spacing: -.7px;
    margin: 0 0 8px
}

.ll-cart-page h2 {
    font-size: 23px;
    margin: 0 0 25px
}

.ll-cart-muted {
    color: var(--ll-muted);
    font-size: 14px;
    margin: 0 0 21px
}

.ll-cart-login, .ll-cart-prescription, .ll-cart-item, .ll-cart-summary, .ll-cart-support {
    background: white;
    border: 1px solid var(--ll-line);
    border-radius: 16px
}

.ll-cart-login {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 20px;
    margin: 0 0 25px;
    gap: 20px
}

    .ll-cart-login strong {
        font-size: 14px
    }

    .ll-cart-login p {
        font-size: 12px;
        color: var(--ll-muted);
        margin: 5px 0 0
    }

.ll-cart-outline {
    border: 1px solid #8da399;
    border-radius: 11px;
    background: white;
    padding: 10px 21px;
    text-decoration: none;
    font-weight: 700;
    white-space: nowrap
}

.ll-cart-prescription {
    display: flex;
    gap: 15px;
    align-items: center;
    background: var(--ll-soft);
    padding: 17px 20px;
    margin-bottom: 17px
}

    .ll-cart-prescription p {
        font-size: 13px;
        margin: 5px 0 0;
        color: #50645a
    }

.ll-cart-rx-icon {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    flex: none;
    border-radius: 12px;
    background: white;
    font-size: 20px
}

.ll-cart-item {
    display: grid;
    grid-template-columns: 100px minmax(0,1fr) auto;
    gap: 17px;
    padding: 19px;
    margin-bottom: 13px
}

.ll-cart-picture {
    width: 100px;
    height: 113px;
    border-radius: 11px;
    background: #f3f6f4;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

    .ll-cart-picture img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain
    }

    .ll-cart-picture .placeholder {
        color: #82948a;
        font-size: 25px
    }

.ll-cart-item h3 {
    font-size: 16px;
    line-height: 1.4;
    margin: 2px 0 7px
}

.ll-cart-eye {
    font-size: 13px;
    margin: 0 0 9px
}

.ll-cart-prescription-state {
    color: var(--ll-muted);
    font-size: 12px;
    margin-top: 9px
}

.ll-cart-item-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 14px
}

    .ll-cart-item-actions button, .ll-cart-item-actions a {
        background: none;
        border: 0;
        padding: 0;
        text-decoration: underline;
        text-underline-offset: 3px;
        font-size: 12px;
        color: #486456;
        cursor: pointer
    }

.ll-cart-item-details {
    font-size: 12px;
    line-height: 1.7;
    background: #f6f9f7;
    padding: 13px;
    margin-top: 12px;
    border-radius: 9px
}

.ll-cart-item-right {
    min-width: 115px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 13px
}

    .ll-cart-item-right strong {
        font-size: 16px
    }

    .ll-cart-item-right .controls {
        display: flex;
        gap: 8px;
        align-items: center
    }

    .ll-cart-item-right select {
        border: 1px solid var(--ll-line);
        border-radius: 9px;
        padding: 9px 11px;
        background: white
    }

.ll-cart-remove {
    border: 0;
    background: white;
    color: #64746b;
    padding: 7px;
    font-size: 17px;
    cursor: pointer
}

.ll-cart-summary {
    padding: 24px;
    margin-bottom: 16px
}

.ll-cart-summary-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin: 17px 0;
    font-size: 14px
}

.ll-cart-summary-rule {
    border-top: 1px solid var(--ll-line);
    margin: 24px 0
}

.ll-cart-summary-row.ll-cart-total {
    font-size: 18px
}

.ll-cart-primary {
    width: 100%;
    background: var(--ll-green);
    color: white;
    border: 0;
    border-radius: 11px;
    padding: 16px;
    font-weight: 700;
    cursor: pointer
}

    .ll-cart-primary:disabled {
        opacity: .48;
        cursor: not-allowed
    }

.ll-cart-shipping-offer {
    background: var(--ll-soft);
    padding: 13px;
    border-radius: 9px;
    color: #3b5a4b;
    font-size: 12px
}

.ll-cart-small {
    font-size: 12px;
    line-height: 1.6;
    color: var(--ll-muted)
}

.ll-cart-rewards {
    background: var(--ll-soft);
    border-radius: 11px;
    padding: 16px;
    display: flex;
    gap: 13px;
    margin-top: 23px
}

    .ll-cart-rewards > i {
        font-size: 23px;
        color: #507b50
    }

    .ll-cart-rewards strong {
        font-size: 13px
    }

    .ll-cart-rewards p, .ll-cart-support p {
        font-size: 12px;
        color: var(--ll-muted);
        margin: 5px 0 0;
        line-height: 1.6
    }

.ll-cart-support {
    padding: 22px;
    display: flex;
    gap: 15px
}

    .ll-cart-support > i {
        font-size: 22px
    }

    .ll-cart-support strong {
        font-size: 14px
    }

.ll-cart-loading, .ll-cart-empty {
    border: 1px dashed var(--ll-line);
    border-radius: 14px;
    padding: 45px 24px;
    text-align: center;
    color: var(--ll-muted)
}

.ll-cart-error {
    background: #fff0ee;
    border: 1px solid #edc6c0;
    padding: 13px;
    border-radius: 9px;
    color: #8b2920;
    margin-bottom: 12px
}

.ll-cart-page [hidden] {
    display: none !important
}

@media(max-width:850px) {
    .ll-cart-grid {
        grid-template-columns: 1fr
    }

    .ll-cart-page {
        padding: 22px 16px
    }

    .ll-cart-steps {
        gap: 8px
    }

        .ll-cart-steps > div {
            font-size: 12px
        }
}

@media(max-width:540px) {
    .ll-cart-item {
        grid-template-columns: 74px minmax(0,1fr);
        padding: 14px;
        gap: 12px
    }

    .ll-cart-picture {
        width: 74px;
        height: 88px
    }

    .ll-cart-item-right {
        grid-column: 2;
        align-items: flex-start;
        flex-direction: row;
        justify-content: space-between
    }

    .ll-cart-login {
        align-items: flex-start
    }

    .ll-cart-page h1 {
        font-size: 29px
    }

    .ll-cart-steps > div {
        gap: 5px
    }

    .ll-cart-steps b {
        width: 22px;
        height: 22px
    }
}

/* Blister Bucks wallet: intentionally scoped to the cart page. */
.ll-cart-wallet {
    border: 1px solid var(--ll-line);
    background: #fff;
    border-radius: 17px;
    padding: 22px;
    margin-bottom: 18px
}

.ll-cart-wallet-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px
}

.ll-cart-wallet-icon {
    background: #e9f1ea;
    width: 48px;
    height: 48px;
    flex: none;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-size: 22px;
    color: #345c43
}

.ll-cart-wallet-heading > div {
    min-width: 0;
    flex: 1
}

.ll-cart-wallet-heading h2 {
    font-size: 18px;
    margin: 0 0 5px
}

.ll-cart-wallet-heading p {
    font-size: 12px;
    line-height: 1.5;
    color: var(--ll-muted);
    margin: 0
}

.ll-cart-wallet-status {
    color: #406c52;
    background: #edf5ee;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 700;
    border-radius: 100px;
    white-space: nowrap
}

.ll-cart-wallet-guest, .ll-cart-wallet-notice {
    font-size: 13px;
    line-height: 1.6;
    color: var(--ll-muted)
}

    .ll-cart-wallet-guest strong {
        color: var(--ll-ink)
    }

    .ll-cart-wallet-guest p {
        margin: 7px 0 18px
    }

    .ll-cart-wallet-guest a {
        display: inline-block
    }

.ll-cart-wallet-balance {
    background: var(--ll-soft);
    padding: 20px;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px
}

    .ll-cart-wallet-balance span, .ll-cart-wallet-pending, .ll-cart-wallet-range-labels, .ll-cart-wallet-note {
        font-size: 12px;
        color: var(--ll-muted)
    }

    .ll-cart-wallet-balance strong {
        font-size: 34px;
        color: var(--ll-green);
        line-height: 1.2
    }

.ll-cart-wallet-pending {
    margin: 14px 0;
    border-bottom: 1px solid var(--ll-line);
    padding-bottom: 15px
}

.ll-cart-wallet-controls {
    padding-top: 12px
}

    .ll-cart-wallet-controls label {
        font-size: 14px;
        font-weight: 700;
        display: block;
        margin-bottom: 18px
    }

    .ll-cart-wallet-controls input[type=range] {
        width: 100%;
        accent-color: var(--ll-green);
        cursor: pointer
    }

    .ll-cart-wallet-controls input:disabled {
        opacity: .5;
        cursor: default
    }

.ll-cart-wallet-range-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 7px
}

.ll-cart-wallet-apply {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 18px
}

    .ll-cart-wallet-apply strong {
        font-size: 23px;
        color: #365d46
    }

    .ll-cart-wallet-apply span {
        font-size: 12px;
        color: var(--ll-muted)
    }

    .ll-cart-wallet-apply button:disabled {
        opacity: .5;
        cursor: not-allowed
    }

.ll-cart-wallet-note {
    line-height: 1.5;
    margin: 17px 0 0
}

.ll-cart-wallet-discount {
    color: #23764f
}

@media(max-width:540px) {
    .ll-cart-wallet {
        padding: 16px
    }

    .ll-cart-wallet-heading {
        flex-wrap: wrap
    }

    .ll-cart-wallet-status {
        margin-left: 60px
    }

    .ll-cart-wallet-apply {
        flex-wrap: wrap
    }
}

/* Wallet now flows after product rows in the left cart column. */
.ll-cart-main > .ll-cart-wallet {
    margin-top: 20px;
    margin-bottom: 22px
}

.ll-cart-side > .ll-cart-summary {
    margin-top: 0
}

.ll-cart-wallet-preview-label {
    color: var(--ll-muted);
    font-size: 12px
}

.ll-cart-wallet-controls input[type=range]:not(:disabled) {
    opacity: 1;
    cursor: pointer
}

/* Approved Blister Bucks placement: selected amount beside available balance. */
.ll-cart-wallet-balance {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap
}

.ll-cart-wallet-balance-available, .ll-cart-wallet-balance-selected {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.ll-cart-wallet-balance-selected {
    text-align: right;
    margin-left: auto
}

    .ll-cart-wallet-balance-selected strong {
        font-size: 29px
    }

.ll-cart-wallet-apply {
    justify-content: flex-end
}

    .ll-cart-wallet-apply .ll-cart-primary {
        width: auto;
        min-width: 170px;
        padding: 12px 24px
    }

@media(max-width:540px) {
    .ll-cart-wallet-balance-selected strong {
        font-size: 25px
    }

    .ll-cart-wallet-apply .ll-cart-primary {
        width: 100%
    }
}


/* Cart loading skeleton. Restrict styles to cart regions; FlyoutCart is unchanged. */
.ll-cart-page .ll-cart-skeleton-block, .ll-cart-page .ll-cart-skeleton-line {
    display: block;
    position: relative;
    overflow: hidden;
    background: #e8eee9;
    border-radius: 7px;
}

.ll-cart-page .ll-cart-skeleton-line {
    height: 13px;
    max-width: 100%
}

    .ll-cart-page .ll-cart-skeleton-block::after, .ll-cart-page .ll-cart-skeleton-line::after {
        content: "";
        position: absolute;
        inset: 0;
        transform: translateX(-100%);
        background: linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
        animation: ll-cart-skeleton-shimmer 1.55s ease-in-out infinite;
    }

@keyframes ll-cart-skeleton-shimmer {
    100% {
        transform: translateX(100%)
    }
}

.ll-cart-skeleton-item {
    min-height: 157px
}

    .ll-cart-skeleton-item .ll-cart-picture {
        height: 113px
    }

.ll-cart-skeleton-description {
    padding-top: 5px;
    min-width: 0
}

    .ll-cart-skeleton-description .ll-cart-skeleton-line {
        margin-bottom: 13px
    }

.ll-cart-skeleton-title {
    width: 78%;
    height: 18px !important
}

.ll-cart-skeleton-eye {
    width: 30%
}

.ll-cart-skeleton-meta {
    width: 65%
}

.ll-cart-skeleton-link {
    width: 39%;
    margin-top: 18px
}

.ll-cart-skeleton-price {
    min-width: 115px;
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 19px
}

.ll-cart-skeleton-amount {
    width: 91px;
    height: 19px !important
}

.ll-cart-skeleton-quantity {
    width: 82px;
    height: 42px;
    border-radius: 9px !important
}

.ll-cart-wallet-skeleton-balance {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    background: var(--ll-soft);
    padding: 23px;
    border-radius: 12px
}

    .ll-cart-wallet-skeleton-balance > div {
        display: flex;
        flex-direction: column;
        gap: 13px
    }

        .ll-cart-wallet-skeleton-balance > div:last-child {
            align-items: flex-end
        }

.ll-cart-wallet-skeleton-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    margin-top: 24px
}

.ll-cart-summary {
    position: relative
}

.ll-cart-summary-skeleton {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 1;
    background: #fff;
    border-radius: 16px;
    padding: 24px
}

.ll-cart-page[data-cart-loading="true"] .ll-cart-summary-skeleton {
    display: block
}

.ll-cart-skeleton-summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 22px 0
}

.ll-cart-skeleton-summary-rule {
    border-top: 1px solid var(--ll-line);
    margin: 27px 0
}

@media(max-width:540px) {
    .ll-cart-skeleton-item .ll-cart-picture {
        width: 74px;
        height: 88px
    }

    .ll-cart-skeleton-price {
        grid-column: 2;
        flex-direction: row;
        align-items: center;
        justify-content: space-between
    }

    .ll-cart-wallet-skeleton-balance {
        padding: 16px
    }
}

@media(prefers-reduced-motion:reduce) {
    .ll-cart-page .ll-cart-skeleton-block::after, .ll-cart-page .ll-cart-skeleton-line::after {
        animation: none
    }
}

/* Cart readability: scope increases to cart content, not checkout steps. */
.ll-cart-page .ll-cart-item h3 {
    font-size: 19px;
    line-height: 1.4
}

.ll-cart-page .ll-cart-eye {
    font-size: 15px
}

.ll-cart-page .ll-cart-prescription-state {
    font-size: 14px;
    line-height: 1.6
}

.ll-cart-page .ll-cart-item-actions button, .ll-cart-page .ll-cart-item-actions a {
    font-size: 14px
}

.ll-cart-page .ll-cart-item-details {
    font-size: 14px;
    line-height: 1.6
}

.ll-cart-page .ll-cart-summary-row {
    font-size: 16px
}

.ll-cart-page .ll-cart-muted {
    font-size: 16px
}

.ll-cart-page .ll-cart-wallet-heading p, .ll-cart-page .ll-cart-rewards p {
    font-size: 14px
}

.ll-cart-page .ll-cart-rx-values {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
    margin: 10px 0 0
}

    .ll-cart-page .ll-cart-rx-values div {
        min-width: 0
    }

    .ll-cart-page .ll-cart-rx-values dt {
        font-weight: 700;
        color: #4d6357;
        font-size: 12px
    }

    .ll-cart-page .ll-cart-rx-values dd {
        margin: 3px 0 0;
        overflow-wrap: anywhere
    }

@media(max-width:540px) {
    .ll-cart-page .ll-cart-rx-values {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }
}

/* Rx remove modal and item-level actions; scoped to the cart. */
.ll-cart-rx-management {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 12px
}

    .ll-cart-rx-management button, .ll-cart-rx-replace {
        font: inherit;
        font-size: 14px;
        background: none;
        color: #254b3e;
        border: 0;
        text-decoration: underline;
        cursor: pointer;
        padding: 4px 0
    }

.ll-cart-rx-dialog[hidden] {
    display: none !important
}

.ll-cart-rx-dialog {
    position: fixed;
    inset: 0;
    background: #13252098;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px
}

.ll-cart-rx-dialog-panel {
    max-width: 460px;
    width: 100%;
    padding: 28px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 60px #071b1935
}

    .ll-cart-rx-dialog-panel h2 {
        margin: 0 0 12px;
        font-size: 24px
    }

    .ll-cart-rx-dialog-panel p {
        font-size: 15px;
        line-height: 1.6;
        color: #63736d
    }

.ll-cart-rx-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px
}

    .ll-cart-rx-dialog-actions button {
        font: inherit;
        border-radius: 10px;
        padding: 12px 17px;
        cursor: pointer
    }

    .ll-cart-rx-dialog-actions .ll-cart-rx-cancel {
        border: 1px solid #b7c5bd;
        background: #fff
    }

    .ll-cart-rx-dialog-actions .ll-cart-rx-confirm {
        border: 0;
        background: #234137;
        color: #fff;
        font-weight: 700
    }

/* Missing prescription: per-cart-item action, linked to existing CheckoutRxMethod. */
.ll-cart-rx-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 16px;
    margin-top: 14px;
    background: #fff8eb;
    border: 1px solid #ebd8a9;
    border-radius: 12px;
}

.ll-cart-rx-alert-icon {
    flex: none;
    color: #a9781c;
    font-size: 19px;
    line-height: 1.3;
}

.ll-cart-rx-alert-content {
    min-width: 0;
}

    .ll-cart-rx-alert-content strong {
        display: block;
        color: #654b20;
        font-size: 14px;
    }

    .ll-cart-rx-alert-content p {
        margin: 5px 0 10px;
        color: #766344;
        font-size: 13px;
    }

.ll-cart-rx-alert-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #29483b;
    font-size: 13px;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

    .ll-cart-rx-alert-link:hover, .ll-cart-rx-alert-link:focus-visible {
        color: #162f25;
    }