/* =========================================================
   ADM Rafael — Visual PRETO + DOURADO premium
   Sofisticado, moderno, com vida — para impressionar
   ========================================================= */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Playfair+Display:wght@600;700&display=swap");

:root {
  --black: #050505;
  --black2: #0c0c0c;
  --black3: #141414;
  --black4: #1a1a1a;
  --gold: #c08b42;
  --gold2: #e3b760;
  --gold3: #f0d090;
  --gold-dim: rgba(192, 139, 66, 0.18);
  --gold-line: rgba(192, 139, 66, 0.32);
  --text: #f6f0e6;
  --text-muted: #a89f90;
  --text-dim: #7a7268;
  --success: #3dcf8e;
  --danger: #ff6b7a;
  --info: #6b9fff;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
  --glow-gold: 0 0 40px rgba(192, 139, 66, 0.15);
}

/* ——— Base ——— */
html { scroll-behavior: smooth; }

body {
  font-family: "Inter", system-ui, sans-serif !important;
  color: var(--text) !important;
  background: var(--black) !important;
  background-image:
    radial-gradient(ellipse 90% 55% at 8% -8%, rgba(192, 139, 66, 0.22), transparent 52%),
    radial-gradient(ellipse 60% 45% at 95% 5%, rgba(227, 183, 96, 0.1), transparent 48%),
    radial-gradient(ellipse 50% 40% at 70% 100%, rgba(192, 139, 66, 0.08), transparent 50%),
    linear-gradient(165deg, #030303 0%, #0a0a0a 40%, #080807 100%) !important;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.5;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 30%, black 15%, transparent 72%);
  animation: grid-drift 40s linear infinite;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(ellipse at center, transparent 35%, rgba(0, 0, 0, 0.55) 100%);
}

body > * {
  position: relative;
  z-index: 1;
}

/* Force text colors on slate utilities */
.text-slate-800,
.text-slate-700,
.text-slate-900,
.font-bold.text-slate-800,
h3, h4 {
  color: var(--text) !important;
}

.text-slate-600,
.text-slate-500,
.text-slate-400 {
  color: var(--text-muted) !important;
}

.text-indigo-600,
.text-indigo-500 {
  color: var(--gold2) !important;
}

.text-amber-400,
.text-amber-500 {
  color: var(--gold2) !important;
}

/* ——— LOGIN ——— */
#loginScreen {
  background:
    radial-gradient(ellipse 80% 50% at 50% -15%, rgba(192, 139, 66, 0.35), transparent 55%),
    radial-gradient(circle at 85% 85%, rgba(192, 139, 66, 0.1), transparent 40%),
    linear-gradient(155deg, #020202 0%, #0d0c0a 45%, #050505 100%) !important;
  overflow: hidden;
}

#loginScreen::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(227, 183, 96, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(227, 183, 96, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, black 15%, transparent 70%);
  animation: grid-drift 28s linear infinite;
  pointer-events: none;
}

#loginScreen::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  left: 50%;
  top: 42%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(192, 139, 66, 0.22), transparent 65%);
  filter: blur(50px);
  pointer-events: none;
  animation: glow-pulse 5s ease-in-out infinite;
}

#loginScreen > div {
  position: relative;
  z-index: 2;
  background: linear-gradient(165deg, rgba(22, 20, 16, 0.95), rgba(10, 10, 9, 0.98)) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.7),
    0 0 80px rgba(192, 139, 66, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  animation: login-in 0.7s var(--ease) both;
  overflow: hidden;
}

#loginScreen > div::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold2), var(--gold), transparent);
  z-index: 5;
  box-shadow: 0 0 20px rgba(227, 183, 96, 0.6);
}

#loginScreen .bg-slate-900,
#loginScreen .bg-slate-900.text-white {
  background: linear-gradient(160deg, #14120f 0%, #0a0908 100%) !important;
  border-color: var(--gold-line) !important;
  color: var(--text) !important;
}

#loginScreen .w-14.h-14 {
  background: rgba(192, 139, 66, 0.12) !important;
  border-color: rgba(227, 183, 96, 0.4) !important;
  box-shadow: 0 0 40px rgba(192, 139, 66, 0.35);
  animation: icon-float 3.5s ease-in-out infinite;
}

