/* ============================================================================
   Orderyfy — Filament admin skin (light & clean)
   Scope: appearance only (fonts, colors, spacing, rounding). Zero behaviour changes.
   Target: Filament 5 `.fi-*` classes.
   ========================================================================== */

:root {
  --oy-green: #A6CE39;
  --oy-green-dark: #8EB82E;
  --oy-ink: #1F1F1F;
  --oy-mute: #6B7280;
  --oy-bg: #F6F7F3;
  --oy-card: #FFFFFF;
  --oy-light: #E8F7E9;
  --oy-border: #EEF0EA;
}

/* -------- Typography -------- */
.fi-body,
.fi-body .fi-topbar,
.fi-body .fi-sidebar,
.fi-body input,
.fi-body select,
.fi-body textarea,
.fi-body button {
  font-family: 'Plus Jakarta Sans','Inter', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}
.fi-header-heading,
.fi-section-header-heading,
.fi-ta-header-heading,
.fi-fo-section .fi-section-header-heading,
.fi-breadcrumbs,
h1, h2, h3, .fi-main-ctn h1, .fi-main-ctn h2 {
  letter-spacing: -0.01em;
  font-weight: 800;
}

/* -------- Page background -------- */
.fi-body { background: var(--oy-bg); color: var(--oy-ink); }
.fi-main { background: var(--oy-bg); }

