/*!
Theme Name: _wt
Theme URI: https://wind.press/go/_wt/
Author: WindPress
Description: A custom theme based on _wt
Version: 0.0.61
Requires at least: 6.8
Requires PHP: 7.4
License: GPLv3
Text Domain: _wt
*/

/* =========================================================
   UNVARNISHED MVP TOKENS + BASE
   ========================================================= */

:root{
  --accent:rgb(74, 79, 88);
  --accent_light:#8da2b3;
  --bg:#fbfaf8;
  --surface:#ffffff;
  --text:rgb(37, 53, 86);
  --muted:#6b7280;
  --border:#e6e3df;
  --radius:14px;
  --pad-x:22px;
  --h1:28px;
  --h2:22px;
  --body:17px;
  --meta:14px;
  --measure-mobile:680px;
  --measure-desktop:780px;
  --sidebar-width: 80px;
}

html, body{
  background:var(--bg);
  color:var(--text);
  margin: 0;
  padding: 0;
}

body{
  font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size:var(--body);
  line-height:1.65;
}

h1, h2, h3{
  font-family:"Besley", Georgia, serif;
  letter-spacing:-0.01em;
}

a{
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:2px;
}

a:hover{
  color:var(--text);
}

/* Accessibility */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* =========================================================
   CORE APP LAYOUT (Flexbox: Sidebar | Content)
   ========================================================= */

.site-layout {
    display: flex;
    align-items: flex-start;
    min-height: 100vh;
}

/* Sidebar Column */
.uv-sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
    border-right: 1px solid #e2e8f0;
    height: 100vh;
    position: sticky;
    top: 0;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem 0.5rem;
    z-index: 999; 
    background-color: #ffffff;
    box-sizing: border-box;
    overflow: hidden;
}

/* Main Content Column */
.site-content {
    flex-grow: 1;
    width: 100%;
    min-width: 0;
    padding: 2rem;
}

/* Sidebar Elements */
.uv-avatar-link {
    display: block;
    margin-bottom: 2rem;
    text-decoration: none;
}

.uv-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.125rem;
    transition: transform 0.2s ease;
}

.uv-avatar:hover { transform: scale(1.05); }

.uv-avatar--logged-in {
    background-color: rgb(37, 53, 86);
    color: #fff;
    border: 2px solid rgb(37, 53, 86);
}

.uv-avatar--guest {
    background-color: #f1f5f9;
    color: #64748b;
    border: 1px dashed #cbd5e1;
}

.uv-sidebar__nav {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items: center;
    width: 100%;
}

.uv-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #64748b;
    gap: 0.25rem;
    padding: 0.5rem;
    border-radius: 8px;
    transition: background 0.1s ease, color 0.1s ease;
}

.uv-nav-item:hover {
    background-color: #f8fafc;
    color: #0f172a;
}

.uv-nav-item--inactive {
    opacity: 0.5;
    cursor: not-allowed;
}

.uv-nav-icon svg {
    width: 28px;
    height: 28px;
    stroke-width: 1.5px;
}

.uv-nav-label {
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}


/* =========================================================
   UV HEADER (Top Bar / Fixed)
   ========================================================= */

#masthead{
  position:sticky;
  top:0;
  z-index:900;
  background:rgba(251,250,248,.95);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0.75rem var(--pad-x);
  min-height:56px;
  width: 100%;
}

.uv-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* Logo Styles */
.site-title a {
    font-family:"Besley", Georgia, serif;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.12em;
    text-decoration:none;
    color:var(--text);
    font-size: 1.25rem;
}

/* Header Buttons */
.uv-nav-extras {
    display: flex;
    gap: 12px;
    align-items: center;
}

.button-small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
    transition: all 0.2s ease;
    background: var(--text);
    color: #fff;
    border: 1px solid var(--text);
}

.button-small:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
    transform: translateY(-1px);
}

.button-small.button-outline {
    background: transparent;
    color: var(--muted);
    border: 1px solid var(--border);
}

.button-small.button-outline:hover {
    border-color: var(--text);
    color: var(--text);
    background: transparent;
}

/* =========================================================
   UV THREAD CARDS & SINGLE
   ========================================================= */

/* ─── Feed Cards (Dark / OG Style) ─── */
/* Targets the LIVE template structure:                      */
/*   article.uv-thread-card                                  */
/*     a.uv-thread-card__link                                */
/*       .uv-thread-card__meta  (date · author)              */
/*       h2.uv-thread-card__title                            */
/*       p.uv-thread-card__thesis                            */
/*     a.uv-thread-card__link                                */
/*       .uv-thread-card__metrics-row                        */
/*         .uv-thread-card__metrics                          */
/*           .uv-thread-metric > img + span                  */

.uv-thread-card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(155deg, #0f172a 0%, #1a2436 50%, #0f172a 100%);
    color: #fff;
    margin-bottom: 14px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.uv-thread-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15,23,42,0.22);
}

/* Whole-card link */
article.uv-thread-card a.uv-thread-card__link {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 0;
}

