/* =========================================================
   LORYANE ESSENTIELLE — VISUAL THEME

   This universe uses the shared DA-02 palette. Its identity comes from
   composition and decorative treatments, not from competing color values.
   ========================================================= */

.essentielle-page.page-layout--universe,
.essentielle-page.page-layout--list,
.essentielle-page.page-layout--detail {
    --essentielle-powder: var(--color-brand-rose);
    --essentielle-powder-soft: var(--color-surface-accent);

    background: var(--color-background);
    color: var(--color-text);
}

.essentielle-page.page-layout--universe .page-layout__hero {
    background:
        radial-gradient(circle at 82% 18%, rgb(var(--color-brand-rose-rgb) / 68%), transparent 24rem),
        linear-gradient(135deg, var(--color-surface) 0%, var(--color-background) 100%);
    border-bottom-color: var(--color-border);
}

.essentielle-page.page-layout--universe .page-layout__container,
.essentielle-page.page-layout--list .page-layout__container,
.essentielle-page.page-layout--detail .page-layout__container {
    width: min(100%, var(--width-content-lg));
}

.essentielle-page.page-layout--universe .page-layout__eyebrow,
.essentielle-page.page-layout--list .page-layout__eyebrow,
.essentielle-page.page-layout--detail .page-layout__eyebrow {
    color: var(--color-brand-primary);
}

.essentielle-page.page-layout--universe .page-layout__title,
.essentielle-page.page-layout--list .page-layout__title,
.essentielle-page.page-layout--detail .page-layout__title {
    color: var(--color-text);
    letter-spacing: -0.025em;
}

.essentielle-page.page-layout--list .page-layout__header {
    max-width: var(--width-content-md);
}

.essentielle-page.page-layout--detail .page-layout__header {
    max-width: var(--width-content-md);
}

/* =========================================================
   LANDING — HERO
   ========================================================= */

.essentielle-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: var(--space-8);
}

.essentielle-hero__content {
    min-width: 0;
    max-width: var(--width-content-sm);
}

.essentielle-hero__signature {
    max-width: 34rem;
    margin: var(--space-4) var(--space-0) var(--space-0);
    color: var(--color-brand-primary);
    font-size: var(--font-size-lg);
    font-style: italic;
    line-height: var(--line-height-relaxed);
}

.essentielle-hero__notice {
    max-width: var(--width-content-sm);
    margin-top: var(--space-6);
}

.essentielle-hero__notice .ui-alert {
    background: rgb(var(--color-surface-rgb) / 92%);
    border-color: var(--color-border);
    border-left-color: var(--color-brand-accent);
    border-radius: var(--radius-lg);
}

.essentielle-hero__notice .ui-alert__title {
    color: var(--color-brand-primary);
}

.essentielle-hero__actions {
    margin-top: var(--space-6);
}

.essentielle-hero__actions .ui-button--primary,
.essentielle-filters .ui-button--primary,
.essentielle-product-availability .ui-button--primary {
    background: var(--essentielle-powder);
    border-color: var(--color-brand-accent);
    border-radius: var(--radius-full);
    color: var(--color-text);
    box-shadow: var(--shadow-sm);
}

.essentielle-hero__actions .ui-button--primary:hover,
.essentielle-filters .ui-button--primary:hover,
.essentielle-product-availability .ui-button--primary:hover {
    background: var(--color-action-secondary-active);
}

.essentielle-hero__visual {
    width: min(100%, 19rem);
    margin-inline: auto;
    padding: var(--space-3);
    background: rgb(var(--color-surface-rgb) / 86%);
    border: 1px solid rgb(var(--color-brand-champagne-rgb) / 72%);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
    transform: rotate(1.5deg);
}

.essentielle-hero__visual img {
    width: 100%;
    display: block;
    border-radius: calc(var(--radius-xl) - var(--space-1));
}

.essentielle-hero__visual picture,
.essentielle-product-detail__media-placeholder picture {
    display: block;
}

.essentielle-product-card__media--placeholder picture {
    width: 100%;
    display: grid;
    place-items: center;
}

/* =========================================================
   LANDING — COLLECTIONS
   ========================================================= */

.essentielle-section {
    min-width: 0;
}

/* =========================================================
   PRE-LAUNCH — COMING SOON
   ========================================================= */

