/*!
 * Copyright © 2026 Nail Alliance - North America, Inc.
 * Authors: See snippets/copyright-notices.liquid in the theme.
 * No other use is authorized without a written contract.
 */

.color-plus-hero{aspect-ratio:1366/320;background:#ed009b var(--hero-desktop) left top/cover no-repeat;color:#fff;display:flex;align-items:center;justify-content:flex-end;padding:30px 10vw;text-align:center}.color-plus-hero h1{font-size:clamp(43px,4.6vw,65px);margin:0 0 15px}.color-plus-hero p{font-size:clamp(16px,1.5vw,24px);line-height:1.5;max-width:32ch}
.color-plus-browser{padding:30px 0 60px}.color-plus-browser>h2{font-size:26px;font-weight:500;text-align:center;margin:0 20px 25px}.color-plus-families{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}.color-plus-families button{background:#fff;color:#711b97;border:1px solid #711b97;padding:12px 22px;border-radius:28px;font:inherit;cursor:pointer}.color-plus-families button[aria-pressed=true]{background:#711b97;color:#fff}.color-plus-browser__intro{text-align:center;max-width:60ch;margin:31px auto;font-size:18px;line-height:1.5;min-height:54px;padding:0 15px}
.color-plus-browser__layout{display:grid;grid-template-columns:250px 1fr;gap:36px;width:95%;max-width:1600px;margin:36px auto}.color-plus-filters{display:flex;flex-direction:column;align-self:start;gap:18px;padding:20px;background:#fff;box-shadow:var(--shadow-box);border-radius:12px;position:sticky;top:calc(var(--header-height) + 20px)}
.color-plus-filters summary{display:flex;align-items:center;justify-content:space-between;gap:15px;list-style:none;font-size:clamp(16px,1.2vw,21px);line-height:1.25;font-weight:500;cursor:pointer;margin-bottom:6px}
.color-plus-filters summary::-webkit-details-marker{display:none}
.color-plus-filters summary::after{content:'+';font-size:24px;line-height:1;font-weight:400;color:#666}
.color-plus-filters details[open]>summary::after{content:'−'}
.color-plus-filter-list{display:flex;flex-direction:column;margin:0 0 6px;padding:0}
.color-plus-filter-option{display:flex;align-items:center;justify-content:space-between;min-width:0}
.color-plus-filter-option>button,.color-plus-filter-option>a{border:0;background:none;color:#000;font-family:var(--font-body);font-size:clamp(13px,1vw,15px);font-weight:400;line-height:1.5;padding:5px;text-align:left;text-decoration:none;cursor:pointer;text-transform:capitalize}
.color-plus-filter-option>[data-sort]{text-transform:uppercase}
.color-plus-filter-option>[aria-pressed=true],.color-plus-filter-option>[aria-current],.color-plus-filter-option>button:hover,.color-plus-filter-option>a:hover{font-weight:600}
.color-plus-filter-option>.color-plus-filter-clear{flex:none;font-size:22px;line-height:1;padding:4px 0 4px 8px;text-align:center;min-width:24px}
.color-plus-filters [hidden]{display:none!important}
.color-plus-filters :focus-visible,.color-plus-filter-toggle:focus-visible{outline:2px solid #711b97;outline-offset:3px}
.color-plus-filter-toggle{display:none}
.color-plus-results__toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.color-plus-results__toolbar p{margin:0}
.color-plus-persona-toggle{display:flex;gap:6px;align-items:center;font-size:12px}
.color-plus-persona-toggle[hidden]{display:none}
.color-plus-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:0;gap:20px;margin:0}.color-plus-grid>li{min-width:0}.color-plus-grid>li[hidden]{display:none}.color-plus-grid.show-personas .product-card__persona{opacity:1}.color-plus-see-all{display:flex;width:fit-content;margin:35px auto 0;background:#711b97}
.color-plus-persona{position:relative;aspect-ratio:269/433;border-radius:12px;overflow:hidden;box-shadow:0 0 14px #0001}.color-plus-persona>img{width:100%;height:100%;object-fit:cover}.color-plus-persona>div{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;background:#fff9;padding:12px;text-transform:capitalize}.color-plus-persona button{border:0;background:none;font-size:24px;cursor:pointer}
@media(min-width:1600px){.color-plus-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:1024px){.color-plus-browser__layout{grid-template-columns:200px 1fr;gap:18px}.color-plus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:767px){.color-plus-hero{background-image:var(--hero-mobile);height:80svh;aspect-ratio:auto;align-items:flex-end;justify-content:center;padding:30px}.color-plus-browser__layout{display:block}.color-plus-filters{margin-bottom:30px}.color-plus-filters{position:static;max-width:320px;padding:20px}.color-plus-filters summary{font-size:20px}.color-plus-filter-option>button,.color-plus-filter-option>a{font-size:14px;min-height:36px}.is-enhanced .color-plus-filter-toggle{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:15px 2.5%;padding:8px 15px;border:0;border-radius:15px;background:#711b97;color:#fff;font:inherit;cursor:pointer}.is-enhanced:not(.filters-open) .color-plus-filters{display:none}.color-plus-grid{gap:10px}.color-plus-persona{max-height:400px;max-width:280px;margin:auto}.color-plus-browser>h2{font-size:21px}}
.color-plus-grid.show-personas .product-card__hover-image{opacity:1}
.color-plus-hero h1 { line-height:1.08; }