/* First link: main content area */
article.uv-thread-card a.uv-thread-card__link:first-of-type {
    padding: 22px 26px 12px;
}

/* ─── Top meta: date · author ─── */
.uv-thread-card__meta {
    display: flex;
    align-items: baseline;
    gap: 5px;
    font-size: 0.8125rem;
    color: #9CA3AF;
    margin-bottom: 6px;
}

.uv-thread-card__date {
    color: #9CA3AF;
}

.uv-thread-card__sep {
    color: #4B5563;
}

.uv-thread-card__author {
    color: #cbd5e1;
    font-weight: 600;
}

/* ─── Title ─── */
.uv-thread-card__title {
    font-family: "Besley", Georgia, serif;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    color: #F5E6C8;
    margin: 0 0 8px 0;
}

/* ─── Thesis preview ─── */
.uv-thread-card__thesis {
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #cbd5e1;
    margin: 0;
}

/* ─── Metrics row (bottom of card) ─── */
.uv-thread-card__metrics-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 8px 26px 14px;
    gap: 8px;
}

.uv-thread-card__metrics-spacer {
    flex: 1;
}

.uv-thread-card__metrics {
    display: flex;
    align-items: center;
    gap: 14px;
}

.uv-thread-metric {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8125rem;
    color: #9CA3AF;
}

.uv-thread-metric__icon {
    width: 16px;
    height: 16px;
    opacity: 0.6;
    filter: brightness(0) invert(0.7);
}

.uv-thread-metric__count {
    font-size: 0.8125rem;
    color: #9CA3AF;
}

/* ─── Future: inner wrapper for new template ─── */
.uv-thread-card__inner {
    padding: 22px 26px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Quote count badge */
.uv-thread-card__badge {
    align-self: flex-start;
    font-size: 0.75rem;
    font-weight: 800;
    color: #D4AF37;
    letter-spacing: 0.02em;
}

/* ─── Quote block (new template) ─── */
.uv-thread-card__quote-wrap {
    position: relative;
    margin-bottom: 6px;
}

.uv-thread-card__stack {
    position: absolute;
    border-radius: 8px;
}

.uv-thread-card__stack--3 {
    bottom: -12px;
    left: 12px;
    right: -6px;
    height: 100%;
    background: rgba(30,41,59,0.4);
    border: 1px solid rgba(100,130,180,0.08);
}

.uv-thread-card__stack--2 {
    bottom: -5px;
    left: 6px;
    right: -3px;
    height: 100%;
    background: rgba(30,41,59,0.6);
    border: 1px solid rgba(100,130,180,0.12);
}

.uv-thread-card__quote {
    position: relative;
    background: rgba(15,23,42,0.85);
    border: 1px solid rgba(100,130,180,0.25);
    border-left: 3px solid #D4AF37;
    border-radius: 8px;
    padding: 16px 20px;
}

.uv-thread-card__quote-text {
    font-family: "Besley", Georgia, serif;
    font-size: 1.5rem;
    font-style: italic;
    line-height: 1.48;
    color: #E2E8F0;
    margin-bottom: 8px;
}

.uv-thread-card__quote-source {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 0.8125rem;
    flex-wrap: wrap;
}

.uv-thread-card__source-name {
    font-weight: 700;
    color: #fff;
}

.uv-thread-card__source-date {
    color: #9CA3AF;
}

/* ─── Footer (new template) ─── */
.uv-thread-card__footer {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-size: 0.8125rem;
}

.uv-thread-card__author-link {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    position: relative;
    z-index: 2;
}

.uv-thread-card__author-link:hover {
    text-decoration: underline;
}

.uv-thread-card__cta {
    color: #9CA3AF;
}

.uv-thread-card__cta strong {
    color: #D4AF37;
    font-weight: 700;
}

/* Single Thread View */
.uv-thread {
  max-width: var(--measure-desktop);
  margin: 0 auto;
}

.uv-thread__title{
  font-size:var(--h1);
  line-height:1.15;
  margin:0 0 10px;
  font-weight:600;
}


/* =========================================================
   UV QUOTES (Accordion)
   ========================================================= */

/* Grid container for all quote accordions */
.uv-quotes{
  gap: 6px;
}

details.uv-quote{
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  overflow:hidden;
  margin-bottom: 6px;
  padding: 0;
}

.uv-quote__summary{
  list-style:none;
  cursor:pointer;
  padding:8px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight:700;
  font-size:0.9375rem;
  background:var(--surface);
}
.uv-quote__summary::-webkit-details-marker{ display:none; }

.uv-quote__body{
  padding:10px 14px 12px;
  border-top:1px solid var(--border);
  background:var(--surface);
}

/* Desktop/tablet: quote text + context side-by-side */
.uv-quote__body-inner{
  display:flex;
  gap:1rem;
  align-items:flex-start;
}

.uv-quote__text{
  font-family:"Besley", Georgia, serif;
  font-size:1.05rem;
  line-height:1.45;
  margin-bottom: 0.5rem;
  flex:1;
  min-width:0;
}

/* Context sits beside the quote on wider screens */
.uv-quote__context{
  flex:0 0 180px;
  font-size:0.8125rem;
  line-height:1.4;
  color:var(--muted);
  background:#f8f8f6;
  border-radius:6px;
  padding:8px 10px;
  align-self:stretch;
  display:flex;
  align-items:center;
}

.uv-quote__context strong{
  font-weight:600;
  color:var(--text);
}

.uv-quote__source-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.8125rem;
  font-weight:700;
  text-decoration:none;
  color: var(--accent);
  margin-top:2px;
}