.essentielle-coming-soon {
    position: relative;
    overflow: hidden;
    padding: var(--space-6);
    display: grid;
    gap: var(--space-5);
    background:
        radial-gradient(circle at 100% 0%, rgb(var(--color-brand-champagne-rgb) / 28%), transparent 16rem),
        linear-gradient(145deg, var(--color-surface), var(--essentielle-powder-soft));
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-coming-soon::before {
    content: "";
    position: absolute;
    inset: var(--space-0) auto var(--space-0) var(--space-0);
    width: var(--space-1);
    background: linear-gradient(
        180deg,
        var(--color-brand-accent),
        var(--essentielle-powder)
    );
}

.essentielle-coming-soon__content {
    min-width: 0;
}

.essentielle-coming-soon__content > p:last-child,
.essentielle-coming-soon__summary {
    margin-bottom: var(--space-0);
    color: var(--color-text-muted);
    line-height: var(--line-height-relaxed);
}

.essentielle-coming-soon__title {
    margin: var(--space-2) var(--space-0) var(--space-3);
    color: var(--color-text);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
}

.essentielle-coming-soon__details {
    margin: var(--space-0);
    padding-left: var(--space-6);
    display: grid;
    align-content: center;
    gap: var(--space-2);
    color: var(--color-text-muted);
    line-height: var(--line-height-relaxed);
}

.essentielle-coming-soon__details li::marker {
    color: var(--color-brand-accent);
}

.essentielle-coming-soon--compact {
    padding: var(--space-5);
    gap: var(--space-3);
}

.essentielle-coming-soon--compact .essentielle-coming-soon__title {
    font-size: var(--font-size-lg);
}

.essentielle-product-availability .essentielle-coming-soon {
    width: 100%;
    box-shadow: none;
}

.essentielle-product-availability .essentielle-coming-soon__content > p,
.essentielle-product-availability .essentielle-coming-soon__summary {
    margin-top: var(--space-2);
}

.essentielle-section__header {
    max-width: var(--width-content-sm);
}

.essentielle-section__header h2,
.essentielle-section--commitment h2 {
    margin: var(--space-0);
    color: var(--color-text);
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-tight);
}

.essentielle-section__header > p:last-child,
.essentielle-section--commitment > p {
    color: var(--color-text-muted);
    line-height: var(--line-height-relaxed);
}

.essentielle-categories {
    margin-top: var(--space-6);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
}

.essentielle-categories .ui-card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: linear-gradient(
        145deg,
        var(--color-surface) 0%,
        var(--essentielle-powder-soft) 100%
    );
    border-color: var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    transition:
        transform var(--duration-normal) var(--easing-standard),
        box-shadow var(--duration-normal) var(--easing-standard);
}

.essentielle-categories .ui-card::before {
    content: "";
    position: absolute;
    inset: var(--space-0) auto var(--space-0) var(--space-0);
    width: var(--space-1);
    background: linear-gradient(
        180deg,
        var(--color-brand-accent),
        var(--color-brand-primary)
    );
}

.essentielle-categories .ui-card:hover {
    transform: translateY(-0.2rem);
    box-shadow: var(--shadow-md);
}

.essentielle-categories .ui-card__eyebrow,
.essentielle-categories .ui-card__link {
    color: var(--color-brand-primary);
}

.essentielle-categories .ui-card__link {
    margin-top: auto;
    padding-top: var(--space-4);
    text-underline-offset: var(--space-1);
}

.essentielle-section--commitment {
    padding: var(--space-6);
    display: grid;
    gap: var(--space-5);
    background:
        radial-gradient(circle at 100% 0%, rgb(var(--color-brand-champagne-rgb) / 22%), transparent 16rem),
        linear-gradient(135deg, var(--color-surface), var(--essentielle-powder-soft));
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

/* =========================================================
   CATALOGUE — FILTERS
   ========================================================= */

.essentielle-catalogue__navigation {
    margin-bottom: var(--space-2);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-3) var(--space-6);
}

.essentielle-catalogue__navigation .ui-link,
.essentielle-filters__actions .ui-link {
    color: var(--color-brand-primary);
}

.essentielle-filters {
    padding: var(--space-5);
    display: grid;
    gap: var(--space-5);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-filters__fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
}

.essentielle-filters .ui-field__label {
    color: var(--color-brand-primary);
}

.essentielle-filters .ui-field__control {
    background: var(--color-white);
    border-color: var(--color-border);
    border-radius: var(--radius-full);
}

