/*
Theme Name: AI Tools Opinions
Theme URI: https://aitoolsopinions.com/
Author: Bhalchandra
Description: Standalone dark "verdict terminal" theme for AI Tools Opinions — reviews, categories, and community, built to match the homepage design exactly.
Version: 1.0.0
Text Domain: aitoolsopinions
*/

:root{
  --bg: #0A0D12;
  --bg-elevated: #0F131B;
  --surface: #141924;
  --surface-hover: #1A2130;
  --border: #232B3D;
  --border-bright: #2E3A52;
  --text: #E7EBF3;
  --text-muted: #8A93A8;
  --text-faint: #5C6478;
  --lime: #C6FF3D;
  --lime-dim: #8FBE2C;
  --violet: #9D7BFF;
  --coral: #FF6B6B;
  --amber: #FFB84D;
  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  overflow-x:hidden;
  max-width:100vw;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(circle at 15% 0%, rgba(198,255,61,0.06), transparent 40%),
    radial-gradient(circle at 85% 15%, rgba(157,123,255,0.07), transparent 45%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;}
::selection{background:var(--lime);color:#0A0D12;}
:focus-visible{outline:2px solid var(--lime);outline-offset:2px;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;letter-spacing:-0.01em;color:var(--text);line-height:1.2;}
img{max-width:100%;height:auto;border-radius:10px;display:block;}
button,input,textarea{font-family:inherit;}
.ato-wrap{max-width:1180px;margin:0 auto;padding:0 24px;}

/* ---------- HEADER ---------- */
.ato-site-header{
  position:sticky;top:0;z-index:500;
  background:rgba(10,13,18,0.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.ato-header-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:24px;max-width:1180px;margin:0 auto;}
.ato-logo{display:flex;align-items:center;gap:2px;font-family:var(--font-mono);font-weight:600;font-size:18px;color:var(--text);}
.ato-logo .prompt{color:var(--lime);}
.ato-logo .cursor{display:inline-block;width:9px;height:18px;background:var(--lime);margin-left:4px;animation:ato-blink 1.1s steps(1) infinite;}
@media (prefers-reduced-motion: reduce){.ato-logo .cursor{animation:none;}}
@keyframes ato-blink{0%,49%{opacity:1;}50%,100%{opacity:0;}}

.ato-nav-links{display:flex;gap:28px;font-size:14.5px;color:var(--text-muted);margin:0;padding:0;}
.ato-nav-links li{list-style:none;}
.ato-nav-links a{transition:color .15s ease;color:var(--text-muted);}
.ato-nav-links a:hover, .ato-nav-links .current-menu-item a{color:var(--lime);}
.ato-header-actions{display:flex;align-items:center;gap:14px;}
.ato-user-menu{display:flex;align-items:center;gap:10px;}
.ato-user-chip{display:flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:13.5px;font-weight:500;color:var(--text) !important;text-decoration:none !important;padding:6px 12px 6px 6px;border:1px solid var(--border-bright);border-radius:999px;}
.ato-user-chip:hover{border-color:var(--lime);}
.ato-user-chip img{border-radius:50%;display:block;}

/* Header links must always use theme colors, never a plugin/browser default */
.ato-site-header a,
.ato-site-header a:visited{
  color: var(--text-muted) !important;
  text-decoration: none !important;
}
.ato-site-header .ato-logo,
.ato-site-header .ato-logo:visited{
  color: var(--text) !important;
}
.ato-site-header .ato-logo .prompt{ color: var(--lime) !important; }
.ato-site-header a:hover{ color: var(--lime) !important; }
.ato-site-header .ato-btn-primary,
.ato-site-header .ato-btn-primary:visited{ color: #0A0D12 !important; }

.ato-btn{
  font-family:var(--font-body);font-weight:600;font-size:14px;
  padding:9px 18px;border-radius:8px;border:1px solid var(--border-bright);
  transition:all .15s ease;white-space:nowrap;display:inline-block;
  background:transparent;color:var(--text);cursor:pointer;
}
.ato-btn-ghost{color:var(--text-muted);}
.ato-btn-ghost:hover{color:var(--text);border-color:var(--text-muted);}
.ato-btn-primary{background:var(--lime);color:#0A0D12;border-color:var(--lime);}
.ato-btn-primary:hover{background:#D8FF6B;box-shadow:0 0 24px rgba(198,255,61,0.35);}
.ato-menu-toggle{display:none;background:none;border:none;color:var(--text);font-size:22px;cursor:pointer;}

/* ---------- HERO / TERMINAL ---------- */
.ato-hero{padding:72px 0 56px;}
.ato-hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
.ato-eyebrow{font-family:var(--font-mono);font-size:12.5px;color:var(--lime);letter-spacing:0.06em;display:flex;align-items:center;gap:8px;margin-bottom:18px;}
.ato-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime);}
.ato-hero h1{font-size:44px;margin-bottom:20px;color:var(--text);}
.ato-hero h1 span{color:var(--lime);}
.ato-hero-sub{color:var(--text-muted);font-size:16.5px;max-width:480px;margin-bottom:32px;}
.ato-hero-ctas{display:flex;gap:14px;margin-bottom:40px;flex-wrap:wrap;}
.ato-stat-row{display:flex;gap:36px;flex-wrap:wrap;}
.ato-stat{font-family:var(--font-mono);}
.ato-stat-num{font-size:22px;font-weight:700;color:var(--text);}
.ato-stat-label{font-size:12px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;}

.ato-terminal{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.4);}
.ato-terminal-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--bg-elevated);}
.ato-dot{width:10px;height:10px;border-radius:50%;}
.ato-dot:nth-child(1){background:#FF6B6B;}
.ato-dot:nth-child(2){background:#FFB84D;}
.ato-dot:nth-child(3){background:#8FBE2C;}
.ato-terminal-title{margin-left:8px;font-family:var(--font-mono);font-size:12px;color:var(--text-faint);}
.ato-terminal-body{padding:22px 20px;font-family:var(--font-mono);font-size:13.5px;color:var(--text-muted);}
.ato-terminal-body .line{margin-bottom:10px;}
.ato-terminal-body .prompt-sign{color:var(--lime);}
.ato-terminal-body .out{color:var(--text);}
.ato-verdict-mini{display:flex;align-items:center;justify-content:space-between;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:10px 14px;margin-top:6px;gap:12px;}
.ato-grade{font-family:var(--font-mono);font-weight:700;font-size:15px;width:30px;height:30px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:rgba(198,255,61,0.15);color:var(--lime);flex-shrink:0;}

/* ---------- FILTER BAR ---------- */
.ato-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);flex-wrap:wrap;}
.ato-pill-row{display:flex;gap:8px;flex-wrap:wrap;}
.ato-pill{font-family:var(--font-mono);font-size:12.5px;padding:7px 13px;border-radius:999px;border:1px solid var(--border-bright);color:var(--text-muted);cursor:pointer;transition:all .15s ease;background:transparent;display:inline-block;}
.ato-pill:hover{border-color:var(--lime);color:var(--text);}
.ato-pill.active{background:var(--lime);color:#0A0D12;border-color:var(--lime);font-weight:600;}

/* ---------- SECTIONS ---------- */
.ato-section{padding:56px 0;}
.ato-section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:28px;flex-wrap:wrap;gap:10px;}
.ato-section-head h2{font-size:26px;margin:0;}
.ato-section-head .ato-view-all{font-family:var(--font-mono);font-size:13px;color:var(--lime);}

/* ---------- TOOL GRID / CARDS ---------- */
.ato-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.ato-grid.ato-grid-2col{grid-template-columns:repeat(2,1fr);}
.ato-card{
  display:block;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:20px;position:relative;overflow:hidden;transition:transform .18s ease,border-color .18s ease;
}
.ato-card:hover{transform:translateY(-3px);border-color:var(--border-bright);}
.ato-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--cat-color, var(--lime));}
.ato-card-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;}
.ato-card-cat{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;}
.ato-card-grade{font-family:var(--font-mono);font-weight:700;font-size:13px;width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:rgba(198,255,61,0.12);color:var(--lime);flex-shrink:0;}
.ato-card h3{font-size:18px;margin:0 0 8px;}
.ato-card p{font-size:13.5px;color:var(--text-muted);margin:0 0 16px;min-height:40px;}
.ato-card-foot{display:flex;align-items:center;justify-content:space-between;}
.ato-price-tag{font-family:var(--font-mono);font-size:11px;padding:4px 9px;border-radius:5px;border:1px solid var(--border-bright);color:var(--text-muted);}
.ato-price-tag.free{color:var(--lime-dim);border-color:rgba(198,255,61,0.3);}
.ato-read-link{font-family:var(--font-mono);font-size:12.5px;color:var(--text);display:flex;align-items:center;gap:5px;}
.ato-card:hover .ato-read-link{color:var(--lime);}

