/*
 * Crystals app stylesheet. Tailwind utility classes are loaded via Play CDN
 * in the layout with Water Rangers brand colours injected. This file holds:
 *   - Tabulator grid skin overrides (its default theme is generic)
 *   - A few global tweaks Tailwind can't easily express
 */

/* ── Tabulator brand skin ───────────────────────────────────────── */

.tabulator {
  border: 1px solid #e5e7eb !important;
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.tabulator .tabulator-header {
  background: #e7f4fa !important; /* wr-sky-light */
  border-bottom: 1px solid #cfe2ec !important;
}

.tabulator .tabulator-header .tabulator-col {
  background: transparent !important;
  border-right: 1px solid rgba(13, 53, 92, 0.08) !important;
}

.tabulator .tabulator-header .tabulator-col-content {
  padding: 0.6rem 0.75rem !important;
}

.tabulator .tabulator-header .tabulator-col-title {
  color: #0c2240 !important; /* wr-navy-dark */
  font-weight: 600 !important;
  font-size: 0.78rem !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tabulator .tabulator-row {
  border-bottom: 1px solid #f3f4f6 !important;
  background: #ffffff;
  transition: background 0.12s ease;
}

.tabulator .tabulator-row.tabulator-row-even {
  background: #fafbfc;
}

.tabulator .tabulator-row:hover {
  background: #f0f9ff !important; /* very soft sky */
  cursor: pointer;
}

.tabulator .tabulator-row .tabulator-cell {
  padding: 0.55rem 0.75rem !important;
  font-size: 0.88rem;
  border-right: 1px solid rgba(13, 53, 92, 0.04) !important;
}

.tabulator .tabulator-footer {
  background: #f1f5f9 !important;
  border-top: 1px solid #cbd5e1 !important;
  font-weight: 600;
}

.tabulator .tabulator-footer .tabulator-calcs-holder {
  background: #f1f5f9 !important;
  border-top: none !important;
  border-bottom: none !important;
}

.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row {
  background: transparent !important;
}

.tabulator .tabulator-footer .tabulator-cell {
  font-weight: 700 !important;
  color: #0c2240 !important;
}

.tabulator .tabulator-cell.tabulator-editing input {
  border: 2px solid #0ea5e9 !important;
  outline: none !important;
}

/* Tabulator frozen columns shouldn't break their cell background on hover */
.tabulator .tabulator-row .tabulator-cell.tabulator-frozen {
  background: inherit !important;
}

/* ── Form inputs (focus ring with WR sky) ───────────────────────── */

input[type="text"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #0ea5e9 !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.15);
}

/* ── Heading rhythm ─────────────────────────────────────────────── */

h1, h2 {
  font-family: "Tungsten Rounded A", "Tungsten Rounded B", "Helvetica Neue Condensed", "Arial Narrow", sans-serif;
  letter-spacing: 0.01em;
}