/*
 * Priyaas — design corrections (October 2026).
 *
 * Loaded after priyaas-modern.css and priyaas-conversion.css, so it wins on
 * source order alone. Each block names the item it fixes in
 * docs/design-corrections.md. The root font size is 10px: 1.6rem is 16px.
 */

/* -- S12. "Shop Our Collection": six tiles, one even row --------------------
 * Six tiles in a four-column grid left two orphans and half a row of white
 * space. Desktop shows all six side by side; tablets already get two rows of
 * three and phones three rows of two (index.php). */
@media (min-width: 1200px) {
    .collection__grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 14px;
    }

    .collection__card {
        border-radius: 22px;
    }

    .collection__card--content {
        inset: auto 10px 14px;
    }

    .collection__pill {
        min-height: 40px;
        padding: 8px 14px;
        font-size: 1.1rem;
        letter-spacing: 0.1em;
    }
}

/* -- S14. Section rhythm on the home and product pages ----------------------
 * Both neighbours carried 80px of padding, so these pairs sat 160px apart,
 * twice the gap between every other section. The FAQ is preceded by its own
 * <style> block, hence ~ rather than +. */
.deals__banner--section + .banner__section,
.testimonial__section ~ .priyaas-faq,
.product__section ~ .priyaas-faq {
    padding-top: 0;
}

/* -- S15. Banner headings stay clear of the photo on phones ----------------- */
@media (max-width: 575.98px) {
    .banner__items--content {
        max-width: 62%;
    }

    .banner__items--content__title br {
        display: none;
    }
}

/* -- S13. Page banner titles stay left of the model photo ------------------- */
@media (min-width: 992px) {
    .breadcrumb__bg .breadcrumb__content {
        max-width: 62%;
        margin-inline: auto;
    }
}

@media (min-width: 1400px) {
    .breadcrumb__bg .breadcrumb__content {
        max-width: 820px;
    }
}

/* -- S9. Shop sidebar: the active filter is shown, not spelled out ----------
 * The category list sat collapsed under an accordion whose only trigger was
 * the "All Categories" link itself, so clicking it navigated instead of
 * opening: the categories were never seen. The list is simply open now. */
.widget__categories--sub__menu {
    display: block;
}

.widget__categories--menu__text.is-active {
    color: var(--pm-accent);
    font-weight: 600;
}

.widget__categories--sub__menu--link.is-active {
    color: var(--pm-accent);
    font-weight: 600;
}

.widget__categories--sub__menu--link.is-active .widget__categories--sub__menu--text::before {
    content: "";
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    margin-right: 0.8rem;
    border-radius: 50%;
    background: currentColor;
    vertical-align: 0.15em;
}

.widget__count {
    color: var(--pm-faint);
    font-weight: 400;
}

/* -- S4 / S16. Cart and wishlist ------------------------------------------- */
.cart__empty {
    display: none;
    max-width: 52rem;
    margin: 0 auto;
    padding: 2rem 0 1rem;
}

.cart__section--inner.is-empty .cart__empty {
    display: block;
}

.cart__section--inner.is-empty .cart__filled,
.cart__section--inner.is-empty .checkout__variant--notice {
    display: none !important;
}

.cart__empty--icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 7.2rem;
    height: 7.2rem;
    margin-bottom: 1.8rem;
    border-radius: 50%;
    background: var(--pm-accent-soft);
    color: var(--pm-accent);
}

.cart__empty--title {
    font-size: 2.6rem;
    margin-bottom: 1rem;
}

.cart__empty--desc {
    color: var(--pm-muted);
    font-size: 1.6rem;
    line-height: 1.6;
    margin-bottom: 2.4rem;
}

.cart__empty--actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1.2rem 2.4rem;
}

.cart__empty--link {
    color: var(--pm-accent);
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 0.3em;
}

.cart__summary--title {
    font-size: 2rem;
    margin-bottom: 1.4rem;
}

.cart__summary--total__table {
    width: 100%;
}

.cart__summary--total__title {
    color: var(--pm-ink-2);
    font-size: 1.5rem;
    text-transform: none;
}

/* The template makes each row a flex box, so a border on the cells drew two
 * short dashes; the rule sits on the row instead. */
.cart__summary--total__list {
    align-items: baseline;
    margin: 0;
}

.cart__summary--total__list > td {
    padding: 0.6rem 0;
    line-height: 1.5;
}

/* The saving is quiet; the bundle discount, money off this order, is the
   green that stands out (docs/combo-offer.md). */
.cart__summary--savings > td {
    color: #1b7a43;
    font-weight: 500;
}