.essentielle-filters .ui-field__control:focus-visible {
    border-color: var(--color-brand-primary);
    outline-color: var(--color-brand-primary);
}

.essentielle-filters__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4);
}

.essentielle-results {
    margin: var(--space-0);
    color: var(--color-text-muted);
}

/* =========================================================
   CATALOGUE — PRODUCT CARDS
   ========================================================= */

.essentielle-product-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
    background: linear-gradient(
        155deg,
        var(--color-surface) 0%,
        var(--essentielle-powder-soft) 100%
    );
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    transition:
        transform var(--duration-normal) var(--easing-standard),
        box-shadow var(--duration-normal) var(--easing-standard);
}

.essentielle-product-card::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--space-1);
    display: block;
    background: linear-gradient(
        90deg,
        var(--color-brand-primary),
        var(--color-brand-accent)
    );
}

.essentielle-product-card:hover {
    transform: translateY(-0.2rem);
    box-shadow: var(--shadow-md);
}

.essentielle-product-card__media {
    width: calc(100% + var(--space-12));
    aspect-ratio: 4 / 3;
    margin: calc(0rem - var(--space-6)) calc(0rem - var(--space-6)) 0;
    display: grid;
    overflow: hidden;
    background: linear-gradient(
        145deg,
        var(--color-surface) 0%,
        var(--essentielle-powder-soft) 100%
    );
    border-bottom: 1px solid var(--color-border);
}

.essentielle-product-card__image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform var(--duration-slow) var(--easing-standard);
}

.essentielle-product-card:hover .essentielle-product-card__image {
    transform: scale(1.025);
}

