/*
 * Alternate site themes. Classic is the default stylesheet and has no data-theme.
 * These rules recolor shared chrome only. Page copy is unchanged.
 */

body[data-theme="midnight"] {
    --bg: #141311;
    --paper: #221e1b;
    --ink: #f6f1ea;
    --muted: #c9bfb4;
    --accent: #e7a0ab;
    --heading: #f0b7c0;
    --btn: #e7a0ab;
    --on-accent: #2a1216;
    --line: #3a332e;
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --radius-card: 14px;
    --radius-control: 10px;
    --shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    --card-border: 1px solid #3a332e;
    --card-edge: 4px solid #e7a0ab;
}

body[data-theme="newsprint"] {
    --bg: #efeae0;
    --paper: #fbf8f1;
    --ink: #161616;
    --muted: #4e493f;
    --accent: #161616;
    --heading: #161616;
    --btn: #161616;
    --on-accent: #fbf8f1;
    --line: #161616;
    --font: Georgia, "Iowan Old Style", "Palatino Linotype", Palatino, serif;
    --radius-card: 0;
    --radius-control: 0;
    --shadow: none;
    --card-border: 1px solid #161616;
    --card-edge: 1px solid #161616;
}

body[data-theme="neon"] {
    --bg: #07080f;
    --paper: #12141f;
    --ink: #f3fbff;
    --muted: #b7c4d6;
    --accent: #5dfff0;
    --heading: #8dfff6;
    --btn: #5dfff0;
    --on-accent: #041316;
    --line: #2a3b52;
    --font: "Avenir Next", "Segoe UI", sans-serif;
    --radius-card: 4px;
    --radius-control: 0;
    --shadow: 0 0 24px rgba(93, 255, 240, 0.12);
    --card-border: 1px solid rgba(93, 255, 240, 0.45);
    --card-edge: 4px solid #ff4ad8;
}

body[data-theme="brutalist"] {
    --bg: #f2f2f2;
    --paper: #ffffff;
    --ink: #111111;
    --muted: #333333;
    --accent: #111111;
    --heading: #111111;
    --btn: #ffe500;
    --on-accent: #111111;
    --line: #111111;
    --font: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    --radius-card: 0;
    --radius-control: 0;
    --shadow: 6px 6px 0 #111111;
    --card-border: 3px solid #111111;
    --card-edge: 3px solid #111111;
}

body[data-theme="coastal"] {
    --bg: #e7f2f1;
    --paper: #f8fcfb;
    --ink: #10292c;
    --muted: #3e5c60;
    --accent: #0c6e78;
    --heading: #0c6e78;
    --btn: #0c6e78;
    --on-accent: #f4fffe;
    --line: #c5ddd9;
    --font: "Avenir Next", "Segoe UI", sans-serif;
    --radius-card: 18px;
    --radius-control: 999px;
    --shadow: 0 10px 24px rgba(12, 110, 120, 0.08);
    --card-border: 1px solid #d5e8e5;
    --card-edge: 4px solid #0c6e78;
}

body[data-theme="grove"] {
    --bg: #efe8da;
    --paper: #f8f4ea;
    --ink: #1e2a22;
    --muted: #516055;
    --accent: #24643f;
    --heading: #1f5a38;
    --btn: #24643f;
    --on-accent: #f4fbf6;
    --line: #d5cbb6;
    --font: "Avenir Next", "Segoe UI", sans-serif;
    --radius-card: 16px;
    --radius-control: 10px;
    --shadow: 0 8px 20px rgba(36, 100, 63, 0.08);
    --card-border: 1px solid #e3d8c4;
    --card-edge: 4px solid #24643f;
}

