/* 2026-09-25 : l'accent vert sombre #0F2D24 etait quasi invisible sur le theme sombre du
   back-office (menu actif, boutons principaux, champ actif, calendrier) -> or #A8863C,
   comme l'espace client et pro.kerukera.com. */
/* KERUKERA Admin — Custom Styles */

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #3a3a5c; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #A8863C; }

/* Nav links */
.nav-link { color: #9ca3af; }
.nav-link:hover { background: rgba(168, 134, 60,0.08); color: #fff; }
.nav-link.active { background: rgba(168, 134, 60,0.18); color: #E3C98A; font-weight: 600; }

/* Cards */
.kpi-card {
  background: linear-gradient(135deg, #1a1a2e 0%, #252540 100%);
  border: 1px solid #2d2d4a;
  border-radius: 1rem;
  padding: 1.5rem;
  transition: all 0.3s ease;
}
.kpi-card:hover { border-color: rgba(168, 134, 60,0.3); transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0,0,0,0.3); }

/* Status badges */
.badge { display: inline-flex; align-items: center; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; }
.badge-pending { background: rgba(234,179,8,0.15); color: #fbbf24; }
.badge-confirmed { background: rgba(59,130,246,0.15); color: #60a5fa; }
.badge-paid { background: rgba(34,197,94,0.15); color: #4ade80; }
.badge-cancelled { background: rgba(239,68,68,0.15); color: #f87171; }
.badge-completed { background: rgba(168,85,247,0.15); color: #c084fc; }
.badge-devis { background: rgba(99,102,241,0.15); color: #818cf8; }
.badge-demande_info { background: rgba(156,163,175,0.15); color: #9ca3af; }

/* Qonto workflow states */
.badge-devis_pending { background: rgba(234,179,8,0.15); color: #fbbf24; }
.badge-devis_accepted { background: rgba(59,130,246,0.15); color: #60a5fa; }
.badge-invoice { background: rgba(34,197,94,0.15); color: #4ade80; }

/* State icons */
.state-icon { display: inline-flex; align-items: center; gap: 0.375rem; }
.state-icon svg { width: 1rem; height: 1rem; }

/* State cards (admin dashboard) */
.state-card { display: flex; flex-direction: column; align-items: center; padding: 1rem; border-radius: 0.75rem; cursor: pointer; transition: all 0.2s; }
.state-card:hover { transform: scale(1.05); }
.state-card .count { font-size: 1.75rem; font-weight: 700; line-height: 1; }
.state-card .label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 0.25rem; }

/* Tables */
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.data-table th { background: #1a1a2e; padding: 0.75rem 1rem; text-align: left; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #9ca3af; border-bottom: 1px solid #2d2d4a; position: sticky; top: 0; z-index: 1; }
.data-table td { padding: 0.75rem 1rem; border-bottom: 1px solid #1a1a2e; font-size: 0.875rem; }
.data-table tbody tr { transition: background 0.15s; }
.data-table tbody tr:hover { background: rgba(168, 134, 60,0.05); }

/* Buttons */
.btn { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; border-radius: 0.75rem; font-size: 0.875rem; font-weight: 500; transition: all 0.2s; cursor: pointer; border: none; }
.btn-primary { background: #A8863C; color: #0a0a0f; font-weight: 600; }
.btn-primary:hover { background: #C7A45D; }
.btn-secondary { background: #252540; color: #e5e7eb; border: 1px solid #3a3a5c; }
.btn-secondary:hover { background: #2d2d4a; border-color: #A8863C; }
.btn-danger { background: rgba(239,68,68,0.15); color: #f87171; }
.btn-danger:hover { background: rgba(239,68,68,0.25); }
.btn-sm { padding: 0.35rem 0.75rem; font-size: 0.75rem; }

/* Form inputs */
.form-input { width: 100%; padding: 0.625rem 1rem; background: #1a1a2e; border: 1px solid #2d2d4a; border-radius: 0.75rem; color: white; font-size: 0.875rem; transition: all 0.2s; }
.form-input:focus { outline: none; border-color: #A8863C; box-shadow: 0 0 0 3px rgba(168, 134, 60,0.15); }
.form-input::placeholder { color: #6b7280; }
.form-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.75rem center; background-repeat: no-repeat; background-size: 1.25rem; padding-right: 2.5rem; }
.form-label { display: block; font-size: 0.875rem; font-weight: 500; color: #d1d5db; margin-bottom: 0.375rem; }

/* Toast */
.toast { padding: 0.875rem 1.25rem; border-radius: 0.75rem; font-size: 0.875rem; animation: slideIn 0.3s ease-out; max-width: 24rem; }
.toast-success { background: #065f46; border: 1px solid #059669; color: #a7f3d0; }
.toast-error { background: #7f1d1d; border: 1px solid #dc2626; color: #fca5a5; }
.toast-info { background: #1e3a5f; border: 1px solid #3b82f6; color: #93c5fd; }
.toast-warning { background: #78350f; border: 1px solid #d97706; color: #fde68a; }

@keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes fadeOut { from { opacity: 1; } to { opacity: 0; transform: translateY(-10px); } }

/* Calendar */
.cal-cell { min-height: 80px; border: 1px solid #2d2d4a; padding: 0.25rem; font-size: 0.75rem; }
.cal-cell.today { border-color: #A8863C; }
.cal-slot { padding: 2px 4px; border-radius: 4px; margin-bottom: 2px; font-size: 0.65rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-slot.green { background: rgba(34,197,94,0.2); color: #4ade80; }
.cal-slot.grey { background: rgba(156,163,175,0.2); color: #9ca3af; }
.cal-slot.red { background: rgba(239,68,68,0.2); color: #f87171; }

/* Loading spinner */
.spinner { display: inline-block; width: 1.5rem; height: 1.5rem; border: 2px solid rgba(168, 134, 60,0.3); border-radius: 50%; border-top-color: #A8863C; animation: spin 0.6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Trend indicators */
.trend-up { color: #4ade80; }
.trend-down { color: #f87171; }
.trend-neutral { color: #9ca3af; }

/* Responsive */
@media (max-width: 1024px) {
  #sidebar { transform: translateX(-100%); position: fixed; }
  #sidebar.open { transform: translateX(0); }
}

/* Print */
@media print {
  #sidebar, header, .btn { display: none !important; }
  body { background: white; color: black; }
  .kpi-card { border: 1px solid #ddd; }
}