#loginScreen .fa-scale-balanced {
  color: var(--gold2) !important;
  filter: drop-shadow(0 0 12px rgba(227, 183, 96, 0.6));
}

#loginScreen h1 {
  font-family: "Playfair Display", Georgia, serif !important;
  background: linear-gradient(180deg, #fff8ee, var(--gold2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  letter-spacing: 0.06em;
}

#loginScreen form {
  background: transparent !important;
}

#loginScreen label {
  color: var(--text-muted) !important;
}

#loginScreen input,
#loginScreen select {
  background: #0a0a0a !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: var(--text) !important;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s !important;
}

#loginScreen select option {
  background: #121212;
  color: #f0e6d8;
}

#loginScreen input:focus,
#loginScreen select:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px rgba(192, 139, 66, 0.2), 0 0 24px rgba(192, 139, 66, 0.12) !important;
  background: #101010 !important;
}

#loginScreen button[type="submit"] {
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color: #0a0908 !important;
  border: none !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 36px rgba(192, 139, 66, 0.4);
  position: relative;
  overflow: hidden;
  transition: transform 0.25s var(--ease), box-shadow 0.25s, filter 0.25s !important;
}

#loginScreen button[type="submit"]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 25%, rgba(255, 255, 255, 0.35) 50%, transparent 75%);
  transform: translateX(-130%);
  transition: transform 0.6s ease;
}

#loginScreen button[type="submit"]:hover {
  transform: translateY(-3px);
  filter: brightness(1.08);
  box-shadow: 0 20px 48px rgba(192, 139, 66, 0.5);
}

#loginScreen button[type="submit"]:hover::after {
  transform: translateX(130%);
}

#loginError {
  background: rgba(255, 80, 90, 0.1) !important;
  border-color: rgba(255, 100, 110, 0.3) !important;
  color: #ff8b95 !important;
}

/* ——— NAVBAR ——— */
body > nav.bg-slate-900,
body > nav {
  background: linear-gradient(180deg, rgba(12, 11, 9, 0.96), rgba(8, 8, 7, 0.94)) !important;
  backdrop-filter: blur(18px) saturate(1.3);
  -webkit-backdrop-filter: blur(18px) saturate(1.3);
  border-bottom: 1px solid var(--gold-line) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45), 0 0 40px rgba(192, 139, 66, 0.05);
  color: var(--text) !important;
}

body > nav::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 5%, var(--gold2) 50%, transparent 95%);
  opacity: 0.7;
  box-shadow: 0 0 16px rgba(227, 183, 96, 0.5);
  pointer-events: none;
}

body > nav .fa-scale-balanced {
  color: var(--gold2) !important;
  filter: drop-shadow(0 0 14px rgba(227, 183, 96, 0.7));
  animation: gold-glow 3s ease-in-out infinite;
}

body > nav span {
  color: var(--text) !important;
}

body > nav .text-amber-400 {
  color: var(--gold2) !important;
}

body > nav .bg-slate-800 {
  background: rgba(26, 24, 20, 0.9) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow: inset 0 0 20px rgba(192, 139, 66, 0.05);
  transition: border-color 0.3s, box-shadow 0.3s;
}

body > nav .bg-slate-800:hover {
  border-color: rgba(227, 183, 96, 0.55) !important;
  box-shadow: 0 0 24px rgba(192, 139, 66, 0.15);
}

body > nav select {
  color: var(--text) !important;
  background: transparent !important;
}

body > nav select option {
  background: #12110f;
  color: #f0e6d8;
}

body > nav button {
  color: var(--text-muted) !important;
  background: rgba(26, 24, 20, 0.9) !important;
  border: 1px solid rgba(192, 139, 66, 0.2);
  border-radius: 0.75rem;
  transition: color 0.25s, transform 0.25s var(--ease), border-color 0.25s, box-shadow 0.25s !important;
}

body > nav button:hover {
  color: var(--gold2) !important;
  transform: scale(1.08);
  border-color: var(--gold);
  box-shadow: 0 0 20px rgba(192, 139, 66, 0.25);
}

#notifBadge {
  background: linear-gradient(135deg, #e11d48, #ff5a6a) !important;
  box-shadow: 0 0 0 2px #0a0a0a, 0 0 14px rgba(255, 80, 90, 0.7);
  animation: badge-pulse 1.8s ease-in-out infinite;
  color: #fff !important;
}