/* ---------- FEATURED ---------- */
.ato-featured{display:grid;grid-template-columns:1fr 1fr;gap:24px;background:linear-gradient(135deg, rgba(198,255,61,0.05), rgba(157,123,255,0.05));border:1px solid var(--border);border-radius:16px;padding:32px;margin-bottom:40px;}
.ato-featured-tag{font-family:var(--font-mono);font-size:11px;color:var(--violet);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px;}
.ato-featured h3{font-size:24px;margin-bottom:10px;}
.ato-featured p{color:var(--text-muted);font-size:14.5px;margin-bottom:18px;}

/* ---------- FORUM / SIDEBAR PANELS ---------- */
.ato-two-col{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;}
.ato-panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;margin-bottom:20px;}
.ato-panel h4{font-size:16px;margin:0 0 18px;display:flex;align-items:center;gap:8px;}
.ato-panel h4::before{content:"";width:6px;height:6px;background:var(--lime);border-radius:50%;}
.ato-log-line{font-family:var(--font-mono);font-size:12.5px;color:var(--text-muted);padding:10px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:10px;}
.ato-log-line:last-child{border-bottom:none;}
.ato-log-line .who{color:var(--lime-dim);}
.ato-log-line .body-text{color:var(--text);font-family:var(--font-body);font-size:13.5px;}
.ato-trend-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);}
.ato-trend-item:last-child{border-bottom:none;}
.ato-trend-rank{font-family:var(--font-mono);font-size:13px;color:var(--text-faint);width:20px;}
.ato-trend-name{font-size:13.5px;font-weight:500;}
.ato-trend-cat{font-size:11.5px;color:var(--text-faint);}

