/**
 * Commerce7 for WordPress — Frontend Styles
 *
 * Design tokens (--c7-*) are set by PHP reading the Elementor active kit,
 * so colors and fonts automatically match the site theme.
 *
 * The Commerce7 SDK (commerce7.css) handles cart drawer, product pages,
 * checkout, account portal, and club/reservation widgets.
 */

/* ── Design Tokens ────────────────────────────────────────────────────────── */
/* Defaults — overridden by inline style injected from Elementor kit in PHP.  */
:root {
    --c7-primary:       #1a1a1a;
    --c7-text:          #1a1a1a;
    --c7-accent:        #888888;
    --c7-font-heading:  inherit;
    --c7-font-body:     inherit;

    /* Derived */
    --c7-primary-light: color-mix(in srgb, var(--c7-primary) 12%, transparent);
    --c7-border:        #e8e8e8;
    --c7-bg-card:       #ffffff;
    --c7-bg-image:      #ffffff;
    --c7-radius:        4px;
    --c7-transition:    0.22s ease;

    /* C7 SDK overrides */
    --c7-cart-count-bg:         var(--c7-primary);
    --c7-cart-count-bg-focus:   var(--c7-primary);
    --c7-cart-count-text-color: #ffffff;
    --c7-side-cart-shadow:      -4px 0 32px rgba(0,0,0,.12);
    --c7-notification:          var(--c7-primary);
    --c7-dropdown-border-radius: var(--c7-radius);
    --c7-dropdown-shadow:        0 8px 24px rgba(0,0,0,.10);
}

/* ══════════════════════════════════════════════════════════════════════════
   Commerce7 SDK — Typography & Cart Enhancements
   C7 keeps its own default color palette (green/brand).
   We only apply the site font family and polish the cart sidebar.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Apply site font to all C7 SDK rendered elements ─────────────────────── */
#c7-cart,
#c7-cart *,
#c7-content,
#c7-content * {
    font-family: var(--c7-font-body) !important;
}

/* ── Cart Sidebar ─────────────────────────────────────────────────────────── */

/* Force C7's own link color (#3251ae) — prevents website theme green bleeding in */
#c7-cart a {
    color:           #3251ae   !important;
    font-family:     var(--c7-font-body) !important;
    text-decoration: none      !important;
}
#c7-cart a:hover { text-decoration: underline !important; }

/* "Remove" links — subtle, not blue */
#c7-cart a[class*="remove"],
#c7-cart a[class*="Remove"],
#c7-cart [class*="remove"] a {
    color:           #999      !important;
    font-size:       0.75rem   !important;
    letter-spacing:  0.4px     !important;
}
#c7-cart a[class*="remove"]:hover,
#c7-cart [class*="remove"] a:hover {
    color: #444 !important;
    text-decoration: none !important;
}

/* Log in / Sign in link — style as a proper outline button */
#c7-cart a[href*="login"],
#c7-cart a[href*="signin"],
#c7-cart a[href*="sign-in"],
#c7-cart [class*="sign-in"] a,
#c7-cart [class*="login"] a {
    display:         inline-block     !important;
    padding:         10px 24px        !important;
    border:          1.5px solid #3251ae !important;
    border-radius:   var(--c7-radius) !important;
    font-size:       0.75rem          !important;
    font-weight:     700              !important;
    letter-spacing:  0.7px            !important;
    text-transform:  uppercase        !important;
    text-decoration: none             !important;
    color:           #3251ae          !important;
    transition:      background 0.2s ease, color 0.2s ease !important;
    margin-top:      4px              !important;
}
#c7-cart a[href*="login"]:hover,
#c7-cart a[href*="signin"]:hover,
#c7-cart [class*="sign-in"] a:hover,
#c7-cart [class*="login"] a:hover {
    background:      #3251ae !important;
    color:           #fff    !important;
    text-decoration: none    !important;
}

/* "Proceed to Checkout" — better size, weight, and shape; keep C7 color */
#c7-cart [class*="checkout"],
#c7-cart [class*="Checkout"],
#c7-cart [class*="proceed"],
#c7-cart [class*="Proceed"],
#c7-cart form button[type="submit"] {
    display:        block      !important;
    width:          100%       !important;
    padding:        14px 20px  !important;
    font-family:    var(--c7-font-body) !important;
    font-size:      0.78rem    !important;
    font-weight:    700        !important;
    letter-spacing: 0.9px      !important;
    text-transform: uppercase  !important;
    border-radius:  var(--c7-radius) !important;
    box-sizing:     border-box !important;
    cursor:         pointer    !important;
}

