/* Shared polish for every page outside the home/shop sections: type, cards, forms, buttons, alerts. */
body.pv {
    font-family: var(--pv-font);
    color: var(--pv-ink);
    background: var(--pv-page);
}

body.pv main.container {
    padding-top: 1.75rem;
    padding-bottom: 3rem;
    min-height: 60vh;
}

body.pv h1,
body.pv h2,
body.pv h3 {
    color: var(--pv-ink);
    letter-spacing: -0.015em;
}

body.pv h1 {
    font-weight: 800;
}

body.pv a:focus-visible,
body.pv button:focus-visible,
body.pv summary:focus-visible,
body.pv input:focus-visible,
body.pv select:focus-visible,
body.pv textarea:focus-visible {
    outline: 3px solid rgba(22, 104, 227, 0.45);
    outline-offset: 2px;
}

/* Card surfaces: same separation from the page as the shop product cards. */
body.pv :is(.card, .auth-card, .shop-filters, .database-card, .card-price, .rewards-stat, .rewards-tier-card,
    .order-summary, .cart-summary, .cart-table-wrap, .giveaway-card, .giveaways-winners, .blog-card,
    .member-card, .review-card, .wall-composer, .wall-post, .support-message, .random-draw-product,
    .random-draw-results, .live-placeholder, .home-empty) {
    background: var(--pv-surface);
    border-color: var(--pv-card-border);
    box-shadow: var(--pv-card-shadow);
}

body.pv :is(.giveaway-card, .blog-card, .member-card, .database-card):hover {
    border-color: var(--pv-blue);
    box-shadow: var(--pv-card-shadow-hover);
}

body.pv .page-intro {
    color: var(--pv-muted);
}

body.pv :is(div, section).page-intro {
    background: var(--pv-surface);
    border: 1px solid var(--pv-card-border);
    border-radius: var(--pv-radius);
    box-shadow: var(--pv-card-shadow);
    color: var(--pv-ink-soft);
    padding: 1.5rem 1.75rem;
    margin-bottom: 1.5rem;
}

body.pv :is(div, section).page-intro h1 {
    margin-top: 0;
}

/* Legacy trading-host header: keep the hamburger bars visible. */
body.pv .menu-toggle span {
    width: 100%;
}

/* Long-form pages sit on a white sheet instead of directly on the page background. */
body.pv .policy-page {
    background: var(--pv-surface);
    border: 1px solid var(--pv-card-border);
    border-radius: var(--pv-radius);
    box-shadow: var(--pv-card-shadow);
    margin: 0 auto;
    max-width: 880px;
    padding: 2.25rem clamp(1.25rem, 4vw, 3rem);
}

body.pv .policy-page h2 {
    border-top: 1px solid var(--pv-border);
    margin-top: 2rem;
    padding-top: 1.5rem;
}

/* Forms */
body.pv :is(.form-field input, .form-field textarea, .form-field select, .shop-filters input, .shop-filters select),
body.pv :is(input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="url"], input[type="date"], select, textarea) {
    background: #fff;
    color: var(--pv-ink);
    border: 1px solid #b8c2d2;
    border-radius: var(--pv-radius);
}

body.pv :is(.form-field input, .form-field textarea, .form-field select):focus,
body.pv :is(input, select, textarea):focus {
    border-color: var(--pv-blue);
    box-shadow: 0 0 0 3px rgba(22, 104, 227, 0.18);
    outline: none;
}

body.pv ::placeholder {
    color: #8792a5;
}

/* Zero-specificity defaults so page-specific input sizing still wins. */
:where(body.pv) :where(input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="url"], input[type="date"], select, textarea) {
    padding: 0.55rem 0.75rem;
    font: inherit;
}

body.pv .link-button {
    color: var(--pv-blue);
}

body.pv .link-button:hover {
    color: var(--pv-blue-hover);
}

body.pv .link-button--danger {
    color: var(--pv-danger);
}

body.pv .form-field label,
body.pv label {
    color: var(--pv-ink-soft);
}

/* Preview index */
.pv-index {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.pv-index__group {
    padding: 1.25rem 1.5rem;
}

.pv-index__group h2 {
    font-size: 1rem;
    margin: 0 0 0.75rem;
}

.pv-index__group ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pv-index__group li {
    align-items: baseline;
    border-top: 1px solid var(--pv-border);
    display: flex;
    justify-content: space-between;
    padding: 0.4rem 0;
}

.pv-index__live {
    color: var(--pv-muted);
    font-size: 0.8rem;
}

/* Buttons */
body.pv .button {
    border-radius: var(--pv-radius);
    box-shadow: 0 1px 2px rgba(11, 18, 32, 0.15);
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

body.pv .button:hover {
    box-shadow: 0 4px 12px rgba(22, 104, 227, 0.3);
}

body.pv .button--outline {
    background: #fff;
    color: var(--pv-blue);
    border: 1px solid var(--pv-blue);
    box-shadow: none;
}

body.pv .button--outline:hover {
    background: var(--pv-blue-soft);
    color: var(--pv-blue-hover);
    box-shadow: none;
}

body.pv .button--danger {
    box-shadow: none;
}

body.pv .button--danger:hover {
    box-shadow: none;
}

body.pv .button[disabled],
body.pv .button:disabled {
    background: #c9d1de;
    color: #5b6577;
    box-shadow: none;
    cursor: not-allowed;
}

/* Alerts */
body.pv .alert {
    border-radius: var(--pv-radius);
}

body.pv .alert--success {
    background: #ecfdf3;
    border-color: #a6e4c3;
    color: #067647;
}

body.pv .alert--error {
    background: #fef3f2;
    border-color: #f5b5b0;
    color: #b42318;
}

/* Tables */
body.pv table {
    border-collapse: collapse;
}

body.pv th {
    background: #f3f6fb;
    color: var(--pv-ink-soft);
}

body.pv :is(th, td) {
    border-color: var(--pv-border);
}

/* Pagination */
body.pv .pagination a {
    background: #fff;
    border-color: var(--pv-card-border);
}

body.pv .pagination a:hover,
body.pv .pagination a[aria-current="page"] {
    background: var(--pv-blue);
    border-color: var(--pv-blue);
    color: #fff;
}