/* ---------- SIDEBAR / WIDGETS ---------- */

/* HARD RESET: some plugins ship widgets with their own inline/white
   styling that fights the theme instead of inheriting it. Rather than
   chase every plugin's class names, force every element inside the
   sidebar onto the theme's dark palette, unconditionally. */
.ato-sidebar,
.ato-sidebar *{
  background-image:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
.ato-sidebar *:not(.ato-btn):not(.widget-title){
  background-color:transparent !important;
}
.ato-sidebar,
.ato-sidebar p,
.ato-sidebar li,
.ato-sidebar span,
.ato-sidebar div{
  color:var(--text-muted) !important;
}
.ato-sidebar h1,
.ato-sidebar h2,
.ato-sidebar h3,
.ato-sidebar h4,
.ato-sidebar h5,
.ato-sidebar h6,
.ato-sidebar strong,
.ato-sidebar b{
  color:var(--text) !important;
}
.ato-sidebar a{
  color:var(--text-muted) !important;
  text-decoration:none !important;
  border-bottom:none !important;
}
.ato-sidebar a:hover{
  color:var(--lime) !important;
}

/* No images anywhere in the sidebar — thumbnails, avatars, inline
   images, galleries, embeds — regardless of which widget put them
   there. Wrapping links/figures collapse to nothing so no empty gap
   is left behind. */
.ato-sidebar img,
.ato-sidebar svg:not(.ato-icon),
.ato-sidebar picture,
.ato-sidebar iframe,
.ato-sidebar video,
.ato-sidebar .avatar,
.ato-sidebar figure,
.ato-sidebar .wp-block-image,
.ato-sidebar .wp-block-gallery,
.ato-sidebar .wp-block-media-text__media{
  display:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
}

/* Each widget is its own dark card, spaced and rounded to match the
   rest of the site's component language. */
.ato-sidebar .widget{
  background:var(--surface) !important;
  border:1px solid var(--border);
  border-radius:12px;
  padding:22px;
  margin-bottom:20px;
  transition:border-color .15s ease;
}
.ato-sidebar .widget:hover{border-color:var(--border-bright);}
.ato-sidebar .widget-title,
.ato-sidebar .widget h1,
.ato-sidebar .widget h2,
.ato-sidebar .widget h3,
.ato-sidebar .widget h4,
.ato-sidebar .widget h5,
.ato-sidebar .widget h6{
  font-family:var(--font-display) !important;
  font-size:15px !important;
  font-weight:600 !important;
  margin:0 0 16px !important;
  color:var(--text) !important;
  display:flex;align-items:center;gap:8px;
  letter-spacing:-0.01em;
}
.ato-sidebar .widget-title::before,
.ato-sidebar .widget > h1::before,
.ato-sidebar .widget > h2::before,
.ato-sidebar .widget > h3::before,
.ato-sidebar .widget > h4::before{
  content:"";width:6px;height:6px;flex-shrink:0;
  background:var(--lime);border-radius:50%;
}
.ato-sidebar .widget p{font-size:13.5px !important;line-height:1.6;margin:0 0 14px !important;}
.ato-sidebar .widget p:last-child{margin-bottom:0 !important;}

/* List-based widgets (Categories, Recent Posts, Archives, nav menus,
   related-post lists) become clean rows with a hover highlight
   instead of plain underlined links — feels like part of the design
   system rather than a bolted-on plugin list. */
.ato-sidebar .widget ul{list-style:none !important;margin:0 !important;padding:0 !important;}
.ato-sidebar .widget ul ul{padding-left:14px !important;}
.ato-sidebar .widget li{
  border-bottom:1px solid var(--border);
  transition:padding-left .15s ease,color .15s ease;
}
.ato-sidebar .widget li:last-child{border-bottom:none;}
.ato-sidebar .widget li > a{
  display:block !important;
  padding:10px 2px !important;
  font-size:13.5px !important;
  line-height:1.4;
}
.ato-sidebar .widget li:hover{padding-left:4px;}
.ato-sidebar .widget li:hover > a{color:var(--lime) !important;}

.ato-sidebar .widget input[type="text"],
.ato-sidebar .widget input[type="search"],
.ato-sidebar .widget select{
  width:100% !important;background:var(--bg-elevated) !important;border:1px solid var(--border-bright) !important;
  border-radius:8px !important;padding:9px 12px !important;color:var(--text) !important;
  font-family:var(--font-mono) !important;font-size:13px !important;
}
.ato-sidebar .widget input[type="submit"],
.ato-sidebar .widget .wp-block-button__link,
.ato-sidebar .widget button:not(.ato-btn),
.ato-sidebar .widget input[type="button"]{
  margin-top:8px;font-family:var(--font-body) !important;font-weight:600 !important;font-size:13px !important;
  padding:9px 16px !important;border-radius:8px !important;cursor:pointer;
  background:var(--lime) !important;color:#0A0D12 !important;border:1px solid var(--lime) !important;
  display:inline-block;text-align:center;
}
.ato-sidebar .widget table{width:100%;border-collapse:collapse;font-size:13px;}
.ato-sidebar .widget table caption{margin-bottom:8px;text-align:left;font-size:13px;}
.ato-sidebar .widget table th,
.ato-sidebar .widget table td{padding:6px 4px;border-bottom:1px solid var(--border);text-align:left;}
.ato-sidebar .widget .tagcloud{display:flex;flex-wrap:wrap;gap:8px;}
.ato-sidebar .widget .tagcloud a{
  font-size:12px !important;font-family:var(--font-mono) !important;padding:5px 11px !important;
  border:1px solid var(--border-bright) !important;border-radius:999px !important;display:inline-block;
}
.ato-sidebar .widget .tagcloud a:hover{border-color:var(--lime) !important;}
.ato-sidebar .widget blockquote{border-left:3px solid var(--lime);padding-left:14px;font-style:italic;margin:14px 0;}

/* "Join the community" box keeps its real button styled, everything
   else defaults to the reset above. */
.ato-sidebar .widget .ato-btn{
  background:var(--lime) !important;color:#0A0D12 !important;border-color:var(--lime) !important;
}
.ato-sidebar .widget .ato-btn:hover{background:#D8FF6B !important;}

/* ---------- CTA BAND ---------- */
.ato-cta-band{text-align:center;padding:56px 24px;border-radius:16px;background:var(--bg-elevated);border:1px solid var(--border);}
.ato-cta-band h2{font-size:28px;margin-bottom:10px;}
.ato-cta-band p{color:var(--text-muted);margin-bottom:24px;}
.ato-cta-form{display:flex;gap:10px;max-width:380px;margin:0 auto;}
.ato-cta-form input{flex:1;background:var(--surface);border:1px solid var(--border-bright);border-radius:8px;padding:11px 14px;color:var(--text);font-family:var(--font-mono);font-size:13px;}
.ato-cta-form input:focus{outline:2px solid var(--lime);border-color:transparent;}

/* ---------- FOOTER ---------- */
.ato-site-footer{background:var(--bg);border-top:1px solid var(--border);padding:48px 0 28px;margin-top:24px;}
.ato-footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:32px;margin-bottom:40px;max-width:1180px;margin-left:auto;margin-right:auto;padding:0 24px;}
.ato-footer-brand p{color:var(--text-faint);font-size:13px;margin-top:12px;max-width:260px;}
.ato-footer-col h5{font-family:var(--font-mono);font-size:12px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:14px;}
.ato-footer-col a{display:block;font-size:13.5px;color:var(--text-muted);margin-bottom:10px;}
.ato-footer-col a:hover{color:var(--lime);}
.ato-footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text-faint);flex-wrap:wrap;gap:10px;max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;}
.ato-social-icons{display:flex;gap:14px;}
.ato-social-icons a{width:32px;height:32px;border:1px solid var(--border-bright);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;}
.ato-social-icons a:hover{border-color:var(--lime);color:var(--lime);}

