/* ============================================================
   Rakiya.lk  —  Design tokens & components (layers on Bootstrap 5)
   Palette: ink navy #0E1B34 · spring green #12B76A · amber #FFB020
   Type: Sora (display) · Inter (Latin body) · Noto Sans Sinhala
   ============================================================ */
:root{
  --ink:#0E1B34; --ink-2:#1B2C4E; --green:#12B76A; --green-d:#0E9457;
  --amber:#FFB020; --paper:#F6F8FB; --line:#E6EBF2; --muted:#667085;
  --radius:14px; --shadow:0 6px 24px rgba(14,27,52,.08);
  --shadow-sm:0 2px 8px rgba(14,27,52,.06);
  --bs-primary:var(--green);
}
*{ -webkit-tap-highlight-color: transparent; }
body{
  font-family:'Inter','Noto Sans Sinhala',system-ui,sans-serif;
  color:var(--ink); background:var(--paper); font-size:15px; line-height:1.6;
}
:lang(si), [lang="si"]{ font-family:'Noto Sans Sinhala','Inter',sans-serif; }
h1,h2,h3,h4,h5,.display,.navbar-brand{
  font-family:'Sora','Noto Sans Sinhala',sans-serif; font-weight:700; letter-spacing:-.01em;
}
a{ color:var(--green-d); text-decoration:none; }
a:hover{ color:var(--ink); }
.text-muted2{ color:var(--muted)!important; }

