/* ============================================================
   BoiScan — Design System (Bootstrap 5 + tokens próprios)
   Paleta: verde-pasto profundo + dourado (arroba) + neutros quentes
   Tipografia: Sora (títulos) / Inter (texto)
   ============================================================ */
:root {
  --bs-primary: #0f3d2e;
  --bs-primary-rgb: 15, 61, 46;
  --bs-secondary: #6b7280;
  --bs-success: #1f8a4c;
  --bs-warning: #d4a017;
  --bs-danger: #c0392b;
  --bs-info: #2b6cb0;
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bs-body-bg: #f6f5f1;
  --bs-body-color: #1f2937;
  --bs-border-radius: .75rem;
  --bs-link-color: #0f3d2e;
  --bs-link-hover-color: #1f8a4c;
  --bsk-green: #0f3d2e;
  --bsk-green-2: #1f8a4c;
  --bsk-green-soft: #e3f1e9;
  --bsk-gold: #d4a017;
  --bsk-gold-soft: #fbf3dc;
  --bsk-ink: #111827;
  --bsk-muted: #6b7280;
  --bsk-line: #e5e7eb;
  --bsk-card: #ffffff;
  --bsk-sidebar-w: 264px;
}
html, body { height: 100%; }
body { font-family: var(--bs-body-font-family); background: var(--bs-body-bg); color: var(--bs-body-color); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, .display-num, .brand { font-family: 'Sora', 'Inter', system-ui, sans-serif; letter-spacing: -.01em; }
a { text-decoration: none; }

/* ---------- Layout ---------- */
.bsk-shell { display: flex; min-height: 100vh; }
.bsk-sidebar { width: var(--bsk-sidebar-w); background: linear-gradient(180deg, #0f3d2e 0%, #0b2e23 100%); color: #d9e7df; position: fixed; inset: 0 auto 0 0; padding: 1.25rem 1rem; overflow-y: auto; z-index: 1040; transition: transform .25s ease; }
.bsk-sidebar .brand { color: #fff; font-weight: 700; font-size: 1.35rem; display: flex; align-items: center; gap: .6rem; padding: .25rem .5rem 1rem; }
.bsk-sidebar .brand .logo { width: 36px; height: 36px; border-radius: 10px; background: var(--bsk-gold); display: grid; place-items: center; color: #0f3d2e; font-weight: 800; }
.bsk-sidebar .nav-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; color: #8fb3a3; padding: 1rem .75rem .35rem; }
.bsk-sidebar .nav-link { color: #d9e7df; border-radius: .6rem; padding: .55rem .75rem; display: flex; align-items: center; gap: .65rem; font-size: .93rem; font-weight: 500; }
.bsk-sidebar .nav-link:hover { background: rgba(255,255,255,.07); color: #fff; }
.bsk-sidebar .nav-link.active { background: rgba(212,160,23,.18); color: #fff; box-shadow: inset 3px 0 0 var(--bsk-gold); }
.bsk-sidebar .nav-link i { width: 20px; text-align: center; opacity: .9; }
.bsk-main { margin-left: var(--bsk-sidebar-w); flex: 1; min-width: 0; display: flex; flex-direction: column; }
.bsk-topbar { background: #fff; border-bottom: 1px solid var(--bsk-line); padding: .75rem 1.5rem; display: flex; align-items: center; gap: 1rem; position: sticky; top: 0; z-index: 1030; }
.bsk-content { padding: 1.5rem; flex: 1; }
.bsk-impersonate { background: var(--bsk-gold); color: #0f3d2e; font-weight: 600; padding: .5rem 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.bsk-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1039; }
@media (max-width: 991.98px) {
  .bsk-sidebar { transform: translateX(-100%); }
  .bsk-sidebar.open { transform: translateX(0); }
  .bsk-backdrop.show { display: block; }
  .bsk-main { margin-left: 0; }
  .bsk-content { padding: 1rem; }
}

/* ---------- Componentes ---------- */
.card { border: 1px solid var(--bsk-line); border-radius: 1rem; box-shadow: 0 1px 2px rgba(17,24,39,.04); background: var(--bsk-card); }
.card-header { background: transparent; border-bottom: 1px solid var(--bsk-line); font-weight: 600; font-family: 'Sora', sans-serif; padding: .9rem 1.25rem; }
.stat-card { padding: 1.1rem 1.25rem; display: flex; align-items: center; gap: 1rem; }
.stat-card .icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-size: 1.2rem; background: var(--bsk-green-soft); color: var(--bsk-green); flex-shrink: 0; }
.stat-card .icon.gold { background: var(--bsk-gold-soft); color: #9a7208; }
.stat-card .icon.red { background: #fde8e6; color: var(--bs-danger); }
.stat-card .icon.blue { background: #e4edf8; color: var(--bs-info); }
.stat-card .label { font-size: .78rem; color: var(--bsk-muted); text-transform: uppercase; letter-spacing: .06em; }
.stat-card .value { font-family: 'Sora', sans-serif; font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.btn { border-radius: .65rem; font-weight: 600; padding: .5rem 1rem; }
.btn-primary { background: var(--bsk-green); border-color: var(--bsk-green); }
.btn-primary:hover, .btn-primary:focus { background: #14513d; border-color: #14513d; }
.btn-gold { background: var(--bsk-gold); border-color: var(--bsk-gold); color: #0f3d2e; }
.btn-gold:hover { background: #bd8e12; border-color: #bd8e12; color: #0f3d2e; }
.btn-outline-primary { color: var(--bsk-green); border-color: var(--bsk-green); }
.btn-outline-primary:hover { background: var(--bsk-green); border-color: var(--bsk-green); }
.btn-lg { padding: .8rem 1.4rem; font-size: 1.05rem; }
.form-control, .form-select { border-radius: .65rem; border-color: #d1d5db; padding: .55rem .8rem; }
.form-control:focus, .form-select:focus { border-color: var(--bsk-green-2); box-shadow: 0 0 0 .2rem rgba(31,138,76,.15); }
.form-label { font-weight: 600; font-size: .85rem; color: #374151; }
.table { --bs-table-bg: transparent; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--bsk-muted); font-weight: 600; border-bottom: 1px solid var(--bsk-line); }
.table td { vertical-align: middle; }
.table-hover tbody tr:hover { background: #f9faf9; }
.badge-status { font-weight: 600; padding: .4em .7em; border-radius: 999px; font-size: .72rem; letter-spacing: .02em; }
.text-gold { color: #9a7208 !important; }
.bg-green-soft { background: var(--bsk-green-soft) !important; }
.bg-gold-soft { background: var(--bsk-gold-soft) !important; }
.modal-content { border-radius: 1rem; border: 0; }
.toast-container { z-index: 2000; }
.empty-state { text-align: center; padding: 3rem 1rem; color: var(--bsk-muted); }
.empty-state i { font-size: 2.6rem; opacity: .35; display: block; margin-bottom: .75rem; }
.page-title { font-size: 1.45rem; font-weight: 700; margin: 0; }
.page-sub { color: var(--bsk-muted); font-size: .9rem; }
.thumb { width: 56px; height: 56px; border-radius: .6rem; object-fit: cover; background: #e5e7eb; }
.thumb-lg { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: .75rem; background: #e5e7eb; }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--bsk-green); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: .85rem; }
.kv { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; font-size: .9rem; }
.kv dt { color: var(--bsk-muted); font-weight: 500; }
.kv dd { margin: 0; text-align: right; font-weight: 600; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85rem; }
.token-box { font-family: ui-monospace, monospace; font-size: 1.25rem; letter-spacing: .08em; background: var(--bsk-gold-soft); border: 2px dashed var(--bsk-gold); border-radius: .75rem; padding: 1rem; text-align: center; word-break: break-all; }

/* ---------- Cartão de peso (regra: nunca só um número) ---------- */
.weight-card { border-radius: 1rem; padding: 1.25rem; background: linear-gradient(135deg, #0f3d2e, #1a5a44); color: #fff; }
.weight-card .kg { font-family: 'Sora', sans-serif; font-size: 2.6rem; font-weight: 800; line-height: 1; }
.weight-card .range { font-size: 1rem; opacity: .9; }
.weight-card .meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .6rem; margin-top: 1rem; }
.weight-card .meta div { background: rgba(255,255,255,.1); border-radius: .6rem; padding: .5rem .7rem; font-size: .8rem; }
.weight-card .meta b { display: block; font-size: 1rem; }
.weight-card.low { background: linear-gradient(135deg, #7a5a08, #b5860f); }
.weight-card.rejected { background: linear-gradient(135deg, #6b2019, #a33326); }
.conf-bar { height: 8px; border-radius: 4px; background: rgba(255,255,255,.2); overflow: hidden; }
.conf-bar > span { display: block; height: 100%; background: var(--bsk-gold); }

/* ---------- Skeleton ---------- */
.skeleton { background: linear-gradient(90deg, #eceeec 25%, #f5f6f5 50%, #eceeec 75%); background-size: 200% 100%; animation: sk 1.2s infinite; border-radius: .5rem; min-height: 1em; }
@keyframes sk { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ---------- Responsivo: tabela vira cards ---------- */
@media (max-width: 767.98px) {
  .table-cards thead { display: none; }
  .table-cards tr { display: block; border: 1px solid var(--bsk-line); border-radius: .75rem; margin-bottom: .75rem; padding: .5rem .75rem; background: #fff; }
  .table-cards td { display: flex; justify-content: space-between; gap: 1rem; border: 0; padding: .35rem 0; }
  .table-cards td::before { content: attr(data-label); font-weight: 600; color: var(--bsk-muted); font-size: .8rem; }
  .stat-card .value { font-size: 1.25rem; }
}

/* ---------- Login ---------- */
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; }
.auth-hero { background: radial-gradient(1200px 600px at 20% 10%, #1f8a4c33, transparent), linear-gradient(160deg, #0f3d2e, #08261c); color: #fff; padding: 3rem; display: flex; flex-direction: column; justify-content: space-between; }
.auth-hero h1 { font-size: 2.6rem; font-weight: 800; }
.auth-hero .tag { color: var(--bsk-gold); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; }
.auth-form { display: grid; place-items: center; padding: 2rem; }
.auth-form .card { width: 100%; max-width: 420px; padding: 2rem; }
@media (max-width: 991.98px) { .auth-wrap { grid-template-columns: 1fr; } .auth-hero { padding: 2rem; min-height: 200px; } }

/* ---------- Print ---------- */
@media print { .bsk-sidebar, .bsk-topbar, .no-print { display: none !important; } .bsk-main { margin: 0; } .card { box-shadow: none; } }