/* ---------- SINGLE REVIEW PAGE ---------- */
.ato-single-layout{max-width:1180px;margin:0 auto;padding:56px 24px;display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start;}
.ato-single-layout.ato-no-sidebar{grid-template-columns:1fr;max-width:1180px;}

/* Forum / community page: drop the reading-width cap entirely so
   forum plugin tables, threads, and lists get the room they need. */
.ato-single-layout.ato-forum-page{max-width:1600px;padding-left:32px;padding-right:32px;}
.ato-single-layout.ato-forum-page .ato-single-content{max-width:none;width:100%;}
@media (max-width: 680px){
  .ato-single-layout.ato-forum-page{padding-left:16px;padding-right:16px;}
}
.ato-single-breadcrumb{font-family:var(--font-mono);font-size:12px;color:var(--text-faint);margin-bottom:20px;}
.ato-single-breadcrumb a{color:var(--text-muted);}
.ato-single-breadcrumb a:hover{color:var(--lime);}
.ato-single-head{margin-bottom:28px;}
.ato-single-head .ato-card-cat{margin-bottom:12px;display:inline-block;}
.ato-single-head h1{font-size:36px;margin-bottom:16px;}
.ato-single-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.ato-single-thumb{border-radius:14px;overflow:hidden;margin-bottom:32px;border:1px solid var(--border);}
.ato-single-thumb img{border-radius:0;}
.ato-single-content{font-size:16px;line-height:1.75;color:var(--text);}
.ato-single-content p{margin-bottom:20px;color:var(--text-muted);}
.ato-single-content h2,.ato-single-content h3{margin-top:36px;margin-bottom:14px;}
.ato-single-content a{color:var(--lime);border-bottom:1px solid rgba(198,255,61,0.35);}
.ato-single-content ul,.ato-single-content ol{color:var(--text-muted);margin-bottom:20px;padding-left:22px;}
.ato-single-content ul{list-style:disc;}
.ato-single-content ol{list-style:decimal;}
.ato-single-content blockquote{border-left:3px solid var(--lime);padding-left:18px;color:var(--text-muted);font-style:italic;margin:24px 0;}
.ato-single-content img{margin:24px 0;}
.ato-single-content code{font-family:var(--font-mono);background:var(--surface);padding:2px 6px;border-radius:4px;font-size:0.9em;}