/* ——— Notification panel ——— */
#notificationPanel {
  background: linear-gradient(165deg, #161410, #0c0b09) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.65), 0 0 40px rgba(192, 139, 66, 0.1) !important;
  animation: panel-in 0.35s var(--ease);
  color: var(--text) !important;
}

#notificationPanel > .bg-slate-900 {
  background: linear-gradient(135deg, #1a1610, #0f0e0c) !important;
  border-bottom: 1px solid var(--gold-line);
}

#notificationList {
  background: #0a0908 !important;
}

#notificationList > div,
#notificationList .bg-white {
  background: linear-gradient(145deg, #1a1814, #12110e) !important;
  border: 1px solid rgba(192, 139, 66, 0.2) !important;
  color: var(--text) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  transition: transform 0.25s var(--ease), border-color 0.25s, box-shadow 0.25s;
}

#notificationList > div:hover {
  transform: translateX(5px);
  border-color: rgba(227, 183, 96, 0.5) !important;
  box-shadow: 0 12px 28px rgba(192, 139, 66, 0.12);
}

#notificationList .text-slate-800,
#notificationList p {
  color: var(--text) !important;
}

#notificationList .text-amber-600 {
  color: var(--gold2) !important;
}

/* ——— MODULE TABS ——— */
body > .bg-white.border-b {
  background: rgba(12, 11, 9, 0.92) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--gold-line) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
}

body > .bg-white.border-b button {
  color: var(--text-dim) !important;
  border-bottom-color: transparent !important;
  transition: color 0.25s, border-color 0.25s, background 0.25s, text-shadow 0.25s !important;
  position: relative;
}

body > .bg-white.border-b button:hover {
  color: var(--text) !important;
  background: rgba(192, 139, 66, 0.06) !important;
}

body > .bg-white.border-b button.border-indigo-600,
body > .bg-white.border-b button.text-indigo-600 {
  color: var(--gold2) !important;
  border-bottom-color: var(--gold) !important;
  background: linear-gradient(180deg, rgba(192, 139, 66, 0.12), transparent) !important;
  text-shadow: 0 0 20px rgba(227, 183, 96, 0.35);
}

body > .bg-white.border-b button i {
  transition: transform 0.3s var(--ease), filter 0.3s;
}

body > .bg-white.border-b button.border-indigo-600 i,
body > .bg-white.border-b button:hover i {
  color: var(--gold2) !important;
  filter: drop-shadow(0 0 8px rgba(227, 183, 96, 0.5));
  transform: scale(1.08);
}

body > .bg-white.border-b .text-blue-600,
body > .bg-white.border-b .text-slate-600 {
  color: inherit !important;
}

/* ——— MAIN ——— */
main {
  color: var(--text) !important;
}

/* Cards */
main .bg-white,
main .bg-slate-50,
main .bg-slate-100 {
  background: linear-gradient(165deg, rgba(26, 24, 20, 0.95), rgba(14, 13, 11, 0.98)) !important;
  border-color: var(--gold-line) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow), var(--glow-gold) !important;
  transition: transform 0.4s var(--ease), box-shadow 0.4s ease, border-color 0.4s ease;
  position: relative;
  overflow: hidden;
}

main .bg-white.rounded-2xl::before,
main .bg-white.rounded-xl::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(227, 183, 96, 0.55), transparent);
  z-index: 2;
  pointer-events: none;
}

main .bg-white.rounded-2xl:hover {
  transform: translateY(-3px);
  border-color: rgba(227, 183, 96, 0.5) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.55), 0 0 50px rgba(192, 139, 66, 0.12) !important;
}

main .border-slate-100,
main .border-slate-200,
main .border-b,
main .border-t {
  border-color: rgba(192, 139, 66, 0.18) !important;
}

main p,
main label,
main span,
main h3,
main h4 {
  color: inherit;
}

main label.block,
main .font-bold.text-slate-600,
main .text-slate-600 {
  color: var(--text-muted) !important;
}

main .text-slate-400,
main .text-\[11px\].text-slate-400,
main p.text-slate-400 {
  color: var(--text-dim) !important;
}