/* Subtotal label */
#c7-cart [class*="subtotal"],
#c7-cart [class*="Subtotal"] {
    font-weight:    600        !important;
    letter-spacing: 0.2px      !important;
}

/* ── SDK product buy-widget inside our PHP cards ──────────────────────────── */
/*
 * The SDK inserts a full product widget (title link, price, qty, button)
 * inside .c7-buy-product. We already render title/price in PHP above it.
 */

/* Hide SDK-rendered title link */
.c7-product-info .c7-buy-product a,
.c7-featured-content .c7-buy-product a,
.c7-club-signup-wrap .c7-buy-product a {
    display: none !important;
}

/* Hide SDK-rendered price text ("$29.00 / bottle") */
.c7-product-info .c7-buy-product p,
.c7-product-info .c7-buy-product [class*="price"],
.c7-product-info .c7-buy-product [class*="Price"],
.c7-product-info .c7-buy-product [class*="variant-name"],
.c7-product-info .c7-buy-product [class*="type"],
.c7-featured-content .c7-buy-product p,
.c7-featured-content .c7-buy-product [class*="price"] {
    display: none !important;
}

/* Apply font + shape to SDK buy buttons in our custom card contexts */
.c7-product-card .c7-buy-product button,
.c7-featured-product .c7-buy-product button,
.c7-club-card .c7-club-join-button button,
.c7-club-signup-wrap .c7-club-join-button button {
    display:        block      !important;
    width:          100%       !important;
    font-family:    var(--c7-font-body) !important;
    font-size:      0.76rem    !important;
    font-weight:    700        !important;
    letter-spacing: 0.8px      !important;
    text-transform: uppercase  !important;
    border-radius:  var(--c7-radius) !important;
    box-sizing:     border-box !important;
    cursor:         pointer    !important;
    padding:        11px 16px  !important;
}

/* Quantity input in buy widget — tidy up font */
.c7-product-card .c7-buy-product input[type="number"] {
    font-family:   var(--c7-font-body) !important;
    border-radius: var(--c7-radius)    !important;
}

/* ── C7 SDK Page Wrapper ──────────────────────────────────────────────────── */
.c7-page-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 24px 80px;
    min-height: 60vh;
    font-family: var(--c7-font-body);
}

@media (max-width: 768px) {
    .c7-page-wrapper { padding: 24px 16px 48px; }
}

/* ── Product Grid ─────────────────────────────────────────────────────────── */
.c7-product-grid-wrapper { width: 100%; }

.c7-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (max-width: 900px) { .c7-product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .c7-product-grid { grid-template-columns: 1fr; } }

/* ── Product Card ─────────────────────────────────────────────────────────── */
.c7-product-card {
    background: var(--c7-bg-card);
    border: 1px solid var(--c7-border);
    border-radius: var(--c7-radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow var(--c7-transition), transform var(--c7-transition);
}

.c7-product-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.10);
    transform: translateY(-2px);
}

/* ── Wine Bottle Image ────────────────────────────────────────────────────── */
/*
 * Wine bottles are tall and narrow. We use a portrait aspect ratio,
 * white background (product photos are usually shot on white/transparent),
 * and constrain the bottle width so it floats with breathing room.
 */
.c7-product-image {
    background: var(--c7-bg-image);
    aspect-ratio: 3 / 5;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 24px 20%;   /* side padding keeps bottle narrow and elegant */
    box-sizing: border-box;
    position: relative;
}

/* Subtle gradient at bottom gives depth without a harsh edge */
.c7-product-image::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 32px;
    background: linear-gradient(to top, rgba(0,0,0,.04), transparent);
    pointer-events: none;
}

.c7-product-image a {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}

.c7-product-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
    display: block;
    transition: transform 0.35s ease;
}

.c7-product-card:hover .c7-product-image img {
    transform: scale(1.05);
}

/* ── Product Info ─────────────────────────────────────────────────────────── */
.c7-product-info {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
    font-family: var(--c7-font-body);
}

