/*
 * TAD Meet — Customer-facing theme tokens.
 *
 * CSS custom properties consumed by `single-product-selector.css` and
 * `my-account.css`. Themes can override any token by re-declaring it on
 * `:root` (or any narrower scope) — the cascade will pick up the override
 * because this file is enqueued first by TAD_Meet_Theme_Hooks.
 *
 * Admin-facing CSS (`admin-*.css`) intentionally does NOT consume these
 * tokens — admin surfaces should follow core WP-Admin styling, not the
 * front-end theme.
 */

:root {
    /* Brand & state colors */
    --tad-meet-color-primary: #2563eb;
    --tad-meet-color-primary-hover: #1d4ed8;
    --tad-meet-color-success: #16a34a;
    --tad-meet-color-danger: #b32d2e;
    --tad-meet-color-text: #0f172a;
    --tad-meet-color-muted: #64748b;
    --tad-meet-color-border: #e2e8f0;
    --tad-meet-color-surface: #f8fafc;
    --tad-meet-color-surface-alt: #ffffff;
    --tad-meet-color-disabled: #9ca3af;

    /* Typography */
    --tad-meet-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    /* Shape & spacing */
    --tad-meet-radius: 6px;
    --tad-meet-spacing: 12px;
}

/* ==========================================================================
   .tad-session-summary — hero "date/time · price" block
   Rendered by [tad_session_summary]. Semantic markup only, minimal styles
   themes can override via CSS custom properties on :root or scoped selectors.
   ========================================================================== */
.tad-session-summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    font-family: var(--tad-font-body, "Rethink Sans", Georgia, "Times New Roman", Arial, sans-serif);
    color: var(--tad-color-navy, #233454);
    line-height: 1.4;
}
.tad-session-summary__when {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.tad-session-summary__date {
    font-size: 18px;
    font-weight: 700;
    color: var(--tad-color-navy, #233454);
}
.tad-session-summary__time {
    font-size: 18px;
    font-weight: 400;
    color: var(--tad-color-navy, #233454);
    opacity: 0.75;
}
.tad-session-summary__price {
    font-size: 20px;
    font-weight: 600;
    color: var(--tad-color-navy, #233454);
    text-align: right;
    white-space: nowrap;
}
.tad-session-summary__price .woocommerce-Price-amount,
.tad-session-summary__price bdi {
    font-weight: 600;
}
@media (max-width: 480px) {
    .tad-session-summary { flex-direction: column; align-items: stretch; }
    .tad-session-summary__price { text-align: left; }
}