/*
Theme Name: Map Generator
Theme URI: https://example.com/
Author: Ryne
Description: Procedural world maps and Minecraft seed maps with accounts, saved maps and Stripe subscriptions. Activate it and the Map, Pricing, Sign up, Log in, Account and My maps pages are created for you. Connect Stripe under Settings > Map.
Version: 1.2.2
Requires at least: 6.0
Tested up to: 6.8
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: coolmap
*/

:root{
  --bg:#e9eeec; --panel:#f4f7f6; --panel-2:#e3e9e7; --field:#ffffff;
  --ink:#1c2a33; --muted:#5b6a71; --line:#cdd7d5;
  --accent:#2c6a6e; --on-accent:#f2fbfa; --brass:#a9821c; --danger:#b3261e; --ok:#1c7c43;
  --stage:#d5ddda; --stage-2:#c4cfcb; --glow:rgba(90,150,200,.35);
  --chip:rgba(244,247,246,.92); --shadow:0 6px 20px rgba(28,42,51,.12);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#10171b; --panel:#141d22; --panel-2:#1b262c; --field:#1f2b32;
    --ink:#dde6e5; --muted:#8c9ca1; --line:#26333a;
    --accent:#76bdb6; --on-accent:#0d1a1c; --brass:#d8b44c; --danger:#ff8a80; --ok:#7fd49b;
    --stage:#0b1114; --stage-2:#121b20; --glow:rgba(110,170,235,.42);
    --chip:rgba(20,29,34,.9); --shadow:0 6px 24px rgba(0,0,0,.4);
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
html{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 "Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* ---------- Site header ---------- */
.site{flex:none;display:flex;align-items:center;gap:6px;padding:0 16px;min-height:56px;background:var(--panel);border-bottom:1px solid var(--line);position:relative;z-index:5}
.site .logo{display:flex;align-items:center;gap:9px;color:var(--accent);flex:none;margin-right:8px;text-decoration:none}
.site .logo img,.site .logo .logo-img{height:38px;width:auto;max-width:160px;object-fit:contain;display:block}
.site .pages{display:flex;gap:4px;overflow-x:auto;min-width:0;scrollbar-width:none}
.site .pages a{padding:8px 13px;border-radius:8px;color:var(--muted);font-weight:500;white-space:nowrap;text-decoration:none;font-size:14px}
.site .pages a:hover{color:var(--ink)}
.site .pages a[aria-current="page"]{background:var(--panel-2);color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.site-user{margin-left:auto;display:flex;align-items:center;gap:4px;flex:none}
.site-user a{padding:7px 11px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:14px;white-space:nowrap}
.site-user a:hover{background:var(--panel-2)}
.site-user .cta{background:var(--accent);color:var(--on-accent);font-weight:600}
.site-user .cta:hover{background:var(--accent);filter:brightness(1.07)}
.badge{display:inline-block;font-size:11px;font-weight:600;padding:2px 7px;border-radius:999px;background:var(--panel-2);color:var(--muted);margin-left:6px;vertical-align:1px}
.badge.premium{background:var(--brass);color:#fff}
@media (max-width:900px){.site{flex-wrap:wrap;padding:6px 12px;gap:4px}.site .pages{order:3;width:100%}.site-user{margin-left:auto}.site-user .hide-sm{display:none}}

/* ---------- Content pages ---------- */
.site-main{max-width:1080px;margin:0 auto;padding:40px 20px 64px}
.site-main.narrow{max-width:520px}
.page-title{font:600 34px/1.15 Spectral,Georgia,serif;margin:0 0 8px}
.lede{color:var(--muted);margin:0 0 28px;font-size:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px}
.card h2{font:600 20px/1.3 Spectral,Georgia,serif;margin:0 0 10px}
.form-row{margin:0 0 14px}
.form-row label{display:block;font-weight:500;font-size:14px;margin-bottom:5px}
.form-row input[type=text],.form-row input[type=email],.form-row input[type=password]{width:100%;background:var(--field);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.form-row small{display:block;color:var(--muted);font-size:12.5px;margin-top:4px}
.check-row{display:flex;gap:8px;align-items:center;font-size:14px;margin:0 0 16px}
.hp{position:absolute!important;left:-9999px!important}
.button,.button-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:9px;padding:11px 18px;font-weight:600;text-decoration:none;cursor:pointer;border:1px solid transparent;font-size:15px}
.button{background:var(--accent);color:var(--on-accent)}
.button:hover{filter:brightness(1.07)}
.button-ghost{background:var(--field);color:var(--ink);border-color:var(--line)}
.button-ghost:hover{border-color:var(--accent)}
.button.wide,.button-ghost.wide{width:100%}
.button-danger{color:var(--danger)}
.notice{border-radius:10px;padding:12px 14px;margin:0 0 18px;font-size:14px;border:1px solid var(--line);background:var(--panel-2)}
.notice.error{border-color:rgba(179,38,30,.4);color:var(--danger)}
.notice.success{border-color:rgba(28,124,67,.4);color:var(--ok)}
.form-foot{margin-top:16px;font-size:14px;color:var(--muted)}
.plan-pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:600;background:var(--panel-2)}
.plan-pill.premium{background:var(--brass);color:#fff}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:8px 18px;margin:12px 0 20px;font-size:14.5px}
.kv dt{color:var(--muted)}
.kv dd{margin:0}
.actions{display:flex;flex-wrap:wrap;gap:10px}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}

/* ---------- Pricing ---------- */
.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:8px}
.price-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;display:flex;flex-direction:column}
.price-card.featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow)}
.price-card h2{font:600 20px Spectral,Georgia,serif;margin:0}
.price-card .price{font:600 40px/1 Spectral,Georgia,serif;margin:14px 0 2px}
.price-card .per{color:var(--muted);font-size:14px}
.price-card .save{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:600;color:var(--ok)}
.price-card ul{list-style:none;padding:0;margin:18px 0 22px;display:grid;gap:8px;font-size:14.5px;flex:1}
.price-card li{padding-left:22px;position:relative}
.price-card li::before{content:"";position:absolute;left:2px;top:.45em;width:10px;height:6px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}

/* ---------- My maps ---------- */
.maps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin-top:18px}
.map-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.map-card .thumb{aspect-ratio:2/1;background:var(--stage);display:block;object-fit:cover;width:100%}
.map-card .meta{padding:12px 14px;flex:1}
.map-card h3{margin:0 0 3px;font:600 16px/1.3 Spectral,Georgia,serif}
.map-card .sub{color:var(--muted);font-size:12.5px}
.map-card .row{display:flex;gap:8px;padding:0 14px 14px}
.map-card .row .button,.map-card .row .button-ghost{padding:7px 12px;font-size:13.5px}
.map-card form{margin:0}
.usage{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-top:6px}
.empty-state{text-align:center;padding:48px 20px;color:var(--muted)}

/* ---------- Footer ---------- */
.site-foot{border-top:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:13.5px}
.site-foot .in{max-width:1080px;margin:0 auto;padding:28px 20px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between}
.site-foot a{color:var(--muted);text-decoration:none}
.site-foot a:hover{color:var(--ink)}
.site-foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.site-foot nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}
.site-foot.slim .in{padding:7px 16px;font-size:12px;max-width:none}

/* ---------- Generic content ---------- */
.entry-content{font-size:16px}
.entry-content > *{max-width:72ch}

/* Keep the footer at the bottom on short pages */
body:not(.coolmap-app){min-height:100vh;display:flex;flex-direction:column}
body:not(.coolmap-app) .site-main{flex:1 0 auto;width:100%}
.page-title + .entry-content{margin-top:22px}