.c7-product-title {
    font-family: var(--c7-font-heading);
    font-size: 0.95rem;
    font-weight: 600;
    margin: 0 0 6px;
    line-height: 1.35;
    color: var(--c7-text);
}

/* Force dark color — prevents the C7 SDK's global green link style bleeding in */
.c7-product-title a,
.c7-product-title a:visited {
    color: var(--c7-text) !important;
    text-decoration: none !important;
}
.c7-product-title a:hover { opacity: 0.75; }

.c7-product-vintage,
.c7-product-varietal {
    display: inline-block;
    font-size: 0.78rem;
    color: var(--c7-accent);
    margin-right: 4px;
    font-family: var(--c7-font-body);
}

.c7-product-teaser {
    font-size: 0.82rem;
    color: #666;
    margin: 6px 0 8px;
    line-height: 1.5;
    flex: 1;
    font-family: var(--c7-font-body);
}

.c7-product-price {
    font-family: var(--c7-font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--c7-text);
    margin: 8px 0 12px;
}

/* ── C7 SDK Buy Button — scoped to our cards ──────────────────────────────── */
.c7-product-card .c7-buy-product {
    margin-top: auto;
}

.c7-product-card .c7-buy-product button,
.c7-product-card .c7-buy-product a {
    display: block;
    width: 100%;
    padding: 11px 16px;
    background: var(--c7-primary);
    color: #fff !important;
    border: 1px solid var(--c7-primary);
    border-radius: var(--c7-radius);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    cursor: pointer;
    text-align: center;
    transition: background var(--c7-transition), color var(--c7-transition);
    text-decoration: none;
    box-sizing: border-box;
    font-family: var(--c7-font-body);
}

.c7-product-card .c7-buy-product button:hover,
.c7-product-card .c7-buy-product a:hover {
    background: transparent;
    color: var(--c7-primary) !important;
}

/* ── Filter Bar ───────────────────────────────────────────────────────────── */
.c7-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}

.c7-filter-btn {
    padding: 6px 18px;
    border: 1px solid var(--c7-border);
    background: transparent;
    border-radius: 2px;
    font-size: 0.72rem;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all var(--c7-transition);
    color: var(--c7-text);
    font-family: var(--c7-font-body);
}

.c7-filter-btn.c7-filter-active,
.c7-filter-btn:hover {
    background: var(--c7-primary);
    color: #fff;
    border-color: var(--c7-primary);
}

/* ── Product Search ───────────────────────────────────────────────────────── */
.c7-product-search-bar { margin-bottom: 20px; }
.c7-search-widget { position: relative; }
.c7-search-input {
    width: 100%;
    padding: 11px 16px;
    border: 1px solid var(--c7-border);
    border-radius: var(--c7-radius);
    font-size: 0.875rem;
    box-sizing: border-box;
    font-family: var(--c7-font-body);
    color: var(--c7-text);
    background: #fff;
    outline: none;
    transition: border-color var(--c7-transition), box-shadow var(--c7-transition);
}
.c7-search-input:focus {
    border-color: var(--c7-text);
    box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}