.ato-you-may-like{max-width:1180px;margin:0 auto;padding:0 24px 72px;}
.ato-you-may-like h2{font-size:22px;margin-bottom:22px;display:flex;align-items:center;gap:8px;}
.ato-you-may-like h2::before{content:"";width:6px;height:6px;background:var(--lime);border-radius:50%;}

/* ---------- ARCHIVE / CATEGORY LIST ---------- */
.ato-archive-head{max-width:1180px;margin:0 auto;padding:48px 24px 24px;}
.ato-archive-head .ato-eyebrow{margin-bottom:10px;}
.ato-archive-head h1{font-size:34px;margin-bottom:10px;}
.ato-archive-head p{color:var(--text-muted);font-size:15px;max-width:640px;}
.ato-archive-layout{max-width:1180px;margin:0 auto;padding:24px 24px 56px;display:grid;grid-template-columns:1fr 320px;gap:32px;align-items:start;}
.ato-archive-layout.ato-no-sidebar{grid-template-columns:1fr;}

/* ---------- CATEGORIES OVERVIEW PAGE ---------- */
.ato-cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.ato-cat-card{display:block;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:22px;transition:all .15s ease;position:relative;overflow:hidden;}
.ato-cat-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--cat-color, var(--lime));}
.ato-cat-card:hover{transform:translateY(-2px);border-color:var(--border-bright);}
.ato-cat-card h3{font-size:17px;margin:0 0 8px;}
.ato-cat-card p{font-size:13px;color:var(--text-muted);margin:0 0 12px;}
.ato-cat-count{font-family:var(--font-mono);font-size:11.5px;color:var(--text-faint);}

