/*
Theme Name: AIToolCritic Lab (Standalone)
Theme URI: https://aitoolcritic.com/
Author: John
Description: Fast, mobile-first standalone theme for AIToolCritic with global John card + directory-friendly styling.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aitoolcritic-lab
Tags: custom-colors, custom-logo, featured-images, responsive-layout
*/

:root{
  --bg:#EEF6FF;
  --surface:#FFFFFF;
  --primary:#1E40AF;
  --accent:#60A5FA;
  --coral:#FF6B6B;
  --text:#0B1220;
  --muted:#64748B;
  --border:#D6E3F2;
  --shadow:0 8px 24px rgba(11,18,32,.12);
  --radius:18px;
  --container:1180px;
  --gap:22px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  line-height:1.6;
}
a{color:var(--primary); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%; height:auto}

.atc-container{max-width:var(--container); margin:0 auto; padding:18px 16px}
.atc-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow)}
.atc-pad{padding:22px}
.atc-grid{display:grid; grid-template-columns: 1fr; gap:var(--gap)}
@media (min-width: 980px){ .atc-grid{grid-template-columns: 2fr 1fr;} }

.atc-header{position:sticky; top:0; z-index:50; background:rgba(238,246,255,.86); backdrop-filter: blur(10px); border-bottom:1px solid rgba(214,227,242,.7);}
.atc-header-inner{display:flex; align-items:center; justify-content:space-between; gap:14px}
.atc-brand{display:flex; align-items:center; gap:12px}
.atc-logo{width:179px; height:300px; border-radius:18px; background:var(--surface); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; overflow:hidden}
.atc-logo img, .atc-logo .custom-logo{width:100%; height:100%; object-fit:contain}
.atc-brand-title{font-weight:800; letter-spacing:.2px}