body[data-theme="pop"] {
    --bg: #ffe4f0;
    --paper: #fff7fb;
    --ink: #2b1024;
    --muted: #7a4668;
    --accent: #e0126d;
    --heading: #c40062;
    --btn: #e0126d;
    --on-accent: #ffffff;
    --line: #ffc2dc;
    --font: "Trebuchet MS", "Avenir Next", "Segoe UI", sans-serif;
    --radius-card: 24px;
    --radius-control: 999px;
    --shadow: 0 12px 28px rgba(224, 18, 109, 0.12);
    --card-border: 2px solid #ffd0e4;
    --card-edge: 0;
}

body[data-theme] {
    background: var(--bg);
    color: var(--ink);
    font-family: var(--font);
}

body[data-theme] h1,
body[data-theme] .page-title,
body[data-theme] .page-heading,
body[data-theme] .page-heading-left,
body[data-theme] .page-heading-sm,
body[data-theme] .post-title,
body[data-theme] .post-detail-title,
body[data-theme] .post-place-heading,
body[data-theme] .section-heading,
body[data-theme] .section-heading-sm,
body[data-theme] .nav-logo,
body[data-theme] .admin-stat-value,
body[data-theme] .content-section h2,
body[data-theme] .content-section h3 {
    font-family: var(--font);
    color: var(--heading);
}

body[data-theme] .post-place-heading a,
body[data-theme] .post-place-heading a:link,
body[data-theme] .post-place-heading a:visited,
body[data-theme] .post-place-heading a:hover,
body[data-theme] .post-place-heading a:active {
    color: var(--heading);
    font-family: inherit;
    font-size: 1em;
    font-weight: inherit;
}

body[data-theme] .nav-logo:hover,
body[data-theme] .nav-links a:hover,
body[data-theme] .nav-links a.nav-active,
body[data-theme] .footer-links a:hover,
body[data-theme] .admin-table a,
body[data-theme] .admin-pagination a,
body[data-theme] .form-label .required {
    color: var(--accent);
}

body[data-theme] .top-nav,
body[data-theme] footer {
    background: var(--paper);
    border-color: var(--line);
    box-shadow: none;
}

body[data-theme] .top-nav.is-compact {
    background: color-mix(in srgb, var(--paper) 88%, transparent);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

body[data-theme] .to-top {
    background: var(--btn);
    color: var(--on-accent);
    border: 2px solid var(--line);
    border-radius: 50%;
    box-shadow: var(--shadow);
}

body[data-theme] .nav-links a,
body[data-theme] .tagline,
body[data-theme] .tagline-support,
body[data-theme] .post-content,
body[data-theme] .post-date,
body[data-theme] .form-label,
body[data-theme] .form-hint,
body[data-theme] .form-hint-block,
body[data-theme] .footer-copyright,
body[data-theme] .location-heading,
body[data-theme] .pagination-info,
body[data-theme] .admin-stat-label,
body[data-theme] .admin-stat-sub,
body[data-theme] .theme-choice-blurb,
body[data-theme] .profile-field-hint,
body[data-theme] .location-select-wrapper label {
    color: var(--muted);
}

body[data-theme] .footer-links a,
body[data-theme] .post-location {
    color: var(--accent);
}

body[data-theme] .footer-copyright,
body[data-theme] .post-footer,
body[data-theme] .header-divider,
body[data-theme] .form-divider-top,
body[data-theme] .form-checkbox-row {
    border-color: var(--line);
}

body[data-theme] .post-card,
body[data-theme] .card,
body[data-theme] .card-form,
body[data-theme] .card-list,
body[data-theme] .card-empty,
body[data-theme] .content-section,
body[data-theme] .contact-form-card,
body[data-theme] .contact-info-card,
body[data-theme] .admin-stat-card,
body[data-theme] .theme-choice,
body[data-theme] .admin-table-wrap {
    background: var(--paper);
    color: var(--ink);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow);
    border: var(--card-border);
}

body[data-theme] .post-card,
body[data-theme] .post-detail {
    border-left: var(--card-edge);
}

body[data-theme] .post-detail {
    background: var(--paper);
    color: var(--ink);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow);
    border: var(--card-border);
    border-left: var(--card-edge);
}

