/* ═══════════════════════════════════════════════════════════
   DocSaaS-DGCI-GW — Design System Institucional
═══════════════════════════════════════════════════════════ */

/* ── PALETA INSTITUCIONAL ────────────────────────────────── */
:root {
    --navy-900: #0a1929;
    --navy-800: #0f2a4a;
    --navy-700: #153d6b;
    --navy-600: #1a5089;
    --gold-500: #c9a227;
    --gold-400: #d4b44a;
    --gray-50:  #f7f8fa;
    --gray-100: #eef0f4;
    --gray-200: #dde1e8;
    --gray-400: #8d95a3;
    --gray-600: #4a5568;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --white:    #ffffff;
}

/* ── FONT GLOBAL ─────────────────────────────────────────── */
body {
    font-family: 'Source Sans 3', 'Segoe UI', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ── PAGE LOADER ─────────────────────────────────────────── */
#page-loader {
    position: fixed; inset: 0; z-index: 9999;
    background: #fff;
    display: flex; align-items: center; justify-content: center;
    flex-direction: column; gap: 16px;
    transition: opacity .3s ease, visibility .3s ease;
}
#page-loader.oculto { opacity: 0; visibility: hidden; pointer-events: none; }

.loader-bar {
    width: 160px; height: 3px;
    background: var(--gray-200); border-radius: 99px; overflow: hidden;
}
.loader-bar-inner {
    height: 100%; width: 40%;
    background: linear-gradient(90deg, var(--navy-800), var(--gold-500));
    border-radius: 99px;
    animation: slide 1s ease-in-out infinite alternate;
}
@keyframes slide { from { transform: translateX(-100%); } to { transform: translateX(300%); } }

/* ── AJAX BAR ────────────────────────────────────────────── */
#ajax-loader {
    position: fixed; top: 0; left: 0; height: 3px; width: 0%;
    background: linear-gradient(90deg, var(--navy-700), var(--gold-500), var(--navy-700));
    background-size: 200% 100%;
    z-index: 10000; transition: width .3s ease;
    animation: shimmer 1.5s linear infinite;
}
#ajax-loader.ativo  { width: 85%; }
#ajax-loader.completo { width: 100%; transition: width .1s ease; }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ── RESPONSIVIDADE ──────────────────────────────────────── */
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 640px) {
    .col-hide-sm  { display: none !important; }
    #drawer-pasta,
    #drawer-grupo { width: 100% !important; }
}
@media (max-width: 768px) {
    .col-hide-md  { display: none !important; }
    .filtros-wrap { flex-direction: column !important; }
    .filtros-wrap > * { min-width: 100% !important; }
    .page-header  { flex-wrap: wrap !important; gap: .75rem !important; }
}

/* ── MENU MOBILE ─────────────────────────────────────────── */
.mobile-menu-item {
    display: flex; align-items: center; gap: .75rem;
    padding: .625rem 1rem; border-radius: .5rem; font-size: .875rem;
}

/* ── SCROLLBAR ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--gray-50); }
::-webkit-scrollbar-thumb { background: var(--gray-200); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--gray-400); }

/* ── FOCUS ───────────────────────────────────────────────── */
*:focus-visible { outline: 2px solid var(--navy-600); outline-offset: 2px; border-radius: 4px; }

/* ── FADE IN ─────────────────────────────────────────────── */
.fade-in { animation: fadeIn .25s ease forwards; }
@keyframes fadeIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }

/* ── SUPERADMIN SIDEBAR ──────────────────────────────────── */
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --navy-900: #0f2a4a;
    --navy-800: #153d6b;
    --navy-700: #1d4e89;
    --gold-500: #c9a227;
    --gold-400: #dfb63a;
    --gold-600: #a68520;
    --slate-50:  #f8fafc;
    --slate-100: #f1f5f9;
    --slate-200: #e2e8f0;
    --slate-800: #1e293b;
    --slate-900: #0f172a;
  }

  body {
    @apply font-sans text-slate-800 antialiased bg-[#f4f6f9];
    font-family: 'Source Sans 3', sans-serif;
  }
}

@layer components {
  /* ── CARDS PREMIUM ── */
  .premium-card {
    @apply bg-white border border-slate-200 rounded-[1.25rem] shadow-sm transition-all duration-300;
  }
  .premium-card-hover {
    @apply hover:shadow-xl hover:shadow-navy-900/5 hover:-translate-y-1 hover:border-gold-500/30;
  }

  /* ── BOTÕES INSTITUCIONAIS ── */
  .btn-navy {
    @apply bg-[#0f2a4a] hover:bg-[#153d6b] text-white px-5 py-2.5 rounded-xl text-sm font-bold transition-all duration-300 flex items-center justify-center gap-2 shadow-lg shadow-navy-900/10 active:scale-95;
  }
  .btn-gold {
    @apply bg-[#c9a227] hover:bg-[#dfb63a] text-white px-5 py-2.5 rounded-xl text-sm font-bold transition-all duration-300 flex items-center justify-center gap-2 shadow-lg shadow-gold-500/10 active:scale-95;
  }
  .btn-outline {
    @apply border border-slate-200 bg-white hover:bg-slate-50 text-slate-700 px-5 py-2.5 rounded-xl text-sm font-bold transition-all duration-300 flex items-center justify-center gap-2 active:scale-95;
  }

  /* ── INPUTS ── */
  .premium-input {
    @apply w-full bg-white border border-slate-200 rounded-xl px-4 py-3 text-sm text-slate-800 placeholder-slate-400 outline-none focus:border-gold-500 focus:ring-4 focus:ring-gold-500/5 transition-all duration-300;
  }

  /* ── TABELAS ── */
  .premium-table {
    @apply w-full text-left border-collapse;
  }
  .premium-table thead th {
    @apply px-6 py-4 bg-slate-50 text-[10px] font-black uppercase tracking-[0.1em] text-slate-400 border-b border-slate-100;
  }
  .premium-table tbody tr {
    @apply hover:bg-slate-50/80 transition-colors border-b border-slate-50 last:border-0;
  }
  .premium-table tbody td {
    @apply px-6 py-4 text-sm text-slate-600;
  }

  /* ── BADGES ── */
  .badge {
    @apply px-2.5 py-1 rounded-full text-[10px] font-black uppercase tracking-tighter;
  }
  .badge-navy { @apply bg-navy-50 text-navy-800; }
  .badge-gold { @apply bg-gold-50 text-gold-600; }
  .badge-success { @apply bg-emerald-50 text-emerald-600; }
  
  /* ── HEADERS DE PÁGINA ── */
  .page-header {
    @apply flex flex-col md:flex-row md:items-center justify-between gap-4 mb-10;
  }
  .page-title {
    @apply text-2xl md:text-3xl font-bold text-slate-900 tracking-tight;
  }
  .page-subtitle {
    @apply text-slate-500 mt-1 flex items-center gap-2 text-sm;
  }
}

/* ── ANIMAÇÕES GLOBAIS ── */
@keyframes slideUpFade {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-premium {
  animation: slideUpFade 0.5s ease-out forwards;
}
.stagger-1 { animation-delay: 0.1s; }
.stagger-2 { animation-delay: 0.2s; }
.stagger-3 { animation-delay: 0.3s; }

/* Scrollbar Custom */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }