/* ============================================================
 * Wac Marketplace — Module Fallback Stylesheet
 * Loaded for any theme that includes the module, providing
 * structural styling so pages don't render unstyled.
 * The full Wac/marketplace theme overrides this with polish.
 * Tokens come from wac-tokens.css.
 * ============================================================ */

/* Common cards/badges/buttons */

.wac-card,
.wac-portal-card {
    background: var(--wac-card-bg);
    border: var(--wac-card-border);
    border-radius: var(--wac-card-radius);
    padding: var(--wac-card-padding);
    margin-bottom: var(--wac-gap-md);
}

.wac-page-title { font: 600 24px/1.2 inherit; margin: 0 0 var(--wac-gap-md); color: var(--wac-text-strong); }
.wac-section-title { font: 600 16px/1.3 inherit; margin: 0 0 var(--wac-gap-sm); color: var(--wac-text-strong); }
.wac-muted { color: var(--wac-text-muted); }

.wac-badge {
    display: inline-block; padding: 2px 8px; border-radius: 999px;
    font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
}
.wac-badge--pending  { background: var(--wac-badge-pending-bg);  color: var(--wac-badge-pending-fg); }
.wac-badge--approved { background: var(--wac-badge-approved-bg); color: var(--wac-badge-approved-fg); }
.wac-badge--rejected { background: var(--wac-badge-rejected-bg); color: var(--wac-badge-rejected-fg); }
.wac-badge--locked   { background: var(--wac-badge-locked-bg);   color: var(--wac-badge-locked-fg); }
.wac-badge--paid     { background: var(--wac-badge-paid-bg);     color: var(--wac-badge-paid-fg); }

.wac-btn-accent {
    background: var(--wac-accent); color: var(--wac-accent-fg);
    border: none; border-radius: var(--wac-card-radius);
    padding: 8px 14px; font-weight: 600; cursor: pointer;
}
.wac-btn-accent:hover { background: var(--wac-accent-hover); color: var(--wac-accent-fg); }

.wac-rating { color: var(--wac-rating-color); letter-spacing: 1px; }

.wac-empty { text-align: center; padding: var(--wac-gap-lg); color: var(--wac-text-muted); }

/* Vacation banner */

.wac-shop-vacation,
.wac-vacation-banner {
    background: var(--wac-vacation-bg);
    color: var(--wac-vacation-fg);
    border: 1px solid var(--wac-vacation-border);
    padding: var(--wac-gap-md);
    border-radius: var(--wac-card-radius);
    margin-bottom: var(--wac-gap-md);
}

/* Portal layout */

.wac-portal-sidebar {
    background: var(--wac-card-bg); border: var(--wac-card-border);
    border-radius: var(--wac-card-radius); padding: var(--wac-gap-sm);
}
.wac-portal-sidebar a {
    display: block; padding: 8px 12px; color: var(--wac-text-strong);
    text-decoration: none; border-radius: var(--wac-card-radius); margin-bottom: 2px;
}
.wac-portal-sidebar a:hover { background: #f9fafb; }
.wac-portal-sidebar a.is-active { background: #fff7ed; color: var(--wac-accent); font-weight: 600; }

.wac-tile-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--wac-gap-md);
    margin-bottom: var(--wac-gap-md);
}
@media (max-width: 768px) { .wac-tile-grid { grid-template-columns: repeat(2, 1fr); } }
.wac-tile {
    background: var(--wac-card-bg); border: var(--wac-card-border);
    border-radius: var(--wac-card-radius); padding: var(--wac-card-padding);
}
.wac-tile__label { color: var(--wac-text-muted); font-size: 13px; text-transform: uppercase; }
.wac-tile__value { font-size: 22px; font-weight: 700; color: var(--wac-text-strong); }

.wac-table { width: 100%; border-collapse: collapse; }
.wac-table th, .wac-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #f3f4f6; }
.wac-table thead th { background: #f9fafb; font-size: 13px; color: var(--wac-text-muted); text-transform: uppercase; }

/* Messaging fallback */

.wac-messaging {
    display: grid; grid-template-columns: 280px 1fr; gap: var(--wac-gap-md);
    border: var(--wac-card-border); border-radius: var(--wac-card-radius); overflow: hidden;
}
@media (max-width: 768px) { .wac-messaging { grid-template-columns: 1fr; } }

.wac-thread-row {
    display: block; padding: var(--wac-gap-sm); border-bottom: 1px solid #f3f4f6;
    color: var(--wac-text-strong); text-decoration: none;
}
.wac-thread-row.is-active { background: #fff7ed; font-weight: 600; }

.wac-bubble {
    max-width: 80%; padding: 8px 12px; border-radius: 8px;
    margin-bottom: var(--wac-gap-sm); white-space: pre-wrap;
}
.wac-bubble--customer { background: var(--wac-bubble-customer); color: var(--wac-bubble-customer-fg); }
.wac-bubble--seller   { background: var(--wac-bubble-seller);   color: var(--wac-bubble-seller-fg);   margin-left: auto; }
.wac-bubble--admin    { background: var(--wac-bubble-admin);    color: var(--wac-bubble-admin-fg);    text-align: center; font-style: italic; }

/* PDP pill (basic) */

.wac-pdp-soldby {
    display: inline-flex; align-items: center; gap: var(--wac-gap-sm);
    padding: 6px 12px; background: var(--wac-card-bg); border: var(--wac-card-border);
    border-radius: 999px; max-width: 320px; margin: var(--wac-gap-sm) 0;
}
.wac-pdp-soldby__name { font-weight: 600; color: var(--wac-text-strong); text-decoration: none; }

/* Review card (basic) */

.wac-review-card {
    background: var(--wac-card-bg); border: var(--wac-card-border);
    border-radius: var(--wac-card-radius); padding: var(--wac-card-padding);
    margin-bottom: var(--wac-gap-md);
}