/*
Theme Name: AINicheTool
Theme URI: https://ainichetool.com
Author: AINicheTool
Description: Fast, minimalist B2B AI tools directory theme with light/dark mode, a custom "AI Tool" post type, filters, submission and contact forms. No page builder or jQuery required.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ainichetool
*/

/* =========================================================
   1. DESIGN TOKENS (dark is default; light via [data-theme])
   ========================================================= */
:root{--bg:#0F172A;--bar:#0B1120;--card:#162033;--bd:#26344d;--h:#F8FAFC;--b:#CBD5E1;--m:#94A3B8;--ac:#818CF8;--btn:#4F46E5;--btnh:#6366F1;--soft:#1E2A44;--ok:#34D399;--no:#FB7185;--star:#FBBF24;--g:rgba(16,185,129,.16);--bl:rgba(59,130,246,.18);--am:rgba(245,158,11,.18);--glow:rgba(79,70,229,.25);--sh:none;--r:12px}
:root[data-theme="light"]{--bg:#F8FAFC;--bar:#FFFFFF;--card:#FFFFFF;--bd:#E2E8F0;--h:#0F172A;--b:#334155;--m:#64748B;--ac:#4338CA;--btnh:#4338CA;--soft:#EEF2FF;--ok:#047857;--no:#BE123C;--star:#D97706;--g:#D1FAE5;--bl:#DBEAFE;--am:#FEF3C7;--glow:rgba(99,102,241,.14);--sh:0 1px 2px rgba(15,23,42,.06)}
@media (prefers-color-scheme: light){:root:not([data-theme]){--bg:#F8FAFC;--bar:#FFFFFF;--card:#FFFFFF;--bd:#E2E8F0;--h:#0F172A;--b:#334155;--m:#64748B;--ac:#4338CA;--btnh:#4338CA;--soft:#EEF2FF;--ok:#047857;--no:#BE123C;--star:#D97706;--g:#D1FAE5;--bl:#DBEAFE;--am:#FEF3C7;--glow:rgba(99,102,241,.14);--sh:0 1px 2px rgba(15,23,42,.06)}}

/* =========================================================
   2. BASE & TYPOGRAPHY
   ========================================================= */
:root{color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root[data-theme="light"]{color-scheme:light}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--bg);color:var(--b);font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;transition:background-color .2s,color .2s}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
h1,h2,h3,h4{color:var(--h);line-height:1.25;margin:0}
h1{font-size:clamp(28px,5vw,44px);font-weight:800;letter-spacing:-.02em}
h2{font-size:22px;margin-bottom:14px}
h3{font-size:17px}
.screen-reader-text,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;top:8px;left:8px;z-index:100;background:var(--btn);color:#fff;padding:8px 14px;border-radius:8px}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}

/* =========================================================
   3. LAYOUT UTILITIES
   ========================================================= */
.w{max-width:1080px;margin:0 auto;padding:0 16px}
.w-narrow{max-width:760px}
.pad{padding-top:36px;padding-bottom:60px}
.sec{margin-top:40px}
.m{color:var(--m)}.c{text-align:center}.ok{color:var(--ok)}.no{color:var(--no)}.star{color:var(--star);font-weight:600}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.two{display:grid;gap:16px;grid-template-columns:1fr 1fr}
.three{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
@media(max-width:700px){.two{grid-template-columns:1fr}}
.glow{background:radial-gradient(60% 70% at 50% 0%,var(--glow),transparent 70%)}
.crumbs{margin:0 0 16px;font-size:14px;color:var(--m)}.crumbs a:hover{color:var(--h)}

/* =========================================================
   4. COMPONENTS
   ========================================================= */
.btn{background:var(--btn);color:#fff;border:0;border-radius:8px;padding:11px 20px;font:600 15px/1.2 inherit;font-family:inherit;cursor:pointer;display:inline-block;text-align:center}
.btn:hover{background:var(--btnh);color:#fff}
.btn.sm{padding:8px 14px;font-size:14px}
.btn.ghost{background:transparent;border:1px solid var(--bd);color:var(--h)}
.btn.block{display:block;width:100%}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:20px;box-shadow:var(--sh);transition:border-color .15s,background-color .2s}
a.card:hover,.tc:hover{border-color:var(--ac)}
.pill{display:inline-block;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;white-space:nowrap}
.pt-free{background:var(--g);color:var(--ok)}
.pt-freemium,.pill-blue{background:var(--bl);color:var(--ac)}
.pt-paid,.pt-free-trial{background:var(--am);color:var(--star)}
.pill-soft{background:var(--soft);color:var(--ac)}
.chip{border:1px solid var(--bd);background:var(--card);color:var(--b);border-radius:999px;padding:6px 14px;cursor:pointer;font:inherit;font-size:14px;display:inline-block}
.chip:hover{color:var(--h)}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips input:checked+.chip{background:var(--btn);border-color:var(--btn);color:#fff}
.chips input:focus-visible+.chip{outline:2px solid var(--ac);outline-offset:2px}
.notice{border-radius:10px;padding:12px 16px;margin-bottom:18px;font-size:15px;border:1px solid}
.notice.ok{background:var(--g);border-color:var(--ok)}.notice.err{background:var(--am);border-color:var(--no);color:var(--no)}

/* forms */
.inp{width:100%;border-radius:8px;background:var(--card);border:1px solid var(--bd);padding:10px 12px;color:var(--h);font:inherit;outline:none;transition:border-color .15s}
.inp:focus{border-color:var(--ac)}
select.inp option{background:var(--card);color:var(--h)}
.lbl{display:block;font-size:14px;margin:14px 0 4px;color:var(--b)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}

/* =========================================================
   5. HEADER & FOOTER
   ========================================================= */
.hd{background:var(--bar);border-bottom:1px solid var(--bd)}
.hd-in{display:flex;align-items:center;gap:16px;min-height:64px}
.brand{font-weight:800;font-size:19px;color:var(--h);display:flex;align-items:center;gap:8px;flex-shrink:0}
.brand i{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,#3b82f6,#4f46e5);color:#fff;font-style:normal;font-size:15px}
.brand img{max-height:36px;width:auto}
.nav{flex:1}
.nav ul{list-style:none;display:flex;gap:22px;margin:0;padding:0;font-size:14px;color:var(--m)}
.nav a:hover,.nav .current-menu-item>a{color:var(--h)}
.hd-act{display:flex;gap:8px;align-items:center;margin-left:auto}
#theme-toggle .t-light{display:none}
:root[data-theme="light"] #theme-toggle .t-dark{display:none}
:root[data-theme="light"] #theme-toggle .t-light{display:inline}
@media(max-width:760px){.hd-in{flex-wrap:wrap;padding-top:10px;padding-bottom:10px}.nav{order:3;flex-basis:100%;overflow-x:auto}.nav ul{white-space:nowrap}}
.ft{border-top:1px solid var(--bd);padding:28px 0;margin-top:20px;font-size:14px;color:var(--m)}
.ft-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ft ul{list-style:none;display:flex;gap:18px;margin:0;padding:0}.ft a:hover{color:var(--h)}

/* =========================================================
   6. TOOL CARD
   ========================================================= */
.tc{display:flex;flex-direction:column}
.tc-top{display:flex;align-items:center;gap:12px}
.logo{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;color:#fff;font-weight:700;flex-shrink:0;overflow:hidden;background:linear-gradient(135deg,#3b82f6,#06b6d4)}
.logo img{width:100%;height:100%;object-fit:cover}
.g0{background:linear-gradient(135deg,#f97316,#db2777)}.g1{background:linear-gradient(135deg,#3b82f6,#06b6d4)}.g2{background:linear-gradient(135deg,#10b981,#0d9488)}
.tc h3 a:hover{color:var(--ac)}
.tc-cat{align-self:flex-start;margin:14px 0 8px;font-size:12px;background:var(--soft);border-radius:6px;padding:2px 8px;color:var(--b)}
.tc p{margin:0 0 16px;font-size:14px;color:var(--m);flex:1}

/* =========================================================
   7. HOMEPAGE
   ========================================================= */
.hero{padding-top:56px;padding-bottom:36px;text-align:center}
.hero p.lead{font-size:18px;color:var(--m);margin:12px 0 0}
.hero-form{display:flex;gap:8px;margin-top:24px}
.hero-form .inp{padding:14px 16px;font-size:16px}
.zone-h{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:14px}
.zone-h h2{margin:0;border-left:4px solid var(--btn);padding-left:12px}
.zone-h a{font-size:14px;color:var(--ac)}
.zone{margin-bottom:44px}

/* =========================================================
   8. SINGLE TOOL
   ========================================================= */
.tool-hero{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.tool-hero .logo{width:80px;height:80px;font-size:32px;border-radius:18px}
.tool-hero .info{flex:1;min-width:220px}
.tool-hero .row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--bd);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;margin-top:18px}
.stats div{background:var(--card);padding:14px 16px}
.stats span{display:block;font-size:12px;color:var(--m)}.stats b{color:var(--h)}
.verdict{background:var(--soft);border:1px solid var(--ac);border-radius:var(--r);padding:22px}
.verdict h2{margin-bottom:8px}.verdict p{margin:0}
.ul{list-style:none;padding:0;margin:10px 0 0}.ul li{margin:7px 0}
.ck li::before{content:"✓ ";color:var(--ok);font-weight:700}
.pro li::before{content:"+ ";color:var(--ok);font-weight:700}
.con li::before{content:"– ";color:var(--no);font-weight:700}
.box-pro{border-color:var(--ok)}.box-pro h3{color:var(--ok)}
.box-con{border-color:var(--no)}.box-con h3{color:var(--no)}
.cta-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.cta-bar h2{margin-bottom:4px}

/* =========================================================
   9. ARCHIVE / FILTERS
   ========================================================= */
.filters{display:grid;gap:14px}
.filters-row{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}
@media(max-width:700px){.filters-row{grid-template-columns:1fr}}
.filters-pr{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:14px}
.count{margin:18px 0 12px;font-size:14px;color:var(--m)}
.pagination{margin-top:28px}
.nav-links{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.page-numbers{border:1px solid var(--bd);background:var(--card);border-radius:8px;padding:6px 12px;font-size:14px}
.page-numbers.current{background:var(--btn);border-color:var(--btn);color:#fff}
a.page-numbers:hover{border-color:var(--ac)}

/* =========================================================
   10. SUBMIT PAGE
   ========================================================= */
.price{font-size:34px;font-weight:800;color:var(--h);margin:6px 0}
.price small{font-size:15px;font-weight:400;color:var(--m)}
.tier-pro{border-color:var(--ac);background:var(--soft)}
.tier-h{display:flex;justify-content:space-between;align-items:center}

/* =========================================================
   11. BLOG / GUIDES / ARTICLE
   ========================================================= */
.feat{padding:0;overflow:hidden;gap:0}
.feat-img{min-height:220px;background:linear-gradient(135deg,#f97316,#db2777,#4f46e5);background-size:cover;background-position:center}
.feat-body{padding:26px}
.feat-body h2{font-size:26px;margin:10px 0}
.pc{padding:0;overflow:hidden;display:flex;flex-direction:column}
.pc-img{height:120px;background-size:cover;background-position:center}
.pc-body{padding:18px;display:flex;flex-direction:column;flex:1}
.pc-body h3{margin:4px 0 8px}.pc-body p{margin:0 0 12px;font-size:14px;color:var(--m);flex:1}
.more{color:var(--ac);font-weight:600;font-size:14px}
.byline{display:flex;gap:12px;align-items:center;font-size:14px;margin-top:16px}
.avatar{border-radius:50%}
.entry-content{font-size:17px;line-height:1.8}
.entry-content h2{margin:36px 0 12px;font-size:26px}.entry-content h3{margin:28px 0 10px;font-size:20px}
.entry-content a{color:var(--ac);text-decoration:underline}
.entry-content blockquote{margin:24px 0;padding:14px 20px;border-left:4px solid var(--ac);background:var(--soft);border-radius:0 10px 10px 0}
.entry-content table{width:100%;border-collapse:collapse;font-size:15px}
.entry-content th,.entry-content td{border:1px solid var(--bd);padding:10px 12px;text-align:left}
.entry-content code{background:var(--soft);padding:2px 6px;border-radius:6px;font-size:.9em}
.entry-content pre{background:var(--card);border:1px solid var(--bd);padding:16px;border-radius:10px;overflow-x:auto}
.entry-content img{border-radius:10px}
.alignleft{float:left;margin:0 20px 10px 0}.alignright{float:right;margin:0 0 10px 20px}.aligncenter{display:block;margin:0 auto}

/* =========================================================
   12. CONTACT
   ========================================================= */
.stat{text-align:center}.stat b{display:block;font-size:26px;color:var(--h);line-height:1.2}.stat span{font-size:13px;color:var(--m)}
.mail{color:var(--ac);text-decoration:underline}

/* =========================================================
   13. EXTRAS
   ========================================================= */
.chips{position:relative}
.pagination ul{list-style:none;display:flex;gap:6px;justify-content:center;flex-wrap:wrap;padding:0;margin:0}
.brand .custom-logo-link{display:flex}