/* ——— Forms ——— */
main input,
main select,
main textarea,
#processModal input,
#processModal select,
#processModal textarea,
#agendaDayModal input,
#agendaDayModal select,
#liquidacaoModal input,
#liquidacaoModal select,
#liquidacaoModal textarea {
  background: #0a0a0a !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: var(--text) !important;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s !important;
}

main select option,
#processModal select option,
#agendaDayModal select option,
#liquidacaoModal select option {
  background: #121212;
  color: #f0e6d8;
}

main input::placeholder,
main textarea::placeholder {
  color: #6b6358 !important;
}

main input:focus,
main select:focus,
main textarea:focus,
#processModal input:focus,
#processModal select:focus,
#agendaDayModal input:focus,
#liquidacaoModal input:focus,
#liquidacaoModal select:focus,
#liquidacaoModal textarea:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px rgba(192, 139, 66, 0.18), 0 0 20px rgba(192, 139, 66, 0.1) !important;
  background: #10100e !important;
  outline: none !important;
}

/* File inputs */
main input[type="file"] {
  color: var(--text-muted) !important;
}

/* ——— BUTTONS ——— */
main button.bg-indigo-600,
main label.bg-indigo-600,
#processModal button.bg-indigo-600,
#agendaDayModal button.bg-indigo-600,
#btnSalvarProcesso,
#btnSubmitContato,
#btnCRMSubmit,
#btnSubmitUsuario {
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color: #0a0908 !important;
  border: none !important;
  box-shadow: 0 10px 28px rgba(192, 139, 66, 0.35);
  position: relative;
  overflow: hidden;
  transition: transform 0.25s var(--ease), box-shadow 0.25s, filter 0.25s !important;
}

main button.bg-indigo-600:hover,
main label.bg-indigo-600:hover,
#processModal button.bg-indigo-600:hover,
#agendaDayModal button.bg-indigo-600:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
  box-shadow: 0 16px 40px rgba(192, 139, 66, 0.48);
}

main button.bg-emerald-600,
main label.bg-emerald-600,
#liquidacaoModal button.bg-emerald-600 {
  background: linear-gradient(135deg, #1a9b64, #3dcf8e) !important;
  color: #04150e !important;
  box-shadow: 0 10px 28px rgba(61, 207, 142, 0.28);
  position: relative;
  overflow: hidden;
  transition: transform 0.25s var(--ease), box-shadow 0.25s, filter 0.25s !important;
}

main button.bg-emerald-600:hover,
main label.bg-emerald-600:hover,
#liquidacaoModal button.bg-emerald-600:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 16px 36px rgba(61, 207, 142, 0.4);
}

main button.bg-slate-800,
main button.bg-slate-900 {
  background: linear-gradient(135deg, #1f1c18, #2a2520) !important;
  color: var(--gold2) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  transition: transform 0.25s var(--ease), border-color 0.25s, box-shadow 0.25s !important;
}

main button.bg-slate-800:hover,
main button.bg-slate-900:hover {
  transform: translateY(-2px);
  border-color: rgba(227, 183, 96, 0.55) !important;
  box-shadow: 0 14px 32px rgba(192, 139, 66, 0.15);
}

main button.bg-rose-600 {
  background: linear-gradient(135deg, #c41e3a, #ff5a6a) !important;
  color: #fff !important;
  box-shadow: 0 10px 28px rgba(196, 30, 58, 0.3);
  transition: transform 0.25s var(--ease), filter 0.25s !important;
}

main button.bg-rose-600:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

main button.bg-blue-600 {
  background: linear-gradient(135deg, var(--gold), #d4a84b) !important;
  color: #0a0908 !important;
  box-shadow: 0 10px 28px rgba(192, 139, 66, 0.3);
}

main button.bg-blue-600:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

main button.bg-slate-100,
main button.bg-slate-200,
#processModal button.bg-slate-100,
#agendaDayModal button[onclick*="close"],
#liquidacaoModal button[type="button"] {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

main button.bg-slate-100:hover,
main button.bg-slate-200:hover {
  background: rgba(192, 139, 66, 0.12) !important;
  border-color: var(--gold-line) !important;
}

/* Shine on gold buttons */
main button.bg-indigo-600::after,
main label.bg-indigo-600::after,
main button.bg-emerald-600::after,
main label.bg-emerald-600::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 28%, rgba(255, 255, 255, 0.28) 50%, transparent 72%);
  transform: translateX(-130%);
  transition: transform 0.55s ease;
  pointer-events: none;
}

main button.bg-indigo-600:hover::after,
main label.bg-indigo-600:hover::after,
main button.bg-emerald-600:hover::after,
main label.bg-emerald-600:hover::after {
  transform: translateX(130%);
}

/* Icons that were indigo */
main .text-indigo-500,
main .fa-user-plus,
main .fa-calculator,
main .fa-wand-magic-sparkles,
main .fa-user-clock {
  color: var(--gold2) !important;
}

main .text-emerald-500,
main .text-emerald-700 {
  color: var(--success) !important;
}

main .text-rose-500,
main .text-rose-700 {
  color: var(--danger) !important;
}

/* Badges */
#totReceber {
  background: rgba(61, 207, 142, 0.12) !important;
  color: var(--success) !important;
  border: 1px solid rgba(61, 207, 142, 0.3);
  box-shadow: 0 0 20px rgba(61, 207, 142, 0.1);
}