/* ── Featured Quote Checkmark (author only) ── */

.uv-quote__feature-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--border);
  cursor: pointer;
  flex-shrink: 0;
  margin-right: 6px;
  border-radius: 50%;
  transition: color 0.15s ease, background 0.15s ease;
}

.uv-quote__feature-btn:hover {
  color: var(--accent);
  background: rgba(63,85,104,0.08);
}

.uv-quote__feature-btn .uv-check-path {
  opacity: 0;
  transition: opacity 0.15s ease;
}

.uv-quote__feature-btn.is-active {
  color: #16a34a;
}

.uv-quote__feature-btn.is-active .uv-check-path {
  opacity: 1;
}


/* =========================================================
   PAGE SPECIFIC: SUBMIT THREAD (ID 29)
   ========================================================= */

body.page-id-29 .site-content {
    background: var(--bg);
    max-width: 900px;
    margin: 0 auto;
}

body.page-id-29 form.frontend-form {
    background: var(--surface);
    padding: 2rem;
    border-radius: 14px;
    border: 1px solid var(--border);
}

body.page-id-29 input, 
body.page-id-29 textarea,
body.page-id-29 select {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 1rem;
}

body.page-id-29 button.button-primary {
    background: var(--accent);
    color: white;
    padding: 14px 24px;
    border-radius: 8px;
    border: none;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
}


/* =========================================================
   PAGE SPECIFIC: ACCOUNT (ID 31)
   ========================================================= */

body.page-id-31 .uv-account {
  max-width: 680px;
  margin: 2rem auto;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  overflow: hidden;
}

body.page-id-31 .uv-account__header {
  padding: 2rem;
  border-bottom: 1px solid var(--border);
  background: #fcfcfc;
}

body.page-id-31 .uv-account__title {
  font-family: "Besley", serif;
  font-size: 2rem;
  margin: 0 0 0.5rem;
}

body.page-id-31 .uv-account__panelActions {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

body.page-id-31 .uv-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
}

body.page-id-31 .uv-btn--primary {
    background: var(--text);
    color: white;
}

body.page-id-31 .uv-btn--secondary {
    background: white;
    border: 1px solid var(--border);
    color: var(--text);
}

/* Dashboard Lists on Account Page */
.uv-dashboard-section {
    padding: 1.5rem 2rem;
    border-top: 1px solid var(--border);
}

.uv-dashboard-section h2 {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
}

/* =========================================================
   SIDEBAR ICON FIXES / BRAND COLOR
   ========================================================= */

.uv-nav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: var(--text);
    opacity: 0.85;
}

.uv-nav-icon svg,
.uv-nav-icon path {
    width: 100%;
    height: 100%;
    display: block;
    fill: currentColor;
}

.uv-nav-item:hover .uv-nav-icon {
    color: var(--accent);
    opacity: 1;
}

.uv-nav-item--inactive .uv-nav-icon {
    color: var(--muted);
    opacity: 0.5;
}

/* Serif Font for Avatar Initials */
.uv-avatar__initials.serif-font {
    font-family: "Besley", Georgia, serif;
    font-weight: 700;
}

/* ─── ACF Front-End Form Overrides ─── */

/* Form container */
.acf-form {
    max-width: 720px;
    margin: 0 auto;
}

/* Field wrappers — remove ACF's admin-style borders */
.acf-fields > .acf-field {
    border-top: none;
    padding: 1rem 0;
}

/* Labels — match your editorial typography */
.acf-label label {
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    letter-spacing: 0.01em;
}

/* Required asterisk */
.acf-required {
    color: #dc2626;
}

/* Text inputs + textareas */
.acf-form .acf-input input[type="text"],
.acf-form .acf-input input[type="url"],
.acf-form .acf-input input[type="email"],
.acf-form .acf-input input[type="number"],
.acf-form .acf-input textarea,
.acf-form .acf-input select {
    font-family: 'Inter', sans-serif;
    font-size: 0.9375rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 0.625rem 0.75rem;
    background: #fff;
    color: #0f172a;
    width: 100%;
    transition: border-color 0.15s ease;
}

.acf-form .acf-input input:focus,
.acf-form .acf-input textarea:focus,
.acf-form .acf-input select:focus {
    border-color: #1e293b;
    outline: none;
    box-shadow: 0 0 0 2px rgba(30, 41, 59, 0.1);
}

