:root{--bg:#f7f8fa;--card:#fff;--text:#1f2937;--muted:#64748b;--primary:#667eea;--border:#e5e7eb;--radius:12px}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"}

/* Legacy styles - scoped to avoid conflicts */
.legacy-ui .container{max-width:960px;margin:0 auto;padding:24px}
.legacy-ui .site-header{position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--border);z-index:10}
.legacy-ui .header-inner{display:flex;align-items:center;justify-content:space-between}
.legacy-ui .brand{font-weight:600;font-size:18px}
.legacy-ui .nav{display:flex;gap:16px}
.legacy-ui .nav-link{color:var(--muted);text-decoration:none;padding:12px 8px;border-radius:8px}
.legacy-ui .nav-link:hover{background:#f0f4ff;color:var(--primary)}
.legacy-ui .card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:0 1px 2px rgba(0,0,0,0.03);margin-bottom:16px}
.legacy-ui .btn{display:inline-block;background:var(--primary);color:#fff;border:none;border-radius:10px;padding:10px 16px;text-decoration:none;cursor:pointer}
.legacy-ui .btn.secondary{background:#eef2ff;color:#1e3a8a}
.legacy-ui .btn.danger{background:#ef4444}
.legacy-ui .btn:disabled{opacity:.6;cursor:not-allowed}
.legacy-ui .table{width:100%;border-collapse:separate;border-spacing:0}
.legacy-ui .table th,.legacy-ui .table td{padding:12px 14px;border-bottom:1px solid var(--border)}
.legacy-ui .table thead th{color:var(--muted);font-weight:500;background:#fafafa}
.legacy-ui .table tr:hover td{background:#fafafa}
.legacy-ui .form-group{margin-bottom:12px}
.legacy-ui label{display:block;margin-bottom:6px;color:var(--muted);font-size:14px}
.legacy-ui input[type="text"],.legacy-ui input[type="number"],.legacy-ui input[type="email"],.legacy-ui input[type="password"],.legacy-ui textarea,.legacy-ui select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#fff}
.legacy-ui textarea{min-height:120px}
.legacy-ui .actions{margin-top:16px}
.legacy-ui .flash{padding:10px 14px;border-radius:10px;margin-bottom:12px}
.legacy-ui .notice{background:#ecfdf5;color:#065f46}
.legacy-ui .alert{background:#fef3c7;color:#92400e}

/* Admin Form Styles for Tailwind compatibility */
input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="datetime-local"],
textarea,
select {
  padding: 0.625rem 0.875rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  background-color: #fff;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #1f2937;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: #667eea;
  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

/* Dark mode form inputs */
.dark input[type="text"],
.dark input[type="number"],
.dark input[type="email"],
.dark input[type="password"],
.dark input[type="tel"],
.dark input[type="url"],
.dark input[type="date"],
.dark input[type="datetime-local"],
.dark textarea,
.dark select {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

.dark input:focus,
.dark textarea:focus,
.dark select:focus {
  border-color: #818cf8;
  box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.2);
}

/* Fix select dropdown arrow */
select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
}

.dark select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%239ca3af' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
}

/* Placeholder styling */
input::placeholder,
textarea::placeholder {
  color: #9ca3af;
}

.dark input::placeholder,
.dark textarea::placeholder {
  color: #6b7280;
}