body[data-theme] .post-detail-header,
body[data-theme] .post-detail-footer,
body[data-theme] .connect-actions {
    border-color: var(--line);
}

body[data-theme] .post-detail-content,
body[data-theme] .post-card-title {
    color: var(--ink);
}

body[data-theme] .post-detail-meta,
body[data-theme] .post-encounter-time,
body[data-theme] .connect-cancel,
body[data-theme] .connect-login-hint,
body[data-theme] .btn-secondary {
    color: var(--muted);
}

body[data-theme] .location-badge,
body[data-theme] .back-link,
body[data-theme] .back-link:link,
body[data-theme] .back-link:visited,
body[data-theme] .auth-link,
body[data-theme] .auth-link:link,
body[data-theme] .auth-link:visited,
body[data-theme] .auth-link-sm,
body[data-theme] .auth-link-sm:link,
body[data-theme] .auth-link-sm:visited,
body[data-theme] .text-link-muted,
body[data-theme] .alert-info a,
body[data-theme] .error {
    color: var(--accent);
}

body[data-theme] .back-link:hover,
body[data-theme] .auth-link:hover,
body[data-theme] .auth-link-sm:hover,
body[data-theme] .text-link-muted:hover {
    color: var(--heading);
}

body[data-theme] .connect-btn,
body[data-theme] .connect-btn:link,
body[data-theme] .connect-btn:visited,
body[data-theme] .btn-green {
    background: var(--btn);
    color: var(--on-accent);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
    box-shadow: none;
}

body[data-theme] .connect-btn:hover,
body[data-theme] .btn-green:hover {
    background: var(--heading);
    color: var(--on-accent);
    border-color: var(--heading);
}

body[data-theme] .connect-form-panel {
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
}

body[data-theme] .connect-form-panel label {
    color: var(--muted);
}

body[data-theme] .connect-form-panel input[type="text"],
body[data-theme] .connect-form-panel textarea {
    background: var(--paper);
    color: var(--ink);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
    font-family: inherit;
}

body[data-theme] .connect-form-panel input[type="text"]:focus,
body[data-theme] .connect-form-panel textarea:focus {
    border-color: var(--accent);
    outline: none;
}

body[data-theme] .post-type-badge {
    background: var(--bg);
    color: var(--ink);
    border: 1px solid var(--line);
}

body[data-theme] .cta-button,
body[data-theme] .btn-primary,
body[data-theme] .listing-apply-btn,
body[data-theme] .profile-btn-save,
body[data-theme] .nav-links a.nav-button {
    background: var(--btn);
    color: var(--on-accent);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
    box-shadow: none;
}

body[data-theme] .cta-button:hover,
body[data-theme] .btn-primary:hover,
body[data-theme] .listing-apply-btn:hover,
body[data-theme] .profile-btn-save:hover,
body[data-theme] .nav-links a.nav-button:hover,
body[data-theme] .posts-pagination a:hover,
body[data-theme] .admin-theme-btn:hover {
    background: var(--heading);
    color: var(--on-accent);
    border-color: var(--heading);
    box-shadow: none;
}

body[data-theme] .nav-links a.nav-button-outline,
body[data-theme] .admin-theme-btn,
body[data-theme] .post-type-chip,
body[data-theme] .post-type-chip:link,
body[data-theme] .post-type-chip:visited,
body[data-theme] .post-type-option,
body[data-theme] .admin-tab,
body[data-theme] .tag {
    background: var(--paper);
    color: var(--ink);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
    box-shadow: none;
}

body[data-theme] .nav-links a.nav-button-outline:hover,
body[data-theme] .post-type-chip.is-active,
body[data-theme] .post-type-chip.is-active:link,
body[data-theme] .post-type-chip.is-active:visited,
body[data-theme] .post-type-chip:hover,
body[data-theme] .post-type-option:has(input:checked),
body[data-theme] .admin-tab.is-active,
body[data-theme] .admin-tab:hover,
body[data-theme] .theme-choice:has(input:checked) {
    background: var(--paper);
    color: var(--accent);
    border-color: var(--accent);
    box-shadow: none;
}

