/**
 * =========================================================================
 * PROPVENDOR OFFICIAL DESIGN SYSTEM v1.0 (PHASE 9A)
 * Unified Design Tokens & Foundational Component Architecture
 * =========================================================================
 */

:root {
    /* --- Brand Core Palette --- */
    --pv-color-navy: #142B3B;
    --pv-color-navy-dark: #0D1C27;
    --pv-color-navy-light: #1D3D52;

    --pv-color-teal: #087F8C;
    --pv-color-teal-hover: #066772;
    --pv-color-teal-active: #05545D;
    --pv-color-teal-subtle: #E6F4F6;

    --pv-color-gold: #F3B64C;
    --pv-color-gold-hover: #E5A335;
    --pv-color-gold-active: #D49526;
    --pv-color-gold-subtle: #FEF7EC;

    /* --- Surfaces & Neutrals --- */
    --pv-color-bg: #F5F7FA;
    --pv-color-surface: #FFFFFF;
    --pv-color-surface-alt: #F8FAFC;
    --pv-color-border: #E2E8F0;
    --pv-color-border-subtle: #EEF2F6;
    --pv-color-border-hover: #CBD5E1;

    /* --- Typography Colors --- */
    --pv-text-primary: #0F172A;
    --pv-text-secondary: #475569;
    --pv-text-muted: #94A3B8;
    --pv-text-inverse: #FFFFFF;

    /* --- Status & Feedback Colors --- */
    --pv-status-success: #0A8A4F;
    --pv-status-success-bg: #E8F8F0;
    --pv-status-success-border: #A7F3D0;
    --pv-status-success-text: #065F46;

    --pv-status-warning: #D97706;
    --pv-status-warning-bg: #FEF3C7;
    --pv-status-warning-border: #FDE68A;
    --pv-status-warning-text: #92400E;

    --pv-status-danger: #DC2626;
    --pv-status-danger-bg: #FEE2E2;
    --pv-status-danger-border: #FECACA;
    --pv-status-danger-text: #991B1B;

    --pv-status-info: #0284C7;
    --pv-status-info-bg: #E0F2FE;
    --pv-status-info-border: #BAE6FD;
    --pv-status-info-text: #0369A1;

    /* --- Typography System --- */
    --pv-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --pv-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --pv-font-size-xs: 0.75rem;     /* 12px */
    --pv-font-size-sm: 0.875rem;    /* 14px */
    --pv-font-size-base: 1rem;      /* 16px */
    --pv-font-size-lg: 1.125rem;    /* 18px */
    --pv-font-size-xl: 1.25rem;     /* 20px */
    --pv-font-size-2xl: 1.5rem;     /* 24px */
    --pv-font-size-3xl: 1.875rem;   /* 30px */
    --pv-font-size-4xl: 2.25rem;    /* 36px */

    --pv-line-height-tight: 1.2;
    --pv-line-height-snug: 1.35;
    --pv-line-height-normal: 1.5;
    --pv-line-height-relaxed: 1.625;

    --pv-font-weight-regular: 400;
    --pv-font-weight-medium: 500;
    --pv-font-weight-semibold: 600;
    --pv-font-weight-bold: 700;
    --pv-font-weight-extrabold: 800;

    /* --- Spacing Scale --- */
    --pv-space-1: 0.25rem;   /* 4px */
    --pv-space-2: 0.5rem;    /* 8px */
    --pv-space-3: 0.75rem;   /* 12px */
    --pv-space-4: 1rem;      /* 16px */
    --pv-space-5: 1.25rem;   /* 20px */
    --pv-space-6: 1.5rem;    /* 24px */
    --pv-space-8: 2rem;      /* 32px */
    --pv-space-10: 2.5rem;   /* 40px */
    --pv-space-12: 3rem;     /* 48px */

    /* --- Border Radius System --- */
    --pv-radius-sm: 6px;
    --pv-radius-md: 8px;
    --pv-radius-lg: 12px;
    --pv-radius-xl: 16px;
    --pv-radius-full: 9999px;

    /* --- Shadows & Elevations --- */
    --pv-shadow-sm: 0 1px 2px 0 rgba(20, 43, 59, 0.05);
    --pv-shadow-md: 0 4px 6px -1px rgba(20, 43, 59, 0.08), 0 2px 4px -2px rgba(20, 43, 59, 0.04);
    --pv-shadow-lg: 0 10px 15px -3px rgba(20, 43, 59, 0.10), 0 4px 6px -4px rgba(20, 43, 59, 0.05);
    --pv-shadow-focus: 0 0 0 3px rgba(8, 127, 140, 0.25);
    --pv-shadow-focus-gold: 0 0 0 3px rgba(243, 182, 76, 0.35);

    /* --- Animation & Transitions --- */
    --pv-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --pv-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --pv-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* =========================================================================
 * FOUNDATIONAL COMPONENT CLASSES (PHASE 9A)
 * Namespaced, Reusable UI Building Blocks
 * ========================================================================= */

/* --- Buttons Base Reset & General Rules --- */
.pv-btn-primary,
.pv-btn-secondary,
.pv-btn-accent,
.pv-btn-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    box-sizing: border-box;
    font-family: var(--pv-font-sans);
    line-height: 1.25;
    text-align: center;
    cursor: pointer;
    max-width: 100%;
    vertical-align: middle;
    user-select: none;
    -webkit-appearance: none;
    appearance: none;
}

/* --- 1. Primary Button --- */
.pv-btn-primary {
    background-color: var(--pv-color-teal);
    color: var(--pv-text-inverse) !important;
    border: 1.5px solid var(--pv-color-teal);
    border-radius: var(--pv-radius-md);
    padding: 0.7rem 1.4rem;
    font-size: var(--pv-font-size-base);
    font-weight: var(--pv-font-weight-semibold);
    text-decoration: none !important;
    box-shadow: var(--pv-shadow-sm);
    transition: background-color var(--pv-transition-base),
                border-color var(--pv-transition-base),
                color var(--pv-transition-base),
                box-shadow var(--pv-transition-base),
                transform var(--pv-transition-base);
}

.pv-btn-primary:hover {
    background-color: var(--pv-color-teal-hover);
    border-color: var(--pv-color-teal-hover);
    color: var(--pv-text-inverse) !important;
    box-shadow: var(--pv-shadow-md);
    transform: translateY(-1px);
}

.pv-btn-primary:active {
    background-color: var(--pv-color-teal-active);
    border-color: var(--pv-color-teal-active);
    transform: translateY(0);
    box-shadow: var(--pv-shadow-sm);
}

.pv-btn-primary:focus-visible {
    outline: none;
    box-shadow: var(--pv-shadow-focus);
}

.pv-btn-primary:disabled,
.pv-btn-primary.is-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

/* --- 2. Secondary Button --- */
.pv-btn-secondary {
    background-color: var(--pv-color-surface);
    color: var(--pv-color-navy) !important;
    border: 1.5px solid var(--pv-color-border);
    border-radius: var(--pv-radius-md);
    padding: 0.7rem 1.4rem;
    font-size: var(--pv-font-size-base);
    font-weight: var(--pv-font-weight-semibold);
    text-decoration: none !important;
    box-shadow: var(--pv-shadow-sm);
    transition: background-color var(--pv-transition-base),
                border-color var(--pv-transition-base),
                color var(--pv-transition-base),
                box-shadow var(--pv-transition-base),
                transform var(--pv-transition-base);
}

.pv-btn-secondary:hover {
    background-color: var(--pv-color-surface-alt);
    border-color: var(--pv-color-navy-light);
    color: var(--pv-color-navy-dark) !important;
    box-shadow: var(--pv-shadow-md);
    transform: translateY(-1px);
}

.pv-btn-secondary:active {
    background-color: var(--pv-color-border-subtle);
    border-color: var(--pv-color-navy);
    transform: translateY(0);
    box-shadow: var(--pv-shadow-sm);
}

.pv-btn-secondary:focus-visible {
    outline: none;
    border-color: var(--pv-color-teal);
    box-shadow: var(--pv-shadow-focus);
}

.pv-btn-secondary:disabled,
.pv-btn-secondary.is-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

/* --- 3. Accent (Gold) Button --- */
.pv-btn-accent {
    background-color: var(--pv-color-gold);
    color: var(--pv-color-navy-dark) !important;
    border: 1.5px solid var(--pv-color-gold);
    border-radius: var(--pv-radius-md);
    padding: 0.7rem 1.4rem;
    font-size: var(--pv-font-size-base);
    font-weight: var(--pv-font-weight-bold);
    text-decoration: none !important;
    box-shadow: var(--pv-shadow-sm);
    transition: background-color var(--pv-transition-base),
                border-color var(--pv-transition-base),
                color var(--pv-transition-base),
                box-shadow var(--pv-transition-base),
                transform var(--pv-transition-base);
}

.pv-btn-accent:hover {
    background-color: var(--pv-color-gold-hover);
    border-color: var(--pv-color-gold-hover);
    color: var(--pv-color-navy-dark) !important;
    box-shadow: var(--pv-shadow-md);
    transform: translateY(-1px);
}

.pv-btn-accent:active {
    background-color: var(--pv-color-gold-active);
    border-color: var(--pv-color-gold-active);
    transform: translateY(0);
    box-shadow: var(--pv-shadow-sm);
}

.pv-btn-accent:focus-visible {
    outline: none;
    box-shadow: var(--pv-shadow-focus-gold);
}

.pv-btn-accent:disabled,
.pv-btn-accent.is-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

/* --- 4. Text / Subtle Link Button --- */
.pv-btn-text {
    background-color: transparent;
    color: var(--pv-color-teal) !important;
    border: 1px solid transparent;
    border-radius: var(--pv-radius-sm);
    padding: 0.4rem 0.6rem;
    font-size: var(--pv-font-size-base);
    font-weight: var(--pv-font-weight-semibold);
    text-decoration: none !important;
    transition: color var(--pv-transition-fast),
                background-color var(--pv-transition-fast),
                text-decoration var(--pv-transition-fast);
}

.pv-btn-text:hover {
    color: var(--pv-color-teal-hover) !important;
    background-color: var(--pv-color-teal-subtle);
    text-decoration: underline !important;
}

.pv-btn-text:active {
    color: var(--pv-color-teal-active) !important;
}

.pv-btn-text:focus-visible {
    outline: none;
    box-shadow: var(--pv-shadow-focus);
}

.pv-btn-text:disabled,
.pv-btn-text.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
    text-decoration: none !important;
}

/* --- 5. Card Container --- */
.pv-card {
    background-color: var(--pv-color-surface);
    border: 1px solid var(--pv-color-border);
    border-radius: var(--pv-radius-lg);
    box-shadow: var(--pv-shadow-sm);
    padding: var(--pv-space-6);
    box-sizing: border-box;
    max-width: 100%;
    transition: border-color var(--pv-transition-base),
                box-shadow var(--pv-transition-base),
                transform var(--pv-transition-base);
}

.pv-card-interactive {
    cursor: pointer;
}

.pv-card-interactive:hover {
    border-color: var(--pv-color-teal);
    box-shadow: var(--pv-shadow-md);
    transform: translateY(-2px);
}

.pv-card-interactive:focus-within {
    border-color: var(--pv-color-teal);
    box-shadow: var(--pv-shadow-focus);
}

/* --- 6. Status & Label Badges --- */
.pv-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--pv-font-sans);
    font-size: var(--pv-font-size-xs);
    font-weight: var(--pv-font-weight-bold);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.28rem 0.65rem;
    border-radius: var(--pv-radius-full);
    line-height: 1.2;
    background-color: var(--pv-color-teal-subtle);
    color: var(--pv-color-teal);
    border: 1px solid transparent;
    box-sizing: border-box;
    white-space: nowrap;
}

.pv-badge-primary {
    background-color: var(--pv-color-teal-subtle);
    color: var(--pv-color-teal);
    border-color: rgba(8, 127, 140, 0.2);
}

.pv-badge-accent {
    background-color: var(--pv-color-gold-subtle);
    color: #8A5800;
    border-color: rgba(243, 182, 76, 0.35);
}

.pv-badge-success {
    background-color: var(--pv-status-success-bg);
    color: var(--pv-status-success-text);
    border-color: var(--pv-status-success-border);
}

.pv-badge-warning {
    background-color: var(--pv-status-warning-bg);
    color: var(--pv-status-warning-text);
    border-color: var(--pv-status-warning-border);
}

.pv-badge-danger {
    background-color: var(--pv-status-danger-bg);
    color: var(--pv-status-danger-text);
    border-color: var(--pv-status-danger-border);
}

.pv-badge-neutral {
    background-color: var(--pv-color-surface-alt);
    color: var(--pv-text-secondary);
    border-color: var(--pv-color-border);
}

/* --- 7. Form Controls --- */
.pv-form-control,
input.pv-form-control,
select.pv-form-control,
textarea.pv-form-control {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    padding: 0.65rem 1rem;
    font-family: var(--pv-font-sans);
    font-size: var(--pv-font-size-base);
    line-height: var(--pv-line-height-normal);
    color: var(--pv-text-primary);
    background-color: var(--pv-color-surface);
    border: 1.5px solid var(--pv-color-border);
    border-radius: var(--pv-radius-md);
    box-shadow: var(--pv-shadow-sm);
    transition: border-color var(--pv-transition-fast),
                box-shadow var(--pv-transition-fast),
                background-color var(--pv-transition-fast);
}

textarea.pv-form-control {
    min-height: 100px;
    resize: vertical;
}

.pv-form-control:hover {
    border-color: var(--pv-color-border-hover);
}

.pv-form-control:focus,
.pv-form-control:focus-visible {
    outline: none;
    border-color: var(--pv-color-teal);
    box-shadow: var(--pv-shadow-focus);
    background-color: var(--pv-color-surface);
}

.pv-form-control:disabled,
.pv-form-control.is-disabled {
    background-color: var(--pv-color-surface-alt);
    border-color: var(--pv-color-border);
    color: var(--pv-text-muted);
    cursor: not-allowed;
    opacity: 0.75;
}

.pv-form-control.is-invalid,
.pv-form-control:invalid:not(:placeholder-shown) {
    border-color: var(--pv-status-danger);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
}

/* --- 8. Alert Banners --- */
.pv-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--pv-radius-md);
    font-family: var(--pv-font-sans);
    font-size: var(--pv-font-size-sm);
    line-height: var(--pv-line-height-normal);
    box-sizing: border-box;
    max-width: 100%;
    margin-bottom: var(--pv-space-4);
    border: 1px solid transparent;
}

.pv-alert-info {
    background-color: var(--pv-status-info-bg);
    border-color: var(--pv-status-info-border);
    color: var(--pv-status-info-text);
}

.pv-alert-success {
    background-color: var(--pv-status-success-bg);
    border-color: var(--pv-status-success-border);
    color: var(--pv-status-success-text);
}

.pv-alert-warning {
    background-color: var(--pv-status-warning-bg);
    border-color: var(--pv-status-warning-border);
    color: var(--pv-status-warning-text);
}

.pv-alert-danger {
    background-color: var(--pv-status-danger-bg);
    border-color: var(--pv-status-danger-border);
    color: var(--pv-status-danger-text);
}

/* --- Accessibility: Reduced Motion Support --- */
@media (prefers-reduced-motion: reduce) {
    .pv-btn-primary,
    .pv-btn-secondary,
    .pv-btn-accent,
    .pv-btn-text,
    .pv-card,
    .pv-card-interactive,
    .pv-form-control,
    .pv-alert {
        transition: none !important;
        transform: none !important;
    }
}

.propvendor-hero {
    display: grid;
    grid-template-columns: 1.5fr 0.8fr;
    gap: 2rem;
    align-items: center;
    padding: 2rem 0 1rem;
}

.propvendor-tag {
    display: inline-block;
    background: #eef7ff;
    color: #0d5aa7;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    padding: 0.4rem 0.7rem;
    border-radius: 999px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 1rem;
}

.propvendor-hero-copy h1 {
    font-size: clamp(2.2rem, 3vw, 4rem);
    line-height: 1.1;
    margin-bottom: 1rem;
}

.propvendor-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.propvendor-btn {
    display: inline-block;
    padding: 0.9rem 1.4rem;
    border-radius: 0.5rem;
    font-weight: 700;
    text-decoration: none;
}

.propvendor-btn.primary {
    background: #0d5aa7;
    color: #fff;
}

.propvendor-btn.secondary {
    background: #ebf4ff;
    color: #0b2e4d;
}

.propvendor-hero-panel,
.propvendor-form-box,
.propvendor-card,
.propvendor-dashboard {
    background: #fff;
    border: 1px solid #e6edf4;
    border-radius: 1rem;
    box-shadow: 0 10px 26px rgba(16, 28, 45, 0.06);
}

.propvendor-hero-panel {
    padding: 1.5rem;
}

.propvendor-hero-panel ul {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
}

.propvendor-hero-panel li {
    padding: 0.55rem 0;
    border-bottom: 1px solid #edf2f8;
}

.propvendor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.2rem;
    margin: 1.5rem 0;
}

.propvendor-card {
    padding: 1.2rem;
}

.propvendor-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #0d5aa7;
    background: #ecf5ff;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    margin-bottom: 0.8rem;
}

.propvendor-card h3 {
    margin: 0 0 0.5rem;
    font-size: 1.2rem;
}

.propvendor-card h3 a {
    text-decoration: none;
    color: #081b2d;
}

.propvendor-price {
    color: #0a8a4f;
    font-weight: 900;
    margin: 0.8rem 0 0.4rem;
}

.propvendor-status,
.propvendor-meta,
.propvendor-empty {
    color: #52667d;
}

.propvendor-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    max-width: 1200px;
    margin: 3.5rem auto 4.5rem;
    padding: 0 20px;
}

.propvendor-info-grid > div {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 2rem 1.5rem;
    position: relative;
    overflow: hidden;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.05));
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.propvendor-info-grid > div::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--pv-color-teal, #087F8C), var(--pv-color-gold, #F3B64C));
}

.propvendor-info-grid > div:hover {
    transform: translateY(-2px);
    box-shadow: var(--pv-shadow-md, 0 8px 20px -4px rgba(13, 28, 39, 0.08));
}

.propvendor-info-grid h3 {
    color: var(--pv-color-navy, #142B3B);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    letter-spacing: -0.01em;
}

.propvendor-info-grid p {
    color: var(--pv-text-secondary, #475569);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 992px) {
    .propvendor-info-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        margin: 2.5rem auto 3.5rem;
    }
}

.propvendor-form-box {
    padding: 1.5rem;
    margin: 1.5rem 0;
}

.propvendor-form {
    display: grid;
    gap: 0.9rem;
}

.propvendor-form label {
    display: grid;
    gap: 0.35rem;
    font-weight: 600;
    color: #1b2d3d;
}

.propvendor-form input,
.propvendor-form select,
.propvendor-form textarea {
    width: 100%;
    padding: 0.75rem 0.9rem;
    border: 1px solid #d9e3ee;
    border-radius: 0.6rem;
    background: #fff;
    font: inherit;
}

.propvendor-form select,
.propvendor-form input[type="text"],
.propvendor-form input[type="number"],
.propvendor-form input[type="email"],
.propvendor-form input[type="tel"],
select.form-control {
    height: 44px !important;
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
}

.propvendor-form button {
    border: none;
    border-radius: 0.6rem;
    background: #0d5aa7;
    color: #fff;
    padding: 0.9rem 1.1rem;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
}

.propvendor-dashboard {
    padding: 2.25rem 2rem;
    margin: 2rem auto 3rem;
    max-width: 1240px;
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 14px);
    box-shadow: 0 4px 16px rgba(20, 43, 59, 0.05);
}

