@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;500;600;700&family=Tenor+Sans&display=swap');

:root {
  --sh-dark: #1a2f04;
  --sh-olive: #5d8402;
  --sh-lime: #bacb4d;
  --sh-light: #d8d8d8;
  --sh-grey: #817d79;
  --sh-ink: #1a2f04;
  --sh-accent: #5d8402;
  --sh-accent-2: #bacb4d;
  --sh-surface: #ffffff;
  --sh-muted: #817d79;
  --sh-line: #d8d8d8;
  --sh-bg: #f4f5f0;
  --font-sans: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Tenor Sans", Georgia, serif;
}

body {
  color: var(--sh-ink);
  font-family: var(--font-sans);
  background:
    radial-gradient(1100px 480px at 8% -8%, rgba(186, 203, 77, 0.18), transparent 58%),
    radial-gradient(900px 420px at 100% 0%, rgba(93, 132, 2, 0.1), transparent 55%),
    var(--sh-bg);
}

h1, h2, h3, h4, h5, h6,
.navbar-brand,
.kpi-value {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: 0.01em;
}

.auth-body {
  background: linear-gradient(145deg, #1a2f04 0%, #2d4a08 50%, #1a2f04 100%);
}

.navbar-dark.bg-dark,
.navbar.bg-dark {
  background-color: var(--sh-dark) !important;
  border-bottom: 2px solid var(--sh-olive) !important;
}

.navbar-brand {
  color: var(--sh-lime) !important;
}

.nav-link.active,
.nav-tabs .nav-link.active {
  color: var(--sh-olive) !important;
  font-weight: 600;
}

.panel {
  background: var(--sh-surface);
  border: 1px solid var(--sh-line);
  border-radius: 12px;
  padding: 1.1rem 1.25rem;
  box-shadow: 0 1px 3px rgba(26, 47, 4, 0.06);
}

.kpi-card {
  background: linear-gradient(180deg, #fff 0%, #fafbf5 100%);
  border: 1px solid var(--sh-line);
  border-left: 4px solid var(--sh-lime);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  height: 100%;
}

.kpi-card.kpi-income { border-left-color: var(--sh-lime); }
.kpi-card.kpi-expense { border-left-color: var(--sh-grey); }
.kpi-card.kpi-tax { border-left-color: var(--sh-olive); }

.kpi-label {
  color: var(--sh-muted);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-family: var(--font-sans);
}

.kpi-value {
  font-size: 1.35rem;
  margin-top: 0.25rem;
  color: var(--sh-dark);
}

.btn-primary {
  background-color: var(--sh-olive);
  border-color: var(--sh-olive);
  color: #fff;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #4a6a02;
  border-color: #4a6a02;
  color: #fff;
}

.btn-outline-primary {
  color: var(--sh-olive);
  border-color: var(--sh-olive);
}

.btn-outline-primary:hover {
  background-color: var(--sh-olive);
  border-color: var(--sh-olive);
}

.badge.text-bg-success,
.text-bg-success {
  background-color: var(--sh-olive) !important;
}

.badge.text-bg-primary,
.text-bg-primary {
  background-color: var(--sh-dark) !important;
}

.badge.text-bg-warning {
  background-color: var(--sh-lime) !important;
  color: var(--sh-dark) !important;
}

.client-logo {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 10px;
  border: 1px solid var(--sh-line);
  background: #fff;
  padding: 4px;
}

.client-logo-lg {
  width: 120px;
  height: 120px;
}

.period-pills .btn-check:checked + .btn {
  background-color: var(--sh-olive);
  border-color: var(--sh-olive);
  color: #fff;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.calendar-head {
  font-size: 0.75rem;
  text-transform: uppercase;
  color: var(--sh-muted);
  text-align: center;
  padding: 0.35rem;
}

.calendar-cell {
  min-height: 84px;
  border: 1px solid var(--sh-line);
  border-radius: 8px;
  padding: 0.4rem;
  background: #fff;
}

.calendar-cell.empty {
  background: transparent;
  border-color: transparent;
}

.calendar-cell.has-pay {
  border-color: rgba(93, 132, 2, 0.45);
  background: rgba(186, 203, 77, 0.12);
}

.day-num {
  font-weight: 600;
  font-size: 0.85rem;
}

.table,
.table thead th,
.table tbody td,
.table-sm {
  font-family: var(--font-sans);
}

.table thead th {
  font-weight: 600;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--sh-muted);
}

.table tbody td {
  font-size: 0.92rem;
  vertical-align: middle;
}

.table thead.table-light {
  --bs-table-bg: #f0f2ea;
}

@media (max-width: 768px) {
  .kpi-value { font-size: 1.05rem; }
  .calendar-cell { min-height: 64px; }
}
