/* Reusable muted data chips for catalog, product detail, and admin metadata. */

:root {
    --chip-earth-border: rgba(113, 91, 63, 0.2);
    --chip-earth-color: #574733;
    --chip-earth-bg: #f2eadf;
    --chip-brand-border: rgba(80, 96, 80, 0.2);
    --chip-brand-color: #374636;
    --chip-brand-bg: #edf1e7;
    --chip-filter-hover-bg: #e8dece;
    --chip-filter-active-bg: #6b5a42;
    --chip-filter-active-hover-bg: #584936;
    --chip-filter-brand-active-bg: #5d684f;
    --chip-filter-brand-active-hover-bg: #4d5841;
    --chip-sale-border: rgba(117, 74, 61, 0.24);
    --chip-sale-color: #613d35;
    --chip-sale-bg: #f4e2da;
    --chip-sale-active-border: rgba(91, 101, 69, 0.28);
    --chip-sale-active-color: #3f4a31;
    --chip-sale-active-bg: #e7eddc;
    --chip-warning-border: rgba(133, 109, 48, 0.22);
    --chip-warning-color: #5b4d25;
    --chip-warning-bg: #f4efd9;
    --chip-danger-border: rgba(126, 72, 62, 0.22);
    --chip-danger-color: #653d36;
    --chip-danger-bg: #f3e5df;
}

.data-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    align-items: center;
    margin: 0;
}

.data-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    border: 1px solid rgba(72, 65, 53, 0.16);
    border-radius: 999px;
    padding: 0.12rem 0.45rem;
    font-size: 0.7rem;
    line-height: 1.25;
    color: #3d3932;
    background: #f5f1ea;
    overflow-wrap: anywhere;
}

.data-chip--sku {
    border-color: rgba(72, 65, 53, 0.18);
    color: #3f3b35;
    background: #f1eee7;
}

.data-chip--brand {
    border-color: var(--chip-brand-border);
    color: var(--chip-brand-color);
    background: var(--chip-brand-bg);
}

.data-chip--brand-yaskawa {
    border-color: rgba(86, 98, 124, 0.22);
    color: #35435b;
    background: #e8edf3;
}

.data-chip--brand-teco,
.data-chip--brand-teco-westinghouse {
    border-color: rgba(76, 100, 112, 0.22);
    color: #334b55;
    background: #e5eef0;
}

.data-chip--brand-baldor,
.data-chip--brand-baldor-reliance {
    border-color: rgba(112, 83, 68, 0.22);
    color: #5a4137;
    background: #f0e6df;
}

.data-chip--brand-marathon {
    border-color: rgba(104, 89, 118, 0.22);
    color: #50445c;
    background: #eee8f0;
}

.data-chip--brand-techtop,
.data-chip--brand-tech-top {
    border-color: rgba(93, 98, 72, 0.22);
    color: #484d37;
    background: #eceee2;
}

.data-chip--brand-worldwide,
.data-chip--brand-worldwide-electric {
    border-color: rgba(80, 101, 88, 0.22);
    color: #3a4c41;
    background: #e5eee7;
}

.data-chip--brand-grundfos {
    border-color: rgba(68, 105, 124, 0.22);
    color: #334f5e;
    background: #e8f0f1;
}

.data-chip--type {
    border-color: var(--chip-earth-border);
    color: var(--chip-earth-color);
    background: var(--chip-earth-bg);
}

.data-chip--spec {
    border-color: rgba(87, 96, 102, 0.2);
    color: #3d474c;
    background: #eaf0ef;
}

.data-chip--water {
    border-color: rgba(68, 105, 124, 0.2);
    color: #334f5e;
    background: #e8f0f1;
}

.data-chip--electrical {
    border-color: rgba(133, 109, 48, 0.22);
    color: #5b4d25;
    background: #f4efd9;
}

.data-chip--power {
    border-color: rgba(126, 72, 62, 0.22);
    color: #653d36;
    background: #f3e5df;
}

.data-chip--price {
    border-color: rgba(69, 110, 73, 0.22);
    color: #37583b;
    background: #e9f1e5;
}

.data-chip--sale,
.data-chip--clearance {
    border-color: var(--chip-sale-border);
    color: var(--chip-sale-color);
    background: var(--chip-sale-bg);
}

.data-chip--sale-active {
    border-color: var(--chip-sale-active-border);
    color: var(--chip-sale-active-color);
    background: var(--chip-sale-active-bg);
}

.data-chip--sale-upcoming,
.data-chip--warning,
.data-chip--unpriced {
    border-color: var(--chip-warning-border);
    color: var(--chip-warning-color);
    background: var(--chip-warning-bg);
}

.data-chip--sale-ended,
.data-chip--danger {
    border-color: var(--chip-danger-border);
    color: var(--chip-danger-color);
    background: var(--chip-danger-bg);
}

.data-chip--stock {
    border-color: rgba(84, 88, 102, 0.2);
    color: #3e4350;
    background: #eceef1;
}

.data-chip--location {
    border-color: rgba(89, 82, 112, 0.2);
    color: #433e57;
    background: #eeebf2;
}

.data-chip--status {
    border-color: rgba(105, 96, 74, 0.2);
    color: #504934;
    background: #f1eee3;
}

.data-chip--status-active,
.data-chip--success {
    border-color: rgba(69, 110, 73, 0.22);
    color: #37583b;
    background: #e9f1e5;
}

.product-chip {
    border-color: var(--chip-earth-border);
    color: var(--chip-earth-color);
    background: var(--chip-earth-bg);
}

.product-chip:visited {
    color: var(--chip-earth-color);
}

.product-chip--brand {
    border-color: var(--chip-brand-border);
    color: var(--chip-brand-color);
    background: var(--chip-brand-bg);
}

.product-chip--brand:visited {
    color: var(--chip-brand-color);
}

.product-chip:hover:not(.product-chip--active) {
    border-color: rgba(113, 91, 63, 0.28);
    color: #4b3e2d;
    background: var(--chip-filter-hover-bg);
}

.product-chip--brand:hover:not(.product-chip--active) {
    border-color: rgba(80, 96, 80, 0.3);
    color: #2f3d2e;
    background: #e3eadb;
}

.product-chip--active,
.product-chip--active:visited {
    border-color: var(--chip-filter-active-bg);
    color: #fff;
    background: var(--chip-filter-active-bg);
}

.product-chip--active:hover {
    border-color: var(--chip-filter-active-hover-bg);
    color: #fff;
    background: var(--chip-filter-active-hover-bg);
}

.product-chip--brand.product-chip--active,
.product-chip--brand.product-chip--active:visited {
    border-color: var(--chip-filter-brand-active-bg);
    color: #fff;
    background: var(--chip-filter-brand-active-bg);
}

.product-chip--brand.product-chip--active:hover {
    border-color: var(--chip-filter-brand-active-hover-bg);
    color: #fff;
    background: var(--chip-filter-brand-active-hover-bg);
}