.c7-search-input::placeholder { color: #bbb; }
.c7-search-results {
    position: absolute; top: calc(100% + 4px); left: 0; right: 0;
    background: #fff; border: 1px solid var(--c7-border);
    border-radius: var(--c7-radius); box-shadow: 0 8px 24px rgba(0,0,0,.10);
    z-index: 1000; max-height: 360px; overflow-y: auto;
}
.c7-search-result-item {
    display: flex; align-items: center; gap: 12px; padding: 10px 14px;
    border-bottom: 1px solid #f3f3f3; text-decoration: none; color: inherit;
}
.c7-search-result-item:hover { background: #f9f9f9; }
.c7-search-result-item img {
    width: 32px; height: 48px; object-fit: contain; flex-shrink: 0;
}
.c7-search-result-info { font-size: 0.85rem; font-family: var(--c7-font-body); }
.c7-search-result-info strong { display: block; font-weight: 600; }
.c7-search-result-info span { color: #888; margin-right: 8px; }
.c7-search-no-results { padding: 14px; font-size: 0.85rem; color: #888; }

/* ── Club Cards ───────────────────────────────────────────────────────────── */
.c7-clubs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 900px) { .c7-clubs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .c7-clubs-grid { grid-template-columns: 1fr; } }

.c7-club-card {
    background: var(--c7-bg-card); border-radius: var(--c7-radius);
    padding: 28px; position: relative; border: 1px solid var(--c7-border);
    transition: box-shadow var(--c7-transition);
    font-family: var(--c7-font-body);
}
.c7-club-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.09); }
.c7-club-featured { border-color: var(--c7-primary); box-shadow: 0 0 0 2px var(--c7-primary); }

.c7-club-featured-badge {
    position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
    background: var(--c7-primary); color: #fff; padding: 3px 14px; border-radius: 2px;
    font-size: 0.68rem; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase; white-space: nowrap;
    font-family: var(--c7-font-body);
}

.c7-club-title { font-family: var(--c7-font-heading); font-size: 1.2rem; font-weight: 700; margin: 0 0 12px; color: var(--c7-text); }
.c7-club-tiers { list-style: none; padding: 0; margin: 12px 0; }
.c7-club-tiers li { padding: 5px 0; font-size: 0.875rem; color: #444; border-bottom: 1px solid #f0f0f0; }
.c7-tier-price { color: var(--c7-primary); font-weight: 700; }

.c7-club-card .c7-club-join-button button,
.c7-club-cta {
    display: block; margin-top: 20px; padding: 12px 24px;
    background: var(--c7-primary); color: #fff; text-align: center; text-decoration: none;
    border-radius: var(--c7-radius); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.8px;
    text-transform: uppercase; border: 1px solid var(--c7-primary); cursor: pointer;
    transition: background var(--c7-transition), color var(--c7-transition);
    width: 100%; box-sizing: border-box; font-family: var(--c7-font-body);
}
.c7-club-card .c7-club-join-button button:hover,
.c7-club-cta:hover { background: transparent; color: var(--c7-primary); }

/* ── Featured Product Widget ──────────────────────────────────────────────── */
.c7-featured-product { display: grid; gap: 48px; align-items: center; }
.c7-featured-layout-image_left  { grid-template-columns: 1fr 1fr; }
.c7-featured-layout-image_right { grid-template-columns: 1fr 1fr; direction: rtl; }
.c7-featured-layout-image_right > * { direction: ltr; }
.c7-featured-layout-stacked { grid-template-columns: 1fr; text-align: center; }
@media (max-width: 768px) {
    .c7-featured-layout-image_left,
    .c7-featured-layout-image_right { grid-template-columns: 1fr; direction: ltr; }
}

.c7-featured-image {
    background: var(--c7-bg-image);
    border-radius: var(--c7-radius);
    aspect-ratio: 3/5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 22%;
    box-sizing: border-box;
}
.c7-featured-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
}

.c7-featured-product-title {
    font-family: var(--c7-font-heading);
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--c7-text);
}
.c7-featured-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.c7-meta-vintage, .c7-meta-varietal, .c7-meta-appellation {
    background: #f3f3f3; padding: 4px 10px; border-radius: 2px;
    font-size: 0.8rem; color: #666; font-family: var(--c7-font-body);
}
.c7-featured-price {
    font-family: var(--c7-font-heading);
    font-size: 1.4rem; font-weight: 700; margin: 16px 0;
    color: var(--c7-text);
}
.c7-featured-award {
    display: inline-block; background: #fef3c7; color: #92400e;
    padding: 4px 12px; border-radius: 2px; font-size: 0.78rem;
    font-weight: 700; margin-bottom: 12px; font-family: var(--c7-font-body);
}

.c7-featured-product .c7-buy-product button {
    display: inline-block; padding: 14px 32px;
    background: var(--c7-primary); color: #fff;
    border: 1px solid var(--c7-primary); border-radius: var(--c7-radius);
    font-size: 0.78rem; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase;
    cursor: pointer; transition: background var(--c7-transition), color var(--c7-transition);
    font-family: var(--c7-font-body);
}
.c7-featured-product .c7-buy-product button:hover {
    background: transparent; color: var(--c7-primary);
}

/* ── Collection Grid ──────────────────────────────────────────────────────── */
.c7-collections-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 900px) { .c7-collections-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .c7-collections-grid { grid-template-columns: 1fr; } }