body[data-theme] .form-input,
body[data-theme] .form-textarea,
body[data-theme] .form-select,
body[data-theme] .location-select,
body[data-theme] .readonly-field,
body[data-theme] .profile-field input[type="password"] {
    background: var(--bg);
    color: var(--ink);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
    font-family: inherit;
}

body[data-theme] .form-input:focus,
body[data-theme] .form-textarea:focus,
body[data-theme] .form-select:focus,
body[data-theme] .location-select:focus {
    border-color: var(--accent);
}

body[data-theme] .posts-pagination a {
    background: var(--paper);
    color: var(--accent);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
}

body[data-theme] .posts-pagination span.pagination-disabled {
    background: var(--bg);
    color: var(--muted);
    border-color: var(--line);
}

body[data-theme] .nav-unread-badge {
    background: var(--accent);
    color: var(--on-accent);
    box-shadow: none;
}

body[data-theme] .alert-info {
    background: var(--paper);
    color: var(--ink);
    border: 1px solid var(--line);
}

body[data-theme] .theme-choice-name,
body[data-theme] .admin-table th,
body[data-theme] .admin-table td {
    color: var(--ink);
    border-color: var(--line);
}

body[data-theme] .theme-choice input,
body[data-theme] .form-checkbox,
body[data-theme] .post-type-option input {
    accent-color: var(--accent);
}

body[data-theme] .location-heading,
body[data-theme] .contact-info-heading,
body[data-theme] .conversation-card-title,
body[data-theme] .profile-modal-content h3,
body[data-theme] .inbox-modal-content h3,
body[data-theme] .conversation-modal-content h3 {
    color: var(--heading);
}

body[data-theme] .contact-info-row dt,
body[data-theme] .contact-info-row a,
body[data-theme] .contact-info-row a:link,
body[data-theme] .contact-info-row a:visited,
body[data-theme] .my-post-title,
body[data-theme] .my-post-title:link,
body[data-theme] .my-post-title:visited,
body[data-theme] .my-post-location,
body[data-theme] .conversation-card-meta,
body[data-theme] .conversation-view-link,
body[data-theme] .conversation-view-link:link,
body[data-theme] .conversation-view-link:visited,
body[data-theme] .conversation-back,
body[data-theme] .conversation-back:link,
body[data-theme] .conversation-back:visited,
body[data-theme] .conversation-header-link,
body[data-theme] .conversation-header-link:link,
body[data-theme] .conversation-header-link:visited,
body[data-theme] .btn-view,
body[data-theme] .admin-role-pill {
    color: var(--accent);
}

body[data-theme] .my-post-title:hover,
body[data-theme] .conversation-view-link:hover,
body[data-theme] .conversation-back:hover,
body[data-theme] .conversation-header-link:hover,
body[data-theme] .conversation-delete-btn:hover,
body[data-theme] .conversation-block-btn:hover,
body[data-theme] .profile-btn-delete:hover,
body[data-theme] .admin-action-btn:hover {
    color: var(--heading);
    border-color: var(--heading);
}

body[data-theme] .contact-info-blurb,
body[data-theme] .contact-info-row dd,
body[data-theme] .contact-info-note,
body[data-theme] .content-section p,
body[data-theme] .content-section li,
body[data-theme] .my-post-excerpt,
body[data-theme] .conversation-card-preview,
body[data-theme] .conversation-header p,
body[data-theme] .profile-modal-content p,
body[data-theme] .inbox-modal-content p,
body[data-theme] .conversation-modal-content p {
    color: var(--ink);
}

body[data-theme] .my-post-date,
body[data-theme] .conversation-card-time,
body[data-theme] .conversation-card-count,
body[data-theme] .reply-cancel,
body[data-theme] .admin-muted,
body[data-theme] .admin-pagination {
    color: var(--muted);
}