/* Thesis textarea — taller default */
.acf-form .acf-input textarea {
    min-height: 140px;
    resize: vertical;
}

/* Post title field (ACF renders this outside field groups) */
.acf-form .acf-post-title input {
    font-family: 'Besley', serif;
    font-size: 1.5rem;
    font-weight: 600;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 0.75rem;
}

/* ─── Repeater (Quote Section) ─── */

/* Repeater table — clean up admin borders */
.acf-repeater .acf-table {
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
}

.acf-repeater .acf-table thead th {
    background: #f8fafc;
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    padding: 0.5rem 0.75rem;
}

.acf-repeater .acf-row td {
    border-top: 1px solid #e2e8f0;
    padding: 0.75rem;
    vertical-align: top;
}

/* Row handle (drag) — subtle */
.acf-repeater .acf-row-handle {
    background: #f8fafc;
    width: 24px;
}

/* Add Row button */
.acf-repeater .acf-actions .acf-button {
    font-family: 'Inter', sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    color: #1e293b;
    padding: 0.5rem 1rem;
    cursor: pointer;
}

.acf-repeater .acf-actions .acf-button:hover {
    background: #e2e8f0;
}

/* Remove row button */
.acf-repeater .acf-row-handle .acf-icon.-minus {
    background: #fee2e2;
    color: #dc2626;
}

/* ─── Submit Button ─── */

.acf-form-submit input[type="submit"] {
    font-family: 'Inter', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    background: var(--text);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    transition: background 0.15s ease;
}

.acf-form-submit input[type="submit"]:hover {
    background: var(--accent);
}

/* ─── Submit/Edit Thread page: let content area breathe ─── */
body.page-template-page-submit-thread .site-content {
    max-width: 100%;
    padding-left: 2rem;
    padding-right: 2rem;
}

/* The form wrap itself controls the readable width */
.uv-submit__form-wrap {
    max-width: 720px;
    margin: 2rem auto;
}

/* Let the repeater table go full-width within that 720px */
.uv-submit__form-wrap .acf-repeater .acf-table {
    width: 100%;
    table-layout: fixed;
}

/* Give quote text + context textareas more room in the repeater */
.uv-submit__form-wrap .acf-repeater .acf-table td.acf-field {
    min-width: 0;
}


/* ─── Submit/Edit Thread page layout ─── */

/* .site-content goes full-width with the light grey background */
body.page-id-29 .site-content {
    max-width: 100%;
    margin: 0 auto;
    background-color: white;
    min-height: 100vh;
    padding: 2rem;
}

/* The form itself is the centered white card */
body.page-id-29 .uv-submit__form-wrap {
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 8px;
    padding: 2.5rem;
}

/* ─── Editorial Pages (Privacy, About, Feedback) ─── */

.uv-editorial {
    padding: 2rem 0;
}

.uv-editorial__article {
    max-width: 1000px;
    margin: 0 auto;
}

.uv-editorial__header {
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border, #e2e8f0);
}