.c7-collection-card {
    display: block; text-decoration: none; color: inherit;
    border-radius: var(--c7-radius); overflow: hidden;
    border: 1px solid var(--c7-border);
    transition: box-shadow var(--c7-transition), transform var(--c7-transition);
    background: var(--c7-bg-card);
}
.c7-collection-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.10);
    transform: translateY(-2px);
}

.c7-collection-image { aspect-ratio: 16/9; overflow: hidden; background: #f7f7f7; }
.c7-collection-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.35s ease; }
.c7-collection-card:hover .c7-collection-image img { transform: scale(1.04); }

.c7-collection-info { padding: 16px 18px; font-family: var(--c7-font-body); }
.c7-collection-title { font-family: var(--c7-font-heading); font-size: 1rem; font-weight: 700; margin: 0 0 6px; color: var(--c7-text); }
.c7-collection-desc  { font-size: 0.85rem; color: #666; margin: 0; line-height: 1.5; }

/* ── Cart Button ──────────────────────────────────────────────────────────── */
.c7-cart-btn-wrapper { position: relative; display: inline-flex; align-items: center; }
.c7-cart-btn {
    background: none; border: none; cursor: pointer; padding: 6px 8px;
    display: inline-flex; align-items: center; gap: 6px;
    color: inherit; font-size: 0.85rem;
    font-family: var(--c7-font-body);
    position: relative;
}
.c7-cart-count {
    /* Positioned badge overlapping the icon top-right */
    position:        absolute;
    top:             -3px;
    right:           -3px;
    background:      #232324;
    color:           #fff;
    font-size:       0.58rem;
    font-weight:     700;
    min-width:       18px;
    height:          18px;
    border-radius:   50%;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    padding:         0 3px;
    line-height:     1;
    box-shadow:      0 1px 4px rgba(0,0,0,.25);
    font-family:     var(--c7-font-body);
    letter-spacing:  0;
    pointer-events:  none;
}
.c7-cart-count:empty { display: none; }

/* ── Account Links — see full rules in Account/Login Widget section below ── */

/* ── Inventory Badge ──────────────────────────────────────────────────────── */
.c7-inventory-badge { display: inline-block; padding: 3px 10px; border-radius: 2px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: #fff; font-family: var(--c7-font-body); }
.c7-badge-in-stock  { background: #2d6a4f; }
.c7-badge-low-stock { background: #d97706; }
.c7-badge-sold-out  { background: #9b1c1c; }

/* ── Button style variants ────────────────────────────────────────────────── */
/* Applied via .c7-btn-outline / .c7-btn-ghost on the wrapper */

.c7-btn-outline .c7-product-card .c7-buy-product button,
.c7-btn-outline .c7-product-card .c7-buy-product a,
.c7-btn-outline.c7-product-card .c7-buy-product button {
    background: transparent;
    color: var(--c7-primary) !important;
    border: 1.5px solid var(--c7-primary);
}
.c7-btn-outline .c7-product-card .c7-buy-product button:hover,
.c7-btn-outline.c7-product-card .c7-buy-product button:hover {
    background: var(--c7-primary);
    color: #fff !important;
}

.c7-btn-ghost .c7-product-card .c7-buy-product button,
.c7-btn-ghost .c7-product-card .c7-buy-product a,
.c7-btn-ghost.c7-product-card .c7-buy-product button {
    background: transparent;
    color: var(--c7-primary) !important;
    border-color: transparent;
    text-decoration: underline;
    padding-left: 0;
    padding-right: 0;
}

/* Featured product button variants */
.c7-btn-outline.c7-featured-product .c7-buy-product button {
    background: transparent;
    color: var(--c7-primary);
    border: 1.5px solid var(--c7-primary);
}
.c7-btn-outline.c7-featured-product .c7-buy-product button:hover {
    background: var(--c7-primary);
    color: #fff;
}
.c7-btn-ghost.c7-featured-product .c7-buy-product button {
    background: transparent;
    color: var(--c7-primary);
    border: none;
    text-decoration: underline;
    padding-left: 0;
}

/* ── Horizontal card layout ───────────────────────────────────────────────── */
.c7-layout-horizontal {
    flex-direction: row !important;
    align-items: stretch;
}
.c7-layout-horizontal .c7-product-image {
    aspect-ratio: unset;
    width: 40%;
    min-width: 120px;
    flex-shrink: 0;
}
.c7-layout-horizontal .c7-product-info {
    flex: 1;
}
@media (max-width: 540px) {
    .c7-layout-horizontal { flex-direction: column !important; }
    .c7-layout-horizontal .c7-product-image { width: 100%; aspect-ratio: 3/4; }
}

/* ── Card style variants ──────────────────────────────────────────────────── */
.c7-card-style-shadow  .c7-product-card { box-shadow: 0 4px 24px rgba(0,0,0,.08); border-color: transparent; }
.c7-card-style-bordered .c7-product-card { border: 2px solid var(--c7-border); }
.c7-card-style-minimal .c7-product-card  { border: none; background: transparent; }
.c7-card-style-minimal .c7-product-card:hover { box-shadow: none; transform: none; }

/* ── Featured product actions row ────────────────────────────────────────── */
.c7-featured-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 4px;
}
.c7-featured-view-all {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--c7-primary);
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: var(--c7-font-body);
    opacity: 0.8;
    transition: opacity var(--c7-transition);
}
.c7-featured-view-all:hover { opacity: 1; text-decoration: underline; }

/* ── View All link below product grid ─────────────────────────────────────── */
.c7-grid-view-all {
    margin-top: 32px;
    text-align: center;
}
.c7-view-all-link {
    display: inline-block;
    padding: 11px 36px;
    border: 1.5px solid var(--c7-primary);
    color: var(--c7-primary);
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    border-radius: var(--c7-radius);
    font-family: var(--c7-font-body);
    transition: background var(--c7-transition), color var(--c7-transition);
}
.c7-view-all-link:hover {
    background: var(--c7-primary);
    color: #fff;
}

/* ── Club signup wrapper ──────────────────────────────────────────────────── */
.c7-club-signup-wrap {
    font-family: var(--c7-font-body);
}
.c7-club-signup-heading {
    font-family: var(--c7-font-heading);
    color: var(--c7-text);
    margin-top: 0;
    margin-bottom: 12px;
}
.c7-club-signup-desc {
    color: #666;
    line-height: 1.65;
    margin-bottom: 20px;
}

/* ── Reservation wrapper ──────────────────────────────────────────────────── */
.c7-reservation-wrap {
    font-family: var(--c7-font-body);
}
.c7-reservation-heading {
    font-family: var(--c7-font-heading);
    color: var(--c7-text);
    margin-top: 0;
    margin-bottom: 12px;
}
.c7-reservation-desc {
    color: #666;
    line-height: 1.65;
    margin-bottom: 24px;
}

/* ── Collection count + arrow ─────────────────────────────────────────────── */
.c7-collection-count {
    display: inline-block;
    margin-top: 6px;
    font-size: 0.75rem;
    color: var(--c7-accent);
    font-family: var(--c7-font-body);
}
.c7-collection-arrow {
    display: inline-block;
    margin-left: 4px;
    transition: transform var(--c7-transition);
    font-style: normal;
}
.c7-collection-card:hover .c7-collection-arrow {
    transform: translateX(4px);
}

/* ── Global button shape variants (body class set by plugin settings) ─────── */
/* sharp: no rounding */
body.c7-btn-shape-sharp .c7-product-card .c7-buy-product button,
body.c7-btn-shape-sharp .c7-card-btn,
body.c7-btn-shape-sharp .c7-filter-btn,
body.c7-btn-shape-sharp .c7-view-all-link {
    border-radius: 0 !important;
}
/* pill: fully rounded */
body.c7-btn-shape-pill .c7-product-card .c7-buy-product button,
body.c7-btn-shape-pill .c7-card-btn,
body.c7-btn-shape-pill .c7-filter-btn,
body.c7-btn-shape-pill .c7-view-all-link {
    border-radius: 999px !important;
}

/* ── Prevent #c7-cart from taking up space when empty ────────────────────── */
#c7-cart:empty { display: none; }

/* ── Cart Summary Widget ──────────────────────────────────────────────────── */
.c7-cart-summary-widget {
    font-family: var(--c7-font-body);
    border: 1px solid var(--c7-border);
    border-radius: var(--c7-radius);
    background: #fff;
    overflow: hidden;
}

.c7-cart-items-list {
    padding: 8px 0;
}

/* Each cart line item rendered by JS */
.c7-cart-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 18px;
    border-bottom: 1px solid #f3f3f3;
    font-size: 0.875rem;
}
.c7-cart-item-image {
    width: 52px;
    height: 68px;
    object-fit: contain;
    flex-shrink: 0;
    background: #f7f7f7;
    border-radius: 2px;
}
.c7-cart-item-info { flex: 1; min-width: 0; }
.c7-cart-item-title {
    font-weight: 600;
    color: var(--c7-text) !important;
    font-size: 0.85rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    text-decoration: none !important;
}
.c7-cart-item-meta { font-size: 0.75rem; color: #888; margin-top: 2px; }
.c7-cart-item-price { font-weight: 700; font-size: 0.9rem; color: var(--c7-text); white-space: nowrap; }
.c7-cart-item-qty {
    font-size: 0.78rem;
    border: 1px solid var(--c7-border);
    border-radius: var(--c7-radius);
    padding: 4px 8px;
    background: #fff;
    color: var(--c7-text);
    width: 52px;
    text-align: center;
}
.c7-cart-item-remove {
    font-size: 0.72rem;
    color: #aaa;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    margin-top: 4px;
    display: block;
    font-family: var(--c7-font-body);
    text-decoration: underline;
}
.c7-cart-item-remove:hover { color: #666; }

.c7-cart-totals {
    border-top: 1px solid var(--c7-border);
    padding: 16px 18px 0;
}
.c7-cart-subtotal-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-family: var(--c7-font-body);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--c7-text);
}
.c7-cart-subtotal-value { font-weight: 700; }

.c7-checkout-btn {
    display: block;
    width: calc(100% - 36px);
    margin: 14px 18px 18px;
    padding: 14px 20px;
    background: var(--c7-primary);
    color: #fff;
    border: 1px solid var(--c7-primary);
    border-radius: var(--c7-radius);
    font-family: var(--c7-font-body);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.9px;
    text-transform: uppercase;
    cursor: pointer;
    box-sizing: border-box;
    text-align: center;
    transition: background var(--c7-transition), color var(--c7-transition);
}
.c7-checkout-btn:hover {
    background: transparent;
    color: var(--c7-primary);
}

.c7-cart-empty-msg {
    text-align: center;
    padding: 40px 20px;
    color: #aaa;
    font-size: 0.9rem;
    font-family: var(--c7-font-body);
}

/* ── Cart Button Widget ───────────────────────────────────────────────────── */
/* Wrapper is already styled (.c7-cart-btn-wrapper / .c7-cart-btn / .c7-cart-count)
   Add cart label spacing */
.c7-cart-label {
    font-size: 0.85rem;
    font-weight: 600;
    font-family: var(--c7-font-body);
    margin-left: 4px;
}

/* ── Account / Login Widget ──────────────────────────────────────────────── */
.c7-account-links {
    display: inline-flex;
    gap: 20px;
    align-items: center;
    font-family: var(--c7-font-body);
}
.c7-account-link {
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    color: var(--c7-text) !important;
    text-decoration: none;
    transition: opacity var(--c7-transition);
}
.c7-account-link:hover { opacity: 0.65; }
.c7-account-link-signin {
    padding: 8px 18px;
    border: 1.5px solid var(--c7-text);
    border-radius: var(--c7-radius);
    font-size: 0.75rem;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    transition: background var(--c7-transition), color var(--c7-transition), border-color var(--c7-transition);
}
.c7-account-link-signin:hover {
    background: var(--c7-text);
    color: #fff !important;
}

/* ── Product Search Widget ───────────────────────────────────────────────── */
.c7-product-search-wrap {
    position: relative;
    font-family: var(--c7-font-body);
}

/* ── Elementor editor placeholder improvements ──────────────────────────── */
/* Shown when widget has no product ID configured */
.c7-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: var(--c7-radius);
    font-size: 0.85rem;
    font-family: var(--c7-font-body);
    background: #f7f8fa;
    color: #888;
    border: 1px dashed #d8dce3;
}
.c7-notice::before {
    content: '⚙';
    font-size: 1.1rem;
    opacity: 0.5;
    flex-shrink: 0;
}
.c7-notice-warning { background: #fef9ec; color: #a06000; border-color: #f5cc6a; }
.c7-notice-warning::before { content: '⚠'; }
.c7-notice-error   { background: #fef2f2; color: #991b1b; border-color: #fca5a5; }
.c7-notice-error::before { content: '✕'; }