body[data-theme] .contact-info-row,
body[data-theme] .my-post-item,
body[data-theme] .conversation-card-footer {
    border-color: var(--line);
}

body[data-theme] .conversation-card,
body[data-theme] .thread-wrap,
body[data-theme] .reply-panel,
body[data-theme] .reply-blocked-panel,
body[data-theme] .profile-modal-content,
body[data-theme] .inbox-modal-content,
body[data-theme] .conversation-modal-content {
    background: var(--paper);
    color: var(--ink);
    border-color: var(--line);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow);
}

body[data-theme] .conversation-card:hover,
body[data-theme] .conversation-card.unread {
    border-left-color: var(--accent);
}

body[data-theme] .conversation-card.unread {
    background: color-mix(in srgb, var(--accent) 8%, var(--paper));
}

body[data-theme] .conversation-unread-badge {
    background: var(--accent);
    color: var(--on-accent);
}

body[data-theme] .thread-message.theirs .thread-bubble {
    background: var(--bg);
    color: var(--ink);
}

body[data-theme] .thread-message.mine .thread-bubble,
body[data-theme] .reply-submit,
body[data-theme] .btn-edit {
    background: var(--btn);
    color: var(--on-accent);
    border-color: var(--line);
}

body[data-theme] .reply-submit,
body[data-theme] .btn-view,
body[data-theme] .btn-edit,
body[data-theme] .inbox-btn-cancel,
body[data-theme] .conversation-btn-cancel,
body[data-theme] .profile-btn-cancel,
body[data-theme] .admin-action-btn {
    border-radius: var(--radius-control);
}

body[data-theme] .btn-view,
body[data-theme] .admin-action-btn,
body[data-theme] .inbox-btn-cancel,
body[data-theme] .conversation-btn-cancel,
body[data-theme] .profile-btn-cancel {
    background: var(--paper);
    border-color: var(--line);
}

body[data-theme] .reply-panel label {
    color: var(--muted);
}

body[data-theme] .reply-panel textarea,
body[data-theme] .city-autocomplete-list {
    background: var(--paper);
    color: var(--ink);
    border: 2px solid var(--line);
    border-radius: var(--radius-control);
}

body[data-theme] .reply-panel textarea:focus {
    border-color: var(--accent);
    outline: none;
}

body[data-theme] .city-autocomplete-item {
    color: var(--ink);
}

body[data-theme] .city-autocomplete-item:hover,
body[data-theme] .city-autocomplete-item.is-active {
    background: var(--bg);
    color: var(--accent);
}

body[data-theme] .admin-table th {
    background: var(--bg);
    color: var(--accent);
}

body[data-theme] .admin-role-pill {
    border-color: var(--accent);
}

body[data-theme="newsprint"] .footer-links a,
body[data-theme="newsprint"] .post-title a,
body[data-theme="newsprint"] .post-place-heading a,
body[data-theme="newsprint"] h1 {
    text-decoration-thickness: 1px;
}

body[data-theme="newsprint"] .nav-links a,
body[data-theme="brutalist"] .nav-links a,
body[data-theme="neon"] .nav-links a {
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 0.78rem;
}

body[data-theme="neon"] h1,
body[data-theme="neon"] .page-title {
    text-shadow: 0 0 18px rgba(93, 255, 240, 0.45);
}

body[data-theme="midnight"] .alert-error,
body[data-theme="neon"] .alert-error {
    background: #3a1c24;
    color: #ffd0d8;
    border-left-color: #e7a0ab;
}

body[data-theme="midnight"] .alert-success,
body[data-theme="midnight"] .alert-success-muted,
body[data-theme="neon"] .alert-success,
body[data-theme="neon"] .alert-success-muted {
    background: #163028;
    color: #c9f3df;
    border-left-color: #7dcea0;
}