.propvendor-dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.propvendor-dashboard-header h2 {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--pv-color-navy, #142B3B);
    letter-spacing: -0.02em;
}

.propvendor-dashboard-header p {
    margin: 0.35rem 0 0;
    color: var(--pv-text-secondary, #475569);
    font-size: 0.95rem;
}

.propvendor-dashboard-add {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex: 0 0 auto;
    padding: 0.65rem 1.25rem;
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    transition: all 0.2s ease;
}

.propvendor-dashboard-add:hover,
.propvendor-dashboard-add:focus {
    background: var(--pv-color-teal-hover, #066772);
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

.propvendor-dashboard-empty {
    padding: 3.5rem 2rem;
    border: 2px dashed var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    background: var(--pv-color-surface-alt, #f8fafc);
    text-align: center;
    margin: 1.5rem 0;
}

.propvendor-dashboard-empty p.propvendor-empty {
    font-size: 1.05rem;
    color: var(--pv-text-secondary, #475569);
    margin: 0 0 1.5rem;
}

.propvendor-dashboard-empty .propvendor-dashboard-add {
    margin: 0 auto;
}

.propvendor-dashboard-table-wrap {
    overflow-x: auto;
    border: 1.5px solid var(--pv-color-border-hover, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    background: var(--pv-color-surface, #ffffff);
    box-shadow: 0 1px 4px rgba(20, 43, 59, 0.04);
    margin-bottom: 2rem;
}

.propvendor-dashboard-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    text-align: left;
}

.propvendor-dashboard-table th,
.propvendor-dashboard-table td {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--pv-color-border, #e2e8f0);
    vertical-align: middle;
}

.propvendor-dashboard-table th {
    background: var(--pv-color-surface-alt, #f8fafc);
    color: var(--pv-color-navy, #142B3B);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid var(--pv-color-border-hover, #cbd5e1);
    white-space: nowrap;
}

.propvendor-dashboard-table tbody tr {
    transition: background-color 0.15s ease;
}

.propvendor-dashboard-table tbody tr:hover td {
    background-color: #f8fafc;
}

.propvendor-dashboard-table td {
    color: var(--pv-text-main, #0f172a);
}

.propvendor-dashboard-table td strong {
    color: var(--pv-color-navy, #142B3B);
    font-size: 0.95rem;
}

.propvendor-dashboard-table tr:last-child td {
    border-bottom: 0;
}

.propvendor-dashboard-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.75rem;
    border-radius: var(--pv-radius-full, 9999px);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
    line-height: 1.3;
}

.propvendor-dashboard-status-pending-review {
    background: var(--pv-status-warning-bg, #fef3c7);
    color: var(--pv-status-warning-text, #92400e);
    border: 1px solid var(--pv-status-warning-border, #fde68a);
}

.propvendor-dashboard-status-published {
    background: var(--pv-status-success-bg, #e8f8f0);
    color: var(--pv-status-success-text, #065f46);
    border: 1px solid var(--pv-status-success-border, #a7f3d0);
}

.propvendor-dashboard-status-rejected {
    background: var(--pv-status-danger-bg, #fee2e2);
    color: var(--pv-status-danger-text, #991b1b);
    border: 1px solid var(--pv-status-danger-border, #fecaca);
}

.propvendor-dashboard-status-sold,
.propvendor-dashboard-status-rented {
    background: var(--pv-status-info-bg, #e0f2fe);
    color: var(--pv-status-info-text, #0369a1);
    border: 1px solid var(--pv-status-info-border, #bae6fd);
}

.propvendor-dashboard-status-expired,
.propvendor-dashboard-status-unavailable {
    background: #f1f5f9;
    color: var(--pv-text-secondary, #475569);
    border: 1px solid #cbd5e1;
}

.propvendor-dashboard-actions {
    white-space: nowrap;
}

.propvendor-dashboard-actions a {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem 0.75rem;
    border-radius: var(--pv-radius-sm, 6px);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
    margin-right: 0.35rem;
}

.propvendor-dashboard-actions a[href*="propvendor_edit_listing"] {
    background: var(--pv-color-surface, #ffffff);
    color: var(--pv-color-navy, #142B3B);
    border: 1px solid var(--pv-color-border-hover, #cbd5e1);
}

.propvendor-dashboard-actions a[href*="propvendor_edit_listing"]:hover,
.propvendor-dashboard-actions a[href*="propvendor_edit_listing"]:focus {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.2);
}

.propvendor-dashboard-actions a:not([href*="propvendor_edit_listing"]) {
    background: var(--pv-color-teal-subtle, #e6f4f6);
    color: var(--pv-color-teal, #087F8C);
    border: 1px solid rgba(8, 127, 140, 0.25);
}

.propvendor-dashboard-actions a:not([href*="propvendor_edit_listing"]):hover,
.propvendor-dashboard-actions a:not([href*="propvendor_edit_listing"]):focus {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.2);
}

.propvendor-dashboard-list {
    margin: 0;
    padding-left: 1.2rem;
}

.propvendor-listing-detail {
    margin: 1.5rem 0;
}

.propvendor-detail-top {
    margin-bottom: 1.25rem;
}

.propvendor-detail-back {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--pv-color-teal, #087F8C);
    text-decoration: none;
    padding: 0.45rem 0.9rem;
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    box-shadow: var(--pv-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.04));
    transition: all 0.2s ease;
}

.propvendor-detail-back:hover,
.propvendor-detail-back:focus {
    background: var(--pv-color-surface-alt, #f8fafc);
    color: var(--pv-color-teal-hover, #066772);
    border-color: var(--pv-color-teal, #087F8C);
    transform: translateX(-2px);
}

.propvendor-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(320px, 1fr);
    gap: 2rem;
    align-items: start;
}

.propvendor-detail-main,
.propvendor-detail-facts,
.propvendor-detail-contact {
    min-width: 0;
    padding: 1.75rem;
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    background: var(--pv-color-surface, #ffffff);
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.05));
}

.propvendor-detail-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.85rem;
    margin-bottom: 1.75rem;
}

.propvendor-detail-gallery figure {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    position: relative;
}

.propvendor-detail-gallery figure:first-child {
    grid-column: 1 / -1;
    border-radius: var(--pv-radius-lg, 12px);
}

.propvendor-detail-image {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 520px;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    transition: transform 0.35s ease;
}

.propvendor-detail-gallery figure:hover .propvendor-detail-image {
    transform: scale(1.02);
}

.propvendor-detail-no-image {
    display: grid;
    min-height: 220px;
    place-items: center;
    margin: 0;
    padding: 2rem;
    border: 1px dashed var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    background: var(--pv-color-surface-alt, #f8fafc);
    color: var(--pv-text-muted, #64748b);
    text-align: center;
    font-size: 0.95rem;
}

.propvendor-detail-description {
    margin-top: 1.75rem;
    overflow-wrap: anywhere;
}

.propvendor-detail-description h2,
.propvendor-detail-facts h2,
.propvendor-detail-contact h2 {
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    letter-spacing: -0.01em;
    border-bottom: 2px solid var(--pv-color-border-subtle, #f1f5f9);
    padding-bottom: 0.65rem;
}

.propvendor-detail-description p {
    color: var(--pv-text-secondary, #475569);
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 1.25rem;
}

.propvendor-detail-facts dl {
    display: grid;
    gap: 0;
    margin: 0;
}

.propvendor-detail-facts dl > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.8rem 0;
    border-bottom: 1px solid var(--pv-color-border-subtle, #edf2f8);
}

.propvendor-detail-facts dl > div:last-child {
    border-bottom: 0;
}

.propvendor-detail-facts dt {
    color: var(--pv-text-secondary, #64748b);
    font-weight: 600;
    font-size: 0.9rem;
}

.propvendor-detail-facts dd {
    margin: 0;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--pv-color-navy, #142B3B);
    text-align: right;
    overflow-wrap: anywhere;
}

.propvendor-detail-sidebar {
    display: grid;
    gap: 1.5rem;
}

.propvendor-detail-contact {
    display: grid;
    gap: 0.75rem;
}

.propvendor-detail-contact h2,
.propvendor-detail-contact p {
    margin-bottom: 0;
}

.propvendor-contact-action {
    display: block;
    padding: 0.75rem 1rem;
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.95rem;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    transition: all 0.2s ease;
    margin-top: 0.5rem;
}

.propvendor-contact-action:hover,
.propvendor-contact-action:focus {
    background: var(--pv-color-teal-hover, #066772);
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

.propvendor-contact-detail {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--pv-color-navy, #142B3B);
    margin: 0.4rem 0;
    text-align: center;
}

.propvendor-detail-muted {
    font-size: 0.85rem;
    color: var(--pv-text-muted, #64748b);
    font-style: italic;
    overflow-wrap: anywhere;
    margin-top: 0.35rem;
}

.propvendor-related-listings {
    margin-top: 3.5rem;
    padding-top: 2rem;
    border-top: 1px solid var(--pv-color-border, #e2e8f0);
}

.propvendor-browse {
    margin: 1.5rem 0;
}

.propvendor-filter-form {
    padding: 1.25rem;
    border: 1px solid #e6edf4;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 26px rgba(16, 28, 45, 0.06);
}

.propvendor-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
    gap: 1rem;
}

.propvendor-filter-grid label {
    display: grid;
    gap: 0.4rem;
    color: #1b2d3d;
    font-weight: 600;
}

.propvendor-filter-grid input,
.propvendor-filter-grid select {
    box-sizing: border-box;
    width: 100%;
    min-height: 2.8rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid #d9e3ee;
    border-radius: 0.55rem;
    background: #fff;
    font: inherit;
}

.propvendor-filter-note {
    margin: 1rem 0 0;
    color: #52667d;
    font-size: 0.9rem;
}

.propvendor-filter-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.propvendor-filter-actions button {
    min-height: 2.8rem;
    padding: 0.65rem 1rem;
    border: 0;
    border-radius: 0.55rem;
    background: #0d5aa7;
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.propvendor-filter-actions button:hover,
.propvendor-filter-actions button:focus {
    background: #0b477f;
}

.propvendor-filter-actions a {
    font-weight: 700;
}

.propvendor-results-count {
    margin: 1.5rem 0 1rem;
    color: var(--pv-text-secondary, #475569);
    font-weight: 600;
    font-size: 0.95rem;
}

.propvendor-browse .propvendor-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin: 1.5rem 0 2.5rem;
}

.propvendor-browse .propvendor-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    overflow: hidden;
    padding: 0;
    display: flex;
    flex-direction: column;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.05));
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.propvendor-browse .propvendor-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--pv-shadow-md, 0 8px 24px -4px rgba(13, 28, 39, 0.12));
    border-color: var(--pv-color-border-hover, #cbd5e1);
}

.propvendor-browse .propvendor-card-image-link {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #f1f5f9;
}

.propvendor-browse .propvendor-card-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #f0f4f8;
    transition: transform 0.35s ease;
}

.propvendor-browse .propvendor-card:hover .propvendor-card-image {
    transform: scale(1.03);
}

.propvendor-browse .propvendor-card .propvendor-badge {
    margin: 1rem 1.1rem 0.35rem;
    align-self: flex-start;
    color: var(--pv-color-teal, #087F8C);
    background: var(--pv-color-teal-subtle, #E6F4F6);
    border-radius: var(--pv-radius-full, 9999px);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.3rem 0.65rem;
}

.propvendor-browse .propvendor-card .propvendor-badge-direct-owner {
    background: var(--pv-status-success, #0A8A4F) !important;
    color: #ffffff !important;
}

.propvendor-browse .propvendor-card .propvendor-card-category {
    margin: 0.2rem 1.1rem;
    font-size: 0.8rem;
    color: var(--pv-text-muted, #64748b);
    font-weight: 500;
}

.propvendor-browse .propvendor-card h3 {
    margin: 0.35rem 1.1rem 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.35;
}

.propvendor-browse .propvendor-card h3 a {
    color: var(--pv-color-navy, #142B3B);
    text-decoration: none;
    transition: color 0.15s ease;
}

.propvendor-browse .propvendor-card h3 a:hover {
    color: var(--pv-color-teal, #087F8C);
}

.propvendor-browse .propvendor-card .propvendor-meta {
    margin: 0 1.1rem 0.5rem;
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #64748b);
}

.propvendor-browse .propvendor-card .propvendor-price {
    margin: auto 1.1rem 0.85rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--pv-status-success, #0A8A4F);
}

.propvendor-browse .propvendor-card .propvendor-card-view {
    margin: 0 1.1rem 1.25rem;
    display: block;
    text-align: center;
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-md, 8px);
    padding: 0.6rem 1rem;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--pv-color-navy, #142B3B);
    text-decoration: none;
    transition: all 0.2s ease;
}

.propvendor-browse .propvendor-card .propvendor-card-view:hover {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    border-color: var(--pv-color-teal, #087F8C);
}

.propvendor-pagination {
    margin: 2.5rem 0 1.5rem;
}

.propvendor-pagination .page-numbers {
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
}

.propvendor-pagination .page-numbers a,
.propvendor-pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 0.85rem;
    border: 1px solid var(--pv-color-border, #d9e3ee);
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-surface, #ffffff);
    color: var(--pv-color-navy, #142B3B);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s ease;
}

.propvendor-pagination .page-numbers a:hover {
    background: var(--pv-color-surface-alt, #f8fafc);
    border-color: var(--pv-color-teal, #087F8C);
    color: var(--pv-color-teal, #087F8C);
}

.propvendor-pagination .page-numbers .current {
    border-color: var(--pv-color-teal, #087F8C) !important;
    background: var(--pv-color-teal, #087F8C) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(8, 127, 140, 0.3);
}

.propvendor-pagination .page-numbers a:focus-visible {
    outline: 2px solid var(--pv-color-teal, #087F8C);
    outline-offset: 2px;
}

@media (max-width: 992px) {
    .propvendor-browse .propvendor-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .propvendor-detail-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.75rem;
    }
    .propvendor-detail-gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .propvendor-browse .propvendor-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-detail-gallery {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .propvendor-hero {
        grid-template-columns: 1fr;
    }

    .propvendor-detail-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .propvendor-detail-main,
    .propvendor-detail-facts,
    .propvendor-detail-contact,
    .propvendor-detail-enquiry {
        padding: 1.25rem;
    }

    .propvendor-filter-form {
        padding: 1rem;
    }

    .propvendor-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .propvendor-filter-actions button,
    .propvendor-filter-actions a {
        text-align: center;
    }

    .propvendor-dashboard {
        padding: 1.25rem 1rem;
        margin: 1.25rem 0 2rem;
    }

    .propvendor-dashboard-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.85rem;
    }

    .propvendor-dashboard-add {
        width: 100%;
        justify-content: center;
    }

    .propvendor-dashboard-table-wrap {
        border: none;
        background: transparent;
        box-shadow: none;
        margin-bottom: 1.5rem;
    }

    .propvendor-dashboard-table,
    .propvendor-dashboard-table tbody,
    .propvendor-dashboard-table tr,
    .propvendor-dashboard-table td {
        display: block;
        width: 100%;
    }

    .propvendor-dashboard-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .propvendor-dashboard-table tr {
        background: var(--pv-color-surface, #ffffff);
        border: 1.5px solid var(--pv-color-border-hover, #cbd5e1);
        border-radius: var(--pv-radius-lg, 12px);
        padding: 1.15rem 1.25rem;
        margin-bottom: 1.25rem;
        box-shadow: var(--pv-shadow-sm, 0 2px 6px rgba(20, 43, 59, 0.05));
    }

    .propvendor-dashboard-table tr:last-child {
        margin-bottom: 0;
    }

    .propvendor-dashboard-table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
        padding: 0.75rem 0;
        border-bottom: 1px solid var(--pv-color-border-subtle, #f1f5f9);
        text-align: right;
        overflow-wrap: anywhere;
        font-size: 0.92rem;
        color: var(--pv-text-main, #0f172a);
    }

    .propvendor-dashboard-table td::before {
        content: attr(data-label);
        flex: 0 0 38%;
        color: var(--pv-text-secondary, #475569);
        font-weight: 700;
        font-size: 0.85rem;
        text-align: left;
    }

    .propvendor-dashboard-table td:last-child {
        border-bottom: 0;
        padding-top: 1rem;
        display: block;
        width: 100%;
        text-align: center;
    }

    .propvendor-dashboard-table td:last-child::before {
        display: none;
    }

    .propvendor-dashboard-actions {
        display: flex;
        gap: 0.75rem;
        width: 100%;
        justify-content: stretch;
        flex-wrap: wrap;
    }

    .propvendor-dashboard-actions a {
        min-height: 44px;
        min-width: 44px;
        padding: 0.65rem 1rem;
        font-size: 0.9rem;
        font-weight: 700;
        justify-content: center;
        text-align: center;
        flex: 1 1 calc(50% - 0.5rem);
        border-radius: var(--pv-radius-md, 8px);
        box-sizing: border-box;
    }

    .propvendor-quota-alert {
        flex-direction: column;
        align-items: stretch;
        gap: 0.85rem;
    }

    .propvendor-quota-alert-action {
        width: 100%;
    }

    .propvendor-btn-upgrade {
        width: 100%;
        justify-content: center;
        min-height: 44px;
        box-sizing: border-box;
    }

    .propvendor-dashboard-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .propvendor-dashboard-tab {
        text-align: center;
        justify-content: center;
        min-height: 44px;
    }

    .propvendor-dashboard-tab-action {
        margin-left: 0;
        text-align: center;
        justify-content: center;
        min-height: 44px;
    }

    .propvendor-vendor-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .propvendor-vendor-title-row {
        justify-content: center;
    }

    .propvendor-vendor-meta-row {
        justify-content: center;
    }

    .propvendor-vendor-contact-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .propvendor-vendor-contact-actions .propvendor-btn {
        text-align: center;
    }
}

/* ==========================================================================
   Vendor Dashboard Navigation Tabs
   ========================================================================== */
.propvendor-dashboard-nav {
    display: flex;
    gap: 0.65rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 2px solid var(--pv-color-border-subtle, #f1f5f9);
}

.propvendor-dashboard-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 1.15rem;
    border-radius: var(--pv-radius-md, 8px);
    font-weight: 600;
    font-size: 0.92rem;
    text-decoration: none;
    color: var(--pv-text-secondary, #475569);
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    transition: all 0.2s ease;
}

.propvendor-dashboard-tab:hover,
.propvendor-dashboard-tab:focus {
    color: var(--pv-color-teal, #087F8C);
    border-color: var(--pv-color-teal, #087F8C);
    background: var(--pv-color-teal-subtle, #e6f4f6);
}

.propvendor-dashboard-tab.active {
    background: var(--pv-color-navy, #142B3B) !important;
    color: #ffffff !important;
    border-color: var(--pv-color-navy, #142B3B) !important;
    box-shadow: 0 2px 4px rgba(20, 43, 59, 0.2);
}

.propvendor-dashboard-tab-action {
    margin-left: auto;
    background: var(--pv-color-teal, #087F8C) !important;
    color: #ffffff !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
}

.propvendor-dashboard-tab-action:hover,
.propvendor-dashboard-tab-action:focus {
    background: var(--pv-color-teal-hover, #066772) !important;
    color: #ffffff !important;
    border-color: var(--pv-color-teal-hover, #066772) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

/* ==========================================================================
   Vendor Public Profile Layout & Cards
   ========================================================================== */
.propvendor-vendor-profile-container {
    margin: 1.5rem 0 3rem;
}

.propvendor-profile-owner-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    background: #eef7ff;
    border: 1px solid #c2defc;
    color: #0b477f;
    padding: 0.85rem 1.25rem;
    border-radius: 0.75rem;
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.propvendor-vendor-profile-card {
    background: #fff;
    border: 1px solid #e6edf4;
    border-radius: 1rem;
    box-shadow: 0 10px 26px rgba(16, 28, 45, 0.06);
    padding: 2rem;
    margin-bottom: 2.5rem;
}

.propvendor-vendor-header {
    display: flex;
    gap: 1.75rem;
    align-items: flex-start;
}

.propvendor-vendor-avatar-wrap {
    flex: 0 0 auto;
}

.propvendor-vendor-avatar {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #e6edf4;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    display: block;
}

.propvendor-vendor-monogram {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0d5aa7, #073868);
    color: #fff;
    font-size: 2.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #e6edf4;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.propvendor-vendor-header-content {
    flex: 1 1 auto;
}

.propvendor-vendor-title-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.4rem;
}

.propvendor-vendor-name {
    margin: 0;
    font-size: clamp(1.6rem, 2.5vw, 2.2rem);
    line-height: 1.2;
    color: #081b2d;
}

.propvendor-badge-verified {
    background: #e5f7ed;
    color: #12653a;
}

.propvendor-vendor-meta-row {
    display: flex;
    gap: 1.25rem;
    flex-wrap: wrap;
    margin-top: 0.5rem;
    color: #52667d;
    font-size: 0.95rem;
}

.propvendor-vendor-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.propvendor-vendor-contact-person {
    margin: 0.6rem 0 0;
    color: #52667d;
    font-size: 0.95rem;
}

.propvendor-vendor-bio-box {
    margin-top: 1.75rem;
    padding-top: 1.5rem;
    border-top: 1px solid #edf2f8;
}

.propvendor-vendor-bio-box h3 {
    margin: 0 0 0.75rem;
    font-size: 1.2rem;
    color: #1b2d3d;
}

.propvendor-vendor-bio-text {
    color: #33485e;
    line-height: 1.6;
}

.propvendor-vendor-bio-text p:last-child {
    margin-bottom: 0;
}

.propvendor-vendor-contact-box {
    margin-top: 1.75rem;
    padding-top: 1.5rem;
    border-top: 1px solid #edf2f8;
}

.propvendor-vendor-contact-box h3 {
    margin: 0 0 0.75rem;
    font-size: 1.2rem;
    color: #1b2d3d;
}

.propvendor-vendor-contact-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: center;
}

.propvendor-btn-sm {
    padding: 0.45rem 0.85rem;
    font-size: 0.85rem;
}

/* ==========================================================================
   Profile Edit Form Specifics
   ========================================================================== */
.propvendor-profile-edit-box {
    margin: 1.5rem 0;
    padding: 2rem;
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.05));
}

.propvendor-form-subtext {
    margin: 0.25rem 0 1.5rem;
    color: var(--pv-text-secondary, #475569);
    font-size: 0.95rem;
}

.propvendor-profile-photo-field {
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 2px dashed var(--pv-color-border, #cbd5e1);
    padding: 1.5rem;
    border-radius: var(--pv-radius-md, 8px);
    margin-bottom: 1.25rem;
}

.propvendor-photo-current {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin: 0.75rem 0;
}

.propvendor-photo-thumb {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--pv-color-surface, #ffffff);
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.1));
}

.propvendor-checkbox-label {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    font-weight: 500 !important;
    color: var(--pv-text-secondary, #33485e) !important;
    cursor: pointer;
}

.propvendor-checkbox-label input[type="checkbox"] {
    width: auto !important;
    margin: 0 !important;
}

.propvendor-form-section-divider {
    margin: 2rem 0 1rem;
    padding-top: 1.5rem;
    border-top: 2px solid var(--pv-color-border-subtle, #f1f5f9);
}

.propvendor-form-section-divider h4 {
    margin: 0 0 0.35rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-field-hint {
    font-size: 0.85rem;
    color: var(--pv-text-muted, #64748b);
    margin: 0.25rem 0 0;
}

.propvendor-form-actions {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-top: 1.5rem;
}

.propvendor-form-actions button[type="submit"] {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    padding: 0.75rem 1.5rem;
    border-radius: var(--pv-radius-md, 8px);
    font-weight: 700;
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    transition: all 0.2s ease;
}

.propvendor-form-actions button[type="submit"]:hover,
.propvendor-form-actions button[type="submit"]:focus {
    background: var(--pv-color-teal-hover, #066772);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

.propvendor-form-actions .propvendor-btn.secondary {
    background: var(--pv-color-surface-alt, #f8fafc);
    color: var(--pv-text-secondary, #475569) !important;
    border: 1px solid var(--pv-color-border, #cbd5e1);
    padding: 0.75rem 1.5rem;
    border-radius: var(--pv-radius-md, 8px);
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}

.propvendor-form-actions .propvendor-btn.secondary:hover,
.propvendor-form-actions .propvendor-btn.secondary:focus {
    background: #ffffff;
    color: var(--pv-color-navy, #142B3B) !important;
    border-color: var(--pv-color-navy, #142B3B);
}

.propvendor-detail-vendor-name {
    font-size: 1.15rem;
    margin: 0.25rem 0;
}

.propvendor-detail-vendor-name a {
    color: #081b2d;
    text-decoration: none;
}

.propvendor-detail-vendor-name a:hover {
    color: #0d5aa7;
}

.propvendor-detail-view-profile {
    margin: 0.4rem 0 1rem;
}

/* ==========================================================================
   Customer Enquiry System
   ========================================================================== */
.propvendor-detail-enquiry {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 1.75rem;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.05));
}

.propvendor-detail-enquiry h2 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    letter-spacing: -0.01em;
    border-bottom: 2px solid var(--pv-color-border-subtle, #f1f5f9);
    padding-bottom: 0.65rem;
}

.propvendor-enquiry-intro {
    font-size: 0.9rem;
    color: var(--pv-text-secondary, #475569);
    margin-bottom: 1.15rem;
    line-height: 1.5;
}

.propvendor-enquiry-listing-meta {
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-md, 8px);
    padding: 0.75rem 0.9rem;
    font-size: 0.85rem;
    color: var(--pv-text-secondary, #475569);
    margin-bottom: 1.15rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.propvendor-enquiry-listing-meta strong {
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-enquiry-ref {
    display: inline-block;
    color: var(--pv-text-muted, #94a3b8);
    font-size: 0.8rem;
    margin-left: 0.25rem;
}

.propvendor-enquiry-form label {
    display: block;
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--pv-color-navy, #142B3B);
    margin-bottom: 0.85rem;
}

.propvendor-enquiry-form input[type="text"],
.propvendor-enquiry-form input[type="email"],
.propvendor-enquiry-form input[type="tel"],
.propvendor-enquiry-form textarea {
    display: block;
    width: 100%;
    margin-top: 0.35rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-md, 8px);
    font-size: 0.95rem;
    color: var(--pv-text-primary, #0F172A);
    background-color: #ffffff;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.propvendor-enquiry-form input:focus,
.propvendor-enquiry-form textarea:focus {
    outline: none;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: 0 0 0 3px rgba(8, 127, 140, 0.15);
}

.propvendor-enquiry-form textarea {
    resize: vertical;
    min-height: 100px;
    line-height: 1.5;
}

.propvendor-enquiry-submit {
    width: 100%;
    margin-top: 0.5rem;
    padding: 0.8rem 1.25rem;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    border: none;
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    transition: all 0.2s ease;
}

.propvendor-enquiry-submit:hover,
.propvendor-enquiry-submit:focus {
    background: var(--pv-color-teal-hover, #066772);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
    transform: translateY(-1px);
}

.propvendor-enquiry-privacy-note {
    font-size: 0.8rem;
    color: var(--pv-text-muted, #64748b);
    margin-top: 0.85rem;
    margin-bottom: 0;
    text-align: center;
    line-height: 1.4;
}

/* ==========================================================================
   Phase 3: On-Site Messaging Inbox Styles
   ========================================================================== */

/* Unread Badge */
.pv-badge-unread {
    display: inline-block;
    background: #e53e3e;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.2rem 0.45rem;
    border-radius: 999px;
    margin-left: 0.4rem;
    vertical-align: middle;
}

.propvendor-dashboard-tab.active .pv-badge-unread {
    background: #ffffff;
    color: var(--pv-color-navy, #142B3B);
}

/* Two-column Inbox Container */
.pv-inbox-container {
    display: flex;
    min-height: 580px;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #ffffff;
    overflow: hidden;
    margin-top: 1.5rem;
    box-shadow: 0 4px 14px rgba(16, 28, 45, 0.05);
}

/* Left Column: Sidebar / Thread List */
.pv-inbox-sidebar {
    width: 320px;
    flex-shrink: 0;
    border-right: 1px solid #e2e8f0;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
}

.pv-inbox-sidebar-header {
    padding: 1rem 1.2rem;
    border-bottom: 1px solid #e2e8f0;
    font-size: 1rem;
    font-weight: 700;
    color: #1e293b;
    background: #ffffff;
}

.pv-inbox-thread-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    flex: 1;
}

.pv-inbox-thread-item {
    border-bottom: 1px solid #edf2f7;
    margin: 0;
}

.pv-inbox-thread-link {
    display: block;
    padding: 0.9rem 1.1rem;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s ease;
    position: relative;
}

.pv-inbox-thread-link:hover {
    background: #edf2f7;
}

.pv-inbox-thread-item.is-active .pv-inbox-thread-link {
    background: #e2e8f0;
    border-left: 4px solid #0d5aa7;
}

.pv-inbox-thread-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.3rem;
}

.pv-inbox-thread-name {
    font-weight: 700;
    font-size: 0.95rem;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.pv-inbox-unread-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #e53e3e;
    border-radius: 50%;
    flex-shrink: 0;
}

.pv-inbox-thread-time {
    font-size: 0.75rem;
    color: #64748b;
    white-space: nowrap;
}

.pv-inbox-thread-property {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #0d5aa7;
    font-weight: 600;
    margin-bottom: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pv-inbox-thread-thumb {
    width: 34px;
    height: 34px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    flex-shrink: 0;
}

.pv-inbox-thread-snippet {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Right Column: Main Conversation Pane */
.pv-inbox-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    min-width: 0;
}

.pv-inbox-header {
    padding: 1.1rem 1.4rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.pv-inbox-header-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.35rem;
}

.pv-inbox-header-title a {
    color: inherit;
    text-decoration: none;
}

.pv-inbox-header-title a:hover {
    color: #0d5aa7;
    text-decoration: underline;
}

.pv-inbox-header-meta {
    font-size: 0.85rem;
    color: #475569;
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.pv-inbox-header-status {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.pv-status-open {
    background: #dbeafe;
    color: #1e40af;
}

.pv-status-replied {
    background: #dcfce7;
    color: #166534;
}

.pv-status-closed {
    background: #f1f5f9;
    color: #475569;
}

/* Chat Message History Stream */
.pv-msg-stream {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    background: #f8fafc;
    max-height: 440px;
}

.pv-msg-row {
    display: flex;
    flex-direction: column;
    max-width: 75%;
}

.pv-msg-from-customer {
    align-self: flex-start;
}

.pv-msg-from-vendor {
    align-self: flex-end;
}

.pv-msg-from-admin {
    align-self: center;
    max-width: 85%;
}

.pv-msg-bubble {
    padding: 0.85rem 1.1rem;
    border-radius: 12px;
    font-size: 0.95rem;
    line-height: 1.5;
    word-break: break-word;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.pv-msg-customer,
.pv-msg-from-customer .pv-msg-bubble {
    background: #F1F5F9;
    color: #1E293B;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    border-bottom-left-radius: 2px;
}

.pv-msg-vendor,
.pv-msg-from-vendor .pv-msg-bubble {
    background: var(--pv-color-teal, #087F8C);
    color: #FFFFFF;
    border: none;
    border-radius: 12px;
    border-bottom-right-radius: 2px;
}

.pv-msg-from-admin .pv-msg-bubble {
    background: #FEF3C7;
    color: #78350F;
    border: 1px solid #FDE68A;
    border-radius: 12px;
    text-align: center;
}

.pv-msg-meta {
    font-size: 0.72rem;
    color: #64748B;
    margin-top: 0.35rem;
}

.pv-msg-from-vendor .pv-msg-meta {
    text-align: right;
    color: #64748B;
}

/* Reply Box Form */
.pv-reply-box {
    position: sticky;
    bottom: 0;
    z-index: 10;
    padding: 1.1rem 1.4rem;
    border-top: 1px solid #E2E8F0;
    background: #FFFFFF;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.04);
}

.pv-reply-form textarea {
    display: block;
    width: 100%;
    min-height: 80px;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    padding: 0.75rem 0.85rem;
    font-size: 0.95rem;
    box-sizing: border-box;
    resize: vertical;
    margin-bottom: 0.75rem;
    color: #102A43;
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.pv-reply-form textarea:focus {
    outline: none;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: 0 0 0 3px rgba(8, 127, 140, 0.15);
}

.pv-reply-submit {
    min-height: 44px;
    min-width: 44px;
    padding: 0.65rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    background: var(--pv-color-teal, #087F8C);
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.pv-reply-submit:hover,
.pv-reply-submit:focus {
    background: var(--pv-color-teal-dark, #066570);
    color: #FFFFFF;
}

/* Responsive Layout (under 768px) */
@media (max-width: 768px) {
    .pv-inbox-container {
        flex-direction: column;
        min-height: auto;
    }

    .pv-inbox-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e2e8f0;
        max-height: 260px;
    }

    .pv-msg-row {
        max-width: 90%;
    }

    .pv-inbox-header {
        flex-direction: column;
    }
}

/* Pay-to-Unlock & Lead Masking Styles */
.pv-masked-info {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.88em;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    letter-spacing: 0.08em;
    border: 1px dashed #cbd5e1;
    user-select: none;
    text-shadow: 0 0 1px rgba(71, 85, 105, 0.4);
}

.pv-unlock-lead-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.pv-unlock-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
}

.pv-btn-unlock-lead {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
    color: #ffffff !important;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.25rem 0.75rem;
    border-radius: 999px;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(5, 150, 105, 0.25);
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.pv-btn-unlock-lead:hover,
.pv-btn-unlock-lead:focus {
    background: linear-gradient(135deg, #047857 0%, #059669 100%);
    transform: translateY(-1px);
    box-shadow: 0 3px 6px rgba(5, 150, 105, 0.35);
    color: #ffffff !important;
}

/* Stage 2: Owner-Direct & Trust Safeguard Badges and Notices */
.propvendor-badge-direct-owner,
.propvendor-detail-owner-badge .propvendor-badge-direct-owner {
    background: var(--pv-status-success, #0A8A4F) !important;
    color: #ffffff !important;
    font-size: 0.88rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    border-radius: var(--pv-radius-md, 8px) !important;
    padding: 0.45rem 1rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    box-shadow: 0 2px 4px rgba(10, 138, 79, 0.2) !important;
}

.propvendor-detail-owner-badge {
    margin: 0.5rem 0 1.25rem 0;
}

.propvendor-badge-regulatory-verified {
    background: #0b5394 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em;
    box-shadow: 0 1px 3px rgba(11, 83, 148, 0.2);
}

.propvendor-safety-notice-card,
.propvendor-anti-fraud-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 1rem 0 1.5rem !important;
    padding: 0.85rem 1.15rem !important;
    background: var(--pv-status-warning-bg, #FEF3C7) !important;
    border: 1px solid var(--pv-status-warning-border, #FDE68A) !important;
    border-left: 4px solid var(--pv-status-warning, #D97706) !important;
    border-radius: 8px !important;
    color: #78350F !important;
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
    box-shadow: var(--pv-shadow-sm, 0 1px 2px rgba(20, 43, 59, 0.05)) !important;
}

.propvendor-safety-notice-card .pv-safety-notice-body {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    flex: 1;
}

.propvendor-safety-notice-card .pv-safety-notice-icon {
    font-size: 1.15rem;
    line-height: 1.3;
    flex-shrink: 0;
}

.propvendor-safety-notice-card .pv-safety-notice-text {
    flex: 1;
    color: #78350F;
}

.propvendor-safety-notice-card .pv-safety-notice-close {
    background: transparent;
    border: none;
    font-size: 1.4rem;
    line-height: 1;
    color: #78350F;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    flex-shrink: 0;
    opacity: 0.75;
    transition: opacity 0.15s ease, background-color 0.15s ease;
}

.propvendor-safety-notice-card .pv-safety-notice-close:hover,
.propvendor-safety-notice-card .pv-safety-notice-close:focus {
    opacity: 1;
    background: rgba(120, 53, 15, 0.12);
    outline: none;
}

.propvendor-safety-notice-card.pv-dismissed,
html.pv-safety-dismissed .propvendor-safety-notice-card {
    display: none !important;
}

.propvendor-vehicle-legal-notice-card {
    margin: 1.25rem 0 1.75rem !important;
    padding: 1rem 1.25rem !important;
    background: var(--pv-status-info-bg, #E0F2FE) !important;
    border: 1px solid var(--pv-status-info-border, #BAE6FD) !important;
    border-left: 4px solid var(--pv-status-info, #0284C7) !important;
    border-radius: var(--pv-radius-md, 8px) !important;
    color: var(--pv-status-info-text, #0369A1) !important;
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
    box-shadow: var(--pv-shadow-sm, 0 1px 2px rgba(20, 43, 59, 0.05)) !important;
}

/* Category-Specific Form Sections & Dynamic Fields */
.propvendor-category-fields {
    margin: 1.5rem 0;
    padding: 1.25rem 1.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    transition: opacity 0.2s ease;
    overflow: visible;
}

.propvendor-category-fields h4 {
    margin: 0 0 1rem 0;
    font-size: 1.05rem;
    color: #1e293b;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 0.5rem;
}

.propvendor-form-grid-3 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.25rem;
    overflow: visible;
}

.propvendor-form-grid-3 label {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 20px;
    font-weight: 600;
    color: #1e293b;
    position: relative;
    overflow: visible;
}

/* Land Details: Baseline alignment for all 4 inputs (Land Type, Plot Size, Plot Size Unit, Title Document) */
#propvendor-fields-land .propvendor-form-grid-3 {
    align-items: flex-end;
}

#propvendor-fields-land .propvendor-form-grid-3 label {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

#propvendor-fields-land .propvendor-form-grid-3 label select,
#propvendor-fields-land .propvendor-form-grid-3 label input {
    margin-top: auto;
}

.propvendor-form-grid-3 select,
.propvendor-form-grid-3 input,
.propvendor-category-fields select,
.propvendor-category-fields input {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    color: #1e293b !important;
    background-color: #ffffff !important;
    width: 100% !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.propvendor-form-grid-3 select:focus,
.propvendor-form-grid-3 input:focus,
.propvendor-category-fields select:focus,
.propvendor-category-fields input:focus {
    outline: none !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    box-shadow: 0 0 0 3px rgba(8, 127, 140, 0.15) !important;
}

/* Optgroup Styling for Clean Hierarchy */
.propvendor-form select optgroup,
.propvendor-search-card select optgroup,
.propvendor-category-fields select optgroup,
#pv_property_subtype optgroup,
#pv_state optgroup {
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--pv-color-navy, #142B3B);
    background-color: var(--pv-color-surface-alt, #f8fafc);
    padding: 6px 4px;
}

.propvendor-form select optgroup option,
.propvendor-search-card select optgroup option,
.propvendor-category-fields select optgroup option,
#pv_property_subtype optgroup option,
#pv_state optgroup option {
    font-weight: 400;
    font-size: 0.9rem;
    color: var(--pv-text-secondary, #334155);
    background-color: #ffffff;
    padding: 6px 12px;
}

/* Multiple Image Upload & Preview Grid */
.propvendor-image-upload-wrap {
    margin: 1.25rem 0;
}

.propvendor-image-preview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 0.75rem;
    margin-top: 0.85rem;
}

.propvendor-preview-card {
    position: relative;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.propvendor-preview-thumb {
    width: 100%;
    height: 90px;
    object-fit: cover;
    display: block;
}

.propvendor-preview-meta {
    font-size: 0.68rem;
    color: #475569;
    padding: 4px 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #f8fafc;
}

.propvendor-preview-remove-btn {
    position: absolute;
    top: 4px;
    right: 4px;
    background: rgba(239, 68, 68, 0.9);
    color: #fff !important;
    border: none;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    line-height: 20px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.15s ease;
}

.propvendor-preview-remove-btn:hover {
    background: #dc2626;
}

/* Existing Images Management (Edit Mode) */
.propvendor-existing-images-box {
    margin: 1.25rem 0;
    padding: 1.25rem;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
}

.propvendor-existing-images-box h4 {
    margin: 0 0 0.85rem 0;
    font-size: 1rem;
    color: #1e293b;
}

.propvendor-existing-images-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 0.85rem;
}

.propvendor-existing-image-card {
    position: relative;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
    padding: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    transition: opacity 0.2s ease, border-color 0.2s ease;
}

.propvendor-existing-image-card img {
    width: 100%;
    height: 90px;
    object-fit: cover;
    border-radius: 4px;
}

.propvendor-existing-image-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    margin-top: 4px;
}

.propvendor-existing-image-actions label {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 500;
    padding: 3px 6px;
    border-radius: 4px;
    transition: background-color 0.15s ease;
}

.propvendor-existing-image-actions .propvendor-action-main {
    color: #1e40af;
    background-color: #eff6ff;
}

.propvendor-existing-image-actions .propvendor-action-main:hover {
    background-color: #dbeafe;
}

.propvendor-existing-image-actions .propvendor-action-delete {
    color: #991b1b;
    background-color: #fef2f2;
}

.propvendor-existing-image-actions .propvendor-action-delete:hover {
    background-color: #fee2e2;
}

.propvendor-existing-image-actions input[type="radio"],
.propvendor-existing-image-actions input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}

.propvendor-image-marked-deleted {
    opacity: 0.45;
    border-color: #ef4444 !important;
    background: #fef2f2 !important;
}

.propvendor-image-primary-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #0d5aa7;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Location & Address Schema Enhancements */
.propvendor-legacy-warning {
    display: block;
    color: #b7791f;
    font-size: 0.85rem;
    margin-top: 4px;
    font-weight: 500;
}

.propvendor-address-required-mark {
    color: #d9363e;
    font-weight: bold;
}

.propvendor-address-label-text {
    font-weight: 600;
}

.propvendor-field-hint {
    display: block;
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 400;
    margin-top: 2px;
    margin-bottom: 5px;
    line-height: 1.35;
}

/* Stage 3 & Phase 9E: Vendor Listing Quota Styles */
.propvendor-quota-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1.5px solid var(--pv-color-border-hover, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 1.6rem 1.75rem;
    margin-bottom: 2rem;
    box-shadow: 0 2px 8px rgba(20, 43, 59, 0.05);
}

.propvendor-quota-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--pv-color-border-subtle, #f1f5f9);
}

.propvendor-quota-title {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.95rem;
}

.propvendor-quota-label {
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-quota-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    border-radius: var(--pv-radius-full, 9999px);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
}

.propvendor-quota-badge-vip {
    background: var(--pv-color-teal-subtle, #e6f4f6);
    color: var(--pv-color-teal, #087F8C);
    border: 1px solid rgba(8, 127, 140, 0.35);
}

.propvendor-quota-badge-free {
    background: #f1f5f9;
    color: var(--pv-color-navy, #142B3B);
    border: 1px solid #cbd5e1;
}

.propvendor-quota-badge-expired {
    background: var(--pv-status-warning-bg, #fef3c7);
    color: var(--pv-status-warning-text, #92400e);
    border: 1px solid var(--pv-status-warning-border, #fde68a);
}

.propvendor-quota-expiry {
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #475569);
    font-weight: 500;
}

.propvendor-quota-body {
    margin-bottom: 0.75rem;
}

.propvendor-quota-stats {
    display: flex;
    gap: 2rem;
    align-items: baseline;
    margin-bottom: 0.85rem;
    flex-wrap: wrap;
}

.propvendor-quota-stat-item {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.propvendor-quota-stat-label {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--pv-text-secondary, #475569);
}

.propvendor-quota-stat-num {
    font-size: 1.65rem;
    font-weight: 800;
    color: var(--pv-color-navy, #142B3B);
    line-height: 1;
    letter-spacing: -0.01em;
}

.propvendor-quota-stat-text {
    font-size: 0.92rem;
    color: var(--pv-text-secondary, #475569);
    font-weight: 500;
}

.propvendor-quota-progress,
.propvendor-quota-progress-track {
    width: 100%;
    height: 10px;
    background: #e2e8f0;
    border-radius: var(--pv-radius-full, 9999px);
    overflow: hidden;
    margin-top: 0.65rem;
}

.propvendor-quota-progress-bar {
    height: 100%;
    background: var(--pv-color-teal, #087F8C);
    border-radius: var(--pv-radius-full, 9999px);
    transition: width 0.4s ease;
}

.propvendor-quota-progress-bar.full {
    background: #d97706;
}

.propvendor-quota-alert,
.propvendor-quota-limit-banner {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 5px solid var(--pv-color-gold, #F3B64C);
    color: #78350f;
    padding: 1.15rem 1.35rem;
    border-radius: var(--pv-radius-md, 8px);
    margin-top: 1.25rem;
    font-size: 0.93rem;
    line-height: 1.55;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    box-shadow: 0 1px 3px rgba(243, 182, 76, 0.15);
}

.propvendor-quota-alert-content {
    flex: 1 1 320px;
}

.propvendor-quota-alert-action {
    flex: 0 0 auto;
}

.propvendor-quota-alert-warning {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 5px solid var(--pv-color-gold, #F3B64C);
    color: #78350f;
}

.propvendor-quota-info-note {
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #475569);
    margin-top: 0.85rem;
    line-height: 1.5;
}

.propvendor-btn-upgrade {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 44px;
    padding: 0.65rem 1.25rem;
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    border-radius: var(--pv-radius-md, 8px);
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    transition: all 0.2s ease;
    white-space: nowrap;
}

.propvendor-btn-upgrade:hover,
.propvendor-btn-upgrade:focus {
    background: var(--pv-color-teal-hover, #066772);
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
    text-decoration: none !important;
}

.propvendor-quota-exceeded-box {
    border-left: 4px solid var(--pv-status-danger, #dc2626) !important;
}

/* ==========================================================================
   Stage 4: Search & Discovery Filters Component
   ========================================================================== */
.propvendor-search-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 1.75rem;
    margin-bottom: 2rem;
    box-shadow: 0 8px 24px -4px rgba(13, 28, 39, 0.08);
    overflow: visible;
}

.propvendor-search-title {
    margin: 0 0 1.25rem 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    border-bottom: 2px solid var(--pv-color-border-subtle, #f1f5f9);
    padding-bottom: 0.75rem;
}

.propvendor-search-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    overflow: visible;
}

.propvendor-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    overflow: visible;
}

.propvendor-filter-row-primary {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr;
    gap: 1rem;
    overflow: visible;
}

.propvendor-filter-category-wrap {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #edf2f7);
    border-radius: var(--pv-radius-md, 8px);
    padding: 1rem 1.25rem;
    overflow: visible;
}

.propvendor-filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex: 1 1 180px;
    overflow: visible;
}

.propvendor-filter-group label {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

/* Strict height, line-height, and vertical alignment to prevent text clipping */
.propvendor-search-card select,
.propvendor-search-card input[type="text"],
.propvendor-search-card input[type="number"],
.propvendor-search-card input[type="search"] {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    border: 1px solid var(--pv-color-border, #cbd5e1) !important;
    border-radius: var(--pv-radius-md, 8px) !important;
    font-size: 0.95rem !important;
    color: var(--pv-text-primary, #0F172A) !important;
    background-color: #ffffff !important;
    width: 100% !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.propvendor-search-card select:focus,
.propvendor-search-card input:focus {
    outline: none !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    box-shadow: 0 0 0 3px rgba(8, 127, 140, 0.15) !important;
}

.propvendor-price-inputs {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.propvendor-price-inputs input {
    flex: 1 1 50%;
}

.propvendor-price-sep {
    color: #94a3b8;
    font-weight: 600;
}

.propvendor-sort-bar {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--pv-color-border, #e2e8f0);
}

.propvendor-filter-sort {
    max-width: 240px;
    flex: 0 0 240px;
}

.propvendor-filter-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-left: auto;
}

.propvendor-btn-search {
    height: 44px;
    padding: 0 1.5rem;
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    border: none;
    border-radius: var(--pv-radius-md, 8px);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
}

.propvendor-btn-search:hover,
.propvendor-btn-search:focus {
    background: var(--pv-color-teal-hover, #066772);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

.propvendor-btn-reset {
    height: 44px;
    padding: 0 1.25rem;
    background: var(--pv-color-surface-alt, #f8fafc);
    color: var(--pv-text-secondary, #475569) !important;
    border: 1px solid var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-md, 8px);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}

.propvendor-btn-reset:hover,
.propvendor-btn-reset:focus {
    background: var(--pv-color-border-subtle, #e2e8f0);
    color: var(--pv-color-navy, #142B3B) !important;
    border-color: var(--pv-color-border-hover, #94a3b8);
}

.propvendor-no-results {
    background: var(--pv-color-surface, #ffffff);
    border: 1px dashed var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 3rem 1.5rem;
    text-align: center;
    margin: 2rem 0;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.04));
}

.propvendor-no-results p {
    margin: 0 auto;
    color: var(--pv-text-secondary, #64748b);
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 580px;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .propvendor-filter-row-primary {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .propvendor-filter-row-primary {
        grid-template-columns: 1fr;
    }

    .propvendor-sort-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .propvendor-filter-sort {
        max-width: 100%;
        flex: 1 1 100%;
    }

    .propvendor-filter-actions {
        margin-left: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .propvendor-btn-search,
    .propvendor-btn-reset {
        width: 100%;
    }
}

/**
 * =========================================================================
 * PHASE 4B & 9F: VENDOR WALLET & CHECKOUT UI STYLES
 * =========================================================================
 */

.propvendor-wallet-container {
    max-width: 1140px;
    margin: 2rem auto;
    font-family: inherit;
    color: var(--pv-text-main, #1e293b);
}

.propvendor-wallet-header {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2.5rem;
}

.propvendor-wallet-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 14px);
    padding: 1.6rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    box-shadow: var(--pv-shadow-sm, 0 2px 6px rgba(20, 43, 59, 0.05));
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.propvendor-wallet-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--pv-shadow-md, 0 6px 16px rgba(20, 43, 59, 0.08));
}

.propvendor-wallet-card-icon {
    width: 58px;
    height: 58px;
    border-radius: var(--pv-radius-md, 12px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.propvendor-balance-card .propvendor-wallet-card-icon {
    background: var(--pv-color-teal-subtle, #e6f4f6);
    color: var(--pv-color-teal, #087F8C);
}

.propvendor-balance-card .propvendor-wallet-card-icon .dashicons {
    font-size: 30px;
    width: 30px;
    height: 30px;
}

.propvendor-vip-card.is-vip-active {
    border-color: rgba(243, 182, 76, 0.45);
    background: linear-gradient(135deg, #ffffff 0%, #fffdfa 100%);
}

.propvendor-vip-card.is-vip-active .propvendor-wallet-card-icon {
    background: var(--pv-color-gold-subtle, #fef7ec);
    color: var(--pv-color-gold-dark, #b45309);
}

.propvendor-vip-card.is-vip-inactive .propvendor-wallet-card-icon {
    background: #f1f5f9;
    color: var(--pv-text-muted, #94a3b8);
}

.propvendor-vip-card .propvendor-wallet-card-icon .dashicons {
    font-size: 30px;
    width: 30px;
    height: 30px;
}

.propvendor-wallet-card-info {
    display: flex;
    flex-direction: column;
}

.propvendor-card-label {
    font-size: 0.78rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--pv-text-muted, #64748b);
    margin-bottom: 0.35rem;
}

.propvendor-card-value {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.15;
    color: var(--pv-color-navy, #142B3B);
    letter-spacing: -0.02em;
}

.propvendor-status-active {
    color: #059669;
    font-weight: 700;
}

.propvendor-status-inactive {
    color: var(--pv-text-secondary, #64748b);
    font-weight: 600;
    font-size: 1.6rem;
}

.propvendor-card-subtext {
    font-size: 0.85rem;
    color: var(--pv-text-secondary, #64748b);
    margin-top: 0.35rem;
    line-height: 1.4;
}

/* Wallet Notices */
.propvendor-wallet-notice {
    padding: 1rem 1.25rem;
    border-radius: var(--pv-radius-md, 8px);
    margin-bottom: 2rem;
    font-size: 0.95rem;
    line-height: 1.5;
}

.propvendor-wallet-notice p {
    margin: 0;
}

.propvendor-wallet-notice.notice-success {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-left: 4px solid #10b981;
    color: #065f46;
}

.propvendor-wallet-notice.notice-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-left: 4px solid #ef4444;
    color: #991b1b;
}

.propvendor-wallet-notice.notice-info {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-left: 4px solid var(--pv-color-teal, #087F8C);
    color: #1e40af;
}

.propvendor-wallet-notice.notice-warning {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 4px solid #f59e0b;
    color: #92400e;
}

/* Pricing Grid */
.propvendor-pricing-section {
    margin-bottom: 3.5rem;
}

.propvendor-section-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.propvendor-section-header h2,
.propvendor-section-header h3 {
    margin-bottom: 0.5rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    letter-spacing: -0.01em;
}

.propvendor-section-header p {
    color: var(--pv-text-secondary, #64748b);
    font-size: 1rem;
    margin: 0;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5;
}

.propvendor-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    align-items: stretch;
    max-width: 1140px;
    margin: 0 auto;
    padding: 20px 0 40px;
}

.propvendor-pricing-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 16px);
    padding: 2rem 1.4rem 1.75rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    box-shadow: 0 4px 6px -1px rgba(20, 43, 59, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.propvendor-pricing-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px -4px rgba(20, 43, 59, 0.1);
    border-color: rgba(8, 127, 140, 0.3);
}

.propvendor-pricing-card.featured-plan {
    border: 2px solid var(--pv-color-gold, #F3B64C);
    box-shadow: 0 10px 25px -4px rgba(20, 43, 59, 0.12);
    background: linear-gradient(180deg, #ffffff 0%, #fffdfa 100%);
}

.propvendor-pricing-card.featured-plan:hover {
    box-shadow: 0 14px 28px -4px rgba(243, 182, 76, 0.25);
    border-color: #e5a435;
}

.propvendor-pricing-card.free-plan {
    background: #fafbfc;
}

.propvendor-card-badge {
    position: absolute;
    top: -12px;
    right: 18px;
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    z-index: 2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.propvendor-card-badge.free-badge {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #cbd5e1;
}

.propvendor-card-badge.starter-badge {
    background: #e0f2fe;
    color: #0369a1;
    border: 1px solid #bae6fd;
}

.propvendor-card-badge.pro-savings-badge {
    background: #f3e8ff;
    color: #7e22ce;
    border: 1px solid #e9d5ff;
}

.propvendor-card-badge.popular-badge {
    background: linear-gradient(135deg, #F3B64C 0%, #e5a435 100%);
    color: #0D1C27;
    border: 1px solid #e5a435;
    font-weight: 800;
    box-shadow: 0 2px 6px rgba(243, 182, 76, 0.35);
}

.propvendor-card-badge.best-value-badge {
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
}

.propvendor-plan-header {
    text-align: center;
    border-bottom: 1px solid var(--pv-color-border-subtle, #f1f5f9);
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
}

.propvendor-plan-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.75rem 0;
}

.propvendor-plan-price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-plan-price .currency {
    font-size: 1.25rem;
    font-weight: 600;
    margin-right: 2px;
}

.propvendor-plan-price .amount {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
}

.propvendor-plan-price .period {
    font-size: 0.88rem;
    color: var(--pv-text-muted, #64748b);
    margin-left: 6px;
    font-weight: 500;
}

.propvendor-plan-body {
    flex-grow: 1;
    margin-bottom: 1.5rem;
}

.propvendor-plan-desc {
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #64748b);
    text-align: center;
    margin-bottom: 1.25rem;
    line-height: 1.5;
    min-height: 42px;
}

.propvendor-plan-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.propvendor-plan-features li {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.88rem;
    color: var(--pv-text-main, #334155);
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

.propvendor-plan-features li .dashicons {
    color: var(--pv-color-teal, #087F8C);
    font-size: 18px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
}

.propvendor-plan-footer {
    margin-top: auto;
    padding-top: 0.5rem;
}

.propvendor-free-plan-btn {
    background: #f1f5f9 !important;
    color: var(--pv-color-navy, #142B3B) !important;
    border: 1px solid #cbd5e1 !important;
    transition: all 0.2s ease !important;
    min-height: 44px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.propvendor-free-plan-btn:hover {
    background: #e2e8f0 !important;
    color: var(--pv-color-navy-dark, #0D1C27) !important;
    border-color: #94a3b8 !important;
}

.propvendor-checkout-btn {
    width: 100%;
    min-height: 44px;
    padding: 0.75rem 1rem !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    border-radius: var(--pv-radius-md, 8px) !important;
    text-align: center !important;
    cursor: pointer;
    background-color: var(--pv-color-teal, #087F8C) !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: all 0.2s ease;
}

.propvendor-checkout-btn:hover {
    background-color: var(--pv-color-teal-hover, #066772) !important;
    border-color: var(--pv-color-teal-hover, #066772) !important;
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
    transform: translateY(-1px);
}

.propvendor-pricing-card.featured-plan .propvendor-checkout-btn {
    background-color: var(--pv-color-navy, #142B3B) !important;
    border-color: var(--pv-color-navy, #142B3B) !important;
    box-shadow: 0 2px 4px rgba(20, 43, 59, 0.25);
}

.propvendor-pricing-card.featured-plan .propvendor-checkout-btn:hover {
    background-color: var(--pv-color-navy-dark, #0D1C27) !important;
    border-color: var(--pv-color-navy-dark, #0D1C27) !important;
    box-shadow: 0 4px 8px rgba(20, 43, 59, 0.35);
}

.propvendor-checkout-btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none !important;
}

/* Spinner */
.propvendor-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    border-top-color: #ffffff;
    animation: propvendor-spin 0.8s linear infinite;
}

@keyframes propvendor-spin {
    to { transform: rotate(360deg); }
}

/* Transactions Table */
.propvendor-transactions-section {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 14px);
    padding: 1.75rem;
    box-shadow: var(--pv-shadow-sm, 0 2px 6px rgba(20, 43, 59, 0.04));
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.propvendor-transactions-section .propvendor-section-header {
    text-align: left;
    margin-bottom: 1.25rem;
}

.propvendor-transactions-section .propvendor-section-header h3 {
    font-size: 1.3rem;
    margin-bottom: 0;
}

.propvendor-transactions-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.propvendor-transactions-table th {
    background: #f8fafc;
    color: var(--pv-color-navy, #142B3B);
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.85rem 1rem;
    text-align: left;
    border-bottom: 2px solid var(--pv-color-border, #e2e8f0);
}

.propvendor-transactions-table td {
    padding: 0.95rem 1rem;
    border-bottom: 1px solid var(--pv-color-border-subtle, #f1f5f9);
    color: var(--pv-text-main, #334155);
    vertical-align: middle;
}

.propvendor-transactions-table tr:hover td {
    background: #fafbfc;
}

.propvendor-transactions-table tr:last-child td {
    border-bottom: none;
}

.propvendor-transactions-table code {
    background: #f1f5f9;
    color: var(--pv-color-navy, #142B3B);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.85rem;
    border: 1px solid #e2e8f0;
}

.propvendor-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.propvendor-badge.status-success {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.propvendor-badge.status-pending {
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

.propvendor-badge.status-failed {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.propvendor-wallet-login-prompt {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    box-shadow: var(--pv-shadow-sm, 0 2px 6px rgba(20, 43, 59, 0.04));
    padding: 2.5rem 2rem;
    text-align: center;
    margin: 2.5rem auto;
    max-width: 600px;
}

.propvendor-wallet-login-prompt a {
    color: var(--pv-color-teal, #087F8C);
    font-weight: 600;
    text-decoration: underline;
}

.propvendor-wallet-login-prompt a:hover {
    color: var(--pv-color-teal-hover, #066772);
}

.propvendor-no-orders {
    color: var(--pv-text-muted, #64748b);
    font-style: italic;
    padding: 1.5rem 0;
    margin: 0;
    text-align: center;
}

/* Wallet Responsive Breakpoints */
@media (max-width: 1024px) {
    .propvendor-pricing-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }
}

@media (max-width: 640px) {
    .propvendor-wallet-header {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .propvendor-pricing-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .propvendor-pricing-card {
        padding: 1.75rem 1.25rem 1.5rem;
    }
    .propvendor-transactions-section {
        padding: 1.25rem 1rem;
    }
}

/* =========================================================================
 * PHASE 5: VENDOR INBOX LEAD UNLOCK & CONFIRMATION MODAL
 * ========================================================================= */

.pv-unlock-lead-container {
    margin: 0.65rem 0 0.85rem 0;
    padding: 0.65rem 1rem;
    background: #F8FAFC;
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-left: 4px solid var(--pv-color-teal, #087F8C);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(20, 43, 59, 0.04);
}

.pv-unlock-lead-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.pv-unlock-status {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.pv-unlock-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
}

.pv-unlock-badge .dashicons {
    font-size: 15px;
    width: 15px;
    height: 15px;
}

.pv-unlock-balance-pill {
    display: inline-block;
    background: #e2e8f0;
    color: var(--pv-text-main, #334155);
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
}

.pv-unlock-action {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.pv-btn-unlock-lead-trigger {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    background: var(--pv-color-teal, #087F8C) !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    padding: 6px 14px !important;
    border-radius: var(--pv-radius-md, 6px) !important;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.2);
    transition: background-color 0.15s ease, transform 0.1s ease;
}

.pv-btn-unlock-lead-trigger:hover,
.pv-btn-unlock-lead-trigger:focus {
    background: var(--pv-color-teal-hover, #066772) !important;
    border-color: var(--pv-color-teal-hover, #066772) !important;
    transform: translateY(-1px);
}

.pv-btn-unlock-lead-trigger .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    line-height: 16px;
}

.pv-unlock-hint {
    font-size: 0.8rem;
    color: var(--pv-text-secondary, #64748b);
    line-height: 1.3;
}

.pv-btn-buy-credits {
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
    font-weight: 600 !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
}

.pv-btn-buy-credits .dashicons {
    font-size: 15px;
    width: 15px;
    height: 15px;
}

.pv-text-warning {
    color: #b45309 !important;
}

.pv-text-warning a {
    color: var(--pv-color-teal, #087F8C);
    text-decoration: underline;
    font-weight: 600;
}

.pv-text-warning a:hover {
    color: var(--pv-color-teal-hover, #066772);
}

/* Success Revealed Banner */
.pv-unlock-success-banner {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-left: 4px solid #10b981;
    color: #065f46;
    padding: 0.65rem 1rem;
    border-radius: 6px;
    font-size: 0.88rem;
    line-height: 1.4;
}

.pv-unlock-success-banner .dashicons {
    color: #10b981;
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* Modal Overlay & Dialog */
.pv-unlock-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    box-sizing: border-box;
}

.pv-unlock-modal-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(13, 28, 39, 0.65);
    backdrop-filter: blur(2px);
}

.pv-unlock-modal-dialog {
    position: relative;
    z-index: 10;
    background: var(--pv-color-surface, #ffffff);
    border-radius: var(--pv-radius-lg, 14px);
    max-width: 460px;
    width: 100%;
    box-shadow: 0 20px 25px -5px rgba(20, 43, 59, 0.15), 0 10px 10px -5px rgba(20, 43, 59, 0.04);
    overflow: hidden;
    animation: pvModalFadeIn 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes pvModalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.96) translateY(8px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.pv-unlock-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--pv-color-border, #e2e8f0);
    background: #f8fafc;
}

.pv-unlock-modal-header h4 {
    margin: 0;
    font-size: 1.1rem;
    color: var(--pv-color-navy, #142B3B);
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
}

.pv-unlock-modal-header h4 .dashicons {
    color: var(--pv-color-teal, #087F8C);
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.pv-unlock-modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: var(--pv-text-muted, #64748b);
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
}

.pv-unlock-modal-close:hover {
    color: var(--pv-color-navy, #142B3B);
}

.pv-unlock-modal-body {
    padding: 1.25rem;
}

.pv-unlock-modal-body p {
    margin: 0 0 0.85rem 0;
    color: var(--pv-text-main, #334155);
    font-size: 0.95rem;
    line-height: 1.5;
}

.pv-unlock-modal-details {
    background: #f1f5f9;
    border-radius: 8px;
    padding: 0.85rem 1rem;
    margin: 0.85rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-size: 0.92rem;
    color: var(--pv-color-navy, #142B3B);
    border: 1px solid var(--pv-color-border, #e2e8f0);
}

.pv-unlock-modal-subtext {
    font-size: 0.82rem !important;
    color: var(--pv-text-secondary, #64748b) !important;
    line-height: 1.4 !important;
    margin-bottom: 0 !important;
}

.pv-unlock-modal-error {
    margin-top: 0.85rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    padding: 0.65rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem;
}

.pv-unlock-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--pv-color-border, #e2e8f0);
    background: #f8fafc;
}

.pv-unlock-modal-footer .button-primary {
    background: var(--pv-color-teal, #087F8C) !important;
    border-color: var(--pv-color-teal, #087F8C) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.2);
}

.pv-unlock-modal-footer .button-primary:hover {
    background: var(--pv-color-teal-hover, #066772) !important;
    border-color: var(--pv-color-teal-hover, #066772) !important;
}

@media (max-width: 640px) {
    .pv-unlock-lead-inner {
        flex-direction: column;
        align-items: flex-start;
    }
    .pv-unlock-action {
        width: 100%;
    }
    .pv-btn-unlock-lead-trigger,
    .pv-btn-buy-credits {
        width: 100%;
        justify-content: center;
    }
}

/* ======================================================================
   ASTRA FRONT PAGE ENTRY HEADER TITLE SUPPRESSION
   ====================================================================== */
.home.page .entry-header,
body.home.page .entry-header,
body.home .ast-archive-description {
    display: none !important;
}

/* ======================================================================
   PHASE 8A — TASK 2: HERO SECTION & FLOATING PILL SEARCH STYLING
   ====================================================================== */
.propvendor-hero {
    position: relative;
    min-height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 20px 85px;
    margin: 0;
    overflow: visible;
    background-color: var(--pv-color-navy-dark, #0D1C27);
}

/* Full-width breakout for Astra container */
.alignfull .propvendor-hero,
.ast-container .propvendor-hero,
.entry-content .propvendor-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
}

/* Dynamic crossfade background slider */
.propvendor-hero-slides {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
}

.propvendor-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: opacity 1.2s ease-in-out;
}

.propvendor-slide.active {
    opacity: 1;
}

/* Dark navy gradient overlay */
.propvendor-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(13, 28, 39, 0.88) 0%, rgba(20, 43, 59, 0.76) 100%);
    z-index: 1;
}

.propvendor-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 900px;
    width: 100%;
    color: #ffffff;
}

.propvendor-hero-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(243, 182, 76, 0.4);
    padding: 6px 18px;
    border-radius: var(--pv-radius-full, 9999px);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin-bottom: 24px;
    color: var(--pv-color-gold, #F3B64C);
}

.propvendor-hero-title {
    font-size: clamp(1.4rem, 5vw, 2.25rem);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 16px;
    color: #ffffff;
    letter-spacing: -0.02em;
    white-space: nowrap;
}

@media (max-width: 360px) {
    .propvendor-hero-title {
        white-space: normal;
    }
}

.propvendor-hero-title .highlight {
    color: var(--pv-color-gold, #F3B64C);
}

.propvendor-hero-subtitle {
    font-size: 1.125rem;
    font-weight: 400;
    margin: 0 0 36px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
}

.propvendor-pill-search-container {
    position: relative;
    z-index: 10;
    margin-bottom: 28px;
}

/* Floating white pill search container */
.propvendor-pill-search {
    display: flex;
    align-items: center;
    background: var(--pv-color-surface, #ffffff);
    border-radius: var(--pv-radius-full, 9999px);
    padding: 6px 8px 6px 20px;
    box-shadow: 0 20px 35px -5px rgba(13, 28, 39, 0.35), 0 4px 12px rgba(0, 0, 0, 0.08);
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.propvendor-pill-search .search-field {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 0 12px;
    position: relative;
}

/* Uniform 44px borderless selects and inputs inside the pill with zero browser outline */
.propvendor-pill-search select,
.propvendor-pill-search input {
    width: 100%;
    border: none !important;
    background: transparent;
    box-shadow: none !important;
    height: 44px;
    line-height: 44px;
    color: #1e293b;
    font-size: 0.95rem;
    outline: none !important;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.propvendor-pill-search .search-field select {
    cursor: pointer;
    background-color: #ffffff !important;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 6px center !important;
    background-size: 16px !important;
    padding-right: 28px !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

.propvendor-pill-search select option {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #1e293b !important;
}

/* Custom State Dropdown Component */
.propvendor-state-dropdown-wrap {
    position: relative;
}

.propvendor-state-dropdown-wrap.js-enabled .propvendor-hero-state-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.propvendor-state-toggle-btn {
    display: none;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 44px;
    padding: 0 10px;
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    color: #1e293b;
    font-size: 0.95rem;
    cursor: pointer;
    text-align: left;
    outline: none !important;
}

.propvendor-state-dropdown-wrap.js-enabled .propvendor-state-toggle-btn {
    display: flex;
}

.propvendor-state-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 8px;
    color: #1e293b;
    font-size: 0.95rem;
}

.propvendor-state-chevron {
    flex-shrink: 0;
    color: #64748b;
    transition: transform 0.2s ease;
}

.propvendor-state-menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    width: 290px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 16px 36px -4px rgba(15, 23, 42, 0.2), 0 4px 12px rgba(0, 0, 0, 0.05);
    z-index: 1000;
    display: none;
    padding: 8px;
    text-align: left;
}

.propvendor-state-menu.is-open {
    display: block !important;
    animation: pvDropdownFadeIn 0.15s ease-out;
}

@keyframes pvDropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.propvendor-state-menu-scroll {
    max-height: 280px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f8fafc;
}

.propvendor-state-menu-scroll::-webkit-scrollbar {
    width: 6px;
}

.propvendor-state-menu-scroll::-webkit-scrollbar-track {
    background: #f8fafc;
    border-radius: 4px;
}

.propvendor-state-menu-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.propvendor-state-menu-scroll::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

.propvendor-state-group-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--pv-color-teal, #087F8C);
    padding: 8px 10px 4px;
    background: var(--pv-color-surface-alt, #f8fafc);
    border-radius: 4px;
    margin: 4px 0 2px;
}

.propvendor-state-option {
    display: block;
    width: 100%;
    padding: 7px 12px;
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #334155);
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
    user-select: none;
}

.propvendor-state-option:hover {
    background: var(--pv-color-teal-subtle, #E6F4F6);
    color: var(--pv-color-teal, #087F8C);
}

.propvendor-state-option.is-selected {
    background: rgba(8, 127, 140, 0.1);
    color: var(--pv-color-teal, #087F8C);
    font-weight: 600;
}

/* Fallback styling for native select if JS disabled */
.propvendor-hero-state-select {
    height: 44px;
    padding: 0 32px 0 12px;
    background: #ffffff !important;
    border: none !important;
}

.propvendor-hero-state-select optgroup {
    font-weight: 700;
    color: var(--pv-color-teal, #087F8C);
    background: var(--pv-color-surface-alt, #f8fafc);
    font-size: 0.8rem;
}

.propvendor-pill-search select:focus,
.propvendor-pill-search input:focus {
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
}

.propvendor-pill-search .keyword-field input {
    padding-left: 8px;
}

.propvendor-pill-search .search-icon-input {
    color: #64748b;
    flex-shrink: 0;
}

.propvendor-pill-search .search-divider {
    width: 1px;
    height: 32px;
    background: #e2e8f0;
    flex-shrink: 0;
}

/* High-converting teal button with hover state */
.propvendor-pill-search .search-submit-btn {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    border: none;
    border-radius: 40px;
    height: 46px;
    padding: 0 28px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 6px;
    box-shadow: 0 4px 6px -1px rgba(8, 127, 140, 0.3);
}

.propvendor-pill-search .search-submit-btn:hover {
    background: var(--pv-color-teal-hover, #066772);
    box-shadow: 0 6px 12px -1px rgba(6, 103, 114, 0.4);
    transform: translateY(-1px);
}

.propvendor-trust-badges {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.propvendor-trust-badges .trust-dot {
    width: 8px;
    height: 8px;
    background: var(--pv-status-success, #0A8A4F);
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 8px rgba(10, 138, 79, 0.6);
}

/* Accessibility: reduce motion fallback */
@media (prefers-reduced-motion: reduce) {
    .propvendor-slide {
        transition: none !important;
    }
}

/* Responsive stacking on mobile viewports (<= 768px) */
@media (max-width: 768px) {
    .propvendor-hero {
        min-height: auto;
        padding: 105px 16px 75px;
    }
    .propvendor-hero-title {
        font-size: clamp(1.4rem, 5vw, 2.25rem);
        white-space: nowrap;
    }
    .propvendor-hero-subtitle {
        font-size: 1rem;
        margin-bottom: 28px;
    }
    .propvendor-pill-search {
        flex-direction: column;
        border-radius: 12px;
        padding: 16px;
        gap: 12px;
        background: #ffffff;
    }
    .propvendor-pill-search .search-field {
        width: 100%;
        padding: 0 12px;
        background: #f8fafc;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
    }
    .propvendor-pill-search .search-field select {
        background-color: #f8fafc !important;
    }
    .propvendor-pill-search select,
    .propvendor-pill-search input {
        padding: 0;
    }
    .propvendor-pill-search .keyword-field input {
        padding-left: 8px;
    }
    .propvendor-pill-search .search-divider {
        display: none;
    }
    .propvendor-pill-search .search-submit-btn {
        width: 100%;
        justify-content: center;
        margin-left: 0;
        margin-top: 4px;
        border-radius: 8px;
        height: 48px;
    }
    .propvendor-trust-badges {
        flex-direction: column;
        text-align: center;
        font-size: 0.75rem;
        gap: 6px;
    }
}

/* ======================================================================
   PHASE 8A & 8B.1: ASTRA PRIMARY NAVIGATION & HEADER SINGLE-LINE LAYOUT
   ====================================================================== */

/* Fix logo squishing and maintain site branding width */
.site-branding,
.ast-site-identity,
.site-title,
.site-title a,
.site-header-primary-section-left {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    min-width: max-content !important;
    letter-spacing: normal !important;
}

.main-header-bar,
.ast-primary-header-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* ======================================================================
   PHASE 9B — GLOBAL HEADER, DESKTOP NAVIGATION, MOBILE MENU & FOOTER
   Consistent, Accessible, Responsive Marketplace Navigation (Tokens)
   ====================================================================== */

/* --- 1. Global Header Container (Solid Surface Across All Pages) --- */
#masthead.site-header,
.home #masthead.site-header {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    z-index: 100 !important;
    display: block !important;
    visibility: visible !important;
    background-color: var(--pv-color-surface, #ffffff) !important;
    border-bottom: 1px solid var(--pv-color-border, #e2e8f0) !important;
    box-shadow: var(--pv-shadow-sm, 0 1px 2px rgba(20, 43, 59, 0.05)) !important;
}

#masthead .ast-desktop-header,
#masthead .ast-main-header-wrap,
#masthead .main-header-bar-wrap,
#masthead .ast-primary-header-bar,
#masthead .main-header-bar,
#masthead .site-primary-header-wrap,
.home #masthead .ast-desktop-header,
.home #masthead .ast-main-header-wrap,
.home #masthead .main-header-bar-wrap,
.home #masthead .ast-primary-header-bar,
.home #masthead .main-header-bar,
.home #masthead .site-primary-header-wrap {
    background-color: var(--pv-color-surface, #ffffff) !important;
    display: flex !important;
    visibility: visible !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 64px !important;
    border: none !important;
    box-shadow: none !important;
}

/* --- 2. Site Branding & Marketplace Logo --- */
.site-branding .site-title a,
.site-title a,
.home .site-branding .site-title a,
.home .site-title a {
    color: var(--pv-color-navy, #142b3b) !important;
    font-family: var(--pv-font-sans);
    font-size: 1.4rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    text-decoration: none !important;
    transition: color var(--pv-transition-fast) !important;
    display: inline-block !important;
    padding: 4px 0 !important;
}

.site-branding .site-title a:hover,
.site-title a:hover,
.home .site-branding .site-title a:hover,
.home .site-title a:hover {
    color: var(--pv-color-teal, #087f8c) !important;
}

.site-branding .site-title a:focus-visible,
.site-title a:focus-visible {
    outline: none !important;
    box-shadow: var(--pv-shadow-focus) !important;
    border-radius: var(--pv-radius-sm, 6px) !important;
}

/* --- 3. Desktop Header Navigation (Single Line Layout & Spacing) --- */
@media (min-width: 922px) {
    .site-header-primary-section-left {
        flex-shrink: 0 !important;
        min-width: max-content !important;
    }

    .site-header-primary-section-right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        flex-shrink: 1 !important;
        min-width: 0 !important;
    }

    .main-header-bar-navigation {
        display: flex !important;
        align-items: center !important;
        flex-shrink: 1 !important;
        min-width: 0 !important;
    }

    .main-navigation .main-header-menu {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 4px;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    /* Standard Navigation Links (All Pages) */
    .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a,
    .home .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a {
        color: var(--pv-text-secondary, #475569) !important;
        font-family: var(--pv-font-sans);
        font-size: 13.5px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        padding: 6px 9px !important;
        border-radius: var(--pv-radius-md, 8px) !important;
        text-decoration: none !important;
        background: transparent !important;
        transition: color var(--pv-transition-fast),
                    background-color var(--pv-transition-fast) !important;
    }

    /* Hover & Focus States */
    .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a:hover,
    .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta).focus > a,
    .home .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a:hover,
    .home .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta).focus > a {
        color: var(--pv-color-teal, #087f8c) !important;
        background-color: var(--pv-color-teal-subtle, #e6f4f6) !important;
    }

    .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a:focus-visible {
        outline: none !important;
        box-shadow: var(--pv-shadow-focus) !important;
    }

    /* Active / Current Page State */
    .main-navigation .main-header-menu > .menu-item.current-menu-item:not(.propvendor-nav-cta) > a,
    .main-navigation .main-header-menu > .menu-item.current_page_item:not(.propvendor-nav-cta) > a,
    .home .main-navigation .main-header-menu > .menu-item.current-menu-item:not(.propvendor-nav-cta) > a,
    .home .main-navigation .main-header-menu > .menu-item.current_page_item:not(.propvendor-nav-cta) > a {
        color: var(--pv-color-teal, #087f8c) !important;
        font-weight: 700 !important;
        background-color: var(--pv-color-teal-subtle, #e6f4f6) !important;
    }

    /* Distinct 'Submit a Listing' High-Conversion Action Button */
    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta {
        margin-left: 8px !important;
        flex-shrink: 0 !important;
    }

    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a,
    .main-header-menu .menu-item a.ast-custom-button-link,
    .main-header-menu .menu-item-btn > a {
        background-color: var(--pv-color-gold, #f3b64c) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
        border: 1.5px solid var(--pv-color-gold, #f3b64c) !important;
        border-radius: var(--pv-radius-md, 8px) !important;
        padding: 7px 15px !important;
        font-family: var(--pv-font-sans);
        font-weight: 700 !important;
        font-size: 13.5px !important;
        line-height: 1.4 !important;
        white-space: nowrap !important;
        text-decoration: none !important;
        display: inline-flex !important;
        align-items: center !important;
        box-shadow: var(--pv-shadow-sm) !important;
        transition: background-color var(--pv-transition-base),
                    border-color var(--pv-transition-base),
                    box-shadow var(--pv-transition-base),
                    transform var(--pv-transition-base) !important;
    }

    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:hover,
    .main-header-menu .menu-item a.ast-custom-button-link:hover,
    .main-header-menu .menu-item-btn > a:hover {
        background-color: var(--pv-color-gold-hover, #e5a335) !important;
        border-color: var(--pv-color-gold-hover, #e5a335) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
        box-shadow: var(--pv-shadow-md) !important;
        transform: translateY(-1px) !important;
    }

    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:active,
    .main-header-menu .menu-item a.ast-custom-button-link:active,
    .main-header-menu .menu-item-btn > a:active {
        background-color: var(--pv-color-gold-active, #d49526) !important;
        border-color: var(--pv-color-gold-active, #d49526) !important;
        transform: translateY(0) !important;
        box-shadow: var(--pv-shadow-sm) !important;
    }

    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:focus-visible {
        outline: none !important;
        box-shadow: var(--pv-shadow-focus-gold) !important;
    }
}

/* Widescreen Desktop Adjustments (1200px+) */
@media (min-width: 1200px) {
    .main-navigation .main-header-menu {
        gap: 8px;
    }

    .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a {
        font-size: 14px !important;
        padding: 7px 11px !important;
    }

    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a {
        padding: 8px 18px !important;
        font-size: 14px !important;
    }
}

/* --- 4. Mobile Navigation & Off-Canvas Drawer (Below 921px) --- */
@media (max-width: 921px) {
    #ast-mobile-header {
        background-color: var(--pv-color-surface, #ffffff) !important;
        border-bottom: 1px solid var(--pv-color-border, #e2e8f0) !important;
        box-shadow: var(--pv-shadow-sm) !important;
        min-height: 56px !important;
    }

    #ast-mobile-header .site-branding .site-title a,
    .home #ast-mobile-header .site-branding .site-title a {
        color: var(--pv-color-navy, #142b3b) !important;
        font-size: 1.25rem !important;
        font-weight: 800 !important;
    }

    /* Mobile Hamburger Menu Toggle Button (Meets 44px Touch Target) */
    .menu-toggle.main-header-menu-toggle {
        min-width: 44px !important;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background-color: var(--pv-color-surface-alt, #f8fafc) !important;
        border: 1.5px solid var(--pv-color-border, #e2e8f0) !important;
        border-radius: var(--pv-radius-md, 8px) !important;
        padding: 8px !important;
        cursor: pointer !important;
        transition: all var(--pv-transition-fast) !important;
    }

    .menu-toggle.main-header-menu-toggle:hover {
        background-color: var(--pv-color-teal-subtle, #e6f4f6) !important;
        border-color: var(--pv-color-teal, #087f8c) !important;
    }

    .menu-toggle.main-header-menu-toggle:focus-visible {
        outline: none !important;
        box-shadow: var(--pv-shadow-focus) !important;
    }

    .menu-toggle .mobile-menu-toggle-icon svg,
    .home .menu-toggle .mobile-menu-toggle-icon svg {
        fill: var(--pv-color-navy, #142b3b) !important;
        color: var(--pv-color-navy, #142b3b) !important;
        width: 22px !important;
        height: 22px !important;
    }

    /* Mobile Drawer Content Dropdown */
    .ast-mobile-header-content {
        background-color: var(--pv-color-surface, #ffffff) !important;
        border-bottom: 2px solid var(--pv-color-border, #e2e8f0) !important;
        box-shadow: var(--pv-shadow-md) !important;
        padding: 0.5rem 0 1rem 0 !important;
        box-sizing: border-box !important;
        max-width: 100vw !important;
        width: 100% !important;
        overflow-x: hidden !important; /* Defect 2 fix: eliminate horizontal scrollbar */
        overflow-y: auto !important;   /* Preserve vertical scrolling for short screens */
        -webkit-overflow-scrolling: touch;
    }

    .ast-mobile-header-content .main-navigation,
    .ast-mobile-header-content .main-header-bar-navigation,
    .ast-mobile-header-content .main-header-menu,
    #ast-hf-mobile-menu {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item,
    #ast-hf-mobile-menu .menu-item {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Mobile Drawer Navigation Links */
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a,
    #ast-hf-mobile-menu .menu-item:not(.propvendor-nav-cta) > a {
        display: block !important;
        color: var(--pv-text-primary, #0f172a) !important;
        font-family: var(--pv-font-sans);
        font-size: 0.95rem !important;
        font-weight: 500 !important;
        padding: 0.85rem 1.25rem !important;
        border-bottom: 1px solid var(--pv-color-border-subtle, #eef2f6) !important;
        text-decoration: none !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        transition: background-color var(--pv-transition-fast),
                    color var(--pv-transition-fast) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item:not(.propvendor-nav-cta) > a:hover,
    #ast-hf-mobile-menu .menu-item:not(.propvendor-nav-cta) > a:hover {
        color: var(--pv-color-teal, #087f8c) !important;
        background-color: var(--pv-color-teal-subtle, #e6f4f6) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.current-menu-item:not(.propvendor-nav-cta) > a,
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.current_page_item:not(.propvendor-nav-cta) > a,
    #ast-hf-mobile-menu .menu-item.current-menu-item:not(.propvendor-nav-cta) > a,
    #ast-hf-mobile-menu .menu-item.current_page_item:not(.propvendor-nav-cta) > a {
        color: var(--pv-color-teal, #087f8c) !important;
        font-weight: 700 !important;
        background-color: var(--pv-color-teal-subtle, #e6f4f6) !important;
        border-left: 4px solid var(--pv-color-teal, #087f8c) !important;
    }

    /* Defect 1 Fix — Intentional, Readable Gold Pill Action Button */
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 0.65rem 1.25rem !important;
        margin: 0 !important;
        border-bottom: 1px solid var(--pv-color-border-subtle, #eef2f6) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a,
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:link,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:link,
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:visited,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:visited {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        background-color: var(--pv-color-gold, #f3b64c) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
        border: 1.5px solid var(--pv-color-gold, #f3b64c) !important;
        border-radius: var(--pv-radius-md, 8px) !important;
        padding: 0.75rem 1.25rem !important;
        font-family: var(--pv-font-sans) !important;
        font-weight: 700 !important;
        font-size: 0.95rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
        text-decoration: none !important;
        box-shadow: var(--pv-shadow-sm) !important;
        transition: background-color var(--pv-transition-base),
                    border-color var(--pv-transition-base),
                    color var(--pv-transition-base),
                    box-shadow var(--pv-transition-base) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:hover,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:hover {
        background-color: var(--pv-color-gold-hover, #e5a335) !important;
        border-color: var(--pv-color-gold-hover, #e5a335) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
        box-shadow: var(--pv-shadow-md) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:focus,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:focus,
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:focus-visible,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:focus-visible {
        outline: none !important;
        box-shadow: var(--pv-shadow-focus-gold) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
    }

    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a:active,
    #ast-hf-mobile-menu .menu-item.propvendor-nav-cta > a:active {
        background-color: var(--pv-color-gold-active, #d49526) !important;
        border-color: var(--pv-color-gold-active, #d49526) !important;
        color: var(--pv-color-navy-dark, #0d1c27) !important;
        transform: translateY(0) !important;
    }
}

/* --- 5. Global Marketplace Footer Architecture --- */
footer.site-footer,
#colophon.site-footer {
    background-color: var(--pv-color-navy-dark, #0d1c27) !important;
    border-top: 3px solid var(--pv-color-teal, #087f8c) !important;
    color: var(--pv-text-muted, #94a3b8) !important;
    padding: 2.5rem 1.5rem !important;
    margin-top: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

footer.site-footer .site-below-footer-wrap,
footer.site-footer .ast-builder-grid-row-container-inner,
footer.site-footer .site-below-footer-inner-wrap {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 1200px !important;
}

footer.site-footer .ast-footer-copyright,
footer.site-footer .ast-footer-copyright p {
    color: #94a3b8 !important;
    font-family: var(--pv-font-sans);
    font-size: 0.925rem !important;
    line-height: 1.6 !important;
    margin: 0 !important;
    text-align: center !important;
}

footer.site-footer a,
footer.site-footer .ast-footer-copyright a {
    color: var(--pv-color-gold, #f3b64c) !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: color var(--pv-transition-fast) !important;
}

footer.site-footer a:hover,
footer.site-footer .ast-footer-copyright a:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
}

footer.site-footer a:focus-visible,
footer.site-footer .ast-footer-copyright a:focus-visible {
    outline: 2px solid var(--pv-color-gold, #f3b64c) !important;
    outline-offset: 2px !important;
    border-radius: var(--pv-radius-sm, 6px) !important;
}

/* Reduced Motion for Navigation and Footer */
@media (prefers-reduced-motion: reduce) {
    .site-branding .site-title a,
    .main-navigation .main-header-menu > .menu-item > a,
    .main-navigation .main-header-menu > .menu-item.propvendor-nav-cta > a,
    .menu-toggle.main-header-menu-toggle,
    .ast-mobile-header-content .main-navigation .main-header-menu > .menu-item > a,
    footer.site-footer a {
        transition: none !important;
        transform: none !important;
    }
}

/* ======================================================================
   PHASE 8A — TASK 2: BROWSE LISTINGS COMPACT DARK HERO BANNER
   ====================================================================== */
.propvendor-browse-hero {
    position: relative;
    background: var(--pv-color-navy-dark, #0D1C27) url('https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?auto=format&fit=crop&w=1920&q=80') center center / cover no-repeat;
    padding: 50px 24px 75px;
    margin-bottom: -35px;
    border-radius: var(--pv-radius-lg, 12px);
    overflow: hidden;
    color: #ffffff;
    text-align: center;
}

/* Full-width breakout for Astra container */
.alignfull .propvendor-browse-hero,
.ast-container .propvendor-browse-hero,
.entry-content .propvendor-browse-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    border-radius: 0;
    margin-bottom: -40px;
    padding: 55px 20px 80px;
}

.propvendor-browse-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(13, 28, 39, 0.94) 0%, rgba(20, 43, 59, 0.88) 100%);
    z-index: 1;
}

.propvendor-browse-hero-content {
    position: relative;
    z-index: 2;
    max-width: 860px;
    margin: 0 auto;
}

.propvendor-browse-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 12px;
}

.propvendor-browse-breadcrumb a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: color 0.2s ease;
}

.propvendor-browse-breadcrumb a:hover {
    color: var(--pv-color-gold, #F3B64C);
}

.propvendor-browse-breadcrumb .breadcrumb-sep {
    color: rgba(255, 255, 255, 0.4);
}

.propvendor-browse-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--pv-radius-full, 9999px);
    padding: 5px 16px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 16px;
}

.propvendor-browse-status-pill .trust-dot {
    width: 8px;
    height: 8px;
    background: var(--pv-status-success, #0A8A4F);
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 6px rgba(10, 138, 79, 0.6);
}

.propvendor-browse-hero-title {
    font-size: 2.5rem;
    font-weight: 800;
    color: #ffffff;
    margin: 0 0 10px;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.propvendor-browse-hero-subtitle {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.88);
    margin: 0;
    line-height: 1.5;
}

/* Overlap filter card over browse hero */
.propvendor-browse .propvendor-search-card {
    position: relative;
    z-index: 3;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

@media (max-width: 768px) {
    .propvendor-browse-hero,
    .alignfull .propvendor-browse-hero,
    .ast-container .propvendor-browse-hero,
    .entry-content .propvendor-browse-hero {
        padding: 40px 16px 65px;
        margin-bottom: -30px;
    }
    .propvendor-browse-hero-title {
        font-size: 1.75rem;
    }
    .propvendor-browse-hero-subtitle {
        font-size: 0.95rem;
    }
}

/* ======================================================================
   PHASE 8B — CATEGORY NAVIGATION GRID & FEATURED LISTINGS CAROUSEL
   ====================================================================== */

/* Section headers (shared) */
.propvendor-section-header {
    text-align: center;
    margin-bottom: 2.25rem;
}

.propvendor-section-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #0d9488;
    background: rgba(13, 148, 136, 0.1);
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    margin-bottom: 0.75rem;
}

.propvendor-section-title {
    font-size: 2.15rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
    margin: 0 0 0.5rem;
    line-height: 1.25;
}

.propvendor-section-subtitle {
    font-size: 1rem;
    color: #64748b;
    max-width: 640px;
    margin: 0 auto;
    line-height: 1.55;
}

/* 1. Explore by Category Centering */
.propvendor-category-section,
.propvendor-category-container,
.propvendor-category-header,
.propvendor-category-section .propvendor-section-header {
    text-align: center !important;
}

.propvendor-category-header .propvendor-category-badge,
.propvendor-category-header span,
.propvendor-category-section .badge,
.propvendor-category-section .propvendor-section-badge {
    display: inline-block !important;
    margin: 0 auto 12px !important;
    color: var(--pv-color-teal, #087F8C);
    background: var(--pv-color-teal-subtle, #E6F4F6);
    border: 1px solid rgba(8, 127, 140, 0.2);
    border-radius: var(--pv-radius-full, 9999px);
    padding: 0.35rem 0.85rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.propvendor-category-header h2,
.propvendor-category-section h2,
.propvendor-category-section .propvendor-section-title,
.propvendor-section-header h2 {
    font-size: clamp(1.4rem, 5vw, 2.25rem) !important;
    white-space: nowrap !important;
    text-align: center !important;
    margin: 0 auto 10px !important;
    line-height: 1.25 !important;
    color: var(--pv-color-navy, #142B3B);
    font-weight: 800;
    letter-spacing: -0.02em;
}

/* Fallback for ultra-narrow devices (< 360px) to prevent viewport clipping */
@media (max-width: 359px) {
    .propvendor-category-header h2,
    .propvendor-category-section h2,
    .propvendor-category-section .propvendor-section-title,
    .propvendor-section-header h2 {
        font-size: 1.25rem !important;
        white-space: normal !important;
    }
}


.propvendor-category-header p,
.propvendor-category-section p,
.propvendor-category-subtitle,
.propvendor-category-section .propvendor-section-subtitle,
.propvendor-category-container p.subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 640px !important;
    display: block !important;
    color: var(--pv-text-secondary, #475569);
    font-size: 1.05rem;
    line-height: 1.55;
}

.propvendor-category-section {
    padding: 4.5rem 0 3.5rem;
    background: var(--pv-color-surface, #ffffff);
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
}

.propvendor-category-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
}

.propvendor-category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    margin-top: 1.5rem;
}

.propvendor-category-card {
    display: flex;
    flex-direction: column;
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    overflow: hidden;
    text-decoration: none !important;
    min-height: 260px;
    margin-top: 1rem;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.06));
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.propvendor-category-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--pv-shadow-md, 0 10px 24px -4px rgba(13, 28, 39, 0.12));
    border-color: var(--pv-color-teal, #087F8C);
}

.propvendor-category-card:focus-visible {
    outline: 2px solid var(--pv-color-teal, #087F8C);
    outline-offset: 3px;
}

.category-card-media,
.propvendor-cat-img {
    height: 150px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1rem;
    flex-shrink: 0;
}

.category-card-media::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13, 28, 39, 0.2) 0%, rgba(13, 28, 39, 0.6) 100%);
    transition: opacity 0.3s ease;
}

.propvendor-category-card:hover .category-card-media::before {
    opacity: 0.8;
}

.category-tag {
    position: relative;
    z-index: 2;
    background: rgba(13, 28, 39, 0.78);
    backdrop-filter: blur(4px);
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.65rem;
    border-radius: var(--pv-radius-sm, 6px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.category-card-body {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.category-card-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
    transition: color 0.2s ease;
}

.propvendor-category-card:hover .category-card-title {
    color: var(--pv-color-teal, #087F8C);
}

.category-card-desc {
    font-size: 0.875rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.5;
    margin: 0 0 1rem 0;
    flex-grow: 1;
}

.category-card-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--pv-color-teal, #087F8C);
    transition: gap 0.2s ease, color 0.2s ease;
}

.propvendor-category-card:hover .category-card-link {
    gap: 0.65rem;
    color: var(--pv-color-teal-hover, #066772);
}

/* 2. Featured Listings Section */
.propvendor-featured-section {
    padding: 4.5rem 0;
    background: var(--pv-color-bg, #f8fafc);
    border-top: 1px solid var(--pv-color-border, #eef2f7);
    border-bottom: 1px solid var(--pv-color-border, #eef2f7);
}

.propvendor-featured-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 2. Featured Listings Header Centering */
.propvendor-featured-section .propvendor-featured-header,
.propvendor-featured-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    margin-bottom: 28px !important;
}

.propvendor-featured-header .header-left {
    text-align: center !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    max-width: 680px;
}

.propvendor-featured-header .propvendor-badge,
.propvendor-featured-section .propvendor-featured-badge,
.propvendor-featured-header span,
.propvendor-featured-header .propvendor-section-badge {
    display: inline-block !important;
    margin: 0 auto 10px !important;
    color: #B45309;
    background: var(--pv-color-gold-subtle, #FEF7EC);
    border: 1px solid rgba(243, 182, 76, 0.35);
    border-radius: var(--pv-radius-full, 9999px);
    padding: 0.35rem 0.85rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.propvendor-featured-header h2,
.propvendor-featured-section h2,
.propvendor-featured-header .propvendor-section-title {
    text-align: center !important;
    margin: 0 auto 8px !important;
    color: var(--pv-color-navy, #142B3B);
    font-size: 2.25rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.propvendor-featured-header p,
.propvendor-featured-section p,
.propvendor-featured-header .propvendor-section-subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 640px !important;
    color: var(--pv-text-secondary, #475569);
    font-size: 1.05rem;
    line-height: 1.55;
}

.propvendor-featured-header .propvendor-view-all-btn,
.propvendor-featured-section .propvendor-view-all,
.propvendor-featured-header a[href*="browse-listings"],
.propvendor-featured-header .view-all-link,
.propvendor-featured-header .propvendor-carousel-controls {
    margin-top: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.propvendor-featured-view-all .view-all-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--pv-color-teal, #087F8C);
    text-decoration: none;
    padding: 0.5rem 1rem;
    border-radius: var(--pv-radius-md, 8px);
    border: 1px solid rgba(8, 127, 140, 0.3);
    background: #ffffff;
    transition: all 0.2s ease;
}

.propvendor-featured-view-all .view-all-link:hover {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    border-color: var(--pv-color-teal, #087F8C);
}

.propvendor-carousel-controls {
    display: flex;
    gap: 0.5rem;
}

.propvendor-carousel-controls .carousel-btn {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--pv-color-border, #cbd5e1);
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pv-color-navy, #142B3B);
    cursor: pointer;
    transition: all 0.2s ease;
}

.propvendor-carousel-controls .carousel-btn:hover:not(:disabled) {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    border-color: var(--pv-color-teal, #087F8C);
}

.propvendor-carousel-controls .carousel-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    background: var(--pv-color-surface-alt, #f1f5f9);
    color: var(--pv-text-muted, #94a3b8);
    border-color: var(--pv-color-border-subtle, #e2e8f0);
}

/* Featured Listings Cards & Carousel Track */
.propvendor-carousel-track.is-carousel {
    display: flex;
    gap: 1.5rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding: 0.5rem 0.25rem 1.5rem;
    margin: 0;
    scrollbar-width: none;
}

.propvendor-carousel-track.is-carousel::-webkit-scrollbar {
    display: none;
}

.propvendor-carousel-track.is-carousel:focus-visible {
    outline: 2px solid var(--pv-color-teal, #087F8C);
    outline-offset: 4px;
    border-radius: var(--pv-radius-md, 8px);
}

.propvendor-carousel-track.is-carousel > .propvendor-card {
    flex: 0 0 320px;
    max-width: 340px;
    scroll-snap-align: start;
}

.propvendor-featured-static {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.5rem;
    margin: 0;
}

.propvendor-featured-section .propvendor-card {
    background: var(--pv-color-surface, #ffffff);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-lg, 12px);
    overflow: hidden;
    padding: 0;
    display: flex;
    flex-direction: column;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.04));
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.propvendor-featured-section .propvendor-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--pv-shadow-md, 0 10px 24px -4px rgba(13, 28, 39, 0.12));
    border-color: var(--pv-color-border-hover, #cbd5e1);
}

.propvendor-featured-section .propvendor-card .propvendor-card-image-link {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #f1f5f9;
    position: relative;
}

.propvendor-featured-section .propvendor-card .propvendor-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.propvendor-featured-section .propvendor-card:hover .propvendor-card-image {
    transform: scale(1.05);
}

.propvendor-featured-section .propvendor-card .propvendor-card-image-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: #64748b;
    height: 100%;
    text-decoration: none;
}

.propvendor-featured-section .propvendor-card .propvendor-badge {
    margin: 1rem 1rem 0.35rem 1rem;
    align-self: flex-start;
    color: var(--pv-color-teal, #087F8C);
    background: var(--pv-color-teal-subtle, #E6F4F6);
    border-radius: var(--pv-radius-full, 9999px);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.3rem 0.65rem;
}

.propvendor-featured-section .propvendor-card .propvendor-card-category {
    margin: 0.2rem 1rem;
    font-size: 0.8rem;
    color: var(--pv-text-muted, #64748b);
    font-weight: 500;
}

.propvendor-featured-section .propvendor-card h3 {
    margin: 0.35rem 1rem 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.35;
}

.propvendor-featured-section .propvendor-card h3 a {
    color: var(--pv-color-navy, #142B3B);
    text-decoration: none;
    transition: color 0.2s ease;
}

.propvendor-featured-section .propvendor-card h3 a:hover {
    color: var(--pv-color-teal, #087F8C);
}

.propvendor-featured-section .propvendor-card .propvendor-meta {
    margin: 0 1rem 0.5rem;
    font-size: 0.88rem;
    color: var(--pv-text-secondary, #64748b);
}

.propvendor-featured-section .propvendor-card .propvendor-price {
    margin: auto 1rem 0.85rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--pv-status-success, #0A8A4F);
}

.propvendor-featured-section .propvendor-card .propvendor-card-view {
    margin: 0 1rem 1.25rem;
    display: block;
    text-align: center;
    background: var(--pv-color-surface-alt, #f8fafc);
    border: 1px solid var(--pv-color-border, #e2e8f0);
    border-radius: var(--pv-radius-md, 8px);
    padding: 0.6rem 1rem;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--pv-color-navy, #142B3B);
    text-decoration: none;
    transition: all 0.2s ease;
}

.propvendor-featured-section .propvendor-card .propvendor-card-view:hover {
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff;
    border-color: var(--pv-color-teal, #087F8C);
}

/* Empty State */
.propvendor-featured-empty {
    text-align: center;
    padding: 3.5rem 1.5rem;
    background: var(--pv-color-surface, #ffffff);
    border: 1px dashed var(--pv-color-border, #cbd5e1);
    border-radius: var(--pv-radius-lg, 12px);
    max-width: 600px;
    margin: 0 auto;
}

.propvendor-featured-empty .empty-icon {
    font-size: 2.5rem;
    color: var(--pv-text-muted, #94a3b8);
    margin-bottom: 1rem;
}

.propvendor-featured-empty h3 {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin-bottom: 0.5rem;
}

.propvendor-featured-empty p {
    font-size: 0.95rem;
    color: var(--pv-text-secondary, #64748b);
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.propvendor-btn-browse {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--pv-color-teal, #087F8C);
    color: #ffffff !important;
    font-weight: 600;
    padding: 0.7rem 1.5rem;
    border-radius: var(--pv-radius-md, 8px);
    text-decoration: none;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(8, 127, 140, 0.25);
}

.propvendor-btn-browse:hover {
    background: var(--pv-color-teal-hover, #066772);
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(8, 127, 140, 0.35);
}

/* Responsive adjustments */
@media (max-width: 1024px) {
    .propvendor-category-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .propvendor-category-section,
    .propvendor-featured-section {
        padding: 3rem 0;
    }
    .propvendor-section-title {
        font-size: 1.75rem;
    }
    .propvendor-featured-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 576px) {
    .propvendor-category-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-carousel-track.is-carousel > .propvendor-card {
        flex: 0 0 280px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .propvendor-category-card,
    .propvendor-featured-section .propvendor-card,
    .propvendor-featured-section .propvendor-card .propvendor-card-image,
    .propvendor-carousel-track {
        transition: none !important;
        scroll-behavior: auto !important;
        transform: none !important;
    }
}

/* =========================================================================
   PHASE 9G — STATIC CONTENT, TRUST PAGES & GLOBAL FOOTER
   Professional styling for About, Contact, FAQs, Safety Guidelines,
   Account Portal, Listing Guides, and Multi-Column Global Footer.
   ========================================================================= */

/* --- 1. Base Static Page Layout --- */
.propvendor-static-page {
    max-width: 1200px;
    margin: 2.5rem auto 4.5rem auto;
    padding: 0 1.5rem;
    box-sizing: border-box;
    font-family: var(--pv-font-sans);
    color: var(--pv-text-primary);
}

.propvendor-static-header {
    text-align: center;
    margin-bottom: 2.75rem;
}

.propvendor-static-header .pv-badge {
    margin-bottom: 0.75rem;
}

.propvendor-static-title {
    font-size: clamp(1.85rem, 3.5vw, 2.6rem);
    font-weight: var(--pv-font-weight-bold, 700);
    color: var(--pv-color-navy, #142B3B);
    margin: 0.5rem 0 0.75rem 0;
    line-height: var(--pv-line-height-tight, 1.2);
    letter-spacing: -0.02em;
}

.propvendor-static-lead {
    font-size: var(--pv-font-size-lg, 1.125rem);
    color: var(--pv-text-secondary, #475569);
    max-width: 760px;
    margin: 0 auto;
    line-height: var(--pv-line-height-relaxed, 1.625);
}

/* --- 2. About PropVendor Page --- */
.propvendor-static-grid.propvendor-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.propvendor-pillar-card {
    text-align: center;
    padding: 2.25rem 1.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.propvendor-pillar-icon {
    font-size: 2.5rem;
    margin-bottom: 1.25rem;
    line-height: 1;
}

.propvendor-pillar-card h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.85rem 0;
}

.propvendor-pillar-card p {
    font-size: 0.95rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.6;
    margin: 0;
}

.propvendor-about-stats-banner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    background: var(--pv-color-navy, #142B3B);
    border-radius: var(--pv-radius-lg, 12px);
    padding: 2.25rem 1.75rem;
    margin-bottom: 3rem;
    text-align: center;
}

.propvendor-about-stats-banner .propvendor-stat-num {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--pv-color-gold, #F3B64C);
    display: block;
    line-height: 1.1;
    margin-bottom: 0.35rem;
}

.propvendor-about-stats-banner .propvendor-stat-lbl {
    font-size: 0.85rem;
    color: #CBD5E1;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    display: block;
}

.propvendor-staged-box {
    background: var(--pv-color-gold-subtle, #FEF7EC);
    border-left: 4px solid var(--pv-color-gold, #F3B64C);
    border-radius: 0 var(--pv-radius-md, 8px) var(--pv-radius-md, 8px) 0;
    padding: 1.25rem 1.5rem;
    margin-bottom: 3rem;
}

.propvendor-staged-box h4 {
    margin: 0 0 0.4rem 0;
    font-size: 1.05rem;
    color: #8A5800;
    font-weight: 700;
}

.propvendor-staged-box p {
    margin: 0;
    font-size: 0.925rem;
    color: #78350F;
    line-height: 1.55;
}

.propvendor-static-cta-banner {
    background: linear-gradient(135deg, var(--pv-color-navy-dark, #0D1C27) 0%, var(--pv-color-navy, #142B3B) 100%);
    border: 1px solid var(--pv-color-navy-light, #1D3D52);
    border-radius: var(--pv-radius-xl, 16px);
    padding: 3rem 2rem;
    text-align: center;
    color: #FFFFFF;
}

.propvendor-static-cta-banner h2 {
    font-size: 1.85rem;
    color: #FFFFFF;
    margin: 0 0 0.75rem 0;
    font-weight: 700;
}

.propvendor-static-cta-banner p {
    font-size: 1.05rem;
    color: #CBD5E1;
    max-width: 650px;
    margin: 0 auto 1.75rem auto;
    line-height: 1.55;
}

.propvendor-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

/* --- 3. Contact Us Page --- */
.propvendor-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 2.25rem;
    align-items: start;
}

.propvendor-contact-card {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    padding: 2rem;
}

.propvendor-contact-method {
    display: flex;
    gap: 1.15rem;
    align-items: flex-start;
}

.propvendor-contact-icon {
    font-size: 1.6rem;
    background: var(--pv-color-teal-subtle, #E6F4F6);
    color: var(--pv-color-teal, #087F8C);
    width: 48px;
    height: 48px;
    border-radius: var(--pv-radius-md, 8px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.propvendor-contact-details h3 {
    margin: 0 0 0.35rem 0;
    font-size: 1.05rem;
    color: var(--pv-color-navy, #142B3B);
    font-weight: 700;
}

.propvendor-contact-details p {
    margin: 0 0 0.3rem 0;
    font-size: 0.95rem;
    color: var(--pv-text-primary, #0F172A);
}

.propvendor-contact-link {
    color: var(--pv-color-teal, #087F8C);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--pv-transition-fast);
}

.propvendor-contact-link:hover {
    color: var(--pv-color-teal-hover, #066772);
    text-decoration: underline;
}

.propvendor-contact-subtext {
    font-size: 0.85rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.45;
    display: block;
}

.propvendor-contact-method.propvendor-staged-notice {
    border-top: 1px solid var(--pv-color-border, #E2E8F0);
    padding-top: 1.5rem;
}

.propvendor-method-header {
    margin-bottom: 0.4rem;
}

.propvendor-form-card {
    padding: 2.25rem;
}

.propvendor-form-card h3 {
    margin: 0 0 0.5rem 0;
    font-size: 1.35rem;
    color: var(--pv-color-navy, #142B3B);
    font-weight: 700;
}

.propvendor-form-intro {
    margin: 0 0 1.5rem 0;
    color: var(--pv-text-secondary, #475569);
    font-size: 0.95rem;
    line-height: 1.5;
}

.propvendor-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.15rem;
}

.propvendor-form-group {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 1.15rem;
}

.propvendor-form-group label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-form-group label .required {
    color: var(--pv-status-danger, #DC2626);
}

.propvendor-form-group label .optional {
    color: var(--pv-text-muted, #94A3B8);
    font-weight: 400;
}

.propvendor-form-group .pv-input,
.propvendor-form-group .pv-select,
.propvendor-form-group .pv-textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 0.7rem 0.9rem;
    border: 1.5px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
    font-family: var(--pv-font-sans);
    font-size: 0.95rem;
    color: var(--pv-text-primary, #0F172A);
    background: var(--pv-color-surface, #FFFFFF);
    transition: border-color var(--pv-transition-fast), box-shadow var(--pv-transition-fast);
}

.propvendor-form-group .pv-input:focus,
.propvendor-form-group .pv-select:focus,
.propvendor-form-group .pv-textarea:focus {
    outline: none;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: var(--pv-shadow-focus);
}

.propvendor-form-safety-notice {
    font-size: 0.825rem;
    color: var(--pv-text-secondary, #475569);
    margin-bottom: 1.5rem;
    line-height: 1.45;
}

.propvendor-btn-submit {
    width: 100%;
    justify-content: center;
    padding: 0.85rem 1.5rem;
    font-size: 1rem;
}

.propvendor-alert {
    padding: 0.9rem 1.25rem;
    border-radius: var(--pv-radius-md, 8px);
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
    line-height: 1.5;
}

.pv-alert-success {
    background: var(--pv-status-success-bg, #E8F8F0);
    color: var(--pv-status-success-text, #065F46);
    border: 1px solid var(--pv-status-success-border, #A7F3D0);
}

.pv-alert-danger {
    background: var(--pv-status-danger-bg, #FEE2E2);
    color: var(--pv-status-danger-text, #991B1B);
    border: 1px solid var(--pv-status-danger-border, #FECACA);
}

/* --- 4. Help & FAQs Page --- */
.propvendor-faq-group {
    margin-bottom: 2.75rem;
}

.propvendor-faq-group-title {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 1.25rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--pv-color-border, #E2E8F0);
}

.propvendor-faq-card {
    margin-bottom: 1.15rem;
    padding: 1.5rem 1.75rem;
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
    background: var(--pv-color-surface, #FFFFFF);
    transition: border-color var(--pv-transition-fast), box-shadow var(--pv-transition-fast);
}

.propvendor-faq-card:hover {
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: var(--pv-shadow-sm);
}

.propvendor-faq-card h3 {
    font-size: 1.1rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.5rem 0;
    font-weight: 600;
}

.propvendor-faq-card p {
    font-size: 0.95rem;
    color: var(--pv-text-secondary, #475569);
    margin: 0;
    line-height: 1.6;
}

/* --- 5. Safety Guidelines Page --- */
.propvendor-safety-golden-rule {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    background: #FFFBEB;
    border: 2px solid #FDE68A;
    border-left: 6px solid #D97706;
    border-radius: var(--pv-radius-lg, 12px);
    padding: 1.6rem 1.75rem;
    margin-bottom: 2.75rem;
}

.propvendor-golden-icon {
    font-size: 2.25rem;
    color: #D97706;
    flex-shrink: 0;
    line-height: 1;
}

.propvendor-golden-content h2 {
    margin: 0 0 0.4rem 0;
    font-size: 1.25rem;
    color: #92400E;
    font-weight: 700;
}

.propvendor-golden-content p {
    margin: 0;
    font-size: 0.975rem;
    color: #78350F;
    line-height: 1.55;
}

.propvendor-safety-section {
    margin-bottom: 2.75rem;
}

.propvendor-safety-section h2 {
    font-size: 1.35rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 1.25rem 0;
    font-weight: 700;
}

.propvendor-safety-steps-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
}

.propvendor-step-card {
    position: relative;
    padding: 1.85rem 1.6rem 1.6rem 1.6rem;
}

.propvendor-step-number {
    position: absolute;
    top: 1rem;
    right: 1.25rem;
    font-size: 1.85rem;
    font-weight: 800;
    color: #CBD5E1;
    line-height: 1;
}

.propvendor-step-card h3 {
    font-size: 1.1rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.5rem 0;
    padding-right: 2.5rem;
    font-weight: 700;
}

.propvendor-step-card p {
    font-size: 0.925rem;
    color: var(--pv-text-secondary, #475569);
    margin: 0;
    line-height: 1.6;
}

.propvendor-red-flags-card {
    border-left: 4px solid var(--pv-status-danger, #DC2626);
    padding: 1.75rem 2rem;
}

.propvendor-flags-list {
    margin: 0;
    padding-left: 1.25rem;
}

.propvendor-flags-list li {
    margin-bottom: 0.85rem;
    font-size: 0.95rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.6;
}

.propvendor-flags-list li:last-child {
    margin-bottom: 0;
}

/* --- 6. Account Portal Page --- */
.propvendor-account-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.35rem;
    margin-bottom: 2.75rem;
}

.propvendor-account-card {
    text-decoration: none !important;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.75rem;
    transition: transform var(--pv-transition-fast), border-color var(--pv-transition-fast), box-shadow var(--pv-transition-fast);
}

.propvendor-account-card:hover {
    transform: translateY(-3px);
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: var(--pv-shadow-md);
}

.propvendor-account-icon {
    font-size: 2rem;
    margin-bottom: 0.85rem;
    line-height: 1;
}

.propvendor-account-card h3 {
    font-size: 1.15rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.4rem 0;
    font-weight: 700;
}

.propvendor-account-card p {
    font-size: 0.9rem;
    color: var(--pv-text-secondary, #475569);
    margin: 0 0 1.25rem 0;
    line-height: 1.5;
}

.propvendor-account-card .propvendor-card-link {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--pv-color-teal, #087F8C);
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.propvendor-account-footer-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.75rem;
    background: var(--pv-color-surface-alt, #F8FAFC);
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
}

.propvendor-logged-as {
    margin: 0;
    font-size: 0.925rem;
    color: var(--pv-text-secondary, #475569);
}

.propvendor-auth-wrapper {
    max-width: 480px;
    margin: 0 auto;
}

.propvendor-auth-card {
    padding: 2.25rem;
}

#propvendor-loginform p {
    margin-bottom: 1.15rem;
}

#propvendor-loginform label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--pv-color-navy, #142B3B);
    display: block;
    margin-bottom: 0.35rem;
}

#propvendor-loginform input[type="text"],
#propvendor-loginform input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.7rem 0.9rem;
    border: 1.5px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
    font-size: 0.95rem;
    color: var(--pv-text-primary, #0F172A);
    transition: border-color var(--pv-transition-fast), box-shadow var(--pv-transition-fast);
}

#propvendor-loginform input[type="text"]:focus,
#propvendor-loginform input[type="password"]:focus {
    outline: none;
    border-color: var(--pv-color-teal, #087F8C);
    box-shadow: var(--pv-shadow-focus);
}

#propvendor-loginform input[type="submit"] {
    width: 100%;
    background: var(--pv-color-teal, #087F8C);
    color: #FFFFFF;
    font-weight: 600;
    padding: 0.85rem 1.5rem;
    border: none;
    border-radius: var(--pv-radius-md, 8px);
    cursor: pointer;
    font-size: 1rem;
    margin-top: 0.5rem;
    transition: background-color var(--pv-transition-fast);
}

#propvendor-loginform input[type="submit"]:hover {
    background: var(--pv-color-teal-hover, #066772);
}

.propvendor-auth-links {
    text-align: center;
    margin-top: 1.5rem;
}

.propvendor-forgot-link {
    font-size: 0.875rem;
    color: var(--pv-text-secondary, #475569);
    text-decoration: none;
}

.propvendor-forgot-link:hover {
    color: var(--pv-color-teal, #087F8C);
    text-decoration: underline;
}

.propvendor-auth-divider {
    margin: 1.25rem 0;
    border: none;
    border-top: 1px solid var(--pv-color-border, #E2E8F0);
}

.propvendor-register-prompt {
    margin: 0;
    font-size: 0.925rem;
    color: var(--pv-text-secondary, #475569);
}

.propvendor-register-link {
    color: var(--pv-color-teal, #087F8C);
    text-decoration: none;
}

.propvendor-register-link:hover {
    text-decoration: underline;
}

/* --- 7. Detail Guides (Pages 9 & 10) --- */
.propvendor-guide-content-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 2.25rem;
    align-items: start;
}

.propvendor-guide-info-card {
    padding: 2.25rem;
}

.propvendor-guide-info-card h2 {
    font-size: 1.35rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 1.25rem 0;
    font-weight: 700;
}

.propvendor-feature-list {
    margin: 0;
    padding-left: 1.25rem;
}

.propvendor-feature-list li {
    margin-bottom: 0.95rem;
    font-size: 0.95rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.6;
}

.propvendor-guide-action-card {
    padding: 2.25rem;
    background: var(--pv-color-surface-alt, #F8FAFC);
}

.propvendor-guide-action-card h3 {
    font-size: 1.15rem;
    color: var(--pv-color-navy, #142B3B);
    margin: 0 0 0.5rem 0;
    font-weight: 700;
}

.propvendor-guide-action-card p {
    font-size: 0.925rem;
    color: var(--pv-text-secondary, #475569);
    margin: 0 0 1.25rem 0;
    line-height: 1.5;
}

.propvendor-guide-btn {
    width: 100%;
    justify-content: center;
    margin-bottom: 1.25rem;
    text-align: center;
}

.propvendor-guide-divider {
    margin: 1.5rem 0;
    border: none;
    border-top: 1px solid var(--pv-color-border, #E2E8F0);
}

/* --- 8. Global Multi-Column Marketplace Footer --- */
.propvendor-global-footer {
    background-color: var(--pv-color-navy, #142B3B) !important;
    border-top: 3px solid var(--pv-color-teal, #087F8C) !important;
    color: #94A3B8;
    padding: 3.5rem 1.5rem 2rem 1.5rem;
    font-family: var(--pv-font-sans);
    box-sizing: border-box;
    width: 100%;
    margin-top: auto;
}

.propvendor-footer-container {
    max-width: 1200px;
    margin: 0 auto;
}

.propvendor-footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: 2.5rem;
    margin-bottom: 2.5rem;
}

.propvendor-footer-col .propvendor-footer-logo {
    margin-bottom: 0.85rem;
}

.propvendor-footer-col .pv-logo-text {
    font-size: 1.5rem;
    font-weight: 800;
    color: #FFFFFF;
    letter-spacing: -0.02em;
    display: inline-block;
}

.propvendor-footer-col .pv-logo-accent {
    color: var(--pv-color-gold, #F3B64C);
}

.propvendor-footer-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #94A3B8;
    margin: 0 0 1.25rem 0;
}

.propvendor-footer-contact p {
    margin: 0 0 0.35rem 0;
    font-size: 0.875rem;
    color: #CBD5E1;
}

.propvendor-footer-contact a {
    color: var(--pv-color-gold, #F3B64C);
    text-decoration: none;
    font-weight: 600;
}

.propvendor-footer-contact a:hover {
    color: #FFFFFF;
    text-decoration: underline;
}

.propvendor-footer-contact .propvendor-footer-hours {
    color: #64748B;
    font-size: 0.825rem;
}

.propvendor-footer-heading {
    font-size: 1rem;
    font-weight: 700;
    color: #FFFFFF;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 1.25rem 0;
    position: relative;
    padding-bottom: 0.6rem;
}

.propvendor-footer-heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 32px;
    height: 2px;
    background: var(--pv-color-teal, #087F8C);
}

.propvendor-footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.propvendor-footer-links li {
    margin-bottom: 0.65rem;
}

.propvendor-footer-links a {
    color: #94A3B8 !important;
    text-decoration: none !important;
    font-size: 0.925rem;
    transition: color var(--pv-transition-fast), padding-left var(--pv-transition-fast);
    display: inline-block;
}

.propvendor-footer-links a:hover {
    color: #FFFFFF !important;
    padding-left: 4px;
}

.propvendor-footer-links a:focus-visible {
    outline: 2px solid var(--pv-color-gold, #F3B64C);
    outline-offset: 2px;
    border-radius: 4px;
}

.propvendor-footer-disclaimer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 1.5rem;
    font-size: 0.825rem;
    line-height: 1.6;
    color: #64748B;
}

.propvendor-footer-disclaimer strong {
    color: #94A3B8;
}

/* --- 9. Responsive Adjustments --- */
@media (max-width: 1024px) {
    .propvendor-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
    .propvendor-contact-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-guide-content-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .propvendor-static-grid.propvendor-pillars-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-about-stats-banner {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }
    .propvendor-safety-steps-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-account-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-account-footer-actions {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    .propvendor-form-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .propvendor-footer-grid {
        grid-template-columns: 1fr;
    }
    .propvendor-about-stats-banner {
        grid-template-columns: 1fr;
    }
    .propvendor-static-page {
        padding: 0 1rem;
        margin-top: 1.75rem;
    }
    .propvendor-form-card {
        padding: 1.5rem 1.25rem;
    }
    .propvendor-cta-buttons {
        flex-direction: column;
    }
    .propvendor-cta-buttons a {
        width: 100%;
        text-align: center;
    }
}


/* =========================================================================
   PHASE 10B.2: LEGAL & POLICY PAGES (PRIVACY POLICY & TERMS OF SERVICE)
   ========================================================================= */

.propvendor-static-page-wrapper.propvendor-legal-page {
    max-width: 980px;
    margin: 2.5rem auto 4.5rem auto;
    padding: 0 1.5rem;
    box-sizing: border-box;
    font-family: var(--pv-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
    color: var(--pv-text-primary, #0F172A);
    line-height: var(--pv-line-height-relaxed, 1.7);
}

.propvendor-legal-page .propvendor-legal-notice-box {
    background: #F8FAFC;
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-left: 4px solid var(--pv-color-teal, #087F8C);
    border-radius: var(--pv-radius-md, 8px);
    padding: 1.25rem 1.5rem;
    margin-bottom: 2.5rem;
}

.propvendor-legal-page .propvendor-legal-notice-box p {
    margin: 0;
    font-size: 0.925rem;
    color: var(--pv-text-secondary, #475569);
    line-height: 1.6;
}

.propvendor-legal-page h1,
.propvendor-legal-page .propvendor-static-title {
    display: none !important;
}

.propvendor-legal-page .propvendor-legal-meta {
    font-size: 0.925rem;
    color: var(--pv-text-muted, #64748B);
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--pv-color-border, #E2E8F0);
}

.propvendor-legal-page .pv-meta-line {
    margin: 0 0 0.25rem 0;
}

.propvendor-legal-page h2 {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin: 2.5rem 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--pv-color-border, #E2E8F0);
    letter-spacing: -0.015em;
}

.propvendor-legal-page h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--pv-color-navy, #142B3B);
    margin: 1.75rem 0 0.75rem 0;
}

.propvendor-legal-page p {
    font-size: 1rem;
    color: var(--pv-text-secondary, #334155);
    margin: 0 0 1.25rem 0;
    line-height: 1.7;
}

.propvendor-legal-page ul,
.propvendor-legal-page ol {
    margin: 0 0 1.5rem 1.5rem;
    padding: 0;
    color: var(--pv-text-secondary, #334155);
}

.propvendor-legal-page li {
    margin-bottom: 0.65rem;
    line-height: 1.65;
}

.propvendor-legal-page strong {
    color: var(--pv-color-navy, #142B3B);
}

.propvendor-legal-page .propvendor-legal-card {
    background: var(--pv-color-surface, #FFFFFF);
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
    padding: 1.5rem 1.75rem;
    margin-bottom: 1.75rem;
    box-shadow: var(--pv-shadow-sm, 0 1px 3px rgba(0,0,0,0.05));
}

.propvendor-legal-page table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0 2rem 0;
    font-size: 0.925rem;
}

.propvendor-legal-page th,
.propvendor-legal-page td {
    padding: 0.85rem 1rem;
    border: 1px solid var(--pv-color-border, #E2E8F0);
    text-align: left;
}

.propvendor-legal-page th {
    background: var(--pv-color-surface-alt, #F8FAFC);
    color: var(--pv-color-navy, #142B3B);
    font-weight: 700;
}

.propvendor-legal-page a {
    color: var(--pv-color-teal, #087F8C);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.propvendor-legal-page a:hover {
    color: var(--pv-color-navy, #142B3B);
}

@media (max-width: 480px) {
    .propvendor-static-page-wrapper.propvendor-legal-page {
        padding: 0 1rem;
        margin-top: 1.75rem;
    }
}

/* Zero horizontal overflow safeguards for customer and vendor inboxes */
.pv-inbox-container,
.pv-inbox-main,
.pv-inbox-sidebar,
.pv-msg-stream,
.pv-msg-row,
.pv-msg-bubble {
    max-width: 100%;
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: break-word;
}

.pv-inbox-container {
    overflow-x: hidden;
}


/* ==========================================================================
   PropVendor Phase 12A — Authentication Portal & Role Flow
   ========================================================================== */
.propvendor-auth-portal-wrapper {
    max-width: 580px;
    margin: 2.5rem auto 3.5rem auto;
    background: #FFFFFF;
    border: 1px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-lg, 12px);
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.pv-auth-tabs {
    display: flex;
    background: var(--pv-color-surface-alt, #F8FAFC);
    border-bottom: 1px solid var(--pv-color-border, #E2E8F0);
}

.pv-auth-tab-btn {
    flex: 1;
    padding: 1.15rem 1rem;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    font-size: 1rem;
    font-weight: 600;
    color: var(--pv-text-secondary, #64748B);
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-align: center;
}

.pv-auth-tab-btn:hover {
    color: var(--pv-color-navy, #142B3B);
    background: rgba(241, 245, 249, 0.6);
}

.pv-auth-tab-btn.active {
    background: #FFFFFF;
    color: var(--pv-color-teal, #087F8C);
    border-bottom-color: var(--pv-color-teal, #087F8C);
    font-weight: 700;
}

.pv-auth-tab-panel {
    display: none;
    padding: 2.25rem 2.25rem 2.5rem 2.25rem;
}

.pv-auth-tab-panel.active {
    display: block;
}

.pv-auth-form .pv-form-group {
    margin-bottom: 1.25rem;
}

.pv-auth-form .pv-form-group:last-of-type {
    margin-bottom: 1.5rem;
}

.pv-auth-form label,
.pv-group-label {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--pv-color-navy, #142B3B);
}

.pv-required {
    color: #DC2626;
    font-weight: bold;
}

.pv-label-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.4rem;
}

.pv-forgot-password-link {
    font-size: 0.825rem;
    color: var(--pv-color-teal, #087F8C);
    text-decoration: none;
    transition: color 0.15s ease;
}

.pv-forgot-password-link:hover {
    color: var(--pv-color-navy, #142B3B);
    text-decoration: underline;
}

.pv-pwd-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.pv-pwd-wrap .pv-input {
    width: 100%;
    padding-right: 3rem;
}

.pv-toggle-pwd-btn {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    cursor: pointer;
    pointer-events: auto !important;
    z-index: 20;
    font-size: 1.2rem;
    padding: 0.35rem 0.5rem;
    color: #64748B;
    line-height: 1;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease;
}

.pv-toggle-pwd-btn:hover {
    color: var(--pv-color-navy, #142B3B);
}

.pv-form-checkbox-row {
    margin-top: 0.25rem;
    margin-bottom: 1.5rem;
}

.pv-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #475569;
    cursor: pointer;
    user-select: none;
}

.pv-auth-submit-btn {
    width: 100%;
    padding: 0.85rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    border-radius: var(--pv-radius-md, 8px);
    cursor: pointer;
}

.pv-role-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 0.35rem;
}

.pv-role-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1.15rem;
    background: var(--pv-color-surface-alt, #F8FAFC);
    border: 2px solid var(--pv-color-border, #E2E8F0);
    border-radius: var(--pv-radius-md, 8px);
    cursor: pointer;
    transition: all 0.2s ease;
}

.pv-role-card:hover {
    border-color: #CBD5E1;
    background: #F1F5F9;
}

.pv-role-card.is-selected,
.pv-role-card.selected,
.pv-role-card.active {
    border-color: var(--pv-color-teal, #087F8C) !important;
    background: #F0FDF4 !important;
    box-shadow: 0 0 0 1px var(--pv-color-teal, #087F8C) !important;
}

.pv-role-radio {
    margin-top: 0.25rem;
    accent-color: var(--pv-color-teal, #087F8C);
    cursor: pointer;
}

.pv-role-card-content {
    flex: 1;
}

.pv-role-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--pv-color-navy, #142B3B);
    margin-bottom: 0.25rem;
}

.pv-role-desc {
    font-size: 0.8rem;
    color: var(--pv-text-secondary, #64748B);
    line-height: 1.4;
}

.pv-role-explanation {
    margin: 1.25rem 0;
    padding: 0.9rem 1.15rem;
    border-radius: var(--pv-radius-md, 8px);
    background: #F8FAFC;
    border-left: 4px solid var(--pv-color-teal, #087F8C);
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--pv-color-navy, #142B3B);
}

.pv-role-exp-content strong {
    color: var(--pv-color-teal, #087F8C);
}

.pv-form-divider {
    position: relative;
    text-align: center;
    margin: 1.75rem 0 1.25rem 0;
}

.pv-form-divider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--pv-color-border, #E2E8F0);
}

.pv-form-divider span {
    position: relative;
    background: #FFFFFF;
    padding: 0 0.85rem;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--pv-text-secondary, #64748B);
}

.pv-auth-legal-note {
    font-size: 0.825rem;
    color: var(--pv-text-secondary, #64748B);
    line-height: 1.5;
    margin-top: 1.25rem;
    margin-bottom: 1.5rem;
    text-align: center;
}

.pv-auth-legal-note a {
    color: var(--pv-color-teal, #087F8C);
    text-decoration: underline;
}

.pv-form-hint {
    display: block;
    font-size: 0.775rem;
    color: var(--pv-text-secondary, #64748B);
    margin-top: 0.35rem;
}

@media (max-width: 640px) {
    .propvendor-auth-portal-wrapper {
        margin: 1.5rem 1rem 2.5rem 1rem;
    }

    .pv-auth-tab-panel {
        padding: 1.5rem 1.25rem 1.75rem 1.25rem;
    }

    .pv-role-cards {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
}


/* Phase 12.1 Branded Password Recovery Styles */
.pv-form-intro {
    font-size: 0.9rem;
    color: var(--pv-text-secondary, #64748B);
    line-height: 1.5;
    margin-bottom: 1.25rem;
}

.pv-link-back {
    font-size: 0.875rem;
    color: var(--pv-color-teal, #087F8C);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.15s ease;
}

.pv-link-back:hover {
    color: var(--pv-color-navy, #142B3B);
    text-decoration: underline;
}

.pv-auth-error-panel {
    text-align: center;
}