/* Batch 2C inactive presentation layer. Every selector is public and namespaced. */
.hybrid-v3-marketplace,
.hybrid-v3-marketplace-form,
.hybrid-v3-artwork-card {
    --hybrid-v3-marketplace-ink: #000;
    --hybrid-v3-marketplace-orange: #ff630c;
    --hybrid-v3-marketplace-sand: #f6f3ee;
    color: var(--hybrid-v3-marketplace-ink);
}

.hybrid-v3-marketplace :where(h1, h2, h3, h4),
.hybrid-v3-artwork-card :where(h1, h2, h3, h4) {
    font-family: 'Cormorant Garamond', 'Noto Sans Arabic', Georgia, serif;
    letter-spacing: -.03em;
}

.hybrid-v3-marketplace :where(p, li, dt, dd, a, button, label, input, select, textarea),
.hybrid-v3-artwork-card :where(p, li, dt, dd, a, button) {
    overflow-wrap: anywhere;
}

.hybrid-v3-marketplace :where(.border-line, .border-ink\/10),
.hybrid-v3-artwork-card :where(.border-line, .border-ink\/10) {
    border-color: rgb(0 0 0 / .1);
}

.hybrid-v3-marketplace :where(.bg-paper, .bg-warm-white),
.hybrid-v3-artwork-card :where(.bg-paper, .bg-warm-white) {
    background: var(--hybrid-v3-marketplace-sand);
}

.hybrid-v3-marketplace :where(.home-eyebrow, .eyebrow),
.hybrid-v3-artwork-card :where(.home-eyebrow, .eyebrow) {
    color: var(--hybrid-v3-marketplace-orange);
}

.hybrid-v3-marketplace :where(a, button):focus-visible,
.hybrid-v3-artwork-card :where(a, button):focus-visible {
    outline: 3px solid var(--hybrid-v3-marketplace-orange);
    outline-offset: 4px;
}

.hybrid-v3-marketplace :where(img, video),
.hybrid-v3-artwork-card :where(img, video) {
    max-width: 100%;
}

/* Public carpet catalogue alignment with the current NAFA collection page. */
.carpet-collection-page .carpet-collection-hero {
    background: #f6f3ee;
}

.carpet-collection-page .carpet-collection-hero .public-container {
    padding-block: 7rem;
}

.carpet-collection-page .carpet-collection-hero .button-primary {
    box-shadow: 0 1rem 2rem rgb(0 0 0 / .08);
}

.carpet-collection-page .carpet-discovery-panel {
    box-shadow: inset 0 0 0 1px rgb(0 0 0 / .035);
}

.carpet-collection-page .carpet-category-nav {
    background: #fff;
}

.carpet-collection-page .carpet-category-nav > div {
    scrollbar-width: thin;
    scrollbar-color: rgb(0 0 0 / .25) transparent;
}

.carpet-collection-page .carpet-results-heading {
    border-bottom: 1px solid rgb(0 0 0 / .1);
    padding-bottom: 1.25rem;
}

.carpet-collection-page .carpet-colour-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

.carpet-collection-page .carpet-colour-option {
    display: grid;
    min-width: 0;
    justify-items: center;
    gap: .4rem;
    cursor: pointer;
    text-align: center;
}

.carpet-collection-page .carpet-colour-tile {
    position: relative;
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border: 2px solid rgb(0 0 0 / .14);
    border-radius: .75rem;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / .55);
    transition: transform .15s ease, box-shadow .15s ease;
}

.carpet-collection-page .carpet-colour-option:hover .carpet-colour-tile,
.carpet-collection-page .carpet-colour-option:focus-within .carpet-colour-tile {
    transform: translateY(-1px);
    box-shadow: 0 0 0 3px rgb(255 99 12 / .2), inset 0 0 0 1px rgb(255 255 255 / .65);
}

.carpet-collection-page .carpet-colour-option input:checked + .carpet-colour-tile {
    border-color: #ff630c;
    box-shadow: 0 0 0 3px rgb(255 99 12 / .3), inset 0 0 0 1px rgb(255 255 255 / .65);
}