#totPagar {
  background: rgba(255, 107, 122, 0.1) !important;
  color: var(--danger) !important;
  border: 1px solid rgba(255, 107, 122, 0.3);
  box-shadow: 0 0 20px rgba(255, 107, 122, 0.1);
}

#totPagos,
#processCount {
  background: rgba(192, 139, 66, 0.12) !important;
  color: var(--gold2) !important;
  border: 1px solid var(--gold-line);
}

/* Finance borders */
main .border-emerald-500 {
  border-color: rgba(61, 207, 142, 0.5) !important;
}

main .border-rose-500,
main .border-rose-100 {
  border-color: rgba(255, 107, 122, 0.35) !important;
}

/* ——— TABLES ——— */
main table thead tr,
main table thead {
  background: linear-gradient(180deg, #1a1814, #12110e) !important;
}

main table thead th {
  color: var(--gold2) !important;
  border-color: var(--gold-line) !important;
  letter-spacing: 0.06em;
}

main table tbody {
  color: var(--text-muted) !important;
}

main table tbody tr {
  border-color: rgba(255, 255, 255, 0.04) !important;
  transition: background 0.2s ease;
}

main table tbody tr:hover {
  background: rgba(192, 139, 66, 0.07) !important;
}

main .divide-y > :not([hidden]) ~ :not([hidden]),
main .divide-slate-100 > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(255, 255, 255, 0.05) !important;
}

main .bg-slate-50 {
  background: rgba(255, 255, 255, 0.03) !important;
}

/* Action icons in tables */
main .text-blue-600,
main .text-blue-800 {
  color: var(--gold2) !important;
}

main .text-rose-600,
main .text-rose-800 {
  color: var(--danger) !important;
}

/* Process sub-tabs */
#tabAtivosBtn,
#tabArquivadosBtn,
#tabGraficosBtn {
  color: var(--text-dim) !important;
  border-color: transparent !important;
  transition: color 0.25s, border-color 0.25s, background 0.25s !important;
}

#tabAtivosBtn.border-indigo-600,
#tabArquivadosBtn.border-indigo-600,
#tabGraficosBtn.border-indigo-600,
#tabAtivosBtn.text-indigo-600 {
  color: var(--gold2) !important;
  border-bottom-color: var(--gold) !important;
  background: linear-gradient(180deg, rgba(192, 139, 66, 0.1), transparent);
  text-shadow: 0 0 16px rgba(227, 183, 96, 0.3);
}

/* Profile box */
#contactProfileBox {
  background: linear-gradient(145deg, #1a1610 0%, #0c0b09 50%, #12100c 100%) !important;
  border: 1px solid rgba(227, 183, 96, 0.35) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.5), 0 0 50px rgba(192, 139, 66, 0.1) !important;
  animation: panel-in 0.4s var(--ease);
  color: var(--text) !important;
}

#contactProfileBox .border-slate-800 {
  border-color: rgba(192, 139, 66, 0.2) !important;
}

#contactProfileBox .bg-slate-850,
#contactProfileBox [class*="bg-slate"] {
  background: rgba(0, 0, 0, 0.35) !important;
  border-color: rgba(192, 139, 66, 0.2) !important;
}

#contactProfileBox .bg-amber-500\/10,
#contactProfileBox [class*="amber"] {
  background: rgba(192, 139, 66, 0.1) !important;
  border-color: rgba(227, 183, 96, 0.25) !important;
}