.uv-editorial__title {
    font-family: 'Besley', serif;
    font-size: 2rem;
    font-weight: 600;
    color: var(--text, #0f172a);
}

/* Prose styling for block editor output */
.uv-editorial__content {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.75;
    color: var(--text, #1e293b);
}

.uv-editorial__content h2 {
    font-family: 'Besley', serif;
    font-size: 1.5rem;
    font-weight: 600;
    margin-top: 2.5rem;
    margin-bottom: 0.75rem;
}

.uv-editorial__content h3 {
    font-family: 'Inter', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    margin-top: 2rem;
    margin-bottom: 0.5rem;
}

.uv-editorial__content p {
    margin-bottom: 1.25rem;
}

.uv-editorial__content ul,
.uv-editorial__content ol {
    margin-bottom: 1.25rem;
    padding-left: 1.5rem;
}

.uv-editorial__content li {
    margin-bottom: 0.5rem;
}

.uv-editorial__content a {
    color: var(--accent, #3f5568);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.uv-editorial__content a:hover {
    color: var(--text, #0f172a);
}

.uv-editorial__content blockquote {
    border-left: 3px solid var(--border, #e2e8f0);
    padding-left: 1rem;
    margin: 1.5rem 0;
    color: var(--muted, #64748b);
    font-style: italic;
}

/* ─── Search + Sort Bar ─── */
.uv-feed-search {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;              /* 12px */
  margin-bottom: 1.5rem;     /* 24px */
  padding: 0 1rem;           /* match card gutters */
}

/* Search input — takes up available space on the left */
.uv-feed-search > div:first-child {
  flex: 1 1 200px;
  min-width: 0;
}

/* Sort dropdown wrapper — pushes right */
.uv-feed-search > div:last-of-type {
  flex: 0 0 auto;
  margin-left: auto;
}

/* Input styling to match thread cards */
.uv-feed-search input[type="search"] {
  width: 100%;
  border: 1px solid #e2e8f0;        /* slate-200 */
  border-radius: 0.375rem;          /* rounded-md */
  padding: 0.625rem 0.75rem;        /* py-2.5 px-3 */
  font-size: 0.875rem;              /* text-sm */
  color: #0f172a;                    /* slate-900 */
  background: #fff;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.uv-feed-search input[type="search"]::placeholder {
  color: #94a3b8;                    /* slate-400 */
}

.uv-feed-search input[type="search"]:focus {
  border-color: #cbd5e1;            /* slate-300 */
  box-shadow: 0 0 0 4px rgba(15, 23, 42, 0.06);  /* ring-slate-900/6 */
}

/* Sort label + select row */
.uv-feed-search .flex {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.uv-feed-search label[for="uv-sort"] {
  font-size: 0.75rem;               /* text-xs */
  color: #64748b;                    /* slate-500 */
  white-space: nowrap;
}

.uv-feed-search select {
  border: 1px solid #e2e8f0;
  border-radius: 0.375rem;
  padding: 0.625rem 0.75rem;
  font-size: 0.75rem;               /* text-xs to keep compact */
  color: #0f172a;
  background: #fff;
  outline: none;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.uv-feed-search select:focus {
  border-color: #cbd5e1;
  box-shadow: 0 0 0 4px rgba(15, 23, 42, 0.06);
}

/* ─── Mobile: stack full-width ─── */
@media (max-width: 479px) {
  .uv-feed-search {
    flex-direction: column;
    align-items: stretch;
  }

  .uv-feed-search > div:last-of-type {
    margin-left: 0;
    align-self: flex-end;
  }
}


.uv-feed-search__btn {
  border: 1px solid #e2e8f0;        /* slate-200 */
  border-radius: 0.375rem;
  padding: 0.625rem 1.25rem;        /* py-2.5 px-5 */
  font-size: 0.875rem;              /* text-sm */
  font-weight: 500;
  color: #fff;
  background: #0f172a;              /* slate-900 */
  cursor: pointer;
  transition: background 0.15s;
}

.uv-feed-search__btn:hover {
  background: #1e293b;              /* slate-800 */
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
#uv-search:focus {
  outline: none;
  border-color: #fbbf24;                          /* amber-400 */
  box-shadow: 0 0 0 4px rgba(251, 191, 36, 0.25); /* pale amber glow */
}


.uv-nav-desktop {
    display: flex;
    align-items: center;
    gap: 12px;
}

.uv-nav-desktop .uv-context-links {
    display: flex;
    gap: 12px;
    align-items: center;
}

.uv-nav-desktop .uv-context-links a {
    font-size: 0.85rem;
    color: var(--muted);
    text-decoration: none;
    font-weight: 500;
}

.uv-nav-desktop .uv-context-links a:hover {
    color: var(--text);
}




/* Hide hamburger and mobile menu on desktop */
.uv-hamburger {
    display: none;
}

.uv-mobile-menu {
    display: none;
}

.uv-mobile-overlay {
    display: none;
}

@media (max-width: 768px) {
    .uv-mobile-menu {
        display: block;
    }
}


/* =========================================================
   MOBILE RESPONSIVE (max-width: 768px)
   ========================================================= */

@media (max-width: 768px) {
    
       .uv-hamburger {
        margin-right: 0.75rem;
    }

    /* --- Layout: Sidebar becomes bottom nav --- */
    .site-layout {
        flex-direction: column;
    }

    .uv-sidebar {
        width: 100%;
        height: auto;
        position: fixed;
        bottom: 0;
        top: auto;
        left: 0;
        right: 0;
        flex-direction: row;
        align-items: center;
        justify-content: space-around;
        padding: 0.5rem 0;
        border-right: none;
        border-top: 1px solid var(--border);
        z-index: 9999;
        box-shadow: 0 -2px 8px rgba(0,0,0,0.05);
    }

    /* Hide avatar on mobile bottom bar */
    .uv-sidebar__profile {
        display: none;
    }

    /* Nav items go horizontal */
    .uv-sidebar__nav {
        flex-direction: row;
        gap: 0;
        width: 100%;
        justify-content: space-around;
    }

    .uv-nav-item {
        padding: 0.25rem 0;
        gap: 0.15rem;
    }

    .uv-nav-item .text-xs,
    .uv-nav-item .uv-nav-label {
        font-size: 0.6rem;
    }

    /* Hide bottom links (Feedback, Terms) from mobile bar */
    .uv-sidebar__footer {
        display: none;
    }

    /* Add bottom padding to content so it doesn't hide behind nav */
    .site-content {
        padding-bottom: 5rem;
    }

    /* --- Header: simplify top bar --- */
    .uv-header-inner {
        flex-wrap: wrap;
        padding: 0.5rem 0.75rem;
        gap: 0.5rem;
    }

    /* Hide left spacer on mobile */
    .header-left {
        display: none;
    }

    /* Logo takes full width, centered */
    .site-branding {
        flex: 1 0 100%;
        text-align: center;
        order: -1;
    }

    .site-title a {
        font-size: 1.1rem;
    }

    /* Right actions wrap below logo */
    .uv-nav-extras {
        flex: 1 0 100%;
        justify-content: center;
        gap: 8px;
        flex-wrap: wrap;
    }

    /* Hide Privacy/About links on mobile header */
    .uv-context-links {
        display: none;
    }

    /* Smaller buttons on mobile */
    .button-small {
        padding: 6px 12px;
        font-size: 0.8rem;
    }

    /* --- Feed cards --- */
    .uv-thread-card {
        border-radius: 10px;
        margin-bottom: 10px;
    }

    /* Old template: tighten first link padding */
    article.uv-thread-card a.uv-thread-card__link:first-of-type {
        padding: 16px 16px 10px;
    }

    .uv-thread-card__title {
        font-size: 1.075rem;
    }

    .uv-thread-card__metrics-row {
        padding: 6px 16px 12px;
    }

    .uv-thread-card__metrics {
        gap: 10px;
    }

    /* New template fallbacks */
    .uv-thread-card__inner {
        padding: 16px 16px 14px;
        gap: 10px;
    }

    .uv-thread-card__badge {
        font-size: 0.6875rem;
    }

    .uv-thread-card__quote {
        padding: 12px 14px;
    }

    .uv-thread-card__quote-text {
        font-size: 0.9375rem;
    }

    .uv-thread-card__quote-wrap {
        margin-bottom: 4px;
    }

    .uv-thread-card__stack--3 {
        bottom: -4px;
        left: 8px;
        right: -4px;
    }

    .uv-thread-card__stack--2 {
        bottom: -2px;
        left: 4px;
        right: -2px;
    }

    .uv-thread-card__footer {
        font-size: 0.75rem;
    }

    .site-content {
        padding: 1rem;
        padding-bottom: 5rem;
    }

    /* --- Single thread --- */
    .uv-thread {
        max-width: 100%;
    }

    .uv-thread__title {
        font-size: 1.4rem;
    }

    /* --- Quotes --- */
    details.uv-quote {
        border-radius: 8px;
        margin-bottom: 5px;
    }

    .uv-quote__summary {
        padding: 7px 10px;
        font-size: 0.875rem;
    }

    .uv-quote__body {
        padding: 8px 12px 10px;
    }

    /* Stack context below quote on mobile */
    .uv-quote__body-inner {
        flex-direction: column;
        gap: 0.5rem;
    }

    .uv-quote__context {
        flex: none;
        width: 100%;
    }

    .uv-quote__text {
        font-size: 0.95rem;
    }

    /* --- Submit thread form --- */
    body.page-id-29 .uv-submit__form-wrap {
        padding: 1.25rem;
    }

    /* --- Account page --- */
    body.page-id-31 .uv-account {
        margin: 1rem;
        border-radius: 12px;
    }

    body.page-id-31 .uv-account__title {
        font-size: 1.5rem;
    }

    /* --- Feedback page --- */
    .uv-feedback {
        padding: 1rem;
    }
    
        /* Force hide context links (overrides inline styles) */
    .uv-context-links {
        display: none !important;
    }

    /* Header: single row — logo left, buttons right */
    .uv-header-inner {
        flex-wrap: nowrap !important;
        justify-content: space-between;
        padding: 0.4rem 0.75rem;
    }

    .header-left {
        display: none !important;
    }

    .site-branding {
        flex: 0 0 auto !important;
        text-align: left;
        order: 0;
    }

    .uv-nav-extras {
        flex: 0 0 auto !important;
        gap: 6px;
        flex-wrap: nowrap !important;
    }

    /* Hide "Submit Thread" button on mobile header — it's accessible from account page */
    .uv-nav-extras .button-small:first-of-type {
        display: none;
    }

    /* Just show Logout */
    .button-small {
        padding: 5px 10px;
        font-size: 0.75rem;
    }

        /* Prevent any horizontal overflow */
    #page,
    .site-layout,
    .site-content,
    .site-content-wrapper {
        max-width: 100vw;
        overflow-x: hidden;
    }

    .site-content {
        padding: 1rem 0.75rem;
        padding-bottom: 5rem;
        box-sizing: border-box;
    }

    /* Submit thread form */
    body.page-id-29 .site-content {
        padding: 0.75rem;
        padding-bottom: 5rem;
    }

    body.page-id-29 .uv-submit__form-wrap {
        padding: 1rem;
        border-radius: 10px;
        margin: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* ACF form inputs don't overflow */
    .acf-form,
    .acf-fields,
    .acf-input input,
    .acf-input textarea {
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Shorten Logout text or just fit it */
    .button-small {
        white-space: nowrap;
        padding: 5px 10px;
        font-size: 0.75rem;
    }

        /* --- Hamburger button --- */
    .uv-hamburger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        width: 36px;
        height: 36px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 6px;
        z-index: 10001;
    }

    .uv-hamburger span {
        display: block;
        width: 22px;
        height: 2px;
        background: var(--text);
        border-radius: 2px;
        transition: transform 0.25s ease, opacity 0.2s ease;
    }

    .uv-hamburger.is-open span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .uv-hamburger.is-open span:nth-child(2) {
        opacity: 0;
    }

    .uv-hamburger.is-open span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* Hide desktop nav on mobile */
    .uv-nav-desktop {
        display: none !important;
    }

    /* --- Slide-in menu --- */
    .uv-mobile-menu {
        position: fixed;
        top: 0;
        right: -280px;
        width: 280px;
        height: 100vh;
        background: #fff;
        z-index: 10000;
        transition: right 0.3s ease;
        padding: 5rem 1.5rem 2rem;
        box-shadow: -4px 0 16px rgba(0,0,0,0.1);
    }

    .uv-mobile-menu.is-open {
        right: 0;
    }

    .uv-mobile-menu__nav {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .uv-mobile-menu__nav a {
        display: block;
        padding: 0.875rem 0;
        font-size: 1rem;
        font-weight: 500;
        color: var(--text);
        text-decoration: none;
        border-bottom: 1px solid var(--border);
    }

    .uv-mobile-menu__nav a:last-child {
        border-bottom: none;
    }

    .uv-mobile-menu__nav a:hover {
        color: var(--accent);
    }

    /* --- Overlay --- */
    .uv-mobile-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.3);
        z-index: 9999;
    }

    .uv-mobile-overlay.is-open {
        display: block;
    }

    
        /* --- Feed: tighten search + sort --- */
    .uv-archive__title {
        font-size: 1.5rem;
        margin-bottom: 0.75rem;
    }

    .uv-feed-search {
        gap: 0.5rem;
        padding: 0;
        margin-bottom: 1rem;
    }

    /* Put search input and sort on same row */
    .uv-feed-search > div:first-child {
        flex: 1 1 auto;
    }

    .uv-feed-search > div:last-of-type {
        margin-left: 0;
    }

    /* Compact the sort dropdown */
    .uv-feed-search select {
        padding: 0.5rem;
        font-size: 0.7rem;
    }

    .uv-feed-search label[for="uv-sort"] {
        font-size: 0.7rem;
    }

    /* Smaller search button */
    .uv-feed-search__btn {
        padding: 0.5rem 1rem;
        font-size: 0.8rem;
    }

    /* Search input */
    .uv-feed-search input[type="search"] {
        padding: 0.5rem 0.625rem;
        font-size: 0.8rem;
    }

    
    
    
    
    
    
    
    
    
    
    
    
    
    
}

/* =========================================================
   SMALL MOBILE (max-width: 380px)
   ========================================================= */

@media (max-width: 380px) {

    .uv-nav-icon {
        width: 22px;
        height: 22px;
    }

    .uv-nav-icon svg {
        width: 22px;
        height: 22px;
    }

    .button-small {
        padding: 5px 10px;
        font-size: 0.75rem;
    }

    .site-title a {
        font-size: 1rem;
    }
}


/* Cap the content wrapper for wide screens */
.site-content-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background-color: #ffffff;
 
}
.site-content {
    display: flex;
    align-items: flex-start;
    min-height: 100vh;
    max-width: 1000px;
    margin: 0 auto;
}


body.page-id-29 .site-main {
  max-width: 900px;
  margin: 0 auto;
}
.uv-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* =================================================================
   UNVARNISHED — User Profile, Bio & Search CSS
   Add to your main stylesheet
   ================================================================= */


/* ─── PUBLIC PROFILE (/user/username) ─── */

.uv-profile {
    max-width: 640px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.uv-profile__header {
    text-align: center;
    padding-bottom: 2rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid #e2e8f0; /* slate-200 */
}

.uv-profile__avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background-color: #0f172a; /* slate-900 */
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}

.uv-profile__initials {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.05em;
}

.uv-profile__name {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.125rem;
}

.uv-profile__handle {
    font-size: 0.875rem;
    color: #64748b; /* slate-500 */
    margin: 0 0 0.75rem;
}

.uv-profile__bio {
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #334155; /* slate-700 */
    margin: 0 0 0.75rem;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

.uv-profile__meta {
    font-size: 0.8125rem;
    color: #94a3b8; /* slate-400 */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.uv-profile__meta-separator {
    color: #cbd5e1;
}

.uv-profile__edit-link {
    display: inline-block;
    margin-top: 1rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #0f172a;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.uv-profile__edit-link:hover {
    color: #334155;
}

.uv-profile__section-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 1rem;
}

.uv-profile__empty {
    color: #94a3b8;
    font-size: 0.875rem;
    text-align: center;
    padding: 2rem 0;
}


/* ─── ACCOUNT PAGE — BIO SECTION ─── */

.uv-account-bio {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e2e8f0;
}

.uv-account-bio__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.uv-account-bio__view-profile {
    font-size: 0.8125rem;
    color: #64748b;
    text-decoration: none;
}
.uv-account-bio__view-profile:hover {
    color: #0f172a;
    text-decoration: underline;
}

.uv-account-bio__textarea {
    width: 100%;
    padding: 0.75rem;
    font-family: inherit;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #0f172a;
    background: #fff;
    border: 1px solid #cbd5e1; /* slate-300 */
    border-radius: 8px;
    resize: vertical;
    min-height: 80px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.uv-account-bio__textarea:focus {
    outline: none;
    border-color: #fbbf24;
    box-shadow: 0 0 0 4px rgba(251, 191, 36, 0.25);
}
.uv-account-bio__textarea::placeholder {
    color: #94a3b8;
}

.uv-account-bio__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
}

.uv-account-bio__charcount {
    font-size: 0.75rem;
    color: #94a3b8;
}
.uv-account-bio__charcount--warn {
    color: #f59e0b; /* amber-500 */
    font-weight: 600;
}

.uv-account-bio__save {
    padding: 0.5rem 1.25rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #fff;
    background-color: #0f172a;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s;
}
.uv-account-bio__save:hover {
    background-color: #1e293b;
}
.uv-account-bio__save:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.uv-account-bio__status {
    font-size: 0.8125rem;
    margin-top: 0.5rem;
    min-height: 1.25rem;
}
.uv-account-bio__status--success {
    color: #16a34a; /* green-600 */
}
.uv-account-bio__status--error {
    color: #dc2626; /* red-600 */
}


/* ─── SEARCH RESULTS — USER CARDS ─── */

.uv-search-users {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    padding: 0 1rem;
}

.uv-user-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: #f8fafc; /* slate-50 */
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.uv-user-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.uv-user-card__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #0f172a;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.uv-user-card__initials {
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.05em;
}

.uv-user-card__info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.uv-user-card__name {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.3;
}

.uv-user-card__handle {
    font-size: 0.75rem;
    color: #94a3b8;
}

.uv-user-card__bio {
    font-size: 0.8125rem;
    color: #64748b;
    margin-top: 0.125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uv-user-card__threads {
    font-size: 0.75rem;
    color: #94a3b8;
    white-space: nowrap;
    flex-shrink: 0;
}
.uv-account-bio {
    max-width: 640px;
}




/* ─── RESPONSIVE ─── */

@media (max-width: 480px) {
    .uv-profile {
        padding: 1.5rem 1rem;
    }
    .uv-profile__avatar {
        width: 56px;
        height: 56px;
    }
    .uv-profile__initials {
        font-size: 1.25rem;
    }
    .uv-profile__name {
        font-size: 1.25rem;
    }
    .uv-user-card__bio {
        display: none;
    }
    .uv-account-bio__header {
        flex-direction: column;
        gap: 0.25rem;
    }
}
/* ============================================
   Thread Card Fixes — March 10, 2026
   1. Author name float-left, quote count float-right
   2. Quote block gets more vertical breathing room
   ============================================ */

/* --- Fix 1: Separate author + quote count --- */
/* The footer row containing "Josh G · Mar 3, 2026" and "Supported by X quotes" */
.uv-thread-cardmeta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    width: 100%;
    padding-top: 0.75rem;
}

/* Author name — hard left */
.uv-thread-cardauthor {
    float: none;          /* clear any existing float */
    text-align: left;
    flex-shrink: 0;
}

/* Quote count / "Read them all" — hard right */
.uv-thread-cardquotecount {
    float: none;
    text-align: right;
    flex-shrink: 0;
}

.uv-thread-card__footer {
    justify-content: flex-start;
}
.uv-thread-card__footer > :last-child {
    margin-left: auto;
}
.uv-thread-card a {
    text-decoration: none!important;
}


/* Account dashboard page – make card h3 navy */
.uv-account_dashboard .uv-thread-card__title {
  color: #0b1935!mportant; /* dark navy */
}

/* Submit button: no fixed height */
.acf-form-submit input[type="submit"] {
  height: auto!important;      /* or just no height property */
}
.uv-submit-buttons .uv-btn--secondary {
  height: 63px!important;
 
  line-height: 63px;
  flex-shrink: 0;      /* do not shrink below 63px */
}


/* Mobile spacing for Account card */
@media (max-width: 768px) {
  /* Outer section */
  section.uv-account {
    padding: 16px;               /* space from screen edge */
  }

  /* The blue card itself */
  section.uv-account .uv-when-logged-out,
  section.uv-account .uv-when-logged-in {
    padding: 20px 16px 24px;     /* top / sides / bottom inside card */
  }

  /* The Create / Log In buttons row */
  section.uv-account .uv-account__actions {
    margin-top: 20px;
    margin-bottom: 12px;
    gap: 8px;                    /* if you’re using display:grid or flex */
  }

  /* Individual buttons */
  section.uv-account .uv-btn,
  section.uv-account .uv-btn--primary,
  section.uv-account .uv-btn--secondary {
    padding: 14px 20px;
    min-height: 48px;
    font-size: 16px;
  }

  /* “Forgot your password?” link spacing */
  section.uv-account .uv-account__footer,
  section.uv-account a[href*="lostpassword"],
  section.uv-account a[href*="resetpassword"] {
    display: block;
    margin-top: 12px;
  }
}