.carpet-collection-page .carpet-colour-tile__check {
    display: grid;
    width: 1.25rem;
    height: 1.25rem;
    place-items: center;
    border-radius: 999px;
    background: rgb(0 0 0 / .7);
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    opacity: 0;
}

.carpet-collection-page .carpet-colour-option input:checked + .carpet-colour-tile .carpet-colour-tile__check {
    opacity: 1;
}

.carpet-collection-page .carpet-colour-option__label {
    max-width: 5.5rem;
    font-size: .75rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.carpet-collection-page .carpet-colour-tile--beige { background: #d6c3a5; }
.carpet-collection-page .carpet-colour-tile--ivory { background: #f4efdf; }
.carpet-collection-page .carpet-colour-tile--white { background: #fff; }
.carpet-collection-page .carpet-colour-tile--black { background: #1e1e1e; }
.carpet-collection-page .carpet-colour-tile--grey { background: #8e9297; }
.carpet-collection-page .carpet-colour-tile--blue { background: #4779a8; }
.carpet-collection-page .carpet-colour-tile--green { background: #5d805f; }
.carpet-collection-page .carpet-colour-tile--red { background: #a94843; }
.carpet-collection-page .carpet-colour-tile--orange { background: #df7b34; }
.carpet-collection-page .carpet-colour-tile--yellow { background: #e3bd45; }
.carpet-collection-page .carpet-colour-tile--gold { background: #c99a2e; }
.carpet-collection-page .carpet-colour-tile--brown { background: #80583f; }
.carpet-collection-page .carpet-colour-tile--pink { background: #d28b9c; }
.carpet-collection-page .carpet-colour-tile--purple { background: #82619b; }
.carpet-collection-page .carpet-colour-tile--multicolour { background: conic-gradient(#a94843 0 16%, #e3bd45 16% 33%, #5d805f 33% 50%, #4779a8 50% 67%, #82619b 67% 84%, #df7b34 84% 100%); }

@media (max-width: 47.99rem) {
    .carpet-collection-page .carpet-collection-hero .public-container {
        padding-block: 4rem;
    }

    .carpet-collection-page .carpet-category-nav button {
        margin-inline-start: auto;
    }

    .carpet-collection-page .carpet-colour-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

.hybrid-v3-marketplace-form :where(input, select, textarea) {
    border-radius: 1rem;
    border-color: rgb(0 0 0 / .15);
    background: var(--hybrid-v3-marketplace-sand);
}

.hybrid-v3-marketplace-form :where(button, [type='submit']) {
    border-radius: 999px;
}

.hybrid-v3-marketplace--detail .artwork-detail-panel {
    border: 1px solid rgb(0 0 0 / .1);
    border-radius: 1.5rem;
    background: #fff;
    padding: 1.5rem;
    box-shadow: 0 14px 36px rgb(0 0 0 / .06);
}

.hybrid-v3-marketplace--detail .artwork-detail-panel :where(p, dd, dt, label, legend) {
    font-family: 'DM Sans', 'Noto Sans Arabic', sans-serif;
}

.hybrid-v3-marketplace--detail .artwork-detail-panel :where(input, select, textarea) {
    min-height: 3rem;
    font-size: 1rem;
    line-height: 1.5;
}

.hybrid-v3-marketplace--detail .artwork-detail-panel textarea {
    min-height: 7rem;
}

.hybrid-v3-marketplace--detail .artwork-detail-panel :where(button, a) {
    min-height: 3rem;
    line-height: 1.35;
}

.hybrid-v3-marketplace--detail [data-artwork-figure] img {
    max-height: min(72dvh, 52rem);
}

@media (min-width: 48rem) {
    .hybrid-v3-marketplace--detail .artwork-detail-panel {
        padding: 2rem;
    }
}

@media (max-width: 47.99rem) {
    .hybrid-v3-marketplace--detail .artwork-detail-panel {
        border-radius: 1rem;
        padding: 1.25rem;
    }
}

@media (max-width: 48rem) {
    .hybrid-v3-marketplace :where(.grid),
    .hybrid-v3-artwork-card :where(.grid) {
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hybrid-v3-marketplace *,
    .hybrid-v3-marketplace-form *,
    .hybrid-v3-artwork-card * {
        animation: none !important;
        transition: none !important;
    }
}