.cart__summary--discount > td {
    color: #1b7a43;
    font-weight: 600;
}

.cart__summary--grand {
    margin-top: 0.8rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--pm-line);
}

.cart__summary--grand > td {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--pm-ink);
}

.cart__summary--footer {
    display: grid;
    gap: 1.2rem;
}

.cart__summary--footer__btn.primary__btn {
    display: block;
    width: 100%;
    text-align: center;
}

.cart__summary--footer__desc {
    font-size: 1.35rem;
    line-height: 1.6;
    color: var(--pm-faint);
    margin: 0;
}

.Priyaas-cart-breakdown:empty {
    display: none;
}

/* A cart line on a phone: photo, name and variant on top; unit price,
 * quantity and line total on one row under it. The template stacked each cell
 * into its own full-width centred row, about 300px per item. */
@media (max-width: 767.98px) {
    .cart__table--body__items:not(.cart__variant--row) {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        gap: 1rem 1.2rem;
        padding: 1.6rem 0;
        border-bottom: 1px solid var(--pm-line);
    }

    .cart__table--body__items:not(.cart__variant--row) > .cart__table--body__list {
        display: block;
        padding: 0;
        border: 0;
    }

    .cart__table--body__items:not(.cart__variant--row) > .cart__table--body__list:first-child {
        grid-column: 1 / -1;
    }

    .cart__table--body__items:not(.cart__variant--row) > .cart__table--body__list:last-child {
        text-align: right;
    }

    .cart__table--body__items .cart__product {
        align-items: flex-start !important;
    }

    .cart__table--body__items .cart__thumbnail {
        flex: 0 0 7.2rem;
        max-width: 7.2rem;
    }

    .cart__table--body__items .cart__content {
        min-width: 0;
        padding-left: 1.2rem;
    }

    .cart__table--body__items .cart__price {
        font-size: 1.5rem;
    }

    .cart__table--body__items .cart__price.end {
        font-weight: 700;
    }

    .cart__table--body__items .cart__remove--btn {
        flex: 0 0 auto;
        margin-right: 1rem;
    }

    /* The wishlist's stock cell says nothing a phone needs. */
    [data-Priyaas-wishlist-shell] .cart__table--body__items > .cart__table--body__list:nth-child(3) {
        display: none;
    }

    [data-Priyaas-wishlist-shell] .cart__table--body__items:not(.cart__variant--row) {
        grid-template-columns: 1fr auto;
    }

    .continue__shopping {
        padding-top: 1.6rem;
    }
}

/* -- S6 / S7. Checkout summary --------------------------------------------- */
.checkout__total--title,
.checkout__total--footer__title {
    font-family: inherit;
}

.Priyaas-checkout-breakdown[hidden] {
    display: none;
}

.checkout__footer {
    display: block;
    width: 100%;
}

.checkout__footer .copyright__content {
    max-width: none;
    font-size: 1.3rem;
}

/* -- S8. Product page share row -------------------------------------------- */
.product__share {
    gap: 0.8rem;
}

.product__share--title {
    margin-right: 0.4rem;
    font-weight: 600;
    color: var(--pm-ink);
}

.product__share--btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 3.6rem;
    padding: 0 1.4rem;
    border: 1px solid var(--pm-line-strong);
    border-radius: 999px;
    background: var(--pm-surface);
    color: var(--pm-ink-2);
    font-size: 1.35rem;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
}

.product__share--btn:hover,
.product__share--btn:focus-visible {
    border-color: var(--pm-accent);
    color: var(--pm-accent);
}

.product__share--btn.is-whatsapp {
    color: #128c4b;
}

.product__share--btn[hidden] {
    display: none;
}

/* Checkout step 2: the padlock beside "Choose payment method". */
.checkout__payment--lock {
    display: inline-flex;
    color: #1b7a43;
}

/* Header perks strip (priyaas-modern.css): its 48px gap also applied between
   wrapped rows, so from 768px to about 1100px the fourth perk sat alone on a
   second line under a wide empty band. Tighter at those widths, and a small
   row gap if it still wraps. */
.pm-usp__track {
    row-gap: 0.6rem;
}

@media only screen and (min-width: 768px) and (max-width: 1199.98px) {
    .pm-usp__track {
        column-gap: 2.4rem;
    }

    .pm-usp__item {
        font-size: 1.2rem;
    }
}

/* Small tablets: three perks fit one row; the fourth (the weaves) waits for
   the wider screens and the phone marquee. */
@media only screen and (min-width: 768px) and (max-width: 919.98px) {
    .pm-usp__item:nth-child(4) {
        display: none;
    }
}