/* ——— KANBAN ——— */
.kanban-column {
  min-height: 280px;
  max-height: 500px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--gold) transparent;
}

#modSec-crm > .flex > div,
#modSec-crm .lg\:grid > div.bg-slate-100 {
  background: linear-gradient(180deg, #1a1814, #12110e) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  transition: transform 0.35s var(--ease), box-shadow 0.35s, border-color 0.35s;
}

#modSec-crm > .flex > div:hover {
  transform: translateY(-4px);
  border-color: rgba(227, 183, 96, 0.5) !important;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.45), 0 0 30px rgba(192, 139, 66, 0.1);
}

#modSec-crm .border-b {
  border-color: rgba(192, 139, 66, 0.2) !important;
}

#modSec-crm .bg-slate-200 {
  background: rgba(192, 139, 66, 0.15) !important;
  color: var(--gold2) !important;
}

#modSec-crm [id^="col-"] > div {
  background: linear-gradient(145deg, #201c16, #14120e) !important;
  border: 1px solid rgba(192, 139, 66, 0.2) !important;
  color: var(--text) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
  transition: transform 0.25s var(--ease), box-shadow 0.25s, border-color 0.25s !important;
}

#modSec-crm [id^="col-"] > div:hover {
  transform: translateY(-3px) scale(1.02);
  border-color: rgba(227, 183, 96, 0.45) !important;
  box-shadow: 0 14px 32px rgba(192, 139, 66, 0.15) !important;
}

/* Calendar */
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-day {
  min-height: 105px;
  background: #12110e !important;
  transition: background 0.25s, transform 0.25s var(--ease), box-shadow 0.25s;
  color: var(--text) !important;
}

.calendar-day:hover {
  background: linear-gradient(145deg, #1f1a12, #16140f) !important;
  cursor: pointer;
  transform: scale(1.015);
  box-shadow: inset 0 0 0 1px rgba(227, 183, 96, 0.4), 0 0 20px rgba(192, 139, 66, 0.1);
  z-index: 1;
}

#calendarDaysGrid {
  background: #0a0908 !important;
  gap: 1px;
}

#modSec-crm .bg-slate-900 {
  background: linear-gradient(135deg, #1a1610, #0c0b09) !important;
  border-bottom: 1px solid var(--gold-line);
  position: relative;
  overflow: hidden;
}

#modSec-crm .bg-slate-900::after {
  content: "";
  position: absolute;
  top: -40%;
  right: -10%;
  width: 280px;
  height: 200%;
  background: radial-gradient(circle, rgba(227, 183, 96, 0.12), transparent 65%);
  pointer-events: none;
  animation: glow-pulse 6s ease-in-out infinite;
}

#modSec-crm .bg-slate-800 {
  background: rgba(0, 0, 0, 0.4) !important;
  border: 1px solid var(--gold-line);
}

#modSec-crm .bg-slate-100.border-b {
  background: #14120e !important;
  color: var(--text-muted) !important;
}

/* ——— USERS ——— */
#usersGridCard > div {
  background: linear-gradient(145deg, #1a1814, #12110e) !important;
  border: 1px solid var(--gold-line) !important;
  transition: transform 0.35s var(--ease), box-shadow 0.35s, border-color 0.35s !important;
}

#usersGridCard > div:hover {
  transform: translateY(-5px);
  border-color: rgba(227, 183, 96, 0.55) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(192, 139, 66, 0.12) !important;
}

#usersGridCard .bg-indigo-600.rounded-full,
#usersGridCard [class*="bg-indigo"] {
  background: linear-gradient(135deg, var(--gold), var(--gold2)) !important;
  color: #0a0908 !important;
  box-shadow: 0 8px 20px rgba(192, 139, 66, 0.4);
}

/* ——— MODALS ——— */
#processModal,
#agendaDayModal,
#liquidacaoModal {
  background: rgba(0, 0, 0, 0.75) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

#processModal > div,
#agendaDayModal > div,
#liquidacaoModal > div {
  background: linear-gradient(165deg, #1a1814, #0e0d0b) !important;
  border: 1px solid var(--gold-line) !important;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.7), 0 0 60px rgba(192, 139, 66, 0.1) !important;
  animation: modal-in 0.4s var(--ease);
  color: var(--text) !important;
}

