/* ============================================================
   dark-mode.css
   THE AGRI WORLD - Dark Mode Overrides
   ============================================================ */

[data-theme="dark"] {
  color-scheme: dark;
}

/* ── Base ── */
[data-theme="dark"] body {
  background: var(--bg);
  color: var(--text);
}

[data-theme="dark"] body::before {
  background-image:
    radial-gradient(circle at 10% 20%, rgba(76,175,80,0.06) 0%, transparent 50%),
    radial-gradient(circle at 90% 80%, rgba(45,122,51,0.04) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(76,175,80,0.03) 0%, transparent 70%);
}

/* ── Header ── */
[data-theme="dark"] header {
  background: var(--bg-card);
  box-shadow: 0 1px 0 rgba(255,255,255,0.06);
}

/* ── Nav ── */
[data-theme="dark"] nav {
  background: linear-gradient(115deg, #0f2f14 0%, #1a4a1f 45%, #00564d 100%);
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}

[data-theme="dark"] nav button {
  color: rgba(255,255,255,0.75);
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.12);
}

[data-theme="dark"] nav button:hover {
  color: #fff;
  background: rgba(255,255,255,0.16);
}

[data-theme="dark"] nav button.active {
  color: #0f2f14;
  background: #fff;
  border-color: #fff;
}

/* ── Cards ── */
[data-theme="dark"] .card {
  background: var(--bg-card);
  border-color: var(--border);
}

