/* Akva brand tokens — used via Tailwind arbitrary values and inline classes. */
:root {
  --akva-aqua:        #1FA8C7;
  --akva-aqua-dark:   #0F4C5C;
  --akva-cyan:        #00BFD4;
  --akva-navy:        #0D2A3A;
  --akva-bg:          #F4FAFC;
  --akva-surface:     #FFFFFF;
  --akva-border:      #E1ECEF;
  --akva-text:        #0D2A3A;
  --akva-text-muted:  #6B7C85;
  --akva-success:     #10B981;
  --akva-warning:     #F59E0B;
  --akva-danger:      #EF4444;
}

html, body {
  background: var(--akva-bg);
  color: var(--akva-text);
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "SF Pro Display", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.status-pending     { background:#FEF3C7; color:#92400E; }
.status-confirmed   { background:#DBEAFE; color:#1E40AF; }
.status-assembling  { background:#E0E7FF; color:#3730A3; }
.status-in_delivery { background:#CFFAFE; color:#0E7490; }
.status-delivered   { background:#D1FAE5; color:#065F46; }
.status-cancelled   { background:#FEE2E2; color:#991B1B; }

.btn-primary {
  background: var(--akva-aqua);
  color: white;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  transition: background .15s;
}
.btn-primary:hover { background: var(--akva-aqua-dark); }

.btn-ghost {
  color: var(--akva-text);
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 14px;
  border: 1px solid var(--akva-border);
  background: white;
  transition: background .15s;
}
.btn-ghost:hover { background: #F0F6F8; }

.card {
  background: var(--akva-surface);
  border: 1px solid var(--akva-border);
  border-radius: 12px;
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border-radius: 10px;
  color: var(--akva-text-muted);
  font-size: 14px;
  font-weight: 500;
  transition: all .15s;
  text-decoration: none;
}
.sidebar-link:hover { background: rgba(31, 168, 199, 0.08); color: var(--akva-text); }
.sidebar-link.active {
  background: rgba(31, 168, 199, 0.12);
  color: var(--akva-aqua-dark);
}

input.akva, select.akva, textarea.akva {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--akva-border);
  border-radius: 8px;
  font-size: 14px;
  background: white;
  color: var(--akva-text);
  transition: border-color .15s, box-shadow .15s;
}
input.akva:focus, select.akva:focus, textarea.akva:focus {
  outline: none;
  border-color: var(--akva-aqua);
  box-shadow: 0 0 0 3px rgba(31, 168, 199, 0.15);
}

.table-row:hover { background: #FAFCFD; }

.metric-card {
  background: white;
  border: 1px solid var(--akva-border);
  border-radius: 12px;
  padding: 20px;
}
.metric-value { font-size: 28px; font-weight: 700; color: var(--akva-text); letter-spacing: -0.02em; }
.metric-label { font-size: 13px; color: var(--akva-text-muted); margin-top: 4px; }
.metric-delta { font-size: 12px; color: var(--akva-success); margin-top: 8px; }