.essentielle-product-card__media--placeholder {
    place-items: center;
    align-content: center;
    gap: var(--space-2);
    color: var(--color-brand-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

.essentielle-product-card__placeholder-logo {
    width: clamp(5rem, 32%, 7rem);
    height: auto;
    display: block;
    opacity: 0.78;
}

.essentielle-product-card__category {
    margin: var(--space-0) var(--space-0) var(--space-2);
    color: var(--color-brand-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

.essentielle-product-card__title {
    margin: var(--space-0);
    color: var(--color-text);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-tight);
}

.essentielle-product-card__title a {
    color: inherit;
    text-decoration-color: rgb(var(--color-brand-primary-rgb) / 38%);
    text-underline-offset: var(--space-1);
}

.essentielle-product-card .ui-badge--warning {
    background: rgb(var(--color-surface-rgb) / 84%);
    border-color: var(--color-brand-accent);
    color: var(--color-brand-primary);
}

.essentielle-product-card__description,
.essentielle-product-card__notice {
    margin: var(--space-0);
    line-height: var(--line-height-relaxed);
}

.essentielle-product-card__description {
    color: var(--color-text);
}

.essentielle-product-card__notice {
    margin-top: auto;
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.essentielle-catalogue__empty {
    display: grid;
    justify-items: center;
    gap: var(--space-4);
}

.essentielle-page.page-layout--list .ui-pagination__link[aria-current="page"] {
    background: var(--color-brand-primary);
    border-color: var(--color-brand-primary);
}

.essentielle-page.page-layout--list a.ui-pagination__link:focus-visible {
    outline-color: var(--color-brand-primary);
}

/* =========================================================
   PRODUCT DETAIL
   ========================================================= */

.essentielle-product-detail__navigation {
    margin-bottom: var(--space-6);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-3) var(--space-6);
}

.essentielle-product-detail__navigation .ui-link {
    color: var(--color-brand-primary);
}

.essentielle-product-detail__status {
    margin-top: var(--space-4);
}

.essentielle-product-detail {
    display: grid;
    gap: var(--space-8);
}

.essentielle-product-detail__media {
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 80% 15%, rgb(var(--color-brand-champagne-rgb) / 24%), transparent 18rem),
        linear-gradient(145deg, var(--color-surface), var(--essentielle-powder-soft));
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
}

.essentielle-product-detail__media > img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
}

.essentielle-product-detail__media-placeholder {
    min-height: 22rem;
    padding: var(--space-8);
    display: grid;
    place-items: center;
    align-content: center;
    gap: var(--space-4);
    color: var(--color-text-muted);
    text-align: center;
}

.essentielle-product-detail__media-placeholder img {
    width: min(100%, 14rem);
    filter: saturate(0.72);
    opacity: 0.76;
}

.essentielle-product-detail__media-placeholder p {
    margin: var(--space-0);
    font-weight: var(--font-weight-medium);
}

.essentielle-product-detail__content {
    display: grid;
    gap: var(--space-6);
}

.essentielle-product-detail__content > section,
.essentielle-product-detail__guidance > section {
    padding: var(--space-6);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-product-detail__content h2,
.essentielle-product-availability h2 {
    margin: var(--space-0);
    color: var(--color-text);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-tight);
}

.essentielle-product-detail__content section > p:last-child,
.essentielle-product-availability > p {
    margin-bottom: var(--space-0);
    line-height: var(--line-height-relaxed);
}

.essentielle-product-detail__context,
.essentielle-product-detail__disclaimer {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
}

.essentielle-product-detail__guidance {
    display: grid;
    gap: var(--space-4);
}

.essentielle-product-detail__guidance > section {
    background: linear-gradient(
        145deg,
        var(--color-surface),
        var(--essentielle-powder-soft)
    );
}

.essentielle-product-detail__disclaimer {
    margin: var(--space-0);
    padding: var(--space-4) var(--space-5);
    border-left: var(--space-1) solid var(--color-brand-accent);
}

.essentielle-product-availability {
    min-width: 0;
    padding: var(--space-6);
    display: grid;
    justify-items: start;
    gap: var(--space-4);
    background:
        radial-gradient(circle at 100% 0%, rgb(var(--color-brand-champagne-rgb) / 22%), transparent 12rem),
        var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
}

.essentielle-product-availability .ui-button {
    width: 100%;
    justify-content: center;
    text-align: center;
}

.essentielle-product-availability__note {
    padding-top: var(--space-4);
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
    border-top: 1px solid var(--color-border);
}

.essentielle-product-availability__price {
    width: 100%;
    margin: var(--space-0);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
}

.essentielle-product-availability__price strong {
    color: var(--color-brand-primary);
    font-size: var(--font-size-xl);
}

.essentielle-product-availability__cart-form {
    width: 100%;
    display: grid;
    gap: var(--space-3);
}

.essentielle-product-availability__cart-form label,
.essentielle-cart-line__quantity label {
    color: var(--color-text);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
}

.essentielle-product-availability__cart-form input,
.essentielle-cart-line__quantity input {
    min-height: var(--size-control-comfortable);
    width: 100%;
    padding: var(--space-2) var(--space-3);
    background: var(--color-white);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    color: var(--color-text);
    font: inherit;
}

.essentielle-product-availability__cart-form input:focus-visible,
.essentielle-cart-line__quantity input:focus-visible {
    outline: var(--focus-ring-width) solid var(--color-brand-primary);
    outline-offset: var(--focus-ring-offset);
}

/* =========================================================
   CART
   ========================================================= */

.essentielle-cart__navigation {
    margin-bottom: var(--space-6);
}

.essentielle-cart__navigation .ui-link {
    color: var(--color-brand-primary);
}

.essentielle-cart__messages,
.essentielle-cart__lines,
.essentielle-cart__empty {
    display: grid;
    gap: var(--space-4);
}

.essentielle-cart__empty {
    padding: var(--space-8);
    justify-items: center;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-cart__layout {
    margin-top: var(--space-6);
    display: grid;
    gap: var(--space-6);
}

.essentielle-cart-line {
    min-width: 0;
    padding: var(--space-5);
    display: grid;
    gap: var(--space-5);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-cart-line--unavailable {
    border-color: var(--color-state-warning);
}

.essentielle-cart-line__identity {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-4);
}

.essentielle-cart-line__identity > div:only-child {
    grid-column: 1 / -1;
}

.essentielle-cart-line__image {
    width: 5rem;
    height: 5rem;
    display: block;
    object-fit: cover;
    border-radius: var(--radius-md);
}

.essentielle-cart-line__category,
.essentielle-cart-line__unit-price,
.essentielle-cart-line__subtotal {
    margin: var(--space-0);
}

.essentielle-cart-line__category {
    color: var(--color-brand-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-wide);
    text-transform: uppercase;
}

.essentielle-cart-line__title {
    margin: var(--space-1) var(--space-0);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-tight);
}

.essentielle-cart-line__title a {
    color: var(--color-text);
}

.essentielle-cart-line__unit-price {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
}

.essentielle-cart-line__quantity {
    display: grid;
    grid-template-columns: minmax(5rem, 0.5fr) minmax(8rem, 1fr);
    align-items: end;
    gap: var(--space-2) var(--space-3);
}

.essentielle-cart-line__quantity label {
    grid-column: 1 / -1;
}

.essentielle-cart-line__subtotal {
    display: grid;
    gap: var(--space-1);
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
}

.essentielle-cart-line__subtotal strong {
    color: var(--color-text);
    font-size: var(--font-size-lg);
}

.essentielle-cart-line__unavailability {
    padding: var(--space-4);
    display: grid;
    gap: var(--space-1);
    background: color-mix(in srgb, var(--color-state-warning) 7%, var(--color-surface));
    border-left: var(--space-1) solid var(--color-state-warning);
    border-radius: var(--radius-md);
}

.essentielle-cart-line__remove .ui-button {
    width: 100%;
}

.essentielle-cart-summary {
    min-width: 0;
    padding: var(--space-6);
    display: grid;
    align-content: start;
    gap: var(--space-4);
    background:
        radial-gradient(circle at 100% 0%, rgb(var(--color-brand-champagne-rgb) / 22%), transparent 12rem),
        var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
}

.essentielle-cart-summary h2,
.essentielle-cart-summary p {
    margin: var(--space-0);
}

.essentielle-cart-summary__count,
.essentielle-cart-summary__note {
    color: var(--color-text-muted);
}

.essentielle-cart-summary__total {
    padding: var(--space-4) var(--space-0);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
    border-block: 1px solid var(--color-border);
}

.essentielle-cart-summary__total strong {
    color: var(--color-brand-primary);
    font-size: var(--font-size-xl);
}

.essentielle-cart-summary__note {
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
}

.essentielle-cart-summary__checkout,
.essentielle-cart-summary__checkout .ui-button {
    width: 100%;
}

/* =========================================================
   CHECKOUT REVIEW
   ========================================================= */

.essentielle-checkout__layout,
.essentielle-checkout__lines {
    display: grid;
    gap: var(--space-6);
}

.essentielle-checkout__layout {
    margin-top: var(--space-6);
}

.essentielle-checkout__lines > h2 {
    margin: var(--space-0);
}

.essentielle-checkout-line {
    min-width: 0;
    padding: var(--space-5);
    display: grid;
    gap: var(--space-5);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-checkout-line h3,
.essentielle-checkout-line p,
.essentielle-checkout-line dl,
.essentielle-checkout-line dd,
.essentielle-checkout-summary__amounts,
.essentielle-checkout-summary__amounts dd {
    margin: var(--space-0);
}

.essentielle-checkout-line p {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
}

.essentielle-checkout-line dl,
.essentielle-checkout-summary__amounts {
    display: grid;
    gap: var(--space-3);
}

.essentielle-checkout-line dl > div,
.essentielle-checkout-summary__amounts > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
}

.essentielle-checkout-line dt,
.essentielle-checkout-summary__amounts dt {
    color: var(--color-text-muted);
}

.essentielle-checkout-line dd,
.essentielle-checkout-summary__amounts dd {
    color: var(--color-text);
    font-weight: var(--font-weight-semibold);
    text-align: right;
}

.essentielle-checkout-summary__total {
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
}

.essentielle-checkout-summary__total dd {
    color: var(--color-brand-primary);
    font-size: var(--font-size-xl);
}

.essentielle-checkout-addresses,
.essentielle-checkout-addresses > section,
.essentielle-checkout-addresses__list,
.essentielle-checkout-address-form__form {
    display: grid;
    gap: var(--space-5);
}

.essentielle-checkout-addresses > section > h2,
.essentielle-checkout-address-form h2,
.essentielle-checkout-address-card h3,
.essentielle-checkout-address-confirmed h2,
.essentielle-checkout-address-confirmed p {
    margin: var(--space-0);
}

.essentielle-checkout-address-card,
.essentielle-checkout-address-form,
.essentielle-checkout-address-confirmed {
    min-width: 0;
    padding: var(--space-5);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

.essentielle-checkout-address-card,
.essentielle-checkout-address-confirmed {
    display: grid;
    gap: var(--space-4);
}

.essentielle-checkout-address-card address,
.essentielle-checkout-address-confirmed address {
    color: var(--color-text-muted);
    font-style: normal;
    line-height: var(--line-height-relaxed);
}

.essentielle-checkout-address-card address strong,
.essentielle-checkout-address-confirmed address strong {
    color: var(--color-text);
}

.essentielle-checkout-address-card form,
.essentielle-checkout-address-card .ui-button {
    width: 100%;
}

.essentielle-checkout-address-form__form > div:not(.essentielle-checkout-address-form__location, .essentielle-checkout-address-form__actions, .essentielle-checkout-address-form__summary) {
    display: grid;
    gap: var(--space-2);
}

.essentielle-checkout-address-form label {
    color: var(--color-text);
    font-weight: var(--font-weight-semibold);
}

.essentielle-checkout-address-form input,
.essentielle-checkout-address-form select {
    width: 100%;
    min-height: var(--size-control-comfortable);
    padding: var(--space-3) var(--space-4);
    background: var(--color-white);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    color: var(--color-text);
    font: inherit;
}

.essentielle-checkout-address-form input:focus-visible,
.essentielle-checkout-address-form select:focus-visible {
    border-color: var(--color-brand-primary);
    outline: var(--focus-ring-width) solid var(--focus-ring-color);
    outline-offset: var(--focus-ring-offset);
}

.essentielle-checkout-address-form ul,
.essentielle-checkout-address-form__summary,
.essentielle-checkout-address-form__zone {
    color: var(--color-state-error);
}

.essentielle-checkout-address-form ul {
    margin: var(--space-2) var(--space-0) var(--space-0);
    padding-left: var(--space-5);
}

.essentielle-checkout-address-form__summary {
    padding: var(--space-4);
    background: color-mix(in srgb, var(--color-state-error) 7%, var(--color-surface));
    border-left: var(--space-1) solid var(--color-state-error);
    border-radius: var(--radius-md);
}

.essentielle-checkout-address-form__summary p,
.essentielle-checkout-address-form__zone {
    margin: var(--space-0);
}

.essentielle-checkout-address-form__zone {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
}

.essentielle-checkout-address-form__location {
    display: grid;
    gap: var(--space-5);
}

.essentielle-checkout-address-form__location > div {
    display: grid;
    gap: var(--space-2);
}

.essentielle-checkout-address-form__actions .ui-button {
    width: 100%;
}

.essentielle-checkout-order-create,
.essentielle-checkout-order-create .ui-button {
    width: 100%;
}

.essentielle-checkout-order-reference {
    min-width: 0;
    padding: var(--space-5);
    background: var(--color-surface-accent);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
}

.essentielle-checkout-order-reference p {
    margin: var(--space-0);
}

.essentielle-checkout-order-reference p:last-child {
    overflow-wrap: anywhere;
    color: var(--color-text);
}

.essentielle-checkout-created-actions {
    display: grid;
    justify-items: start;
    gap: var(--space-2);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (min-width: 48rem) {
    .essentielle-categories,
    .essentielle-filters__fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .essentielle-section--commitment {
        padding: var(--space-8);
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: start;
    }

    .essentielle-coming-soon:not(.essentielle-coming-soon--compact) {
        padding: var(--space-8);
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        align-items: center;
    }

    .essentielle-product-detail__guidance {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .essentielle-cart-line {
        grid-template-columns: minmax(0, 2fr) minmax(12rem, 0.8fr) minmax(8rem, 0.5fr);
        align-items: center;
    }

    .essentielle-cart-line__remove {
        grid-column: 3;
    }

    .essentielle-checkout-addresses__list,
    .essentielle-checkout-address-form__location {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 64rem) {
    .essentielle-hero {
        grid-template-columns: minmax(0, 1.55fr) minmax(15rem, 0.75fr);
        gap: var(--space-12);
    }

    .essentielle-categories {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .essentielle-product-availability {
        position: sticky;
        top: var(--space-6);
    }

    .essentielle-cart__layout {
        grid-template-columns: minmax(0, 2fr) minmax(17rem, 0.8fr);
        align-items: start;
    }

    .essentielle-checkout__layout {
        grid-template-columns: minmax(0, 2fr) minmax(17rem, 0.8fr);
        align-items: start;
    }

    .essentielle-cart-summary {
        position: sticky;
        top: var(--space-6);
    }
}

@media (prefers-reduced-motion: reduce) {
    .essentielle-categories .ui-card,
    .essentielle-product-card {
        transition: none;
    }

    .essentielle-categories .ui-card:hover,
    .essentielle-product-card:hover {
        transform: none;
    }

    .essentielle-product-card__image {
        transition: none;
    }

    .essentielle-product-card:hover .essentielle-product-card__image {
        transform: none;
    }
}