#processModal h3,
#agendaDayModal h3,
#liquidacaoModal h3 {
  color: var(--text) !important;
}

#liquidacaoModal .bg-slate-900 {
  background: linear-gradient(135deg, #1a1610, #0f0e0c) !important;
  border-bottom: 1px solid var(--gold-line);
}

#processModal .border-b,
#agendaDayModal .border-b {
  border-color: var(--gold-line) !important;
}

#processModal .bg-slate-50,
#liquidacaoModal .bg-slate-50 {
  background: rgba(192, 139, 66, 0.06) !important;
  border-color: var(--gold-line) !important;
}

#processModal .bg-amber-50\/50,
#processModal input.bg-amber-50\/50 {
  background: rgba(192, 139, 66, 0.08) !important;
}

/* File picker buttons inside modals */
#processModal input[type="file"]::file-selector-button,
main input[type="file"]::file-selector-button {
  background: rgba(192, 139, 66, 0.15);
  color: var(--gold2);
  border: 1px solid var(--gold-line);
  border-radius: 0.5rem;
  padding: 0.35rem 0.75rem;
  margin-right: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
}

#processModal input[type="file"]::file-selector-button:hover {
  background: rgba(192, 139, 66, 0.28);
}

/* ——— PAGINATION ——— */
.pagination-btn {
  min-width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.7rem;
  font-size: 11px;
  font-weight: 800;
  border: 1px solid var(--gold-line);
  background: #14120e;
  color: var(--text-muted);
  transition: all 0.22s var(--ease);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.pagination-btn:hover {
  background: rgba(192, 139, 66, 0.12);
  color: var(--gold2);
  border-color: rgba(227, 183, 96, 0.5);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(192, 139, 66, 0.15);
}

.pagination-btn.active {
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  color: #0a0908;
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(192, 139, 66, 0.4);
}

.pagination-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.payment-method-badge i { font-size: 0.52rem; line-height: 1; }
.payment-method-badge {
  font-size: 8px !important;
  padding: 2px 6px !important;
  gap: 3px !important;
  background: rgba(192, 139, 66, 0.12) !important;
  color: var(--gold2) !important;
  border: 1px solid var(--gold-line) !important;
}

/* Scrollbars */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

main ::-webkit-scrollbar { width: 6px; height: 6px; }
main ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--gold2), var(--gold));
  border-radius: 99px;
  box-shadow: 0 0 8px rgba(192, 139, 66, 0.4);
}
main ::-webkit-scrollbar-track { background: transparent; }

/* Document editor */
#documentTextArea {
  background: #0a0a0a !important;
  border-color: var(--gold-line) !important;
  color: var(--text) !important;
  box-shadow: inset 0 2px 16px rgba(0, 0, 0, 0.4);
}

#documentTextArea:focus {
  border-color: var(--gold) !important;
  box-shadow: inset 0 2px 16px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(192, 139, 66, 0.15) !important;
}

/* Chart */
#chartSection {
  animation: panel-in 0.45s var(--ease);
}

/* Deleted payments */
#deletedPaymentsBox {
  border-color: rgba(255, 107, 122, 0.3) !important;
}

#deletedPaymentsBox .bg-rose-50 {
  background: rgba(255, 107, 122, 0.08) !important;
  color: var(--danger) !important;
}

/* Section animation */
main > section:not(.hidden) {
  animation: section-in 0.5s var(--ease);
}

/* Amber accents everywhere */
.bg-amber-50,
.bg-amber-500\/10 {
  background: rgba(192, 139, 66, 0.1) !important;
}

.border-amber-500\/20,
.border-amber-500\/30 {
  border-color: rgba(227, 183, 96, 0.3) !important;
}

