/* DFAC AgriDEP - Custom Admin Interface Styling */

:root {
  --admin-primary: #005a26;
  --admin-primary-dark: #00441b;
  --admin-accent: #10b981;
  --admin-header-bg: #0b2518;
  --admin-bg: #f8fafc;
  --admin-card-bg: #ffffff;
  --admin-border: #e2e8f0;
  --admin-text: #0f172a;
}

body {
  background-color: var(--admin-bg) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  color: var(--admin-text) !important;
}

/* Header */
#header {
  background: var(--admin-header-bg) !important;
  color: #ffffff !important;
  padding: 16px 24px !important;
  border-bottom: 2px solid var(--admin-accent) !important;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1) !important;
}

#header a:link, #header a:visited {
  color: #ffffff !important;
}

#user-tools {
  font-size: 0.85rem !important;
  color: #a7f3d0 !important;
}

#user-tools a {
  border-bottom: 1px dotted #10b981 !important;
  font-weight: 600 !important;
}

/* Breadcrumbs */
div.breadcrumbs {
  background: #ffffff !important;
  border-bottom: 1px solid var(--admin-border) !important;
  padding: 12px 24px !important;
  font-size: 0.85rem !important;
  color: #64748b !important;
}

div.breadcrumbs a {
  color: var(--admin-primary) !important;
  font-weight: 600 !important;
}

/* Content & Modules */
#content {
  padding: 24px 32px !important;
}

.module {
  background: #ffffff !important;
  border-radius: 10px !important;
  border: 1px solid var(--admin-border) !important;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.05) !important;
  margin-bottom: 24px !important;
  overflow: hidden !important;
}

.module h2, .module caption {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  letter-spacing: -0.01em !important;
  padding: 12px 18px !important;
  border-bottom: 1px solid var(--admin-border) !important;
}

/* Tables & Lists */
#changelist table {
  border-radius: 8px !important;
  overflow: hidden !important;
  border: 1px solid var(--admin-border) !important;
}

#changelist table thead th {
  background: #f8fafc !important;
  color: #475569 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.05em !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid var(--admin-border) !important;
}

#changelist table tbody tr:nth-child(even) {
  background: #fdfdfd !important;
}

#changelist table tbody tr:hover {
  background: #f0fdf4 !important;
}

#changelist table tbody td, #changelist table tbody th {
  padding: 12px 14px !important;
  font-size: 0.9rem !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

/* Action Buttons */
.button, input[type=submit], input[type=button], .submit-row input {
  background: var(--admin-primary) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  cursor: pointer !important;
  transition: background 0.2s ease !important;
}

.button:hover, input[type=submit]:hover, input[type=button]:hover, .submit-row input:hover {
  background: var(--admin-primary-dark) !important;
}

.button.default, input[type=submit].default {
  background: var(--admin-accent) !important;
}

/* Search bar & Filter sidebar */
#changelist-filter {
  background: #ffffff !important;
  border-left: 1px solid var(--admin-border) !important;
  border-radius: 0 10px 10px 0 !important;
  padding: 16px !important;
}

#changelist-filter h2 {
  background: transparent !important;
  color: var(--admin-primary-dark) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  padding: 0 0 10px 0 !important;
  border-bottom: 1px solid var(--admin-border) !important;
}

#searchbar {
  border-radius: 6px !important;
  border: 1px solid var(--admin-border) !important;
  padding: 8px 12px !important;
  font-size: 0.9rem !important;
}

#searchbar:focus {
  border-color: var(--admin-primary) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0, 122, 51, 0.12) !important;
}