/* ---- buttons ---- */
.btn{ border-radius:10px; font-weight:600; padding:.55rem 1.1rem; }
.btn-primary,.btn-success{ background:var(--green); border-color:var(--green); }
.btn-primary:hover,.btn-success:hover{ background:var(--green-d); border-color:var(--green-d); }
.btn-ink{ background:var(--ink); color:#fff; }
.btn-ink:hover{ background:var(--ink-2); color:#fff; }
.btn-amber{ background:var(--amber); color:var(--ink); }
.btn-outline-ink{ border:1.5px solid var(--ink); color:var(--ink); }
.btn-outline-ink:hover{ background:var(--ink); color:#fff; }

/* ---- navbar ---- */
.navbar{ background:#fff!important; box-shadow:var(--shadow-sm); padding:.6rem 0; }
.navbar-brand{ font-size:1.35rem; color:var(--ink)!important; }
.brand-dot{ color:var(--green); }
.nav-link{ font-weight:500; color:var(--ink)!important; }
.nav-link:hover{ color:var(--green-d)!important; }
.lang-toggle a{ font-weight:600; font-size:.82rem; padding:.15rem .5rem; border-radius:6px; color:var(--muted); }
.lang-toggle a.on{ background:var(--ink); color:#fff; }

/* ---- hero ---- */
.hero{ background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 100%); color:#fff;
  border-radius:0 0 28px 28px; position:relative; overflow:hidden; }
.hero::after{ content:""; position:absolute; right:-80px; top:-80px; width:280px; height:280px;
  background:radial-gradient(circle,var(--green) 0%,transparent 70%); opacity:.25; }
.hero h1{ color:#fff; font-size:clamp(1.7rem,4.5vw,2.9rem); }
.hero .lead{ color:#C9D4E6; }
.search-card{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:.5rem; }
.search-card .form-control,.search-card .form-select{ border:none; box-shadow:none; }
.search-card .form-control:focus,.search-card .form-select:focus{ box-shadow:none; }

/* ---- cards ---- */
.card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.job-card{ transition:transform .15s ease, box-shadow .15s ease; border-left:3px solid transparent; }
.job-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-left-color:var(--green); }
.job-logo{ width:52px; height:52px; border-radius:12px; object-fit:cover; background:var(--paper);
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  font-weight:700; color:var(--ink); font-size:1.2rem; }
.chip{ display:inline-flex; align-items:center; gap:.3rem; font-size:.78rem; font-weight:600;
  padding:.2rem .6rem; border-radius:20px; background:var(--paper); color:var(--ink); border:1px solid var(--line); }
.chip-green{ background:rgba(18,183,106,.1); color:var(--green-d); border-color:transparent; }

/* ---- category tiles ---- */
.cat-tile{ display:block; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:1.1rem; text-align:center; transition:.15s; height:100%; }
.cat-tile:hover{ border-color:var(--green); transform:translateY(-2px); }
.cat-tile .ic{ font-size:1.6rem; }

/* ---- package cards ---- */
.pkg{ border:1.5px solid var(--line); border-radius:18px; background:#fff; overflow:hidden; height:100%; }
.pkg.featured{ border-color:var(--green); box-shadow:var(--shadow); }
.pkg-head{ padding:1.4rem; text-align:center; }
.pkg.featured .pkg-head{ background:var(--ink); color:#fff; }
.pkg .price{ font-family:'Sora',sans-serif; font-size:2.1rem; font-weight:800; }
.pkg ul{ list-style:none; padding:0 1.4rem 1.4rem; margin:0; }
.pkg ul li{ padding:.45rem 0; border-bottom:1px dashed var(--line); font-size:.92rem; }
.pkg ul li::before{ content:"✓"; color:var(--green); font-weight:800; margin-right:.5rem; }

/* ---- forms ---- */
.form-control,.form-select{ border-radius:10px; border:1.5px solid var(--line); padding:.6rem .8rem; }
.form-control:focus,.form-select:focus{ border-color:var(--green); box-shadow:0 0 0 3px rgba(18,183,106,.12); }
.form-label{ font-weight:600; font-size:.88rem; margin-bottom:.3rem; }
.auth-wrap{ max-width:440px; margin:2.5rem auto; }
.auth-card{ background:#fff; border-radius:18px; box-shadow:var(--shadow); padding:2rem; }

/* ---- dashboard shell ---- */
.dash{ display:flex; gap:1.25rem; align-items:flex-start; }
.side{ width:230px; flex:0 0 230px; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); padding:.6rem; position:sticky; top:1rem; }
.side a{ display:flex; align-items:center; gap:.6rem; padding:.6rem .8rem; border-radius:10px;
  color:var(--ink); font-weight:500; margin-bottom:.15rem; }
.side a.active,.side a:hover{ background:var(--paper); color:var(--green-d); }
.side a.active{ background:var(--ink); color:#fff; }
.dash-main{ flex:1 1 auto; min-width:0; }
.stat{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem; }
.stat .n{ font-family:'Sora',sans-serif; font-size:1.8rem; font-weight:800; }
.stat .l{ color:var(--muted); font-size:.85rem; }

/* ---- footer ---- */
footer.site{ background:var(--ink); color:#C9D4E6; margin-top:3rem; }
footer.site a{ color:#C9D4E6; } footer.site a:hover{ color:#fff; }

/* ---- mobile ---- */
@media (max-width:768px){
  .dash{ flex-direction:column; }
  .side{ width:100%; flex:auto; position:static; display:flex; overflow-x:auto; gap:.3rem; }
  .side a{ white-space:nowrap; margin-bottom:0; }
  .hero{ border-radius:0 0 20px 20px; }
}

/* ---- CV print ---- */
.cv-sheet{ background:#fff; max-width:800px; margin:1.5rem auto; padding:2.4rem;
  box-shadow:var(--shadow); border-radius:8px; }
.cv-sheet h1{ font-size:1.8rem; margin-bottom:.1rem; }
.cv-sheet .cv-head{ border-bottom:3px solid var(--green); padding-bottom:1rem; margin-bottom:1.2rem; }
.cv-sheet .cv-sec{ margin-bottom:1.3rem; }
.cv-sheet .cv-sec h3{ font-size:1.05rem; color:var(--green-d); text-transform:uppercase;
  letter-spacing:.05em; border-bottom:1px solid var(--line); padding-bottom:.3rem; margin-bottom:.6rem; }
.cv-photo{ width:110px; height:110px; border-radius:12px; object-fit:cover; }
@media print{
  body{ background:#fff; } .no-print{ display:none!important; }
  .cv-sheet{ box-shadow:none; margin:0; max-width:100%; padding:0; }
  @page{ margin:1.5cm; }
}