/* Print — papel limpo, sem overlay/filtro */
@media print {
  body::before,
  body::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
  }

  /* Processo: só #printSection (quando NÃO está imprimindo financeiro) */
  body:not(.printing-finance-report) * {
    visibility: hidden;
  }
  body:not(.printing-finance-report) #printSection,
  body:not(.printing-finance-report) #printSection * {
    visibility: visible;
  }
  body:not(.printing-finance-report) #printSection {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }

  /* Financeiro: conteúdo legível em preto no branco */
  body.printing-finance-report {
    background: #ffffff !important;
    color: #000000 !important;
  }
  body.printing-finance-report * {
    color: #000000 !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
  }
  body.printing-finance-report > *:not(#financeReportModal) {
    display: none !important;
  }
  body.printing-finance-report #financeReportModal {
    display: block !important;
    position: static !important;
    background: #ffffff !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  body.printing-finance-report #financeReportToolbar {
    display: none !important;
  }
  body.printing-finance-report #financeReportContent,
  body.printing-finance-report #financeReportContent * {
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  body.printing-finance-report #financeReportContent table th {
    background: #e5e5e5 !important;
    color: #000000 !important;
    border: 1px solid #333 !important;
  }
  body.printing-finance-report #financeReportContent table td {
    border: 1px solid #555 !important;
    color: #000000 !important;
  }

  .no-print {
    display: none !important;
  }
}

/* ——— Keyframes ——— */
@keyframes login-in {
  from { opacity: 0; transform: translateY(28px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes grid-drift {
  from { background-position: 0 0; }
  to { background-position: 56px 56px; }
}

@keyframes glow-pulse {
  0%, 100% { opacity: 0.5; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
}

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

@keyframes gold-glow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(227, 183, 96, 0.5)); }
  50% { filter: drop-shadow(0 0 18px rgba(227, 183, 96, 0.9)); }
}

@keyframes badge-pulse {
  0%, 100% { box-shadow: 0 0 0 2px #0a0a0a, 0 0 10px rgba(255, 80, 90, 0.5); }
  50% { box-shadow: 0 0 0 2px #0a0a0a, 0 0 20px rgba(255, 80, 90, 0.9); }
}

@keyframes panel-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes modal-in {
  from { opacity: 0; transform: translateY(22px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes section-in {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ——— Conteúdo gerado por JS (cards, badges, status) ——— */
main .bg-white,
#notificationList .bg-white,
[class*="rounded"][class*="border"].bg-white {
  color: var(--text) !important;
}

main .bg-indigo-50,
main .bg-blue-50,
main .bg-emerald-50,
main .bg-rose-50,
main .bg-amber-50,
main .bg-slate-100 {
  background: rgba(192, 139, 66, 0.1) !important;
  color: var(--gold2) !important;
  border-color: var(--gold-line) !important;
}

main .bg-emerald-50 {
  background: rgba(61, 207, 142, 0.12) !important;
  color: var(--success) !important;
  border-color: rgba(61, 207, 142, 0.3) !important;
}

main .bg-rose-50 {
  background: rgba(255, 107, 122, 0.1) !important;
  color: var(--danger) !important;
  border-color: rgba(255, 107, 122, 0.3) !important;
}

main .text-emerald-600,
main .text-emerald-700,
main .text-green-600 {
  color: var(--success) !important;
}

main .text-rose-500,
main .text-rose-600,
main .text-red-500,
main .text-red-600 {
  color: var(--danger) !important;
}

main .text-amber-600,
main .text-yellow-600,
main .text-orange-500 {
  color: var(--gold2) !important;
}

main .font-mono {
  color: var(--gold3);
}

/* Botões pequenos de ação gerados no HTML dinâmico */
main button.text-blue-600,
main button.text-indigo-600,
main a.text-blue-600 {
  color: var(--gold2) !important;
}

main button.text-rose-600 {
  color: var(--danger) !important;
}

/* Sombra suave animada no topo da página */
body > nav {
  animation: nav-shine 8s ease-in-out infinite;
}

@keyframes nav-shine {
  0%, 100% { box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45), 0 0 30px rgba(192, 139, 66, 0.04); }
  50% { box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45), 0 0 50px rgba(192, 139, 66, 0.12); }
}

/* Títulos de seção com toque sofisticado */
main h3.text-sm,
main h3.text-base,
main h3.text-lg,
main .uppercase.font-bold {
  letter-spacing: 0.04em;
}

/* Hover dourado em ícones Font Awesome na main */
main i.fa-solid,
main i.fa-regular {
  transition: filter 0.3s ease, transform 0.3s var(--ease);
}

main button:hover i.fa-solid,
main label:hover i.fa-solid {
  filter: drop-shadow(0 0 6px rgba(227, 183, 96, 0.45));
}

@media (max-width: 640px) {
  main .bg-white.rounded-2xl:hover {
    transform: none;
  }
}