/**
 * Udgoon Header — functional integration styles (PATCH v2, not yet deployed).
 * Scoped strictly under #udgoon-header-widget. Uses ONLY the fragment's own
 * CSS custom properties — no hardcoded brand colors.
 */

#udgoon-header-widget .udg-cart-lines,
#udgoon-header-widget .udg-wishlist-lines { padding: 18px 32px 0; overflow-y: auto; }

#udgoon-header-widget .udg-cart-line,
#udgoon-header-widget .udg-wishlist-line {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--ud-border-subtle, rgba(0,0,0,.08));
}
#udgoon-header-widget .udg-cart-line__media img,
#udgoon-header-widget .udg-wishlist-line img { width: 72px; height: 90px; object-fit: cover; display: block; }
#udgoon-header-widget .udg-cart-line__info a { font: 500 13px/1.25 var(--sans); color: inherit; text-decoration: none; }
#udgoon-header-widget .udg-cart-line__price { display: block; margin-top: 4px; font: 500 12px/1 var(--sans); color: var(--ud-text-muted, inherit); }
#udgoon-header-widget .udg-cart-line__qty { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; font: 500 12px/1 var(--sans); }
#udgoon-header-widget .udg-cart-line__qty .udg-qty {
    width: 24px; height: 24px; border: 1px solid var(--ud-border-subtle, rgba(0,0,0,.15)); background: transparent;
    font: 500 13px/1 var(--sans); cursor: pointer; border-radius: 2px; color: inherit;
}
#udgoon-header-widget .udg-line-remove {
    width: 28px; height: 28px; border: 0; background: transparent; font-size: 18px;
    line-height: 1; cursor: pointer; color: var(--ud-text-muted, inherit);
}
#udgoon-header-widget .udg-line-remove:hover { color: var(--ud-brand-primary); }

#udgoon-header-widget .udg-cart-total {
    display: flex; justify-content: space-between; align-items: baseline;
    padding: 16px 0 6px; font: 500 14px/1 var(--sans);
}
#udgoon-header-widget .udg-cart-total strong { font-weight: 600; }

/* Two action buttons must fit narrow drawers — wrap on small screens. */
#udgoon-header-widget .udg-cart-actions { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px 0 4px; }
#udgoon-header-widget .udg-cart-actions .solid-btn { flex: 1 1 140px; text-align: center; box-sizing: border-box; }
#udgoon-header-widget .udg-checkout-btn { background: var(--ud-brand-primary); color: var(--ud-text-on-brand, inherit); }

/* VIEW fallback link — same footprint as .mini-add but a plain <a>. */
#udgoon-header-widget .udg-view-product {
    display: block; width: 100%; height: 42px; margin-top: 35px; line-height: 42px;
    text-align: center; text-decoration: none; box-sizing: border-box;
    background: var(--ud-brand-primary); color: var(--ud-text-on-brand, inherit);
    font: 600 12px/42px var(--sans); cursor: pointer;
}
#udgoon-header-widget #search-panel .udg-view-product { margin-top: 20px; }

#udgoon-header-widget .udg-account-loggedin { display: flex; flex-direction: column; gap: 14px; }
#udgoon-header-widget .udg-account-loggedin .solid-btn { text-align: center; }
#udgoon-header-widget .udg-logout-link {
    align-self: center; font: 500 13px/1 var(--sans); color: var(--ud-text-muted, inherit);
    text-decoration: underline; text-underline-offset: 3px;
}
#udgoon-header-widget .account-notice { font: 400 13px/1.5 var(--sans); color: var(--ud-brand-secondary-strong, inherit); }

/* Transient error/notice toast — anchored under the nav, non-blocking. */
#udgoon-header-widget .udg-header-toast {
    position: fixed; z-index: 140; top: calc(var(--udg-nav-bottom, 78px) + 8px); left: 50%;
    transform: translate(-50%, -8px); margin: 0; padding: 10px 18px; max-width: min(92vw, 420px);
    background: var(--ud-bg-light); color: var(--ud-text-primary);
    border: 1px solid var(--ud-border-subtle, rgba(0,0,0,.12)); border-radius: 4px;
    font: 500 13px/1.4 var(--sans); text-align: center;
    opacity: 0; visibility: hidden; transition: opacity .25s ease, transform .25s ease, visibility .25s;
    pointer-events: none;
}
#udgoon-header-widget .udg-header-toast.on { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

#udgoon-header-widget .mini-add[disabled] { opacity: .55; cursor: default; }

@media (max-width: 767px) {
    #udgoon-header-widget .udg-cart-lines,
    #udgoon-header-widget .udg-wishlist-lines { padding: 14px 16px 0; }
    #udgoon-header-widget .udg-cart-actions { gap: 8px; }
    #udgoon-header-widget .udg-cart-actions .solid-btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
    #udgoon-header-widget .udg-header-toast { transition: none; }
}

/* =====================================================================
 * STICKY HEADER + CART BADGE (four-fixes)
 * =================================================================== */

/* The inner <header class="udg-header"> is display:contents, so it has no
 * box to stick. The Elementor location wrapper is the direct body child and
 * is the correct sticky box — it sticks against the document scroll. */
.elementor-location-header { position: sticky; top: 0; z-index: 100; }
body.admin-bar .elementor-location-header { top: 32px; }
@media screen and (max-width: 782px) {
    body.admin-bar .elementor-location-header { top: 46px; }
}

/* Cart quantity badge on every cart toggle (desktop tools, mobile mast,
 * mobile menu topbar). Injected by header-integration.js. */
#udgoon-header-widget .icon-btn { position: relative; }
#udgoon-header-widget .udg-cart-badge {
    position: absolute; top: -1px; right: -7px;
    min-width: 18px; height: 18px; padding: 0 4px; box-sizing: border-box;
    border-radius: 9px;
    background: var(--ud-brand-primary, #0F5B59);
    color: var(--ud-text-on-brand, #FFFDFC);
    font: 600 11px/18px var(--sans, "DM Sans", sans-serif);
    text-align: center; letter-spacing: 0;
    pointer-events: none;
}
#udgoon-header-widget .udg-cart-badge[hidden] { display: none; }