[data-theme="dark"] .card:hover {
  border-color: #2a4a2e;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

[data-theme="dark"] .card-title::before {
  background: var(--green-400);
}

/* ── Stats ── */
[data-theme="dark"] .stat,
[data-theme="dark"] .coupon-summary-item {
  background: linear-gradient(135deg, var(--bg-card) 0%, #1e3a22 100%);
  border-color: #2a4a2e;
}

[data-theme="dark"] .stat:hover,
[data-theme="dark"] .coupon-summary-item:hover {
  border-color: var(--green-700);
}

[data-theme="dark"] .stat::before,
[data-theme="dark"] .coupon-summary-item::before {
  background: linear-gradient(90deg, var(--green-600), var(--green-400));
}

/* ── Tables ── */
[data-theme="dark"] .tbl-wrap {
  background: var(--bg-card);
  border-color: var(--border);
}

[data-theme="dark"] thead {
  background: linear-gradient(135deg, #1e3a22 0%, rgba(45,122,51,0.08) 100%);
}

[data-theme="dark"] th {
  color: var(--green-300);
  border-bottom-color: #2a4a2e;
}

[data-theme="dark"] td {
  border-bottom-color: #223322;
  color: #b0b8b0;
}

[data-theme="dark"] tbody tr:hover {
  background: rgba(45,122,51,0.04);
}

/* ── Forms ── */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: #162618;
  border-color: #2a3a2e;
  color: #e0e8e0;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
  border-color: var(--green-500);
  box-shadow: 0 0 0 3px rgba(45,122,51,0.15);
}

[data-theme="dark"] input::placeholder {
  color: #556655;
}

/* ── Buttons ── */
[data-theme="dark"] .btn.outline {
  border-color: var(--green-500);
  color: var(--green-300);
}

[data-theme="dark"] .btn.outline:hover {
  background: var(--green-700);
  color: #fff;
}

/* ── Modals ── */
[data-theme="dark"] .modal-bg {
  background: rgba(0,0,0,0.7);
}

[data-theme="dark"] .modal {
  background: var(--bg-card);
  border-color: #2a3a2e;
}

/* ── Login ── */
[data-theme="dark"] #login-screen {
  background:
    linear-gradient(135deg, rgba(8,20,10,0.92) 0%, rgba(15,30,18,0.95) 50%, rgba(10,22,12,0.92) 100%),
    url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?w=1920&q=80') center/cover no-repeat;
}

[data-theme="dark"] .login-card {
  background: rgba(26,46,31,0.85);
  border-color: rgba(255,255,255,0.08);
  box-shadow: 0 10px 40px rgba(0,0,0,0.4), 0 0 60px rgba(45,122,51,0.08);
}

[data-theme="dark"] .login-logo h1 {
  color: #e0e8e0;
}

[data-theme="dark"] .role-tabs {
  background: rgba(45,122,51,0.1);
}

[data-theme="dark"] .role-tab.active {
  background: #1a2e1f;
  border-color: #2a4a2e;
}

[data-theme="dark"] .login-field input {
  background: #162618;
  border-color: #2a3a2e;
  color: #e0e8e0;
}

[data-theme="dark"] .login-err {
  background: rgba(229,57,53,0.15);
}

/* ── Coupon code ── */
[data-theme="dark"] .coupon-code {
  background: #1a3a1e;
  border-color: #2a5a2e;
  color: var(--green-300);
}

/* ── Status badges ── */
[data-theme="dark"] .status-select {
  background: #162618;
  border-color: #2a3a2e;
}

[data-theme="dark"] .status-select.is-claim {
  background: rgba(67,160,71,0.15);
  border-color: var(--success);
}

[data-theme="dark"] .status-select.is-notclaim {
  background: rgba(251,140,0,0.15);
  border-color: var(--warning);
}

/* ── Alerts ── */
[data-theme="dark"] .alert.ok {
  background: rgba(67,160,71,0.15);
}

[data-theme="dark"] .alert.err {
  background: rgba(229,57,53,0.15);
}

[data-theme="dark"] .alert.warn {
  background: rgba(251,140,0,0.15);
}

[data-theme="dark"] .alert.info {
  background: rgba(30,136,229,0.15);
}

/* ── Coupon filter bar ── */
[data-theme="dark"] .coupon-filter-bar {
  background: #162618;
  border-color: #223322;
}

/* ── Access checklist ── */
[data-theme="dark"] .access-checklist label {
  background: #162618;
  border-color: #223322;
}

[data-theme="dark"] .access-checklist label:hover {
  background: #1e3a22;
  border-color: #2a4a2e;
}

/* ── Result box ── */
[data-theme="dark"] .result-box {
  background: linear-gradient(135deg, var(--bg-card) 0%, #1e3a22 100%);
  border-color: #2a4a2e;
}

/* ── Timeline ── */
[data-theme="dark"] .timeline::before {
  background: linear-gradient(180deg, var(--green-600), #1a3a1e);
}

[data-theme="dark"] .timeline-item::before {
  background: var(--green-500);
  border-color: var(--bg-card);
  box-shadow: 0 0 0 2px #2a4a2e;
}

/* ── Skeleton loading ── */
[data-theme="dark"] .skeleton {
  background: linear-gradient(90deg, #1a2e1f 25%, #223322 50%, #1a2e1f 75%);
  background-size: 200% 100%;
}

/* ── Pagination ── */
[data-theme="dark"] .pagination button {
  background: var(--bg-card);
  border-color: var(--border);
  color: #889988;
}

[data-theme="dark"] .pagination button:hover {
  border-color: var(--green-500);
  color: var(--green-300);
}

[data-theme="dark"] .pagination button.active {
  background: var(--green-700);
  color: #fff;
  border-color: var(--green-600);
}

/* ── Activity feed ── */
[data-theme="dark"] .activity-feed {
  background: var(--bg-card);
  border-color: var(--border);
}

[data-theme="dark"] .activity-item {
  border-bottom-color: #223322;
}

[data-theme="dark"] .activity-item:hover {
  background: rgba(45,122,51,0.03);
}

/* ── Glass cards ── */
[data-theme="dark"] .glass-card {
  background: rgba(26,46,31,0.8);
  border-color: rgba(255,255,255,0.06);
}

[data-theme="dark"] .glass-card:hover {
  border-color: rgba(45,122,51,0.2);
}

/* ── Chart container ── */
[data-theme="dark"] #coupon-chart-box,
[data-theme="dark"] #emp-coupon-chart-box,
[data-theme="dark"] .chart-container {
  background: var(--bg-card);
  border-color: #223322;
}

/* ── Search bar ── */
[data-theme="dark"] .search-bar input {
  background: #162618;
}

/* ── Filter bar ── */
[data-theme="dark"] .filter-bar {
  background: #162618;
  border-color: #223322;
}

/* ── Overview cards ── */
[data-theme="dark"] .overview-card {
  background: var(--bg-card);
  border-color: #2a3a2e;
}

[data-theme="dark"] .overview-card::after {
  background: radial-gradient(circle at top right, rgba(45,122,51,0.08) 0%, transparent 70%);
}

/* ── KPI cards ── */
[data-theme="dark"] .kpi-card {
  background: var(--bg-card);
  border-color: #2a3a2e;
}

[data-theme="dark"] .kpi-icon.green { background: rgba(45,122,51,0.15); }
[data-theme="dark"] .kpi-icon.blue  { background: rgba(30,136,229,0.15); }
[data-theme="dark"] .kpi-icon.gold  { background: rgba(249,168,37,0.15); }
[data-theme="dark"] .kpi-icon.red   { background: rgba(229,57,53,0.15); }

/* ── Scrollbar ── */
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #2a4a2e;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: var(--green-600);
}

/* ── Dashboard CSS ── */
[data-theme="dark"] .chart-empty {
  color: #556655;
}

[data-theme="dark"] .empty-state {
  color: #556655;
}

[data-theme="dark"] .empty-state-icon {
  opacity: 0.2;
}

[data-theme="dark"] .mini-bar {
  background: #2a4a2e;
}

[data-theme="dark"] .mini-bar:hover,
[data-theme="dark"] .mini-bar.highlight {
  background: var(--green-500);
}

/* ── Widget header ── */
[data-theme="dark"] .widget-action-btn {
  background: var(--bg-card);
  border-color: #2a3a2e;
  color: #889988;
}

[data-theme="dark"] .widget-action-btn:hover {
  border-color: var(--green-500);
  color: var(--green-300);
  background: #1e3a22;
}

/* ── Login security badges ── */
[data-theme="dark"] .login-security-badges {
  border-top-color: #223322;
}

/* ── Toast ── */
[data-theme="dark"] .toast {
  border-color: rgba(255,255,255,0.1);
}

/* ── Badges ── */
[data-theme="dark"] .badge-green { background: rgba(67,160,71,0.2); }
[data-theme="dark"] .badge-red   { background: rgba(229,57,53,0.2); }
[data-theme="dark"] .badge-blue  { background: rgba(30,136,229,0.2); }
[data-theme="dark"] .badge-gold  { background: rgba(251,140,0,0.2); }
[data-theme="dark"] .badge-gray  { background: #223322; }

/* ── Tooltips ── */
[data-theme="dark"] [data-tooltip]::after {
  background: #2a4a2e;
  color: #e0e8e0;
  border: 1px solid #3a5a3e;
}

/* ── Employee dashboard specific ── */
[data-theme="dark"] .emp-stat-mini {
  background: var(--bg-card);
  border-color: #2a3a2e;
}

[data-theme="dark"] .customer-info-card {
  background: linear-gradient(135deg, var(--bg-card) 0%, rgba(30,136,229,0.08) 100%);
  border-color: rgba(30,136,229,0.2);
}

[data-theme="dark"] .lookup-result {
  background: #1e3a22;
  border-color: #2a4a2e;
}

[data-theme="dark"] .coupon-code-item {
  background: #1a3a1e;
  border-color: #2a5a2e;
}

/* ── Coupon thumbnail loading ── */
[data-theme="dark"] .coupon-thumb.loading {
  background: linear-gradient(90deg, #1a2e1f 25%, #223322 50%, #1a2e1f 75%);
  background-size: 200% 100%;
}

/* ── Progress ring ── */
[data-theme="dark"] .progress-ring-bg {
  stroke: #223322;
}

[data-theme="dark"] .progress-ring-fill {
  stroke: var(--green-500);
}

[data-theme="dark"] .progress-ring-value {
  color: var(--green-300);
}

/* ── Table toolbar ── */
[data-theme="dark"] .table-toolbar {
  border-bottom-color: #223322;
}

/* ── Section divider ── */
[data-theme="dark"] .section-divider {
  background: linear-gradient(90deg, transparent 0%, #2a3a2e 50%, transparent 100%);
}