/* ---------- PAGINATION ---------- */
.ato-pagination{display:flex;gap:8px;justify-content:center;margin-top:40px;flex-wrap:wrap;}
.ato-pagination a, .ato-pagination span{
  font-family:var(--font-mono);font-size:13px;min-width:38px;height:38px;padding:0 10px;
  display:flex;align-items:center;justify-content:center;border-radius:8px;
  border:1px solid var(--border-bright);color:var(--text-muted);
}
.ato-pagination a:hover{border-color:var(--lime);color:var(--lime);}
.ato-pagination .current{background:var(--lime);color:#0A0D12;border-color:var(--lime);font-weight:600;}

/* ---------- SIGNAL BARS ---------- */
.ato-signal{display:flex;gap:3px;align-items:flex-end;height:20px;}
.ato-signal span{width:5px;background:var(--border-bright);border-radius:2px;}
.ato-signal span:nth-child(1){height:35%;}
.ato-signal span:nth-child(2){height:55%;}
.ato-signal span:nth-child(3){height:75%;}
.ato-signal span:nth-child(4){height:100%;background:var(--lime);}
.ato-signal.filled span{background:var(--lime);}

/* ---------- COMMENTS ---------- */
.ato-comments{margin-top:48px;}
.ato-comments-title{font-size:20px;margin-bottom:20px;}
.ato-comment-list{margin-bottom:24px;}
.ato-comment{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px 18px;margin-bottom:12px;}
.ato-comment-author{font-family:var(--font-mono);font-size:12.5px;color:var(--lime-dim);margin-bottom:6px;}
.ato-comment-content{font-size:14px;color:var(--text-muted);}
.ato-comment-form input[type="text"],
.ato-comment-form input[type="email"],
.ato-comment-form textarea{
  width:100%;background:var(--surface);border:1px solid var(--border-bright);border-radius:8px;
  padding:11px 14px;color:var(--text);font-family:var(--font-body);font-size:14px;margin-bottom:12px;
}
.ato-comment-form textarea{min-height:120px;}

/* ---------- FORM PAGES (Login / Submit a Tool) ---------- */
.ato-auth-tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border);}
.ato-auth-tab{font-family:var(--font-mono);font-size:13.5px;padding:10px 4px;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-1px;}
.ato-auth-tab:hover{color:var(--text);}
.ato-auth-tab.active{color:var(--lime);border-bottom-color:var(--lime);}
.ato-auth-tab + .ato-auth-tab{margin-left:8px;}
.ato-form-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:32px;display:flex;flex-direction:column;}
.ato-form-label{font-family:var(--font-mono);font-size:12.5px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.04em;margin-bottom:8px;margin-top:20px;}
.ato-form-label:first-child{margin-top:0;}
.ato-form-card input[type="text"],
.ato-form-card input[type="email"],
.ato-form-card input[type="password"],
.ato-form-card textarea{
  width:100%;background:var(--bg-elevated);border:1px solid var(--border-bright);border-radius:8px;
  padding:12px 14px;color:var(--text);font-family:var(--font-body);font-size:14.5px;
}
.ato-form-card textarea{min-height:160px;resize:vertical;}
.ato-form-card input[type="text"]:focus,
.ato-form-card input[type="email"]:focus,
.ato-form-card input[type="password"]:focus,
.ato-form-card textarea:focus{outline:2px solid var(--lime);border-color:transparent;}
.ato-form-card input[type="file"]{
  width:100%;background:var(--bg-elevated);border:1px dashed var(--border-bright);border-radius:8px;
  padding:16px;color:var(--text-muted);font-family:var(--font-mono);font-size:13px;
}

/* WP's built-in wp_login_form() markup */
.ato-form-card #loginform{display:flex;flex-direction:column;}
.ato-form-card .login-username,
.ato-form-card .login-password{margin-bottom:16px;}
.ato-form-card .login-username label,
.ato-form-card .login-password label{
  display:block;font-family:var(--font-mono);font-size:12.5px;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:0.04em;margin-bottom:8px;
}
.ato-form-card #user_login,
.ato-form-card #user_pass{
  width:100%;background:var(--bg-elevated);border:1px solid var(--border-bright);border-radius:8px;
  padding:12px 14px;color:var(--text);font-family:var(--font-body);font-size:14.5px;
}
.ato-form-card #user_login:focus,
.ato-form-card #user_pass:focus{outline:2px solid var(--lime);border-color:transparent;}
.ato-form-card .login-remember{font-size:13.5px;color:var(--text-muted);margin-bottom:20px;}
.ato-form-card .login-remember label{display:flex;align-items:center;gap:8px;}
.ato-form-card .login-submit{margin:0;}
.ato-form-card #wp-submit{
  background:var(--lime);color:#0A0D12;border:none;border-radius:8px;padding:11px 22px;
  font-weight:600;font-size:14px;cursor:pointer;font-family:var(--font-body);
}
.ato-form-card #wp-submit:hover{background:#D8FF6B;}

