@import "tailwindcss";

@theme {
  --color-slate-50: #f8fafc;
  --color-slate-100: #f1f5f9;
  --color-slate-200: #e2e8f0;
  --color-slate-300: #cbd5e1;
  --color-slate-400: #94a3b8;
  --color-slate-500: #64748b;
  --color-slate-600: #475569;
  --color-slate-700: #334155;
  --color-slate-800: #1e293b;
  --color-slate-900: #0f172a;
  --color-slate-950: #020617;
}

.nav-item { transition: all 0.2s ease; }
.nav-item:hover { color: white; background-color: rgba(255,255,255,0.1); }
.nav-item.active { background-color: white; color: #1e293b; }

.modal-overlay { transition: opacity 0.2s ease; }
.modal-content { transition: transform 0.2s ease, opacity 0.2s ease; }
.toast { transition: transform 0.3s ease, opacity 0.3s ease; }

.search-input { background: linear-gradient(to bottom, #fff 0%, #f8f9fa 100%); border: 1px solid #d4d4d4; box-shadow: inset 0 1px 2px rgba(0,0,0,0.075); }
.filter-btn { background: linear-gradient(to bottom, #fff 0%, #e9ecef 100%); border: 1px solid #d4d4d4; box-shadow: 0 1px 0 rgba(255,255,255,0.5); }
.date-input { background: linear-gradient(to bottom, #fff 0%, #f8f9fa 100%); border: 1px solid #d4d4d4; box-shadow: inset 0 1px 2px rgba(0,0,0,0.075); }

.table-header { background: linear-gradient(to bottom, #f3f3f3 0%, #e8e8e8 100%); border: 1px solid #d4d4d4; }
.table-row { background-color: #ffffff; border: 1px solid #d4d4d4; }
.table-row-agent { background-color: #ffffff; border: 1px solid #d4d4d4; }
.table-row-agent:nth-child(even) { background-color: #fafafa; }
.table-row-agent:hover { background-color: #e8f4fc !important; }

.footer-box { background: linear-gradient(to bottom, #fff 0%, #f8f9fa 100%); border: 2px solid #d4d4d4; }
.footer-box-header { background: linear-gradient(to bottom, #f3f3f3 0%, #e8e8e8 100%); border-bottom: 1px solid #d4d4d4; }

.export-btn { background: linear-gradient(to bottom, #fff 0%, #e9ecef 100%); border: 1px solid #d4d4d4; box-shadow: 0 1px 0 rgba(255,255,255,0.5); }
.export-btn:hover { background: linear-gradient(to bottom, #f0f0f0 0%, #dee2e6 100%); }

.view-btn { background: linear-gradient(to bottom, #3b82f6 0%, #2563eb 100%); }
.view-btn:hover { background: linear-gradient(to bottom, #2563eb 0%, #1d4ed8 100%); }

.filter-btn:hover { background: linear-gradient(to bottom, #f0f0f0 0%, #e2e6ea 100%); }

.scrollbar-thin::-webkit-scrollbar { height: 8px; width: 8px; }
.scrollbar-thin::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px; }
.scrollbar-thin::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px; }
.scrollbar-thin::-webkit-scrollbar-thumb:hover { background: #a1a1a1; }

input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.5); cursor: pointer; }

.modal-row:hover { background-color: #f3f4f6 !important; }

.table-row-agent { background-color: #ffffff; border: 1px solid #d4d4d4; }
.table-row-agent:nth-child(even) { background-color: #fafafa; }
.table-row-agent:hover { background-color: #e8f4fc !important; }

.footer-box { background: linear-gradient(to bottom, #fff 0%, #f8f9fa 100%); border: 2px solid #d4d4d4; }
.footer-box-header { background: linear-gradient(to bottom, #f3f3f3 0%, #e8e8e8 100%); border-bottom: 1px solid #d4d4d4; }

.export-btn { background: linear-gradient(to bottom, #fff 0%, #e9ecef 100%); border: 1px solid #d4d4d4; box-shadow: 0 1px 0 rgba(255,255,255,0.5); }
.export-btn:hover { background: linear-gradient(to bottom, #f0f0f0 0%, #dee2e6 100%); }

.view-btn { background: linear-gradient(to bottom, #3b82f6 0%, #2563eb 100%); }
.view-btn:hover { background: linear-gradient(to bottom, #2563eb 0%, #1d4ed8 100%); }

.scrollbar-thin::-webkit-scrollbar { height: 8px; width: 8px; }
.scrollbar-thin::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px; }
.scrollbar-thin::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px; }
.scrollbar-thin::-webkit-scrollbar-thumb:hover { background: #a1a1a1; }

.modal-row:hover { background-color: #f3f4f6 !important; }

[x-cloak] { display: none !important; }