/* -------- Topbar -------- */
.fi-topbar {
  background: #fff !important;
  border-bottom: 1px solid var(--oy-border) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
.fi-topbar .fi-logo img { height: 36px !important; width: auto; }
.fi-topbar .fi-topbar-item { color: var(--oy-ink); }
.fi-global-search-field input {
  border-radius: 999px !important;
  background: #F6F7F3 !important;
  border-color: var(--oy-border) !important;
}
.fi-global-search-field input:focus {
  box-shadow: 0 0 0 3px rgba(166,206,57,.25) !important;
  border-color: var(--oy-green) !important;
}

/* -------- Sidebar -------- */
.fi-sidebar {
  background: #fff !important;
  border-right: 1px solid var(--oy-border) !important;
}
.fi-sidebar-header {
  background: #fff !important;
  border-bottom: 1px solid var(--oy-border) !important;
}
.fi-sidebar-nav { padding: 10px 8px !important; }
.fi-sidebar-group { margin-top: 10px !important; margin-bottom: 2px !important; }
.fi-sidebar-group:first-child { margin-top: 0 !important; }
.fi-sidebar-group-label {
  color: var(--oy-green-dark) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 6px 12px 4px !important;
  opacity: .9;
}
.fi-sidebar-item-button {
  color: var(--oy-ink) !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  padding: 10px 12px !important;
  position: relative;
  transition: background .15s, color .15s;
}
.fi-sidebar-item-button:hover {
  background: var(--oy-light) !important;
  color: var(--oy-green-dark) !important;
}
.fi-sidebar-item-button .fi-sidebar-item-icon { color: var(--oy-mute); }
.fi-sidebar-item-button:hover .fi-sidebar-item-icon { color: var(--oy-green-dark); }

/* Active nav item: green-pill with a left accent bar */
.fi-sidebar-item.fi-active > .fi-sidebar-item-button,
.fi-sidebar-item-active > .fi-sidebar-item-button {
  background: var(--oy-light) !important;
  color: var(--oy-green-dark) !important;
  font-weight: 800 !important;
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-icon,
.fi-sidebar-item-active > .fi-sidebar-item-button .fi-sidebar-item-icon {
  color: var(--oy-green-dark) !important;
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-button::before,
.fi-sidebar-item-active > .fi-sidebar-item-button::before {
  content: '';
  position: absolute;
  left: -4px; top: 8px; bottom: 8px;
  width: 3px;
  background: var(--oy-green);
  border-radius: 3px;
}

/* -------- Primary buttons -------- */
.fi-btn-color-primary,
.fi-ac-btn-action.fi-color-primary,
button.fi-color-primary:not(.fi-link) {
  background: var(--oy-green) !important;
  color: var(--oy-ink) !important;
  border-color: var(--oy-green) !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 0 rgba(31,31,31,.04) !important;
}
.fi-btn-color-primary:hover,
.fi-ac-btn-action.fi-color-primary:hover,
button.fi-color-primary:not(.fi-link):hover {
  background: var(--oy-green-dark) !important;
  color: #fff !important;
  border-color: var(--oy-green-dark) !important;
}

/* -------- Cards / sections -------- */
.fi-section,
.fi-wi,
.fi-ta-ctn {
  border-radius: 16px !important;
  border-color: var(--oy-border) !important;
  box-shadow: 0 1px 2px rgba(31,31,31,.03), 0 4px 16px rgba(31,31,31,.04);
  background: var(--oy-card) !important;
}
.fi-section-content { border-radius: 16px !important; }

/* -------- Dashboard stat widgets -------- */
.fi-wi-stats-overview { gap: 16px !important; }
.fi-wi-stats-overview-stat {
  background: var(--oy-card) !important;
  border: 1px solid var(--oy-border) !important;
  border-radius: 16px !important;
  padding: 20px !important;
  box-shadow: 0 1px 2px rgba(31,31,31,.03), 0 4px 16px rgba(31,31,31,.04) !important;
  position: relative;
  overflow: hidden;
  transition: transform .15s, box-shadow .15s;
}
.fi-wi-stats-overview-stat:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(31,31,31,.04), 0 8px 24px rgba(31,31,31,.08) !important;
}
/* Soft green accent bar on the left edge */
.fi-wi-stats-overview-stat::before {
  content: '';
  position: absolute;
  left: 0; top: 20px; bottom: 20px;
  width: 3px;
  background: var(--oy-green);
  border-radius: 0 3px 3px 0;
}
.fi-wi-stats-overview-stat-label {
  color: var(--oy-mute) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.fi-wi-stats-overview-stat-value {
  color: var(--oy-ink) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em;
  line-height: 1.1 !important;
  margin-top: 4px !important;
}
.fi-wi-stats-overview-stat-description {
  color: var(--oy-mute) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  margin-top: 6px !important;
}
/* Icon in the stat (if the widget provides one) — tint green */
.fi-wi-stats-overview-stat-icon {
  color: var(--oy-green-dark) !important;
  background: var(--oy-light) !important;
  border-radius: 10px !important;
  padding: 8px !important;
  width: 36px !important;
  height: 36px !important;
}

/* -------- Dashboard page heading -------- */
.fi-page.fi-dashboard-page .fi-header-heading,
.fi-page .fi-header-heading {
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
}

/* -------- Filter / Date-range card (form inside) -------- */
.fi-fo-field-wrp .fi-fo-field-wrp-label,
.fi-fo-field-wrp-label {
  color: var(--oy-mute) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* -------- Tables -------- */
.fi-ta-header {
  background: #fff !important;
  border-top-left-radius: 14px !important;
  border-top-right-radius: 14px !important;
}
.fi-ta-header-cell,
.fi-ta-text-item-label {
  color: var(--oy-mute) !important;
  font-weight: 700 !important;
}
.fi-ta-row:hover { background: #fafbf6 !important; }
.fi-ta-row .fi-ta-cell { border-color: var(--oy-border) !important; }

/* Filters + inputs */
.fi-input, .fi-select-input, .fi-ta-filters .fi-input,
.fi-fo-field-wrp input, .fi-fo-field-wrp select, .fi-fo-field-wrp textarea {
  border-radius: 10px !important;
  border-color: var(--oy-border) !important;
}
.fi-input:focus, .fi-select-input:focus,
.fi-fo-field-wrp input:focus, .fi-fo-field-wrp select:focus, .fi-fo-field-wrp textarea:focus {
  box-shadow: 0 0 0 3px rgba(166,206,57,.25) !important;
  border-color: var(--oy-green) !important;
}
.fi-ta-filters-form { background: #fff !important; border-radius: 14px !important; border: 1px solid var(--oy-border); }

/* -------- Badges / pills -------- */
.fi-badge-color-primary {
  background: var(--oy-light) !important;
  color: var(--oy-green-dark) !important;
  border-color: #d9ecb6 !important;
}

/* -------- Login page -------- */
.fi-simple-main-ctn, .fi-simple-main {
  background: var(--oy-bg) !important;
}
.fi-simple-page .fi-simple-main .fi-section {
  border-radius: 20px !important;
  border-color: var(--oy-border) !important;
  box-shadow: 0 10px 30px rgba(31,31,31,.06) !important;
}
.fi-simple-header-logo img { height: 54px !important; }

/* -------- Links & focus -------- */
a.fi-link, .fi-link { color: var(--oy-green-dark) !important; }
a.fi-link:hover, .fi-link:hover { color: var(--oy-ink) !important; }
*:focus-visible { outline-color: var(--oy-green) !important; }