.ato-form-notice{font-family:var(--font-mono);font-size:13px;padding:14px 18px;border-radius:10px;margin-bottom:20px;}
.ato-form-notice-success{background:rgba(198,255,61,0.1);border:1px solid rgba(198,255,61,0.3);color:var(--lime);}
.ato-form-notice-error{background:rgba(255,107,107,0.1);border:1px solid rgba(255,107,107,0.3);color:var(--coral);}

/* ---------- NO RESULTS ---------- */
.ato-empty{font-family:var(--font-mono);color:var(--text-faint);text-align:center;padding:60px 0;}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 980px){
  .ato-single-layout, .ato-archive-layout{grid-template-columns:1fr;}
}
@media (max-width: 920px){
  .ato-hero-grid{grid-template-columns:1fr;}
  .ato-terminal{order:-1;}
  .ato-grid{grid-template-columns:repeat(2,1fr);}
  .ato-two-col{grid-template-columns:1fr;}
  .ato-featured{grid-template-columns:1fr;}
  .ato-footer-grid{grid-template-columns:1fr 1fr;}
  .ato-cat-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 680px){
  .ato-nav-links{display:none;}
  .ato-menu-toggle{display:block;}
  .ato-hero h1{font-size:30px;}
  .ato-grid{grid-template-columns:1fr;}
  .ato-cat-grid{grid-template-columns:1fr;}
  .ato-footer-grid{grid-template-columns:1fr;}
  .ato-single-head h1{font-size:26px;}

  /* Header: logo + Sign in + Submit Tool + hamburger don't fit in one
     row on a phone. Drop the secondary "Sign in" action, shrink the
     rest, and tighten the outer spacing so nothing pushes off-screen. */
  .ato-header-inner{padding:12px 16px;gap:8px;}
  .ato-logo{font-size:14px;}
  .ato-header-actions{gap:8px;}
  .ato-header-actions .ato-btn-ghost{display:none;}
  .ato-header-actions .ato-btn-primary{padding:8px 12px;font-size:12.5px;}
  .ato-menu-toggle{font-size:20px;flex-shrink:0;}
}
@media (max-width: 360px){
  .ato-header-actions .ato-btn-primary{padding:7px 10px;font-size:11.5px;}
  .ato-logo{font-size:12.5px;}
}

/* ==========================================================================
   PLUGIN OVERRIDES — restyle UsersWP (login/register/forgot-password) and
   User Submitted Posts (tool submission form) to match the dark theme.
   These plugins render their own markup outside our template files, so
   they have to be themed here instead of in header.php/page.php. Selectors
   are based on each plugin's documented CSS hooks; if a specific element
   still looks unstyled after upload, send a screenshot of just that part
   and the selector can be tightened.
   ========================================================================== */

