.cosmetics-dossier-product,
.cosm-dossier-grid,
.cosm-sl-root,
.cosm-pms-subscribe--skinned {
--cosmetics-dossier-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
--cosmetics-dossier-font-body: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--cosmetics-dossier-surface-fog: #f4f4f4;
--cosmetics-dossier-radius-sm: 4px;
--cosmetics-dossier-radius-md: 8px;
--cosmetics-dossier-shadow-card: 0 4px 24px rgba(70, 93, 82, 0.1);
--cosmetics-dossier-shadow-nav: 0 2px 12px rgba(0, 0, 0, 0.06); --cosm-pill-radius: 9999px;
--cosm-btn-radius: var(--cosmetics-dossier-radius-sm);
--cosm-btn-min-height: 44px;
font-family: var(--cosmetics-dossier-font-body, inherit);
} .cosm-sl-root {
--cosm-sl-primary: var(--cosmetics-dossier-primary, #465d52);
--cosm-sl-primary-light: var(--cosmetics-dossier-border, #e2ddda);
--cosm-sl-primary-border: var(--cosmetics-dossier-border, #e2ddda);
--cosm-sl-primary-text: var(--cosmetics-dossier-primary, #465d52);
--cosm-sl-in-list-card: var(--cosmetics-dossier-primary, #465d52);
--cosm-sl-panel-bg: #fff;
--cosm-sl-border: var(--cosmetics-dossier-border, #e2ddda);
--cosm-sl-panel-w: 300px;
--cosm-sl-handle-w: 28px;
--cosm-sl-z: 200000;
--cosm-sl-fab-size: 48px;
--cosm-sl-fab-radius: 50%;
--cosm-sl-fab-shadow: var(--cosmetics-dossier-shadow-card);
--cosm-sl-panel-text: var(--cosmetics-dossier-secondary, #4a413a);
--cosm-sl-panel-muted: rgba(74, 65, 58, 0.65);
}
@media (min-width: 480px) and (max-width: 782px) {
.cosm-sl-root {
--cosm-sl-panel-w: 260px;
}
}