/* ADS PRO MULTIUSUÁRIO v3.0 — Custom Styles */

* { box-sizing: border-box; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #111827; }
::-webkit-scrollbar-thumb { background: #374151; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #4B5563; }

/* Line clamp */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orientation: vertical;
  overflow: hidden;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes slideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes bounce-slow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

.animate-bounce-slow { animation: bounce-slow 2.5s ease-in-out infinite; }
.animate-fadeIn { animation: fadeIn 0.3s ease-out; }

#main-content > * { animation: fadeIn 0.25s ease-out; }

/* Input datetime-local */
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: invert(1) opacity(0.5);
  cursor: pointer;
}

/* Checkbox accent */
input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; accent-color: #3b82f6; }

/* Select options */
select option { background: #1f2937; color: #f3f4f6; }

/* Gradient text */
.gradient-text {
  background: linear-gradient(135deg, #60a5fa, #a78bfa);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Glass card */
.glass {
  background: rgba(17, 24, 39, 0.7);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.05);
}

/* Pulse ring */
@keyframes pulse-ring {
  0% { transform: scale(0.9); box-shadow: 0 0 0 0 rgba(59,130,246,0.5); }
  70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(59,130,246,0); }
  100% { transform: scale(0.9); }
}

.pulse-ring { animation: pulse-ring 2s infinite; }

/* Status colors — Tailwind dynamic classes safelist */
.text-blue-400 { color: #60a5fa; }
.text-green-400 { color: #4ade80; }
.text-pink-400 { color: #f472b6; }
.text-pink-500 { color: #ec4899; }
.text-yellow-400 { color: #facc15; }
.text-orange-400 { color: #fb923c; }
.text-purple-400 { color: #c084fc; }
.text-cyan-400 { color: #22d3ee; }
.text-emerald-400 { color: #34d399; }
.text-red-400 { color: #f87171; }
.text-indigo-400 { color: #818cf8; }

/* Background safelist */
.bg-blue-500\/10 { background-color: rgba(59,130,246,0.1); }
.bg-green-500\/10 { background-color: rgba(34,197,94,0.1); }
.bg-yellow-500\/10 { background-color: rgba(234,179,8,0.1); }
.bg-red-500\/10 { background-color: rgba(239,68,68,0.1); }
.bg-purple-500\/10 { background-color: rgba(168,85,247,0.1); }
.bg-emerald-500\/10 { background-color: rgba(16,185,129,0.1); }
.bg-orange-500\/10 { background-color: rgba(249,115,22,0.1); }
.bg-indigo-500\/10 { background-color: rgba(99,102,241,0.1); }

/* Hover safelist */
.hover\:bg-blue-500\/20:hover { background-color: rgba(59,130,246,0.2); }
.hover\:bg-green-600\/30:hover { background-color: rgba(22,163,74,0.3); }
.hover\:bg-yellow-500\/20:hover { background-color: rgba(234,179,8,0.2); }
.hover\:bg-red-500\/20:hover { background-color: rgba(239,68,68,0.2); }
.hover\:bg-purple-600\/30:hover { background-color: rgba(147,51,234,0.3); }

/* Border safelist */
.border-blue-500\/30 { border-color: rgba(59,130,246,0.3); }
.border-green-500\/20 { border-color: rgba(34,197,94,0.2); }
.border-green-500\/30 { border-color: rgba(34,197,94,0.3); }
.border-yellow-500\/20 { border-color: rgba(234,179,8,0.2); }
.border-red-500\/20 { border-color: rgba(239,68,68,0.2); }
.border-purple-500\/30 { border-color: rgba(168,85,247,0.3); }
.border-orange-500\/20 { border-color: rgba(249,115,22,0.2); }

/* Hover transitions */
button { transition: all 0.2s ease; }
a { transition: all 0.2s ease; }

/* Table styles */
table { border-collapse: collapse; }
thead th { white-space: nowrap; }
td { vertical-align: middle; }

/* Modal backdrop */
.modal-overlay {
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(4px);
}

/* Brand colors */
.bg-facebook { background: #1877F2; }
.bg-instagram { background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045); }
.text-facebook { color: #1877F2; }

/* Sidebar item active */
.sidebar-active {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  box-shadow: 0 4px 15px rgba(37, 99, 235, 0.25);
}

/* Card hover effect */
.card-hover {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

/* Metric value animation */
@keyframes countUp {
  from { opacity: 0.5; }
  to { opacity: 1; }
}

.metric-update { animation: countUp 0.4s ease-out; }

/* File upload zone */
.upload-zone {
  border: 2px dashed rgba(75,85,99,0.7);
  transition: border-color 0.2s ease, background 0.2s ease;
}
.upload-zone:hover {
  border-color: rgba(59,130,246,0.5);
  background: rgba(59,130,246,0.02);
}

/* AI badge */
.ai-badge {
  background: linear-gradient(135deg, rgba(168,85,247,0.2), rgba(59,130,246,0.2));
  border: 1px solid rgba(168,85,247,0.3);
  color: #c084fc;
}

/* Progress bar */
.progress-bar {
  height: 4px;
  border-radius: 2px;
  background: #1f2937;
  overflow: hidden;
}
.progress-bar-fill {
  height: 100%;
  border-radius: 2px;
  background: linear-gradient(90deg, #3b82f6, #8b5cf6);
  transition: width 0.5s ease;
}

/* Toast notification slide */
@keyframes toastIn {
  from { opacity: 0; transform: translateX(100%); }
  to { opacity: 1; transform: translateX(0); }
}

/* Image preview */
.media-preview {
  max-height: 256px;
  border-radius: 12px;
  overflow: hidden;
}

/* Responsive table */
@media (max-width: 768px) {
  table { font-size: 12px; }
  thead th, tbody td { padding: 8px 10px; }
}

/* Cross-browser compatibility */
input, textarea, select, button {
  -webkit-appearance: none;
  appearance: none;
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: #374151 #111827;
}