/* ---------- UsersWP: login / register / forgot-password ---------- */
[class*="uwp-"],
[id*="uwp-"],
.uwp-login-form,
.uwp-registration-form,
.uwp-account-form,
.uwp-forgot-form,
#uwp-login-modal,
#uwp-register-modal,
#uwp-forgot-modal,
.modal-content:has([class*="uwp"]),
.modal-content:has(#user_login),
.modal-content:has(#user_email) {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  color: var(--text) !important;
}

/* Modal chrome: header title, close icon, footer */
.modal-header,
.modal-footer{
  background: transparent !important;
  border-color: var(--border) !important;
}
.modal-title,
.modal-content h1,
.modal-content h2,
.modal-content h3,
.modal-content h4{
  color: var(--text) !important;
  font-family: var(--font-display) !important;
}
.modal-content .close,
.modal-content button.close{
  color: var(--text-muted) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.modal-content .close:hover{ color: var(--lime) !important; }

/* Inputs (Bootstrap .form-control, used throughout UsersWP) */
.modal-content .form-control,
.modal-content input[type="text"],
.modal-content input[type="email"],
.modal-content input[type="password"],
.modal-content input[type="tel"],
.modal-content textarea,
[class*="uwp-"] .form-control,
[class*="uwp-"] input[type="text"],
[class*="uwp-"] input[type="email"],
[class*="uwp-"] input[type="password"]{
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border-bright) !important;
  color: var(--text) !important;
  border-radius: 8px !important;
  font-family: var(--font-body) !important;
}
.modal-content .form-control::placeholder,
[class*="uwp-"] input::placeholder{
  color: var(--text-faint) !important;
}
.modal-content .form-control:focus,
[class*="uwp-"] input:focus{
  border-color: var(--lime) !important;
  box-shadow: 0 0 0 2px rgba(198,255,61,0.25) !important;
}

/* Buttons (Log in, Create account, Submit) */
.modal-content .btn,
.modal-content .btn-primary,
.modal-content .btn-block,
[class*="uwp-"] .btn,
[class*="uwp-"] button[type="submit"],
[class*="uwp-"] input[type="submit"]{
  background: var(--lime) !important;
  border-color: var(--lime) !important;
  color: #0A0D12 !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  font-family: var(--font-body) !important;
  text-transform: none !important;
}
.modal-content .btn:hover,
[class*="uwp-"] .btn:hover{
  background: #D8FF6B !important;
  border-color: #D8FF6B !important;
}

/* Links: Create account / Forgot password? / Log in */
.modal-content a,
[class*="uwp-"] a{
  color: var(--lime) !important;
}
.modal-content a:hover,
[class*="uwp-"] a:hover{
  color: #D8FF6B !important;
}

/* Checkbox row (Remember Me) */
.modal-content label,
[class*="uwp-"] label{
  color: var(--text-muted) !important;
}

/* Password visibility "eye" icon — keep it visible on dark bg */
.modal-content svg,
[class*="uwp-"] svg{
  filter: none;
  color: var(--text-muted) !important;
}

/* Standalone (non-modal) login/register pages, e.g. a page with the
   [uwp_login] or [uwp_register] shortcode placed directly in content */
.uwp-content-wrap,
.uwp_page,
.uwp_form_wrap{
  max-width: 480px;
  margin: 0 auto;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  padding: 32px !important;
}

/* ---------- User Submitted Posts: tool submission form ---------- */
#user-submitted-posts{
  max-width: 720px;
  margin: 0 auto;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  padding: 32px !important;
  color: var(--text) !important;
}
#user-submitted-posts form#usp_form{
  display: flex;
  flex-direction: column;
}
#user-submitted-posts fieldset{
  border: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
}
#user-submitted-posts fieldset legend,
#user-submitted-posts label{
  font-family: var(--font-mono) !important;
  font-size: 12.5px !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 8px !important;
  display: block !important;
}
#user-submitted-posts .usp-input,
#user-submitted-posts .usp-textarea,
#user-submitted-posts input[type="text"],
#user-submitted-posts input[type="url"],
#user-submitted-posts input[type="email"],
#user-submitted-posts textarea,
#user-submitted-posts select{
  width: 100% !important;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border-bright) !important;
  color: var(--text) !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
}
#user-submitted-posts .usp-textarea,
#user-submitted-posts textarea{
  min-height: 160px !important;
}
#user-submitted-posts input:focus,
#user-submitted-posts textarea:focus,
#user-submitted-posts select:focus{
  outline: none !important;
  border-color: var(--lime) !important;
  box-shadow: 0 0 0 2px rgba(198,255,61,0.25) !important;
}
#user-submitted-posts fieldset.usp-custom input[type="file"],
#user-submitted-posts input[type="file"]{
  width: 100% !important;
  background: var(--bg-elevated) !important;
  border: 1px dashed var(--border-bright) !important;
  border-radius: 8px !important;
  padding: 16px !important;
  color: var(--text-muted) !important;
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
}
#user-submitted-posts input[type="submit"],
#user-submitted-posts button[type="submit"]{
  background: var(--lime) !important;
  border: none !important;
  color: #0A0D12 !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  padding: 12px 24px !important;
  font-family: var(--font-body) !important;
  cursor: pointer !important;
  margin-top: 8px !important;
}
#user-submitted-posts input[type="submit"]:hover,
#user-submitted-posts button[type="submit"]:hover{
  background: #D8FF6B !important;
}
#user-submitted-posts .usp-error,
#user-submitted-posts .error{
  color: var(--coral) !important;
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
}

/* ---------- UsersWP: account page avatar upload box ---------- */
[class*="uwp-avatar"],
[class*="uwp_avatar"],
[class*="uwp-account"] [class*="avatar"]{
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border-bright) !important;
  border-radius: 10px !important;
}
[class*="uwp-avatar"] img,
[class*="uwp_avatar"] img{
  border-radius: 10px !important;
}