.atc-nav-toggle{display:flex; align-items:center; gap:8px; border:1px solid var(--border); background:var(--surface); border-radius:14px; padding:10px 12px; cursor:pointer}
.atc-nav-toggle span{font-weight:700; font-size:14px}
.atc-nav{display:none}
.atc-nav a{padding:10px 10px; border-radius:12px; display:inline-block; font-weight:600; color:var(--text)}
.atc-nav a:hover{background:rgba(96,165,250,.18); text-decoration:none}
.atc-cta{background:var(--coral); color:#fff !important; padding:10px 14px; border-radius:14px; font-weight:800}
.atc-cta:hover{filter:brightness(.96)}
@media (min-width: 980px){
  .atc-nav-toggle{display:none}
  .atc-nav{display:flex; align-items:center; gap:6px}
}

.atc-drawer{display:none; margin-top:12px}
.atc-drawer a{display:block; padding:12px 12px; border-radius:14px; font-weight:650; color:var(--text)}
.atc-drawer a:hover{background:rgba(96,165,250,.18); text-decoration:none}
.atc-drawer .atc-cta{display:inline-block; margin-top:8px}

.atc-hero{background: linear-gradient(180deg, #EEF6FF 0%, #FFFFFF 55%, #FFFFFF 100%); border:1px solid var(--border); border-radius:24px; box-shadow:var(--shadow);}
.atc-hero-inner{display:grid; gap:18px; padding:26px}
.atc-hero h1{margin:0; line-height:1.1; font-size:clamp(28px, 3.2vw, 42px)}
.atc-hero p{margin:0; color:var(--muted); font-size:16px}
.atc-tiles{display:grid; gap:12px; grid-template-columns:1fr}
.atc-tile{padding:16px; border-radius:16px; border:1px solid var(--border); background:var(--surface)}
.atc-tile strong{display:block}
.atc-tile span{color:var(--muted)}
@media (min-width: 720px){ .atc-tiles{grid-template-columns: repeat(3, 1fr)} }

.entry-title{margin:0 0 10px 0; font-size:clamp(24px, 2.4vw, 34px); line-height:1.15}
.entry-meta{color:var(--muted); font-size:14px; margin-bottom:14px}
.entry-content p{margin-top:0}
.atc-featured{margin:0 0 18px 0; border-radius:16px; overflow:hidden; border:1px solid var(--border);}
.atc-featured img{width:100%; max-height:460px; object-fit:cover}
@media (max-width: 768px){ .atc-featured img{max-height:280px} }

.atc-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 14px; border-radius:14px; border:1px solid var(--border); background:var(--surface); font-weight:800; cursor:pointer}
.atc-btn-primary{background:var(--primary); border-color:var(--primary); color:#fff}
.atc-btn-primary:hover{filter:brightness(.96)}
.atc-btn-accent{background:rgba(96,165,250,.18); border-color:rgba(96,165,250,.55); color:var(--primary)}

.atc-john-top{display:flex; gap:12px; align-items:center}
.atc-john img{width:64px; height:64px; border-radius:18px; border:1px solid var(--border); object-fit:cover}
.atc-john h3{margin:0; font-size:18px}
.atc-john p{margin:4px 0 0 0; color:var(--muted); font-size:14px}
.atc-john-actions{display:flex; gap:10px; margin-top:14px; flex-wrap:wrap}
.atc-john small{display:block; margin-top:10px; color:var(--muted)}

.atc-collapsible summary{cursor:pointer; font-weight:800; list-style:none}
.atc-collapsible summary::-webkit-details-marker{display:none}
.atc-collapsible{border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow);}
.atc-collapsible .atc-pad{padding:18px}

.atc-mobile-john{display:block}
.atc-desktop-john{display:none}
@media (min-width: 980px){ .atc-mobile-john{display:none} .atc-desktop-john{display:block} }

/* Directory plugin friendliness (.drts wrapper) */
.drts .drts-view{max-width:100%}
.drts .drts-entity{background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow);}
.drts .drts-entity .drts-entity-label{font-weight:800}
.drts .drts-btn, .drts button, .drts input[type="submit"]{border-radius:14px !important; padding:10px 14px !important; font-weight:800 !important;}
.drts .drts-btn-primary, .drts input[type="submit"]{background:var(--primary) !important; border-color:var(--primary) !important; color:#fff !important;}
.drts input[type="text"], .drts input[type="search"], .drts select{border-radius:14px !important; border:1px solid var(--border) !important; padding:12px 12px !important; width:100% !important; max-width:100% !important;}
@media (max-width: 768px){ .drts .drts-search, .drts .drts-filters{display:block !important} }

.atc-footer{margin-top:26px}
.atc-footer-inner{display:grid; gap:14px; padding:22px}
.atc-footer-links{display:flex; gap:10px; flex-wrap:wrap}
.atc-footer-links a{padding:8px 10px; border-radius:12px; border:1px solid var(--border); background:var(--surface)}
.atc-footer-links a:hover{text-decoration:none; background:rgba(96,165,250,.18)}

@media (max-width: 520px){ .atc-logo{width:72px; height:120px;} }


/* --- Header logo fixes --- */
.atc-logo-link{display:flex; align-items:center; justify-content:center; text-decoration:none}
.atc-logo-img{height:190px; width:auto; display:block}

/* Keep header usable on smaller screens */
@media (max-width: 980px){ .atc-logo-img{height:160px;} }
@media (max-width: 520px){ .atc-logo-img{height:120px;} }

/* Remove list bullets/separators from wp_nav_menu output */
.atc-nav li{list-style:none; display:inline-block; margin:0; padding:0}
.atc-drawer li{list-style:none; margin:0; padding:0}
.atc-nav .menu, .atc-drawer .menu{margin:0; padding:0}

.atc-logo{background:transparent; border:none; width:auto; height:auto; border-radius:0; overflow:visible}
.atc-logo img, .atc-logo .custom-logo{width:auto; height:auto; object-fit:contain}


/* --- Header nav cleanup (no bullets, better wrapping) --- */
.atc-nav{flex-wrap:wrap; row-gap:6px}
.atc-nav li, .atc-drawer li{
  list-style:none !important;
  list-style-type:none !important;
  list-style-position:inside !important;
  margin:0 !important;
  padding:0 !important;
}
.atc-nav li::marker, .atc-drawer li::marker{content:''}
.atc-nav a{white-space:nowrap}