/*
Theme Name: Japan Talent Matching
Theme URI: https://example.com/japan-talent-matching
Author: Tayyab Anwar
Author URI: https://example.com
Description: Custom job matching theme. Tailwind + ACF + WPML ready.
Version: 0.2.0
Text Domain: japantalent
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ========== Minimal Mist — Design Tokens ========== */
:root{
  /* Brand gradient */
  --brand-1:#0b1220;   /* deepest */
  --brand-2:#1e293b;   /* slate-800 */
  --brand-3:#111827;   /* slate-900 for surfaces */

  /* Text */
  --text-strong:#e5e7eb;  /* main text on dark */
  --text-soft:#cbd5e1;    /* muted on dark */
  --text-invert:#0b1220;  /* text over accent */

  /* Links / accent */
  --accent:#60a5fa;  /* Minimal Mist accent */
  --link:#93c5fd;    /* Link hover/alt */

  /* Surfaces */
  --surface-1:#0f172a; /* dark cards */
  --surface-2:#0c1524; /* dropdowns */
  --border-soft:rgba(255,255,255,.08);
}

/* Helpers */
.bg-brand-gradient{
  background: linear-gradient(90deg, var(--brand-1) 0%, var(--brand-2) 100%);
  color: var(--text-strong);
}

/* Header: menu colors */
.jt-menu a{ color:var(--text-strong); text-decoration:none; transition:color .15s ease, opacity .15s ease; }
.jt-menu a:hover{ color:var(--link); }

/* Header pills */
.jt-pill{
  display:inline-flex; align-items:center; gap:.45rem; height:36px; padding:0 .9rem;
  border-radius:9999px; font-weight:600; font-size:14px; line-height:1; white-space:nowrap;
  transition:background .15s ease, color .15s ease, filter .15s ease, border-color .15s ease;
}
.jt-pill--ghost{ background:rgba(255,255,255,.10); color:var(--text-strong); border:1px solid var(--border-soft); }
.jt-pill--ghost:hover{ background:rgba(255,255,255,.16); }
.jt-pill--accent{ background:var(--accent); color:var(--text-invert); border:1px solid rgba(0,0,0,.08); }
.jt-pill--accent:hover{ filter:brightness(1.08); }

/* Footer */
.site-footer{
  background: radial-gradient(1200px 600px at 10% -20%, rgba(255,255,255,.04) 0%, transparent 60%),
              linear-gradient(180deg, var(--brand-1) 0%, var(--brand-2) 100%);
  color: var(--text-strong);
}
.site-footer .footer-links a,
.site-footer .footer-link{ color:var(--text-strong); opacity:.85; transition:color .15s ease, opacity .15s ease; }
.site-footer .footer-links a:hover,
.site-footer .footer-link:hover{ color:var(--link); opacity:1; }

/* Buttons for light/dark blocks */
.jt-btn{ display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 14px; border-radius:.6rem; font-weight:600; text-decoration:none; }
.jt-btn--light{ background:#ffffff; color:#1e293b; }
.jt-btn--light:hover{ background:#f1f5f9; }
.jt-btn--accent{ background:var(--accent); color:var(--text-invert); }
.jt-btn--accent:hover{ filter:brightness(1.06); }

/* Accent text & links */
.text-accent{ color:var(--accent) !important; }
.link-accent{ color:var(--link); text-decoration:none; }
.link-accent:hover{ color:#cfe2ff; text-decoration:underline; }

/* Cards / chips (used on home) */
.card{ background:#fff; border:1px solid #e2e8f0; border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.02); }
.card:hover{ border-color:var(--accent); box-shadow:0 8px 18px rgba(2,6,23,.08); transform:translateY(-1px); }

.chip{ font-size:12px; line-height:1; background:#f1f5f9; color:#0f172a; border-radius:9999px; padding:6px 10px; }
.chip--muted{ background:#e5e7eb; color:#111827; }
.chip--accent{ background:rgba(96,165,250,.18); color:#1d4ed8; }

/* Newsletter/contact card on dark */
.card--dark{ background:rgba(255,255,255,.06); border:1px solid var(--border-soft); color:var(--text-strong); }

/* Utilities for hero search */
.jt-search-btn{ background:var(--accent); color:var(--text-invert); border:0; border-radius:10px; padding:.75rem 1rem; font-weight:600; white-space:nowrap; cursor:pointer; }
.jt-search-btn:hover{ filter:brightness(1.06); }
.jt-search-btn:focus{ outline:2px solid var(--link); outline-offset:2px; }

/* Accessibility niceties */
a:focus-visible, button:focus-visible{ outline:2px solid var(--link); outline-offset:2px; }
