/* ============================================================
   GovFormBD Portal — global styles
   Font: NikoshBAN (bundled locally in assets/fonts)
   Palette: emerald #047857 / #065f46, warm cream accents
   ============================================================ */

@font-face {
  font-family: 'NikoshBAN';
  src: url('../fonts/NikoshBAN.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: 'NikoshBAN', 'SolaimanLipi', 'Kalpurush', 'Noto Sans Bengali', sans-serif;
  line-height: 1.7;
}

/* hide Alpine-managed elements until Alpine initializes */
[x-cloak] { display: none !important; }

/* ── Tool cards: organized desk files ─────────────────────── */
.tool-card {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.tool-card.is-open:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 20px -8px rgb(4 120 87 / .25);
}

/* ── Category pills: tactile drawer tabs ──────────────────── */
.cat-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem 1.1rem;
  border-radius: 9999px;
  border-width: 2px;
  font-weight: 700;
  transition: transform .12s ease, box-shadow .15s ease,
              background-color .15s ease, color .15s ease, border-color .15s ease;
}
.cat-pill:active { transform: translateY(1px) scale(.98); }

/* ── Quick-search chips ───────────────────────────────────── */
.quick-chip {
  display: inline-flex;
  align-items: center;
  padding: .35rem .9rem;
  border-radius: 9999px;
  background: #fff;
  border: 1.5px solid #a7f3d0;
  color: #065f46;
  font-weight: 600;
  transition: background-color .15s ease, transform .12s ease,
              box-shadow .15s ease, border-color .15s ease;
}
.quick-chip:hover {
  background: #ecfdf5;
  border-color: #047857;
  box-shadow: 0 3px 8px -2px rgb(4 120 87 / .25);
  transform: translateY(-1px);
}
.quick-chip:active { transform: translateY(0); }

/* ── Floating help button ─────────────────────────────────── */
.help-fab { animation: fab-pop .4s ease-out; }
@keyframes fab-pop {
  from { opacity: 0; transform: translateY(12px); }
}

/* ── Help modal entrance ──────────────────────────────────── */
.modal-panel { animation: modal-pop .18s ease-out; }
@keyframes modal-pop {
  from { opacity: 0; transform: translateY(10px) scale(.98); }
}

/* ── Comfortable, visible focus for keyboard users ────────── */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #047857;
  outline-offset: 2px;
  border-radius: .5rem;
}

/* ── Respect users who prefer less motion ─────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ── Print: keep only the directory listing ───────────────── */
@media print {
  header, footer, .no-print, .help-fab { display: none !important; }
  body { background: #fff !important; font-size: 12pt; }
  .tool-card { break-inside: avoid; box-shadow: none !important; border-color: #d1d5db !important; }
  .cat-pill { border-color: #d1d5db !important; color: #1f2937 !important; background: #fff !important; }
}