/* Camada institucional UFPA — adaptação visual para a Universidade Federal do Pará */
:root {
  --ufpa-blue: #004b87;
  --ufpa-blue-dark: #003865;
  --ufpa-blue-darker: #002347;
  --ufpa-blue-soft: #eff6ff;
  --ufpa-text: #0f172a;
  --ufpa-muted: #475569;
  --ufpa-border: #cbd5e1;
  --ufpa-page: #f8fafc;
  --ufpa-shadow: 0 20px 45px rgba(0, 75, 135, 0.08);
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--ufpa-page) !important;
  color: var(--ufpa-text) !important;
  font-family: var(--font-inter), "Segoe UI", Arial, sans-serif !important;
}

/* Header principal com degradê UFPA */
.min-h-screen > header:first-of-type {
  position: relative !important;
  top: auto !important;
  background: linear-gradient(120deg, var(--ufpa-blue) 0%, #003e73 50%, var(--ufpa-blue-darker) 100%) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  padding: 18px 16px !important;
  color: #fff !important;
  backdrop-filter: none !important;
}

.min-h-screen > header:first-of-type .max-w-6xl {
  max-width: 1280px !important;
}

.min-h-screen > header:first-of-type img {
  width: auto !important;
  height: 68px !important;
  max-height: 68px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.22));
}

.min-h-screen > header:first-of-type h1,
.min-h-screen > header:first-of-type p,
.min-h-screen > header:first-of-type .dark\:text-white,
.min-h-screen > header:first-of-type .text-slate-800,
.min-h-screen > header:first-of-type .text-slate-400,
.min-h-screen > header:first-of-type .text-slate-500 {
  color: #fff !important;
}

.min-h-screen > header:first-of-type h1 {
  font-size: 1.55rem !important;
  letter-spacing: -0.02em !important;
}

.min-h-screen > header:first-of-type p {
  opacity: 0.92 !important;
}

.min-h-screen > header:first-of-type .h-8.w-px {
  background: rgba(255, 255, 255, 0.32) !important;
}

/* Botões do topo (Header Action Buttons) */
.min-h-screen > header:first-of-type button,
.min-h-screen > header:first-of-type label {
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  background: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  backdrop-filter: blur(4px) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  transition: all 0.2s ease-in-out !important;
}

.min-h-screen > header:first-of-type button:hover,
.min-h-screen > header:first-of-type label:hover {
  background: rgba(255, 255, 255, 0.28) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Área hero */
main.max-w-6xl {
  max-width: 1280px !important;
  margin-top: 0 !important;
  padding-top: 36px !important;
}

main.max-w-6xl > div:first-child > header:first-child {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 255, 255, 0.97) 55%, rgba(239, 246, 255, 0.92) 100%),
              radial-gradient(circle at right center, rgba(0, 75, 135, 0.15), transparent 35%);
  border: 1px solid #cbd5e1;
  border-radius: 24px;
  padding: 34px;
  box-shadow: var(--ufpa-shadow);
}

main.max-w-6xl > div:first-child > header:first-child::after {
  content: 'UFPA';
  position: absolute;
  right: -8px;
  top: 18px;
  font-size: clamp(42px, 7vw, 110px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  color: rgba(0, 75, 135, 0.06);
  pointer-events: none;
}

/* Sobrescrita de cores para elementos Brand (Modo Claro) */
html:not(.dark) main h2 span,
html:not(.dark) .text-brand-600,
html:not(.dark) .text-brand-700,
html:not(.dark) .text-brand-800,
html:not(.dark) .text-brand-900\/80 {
  color: var(--ufpa-blue) !important;
}

html:not(.dark) .bg-brand-50 {
  background: var(--ufpa-blue-soft) !important;
}

html:not(.dark) .border-brand-200,
html:not(.dark) .border-brand-200\/80 {
  border-color: #bfdbfe !important;
}

/* Sobrescrita de cores para elementos Brand (Modo Escuro) */
.dark main h2 span,
.dark .text-brand-400,
.dark .text-brand-300 {
  color: #60a5fa !important;
}

.dark .bg-brand-950\/20 {
  background: rgba(0, 75, 135, 0.25) !important;
}

.dark .border-brand-900\/40,
.dark .border-brand-900\/50 {
  border-color: rgba(96, 165, 250, 0.3) !important;
}

/* Cards e formulários */
.rounded-2xl, .rounded-xl {
  border-radius: 20px !important;
}

.shadow-sm, .shadow-xl, .shadow-md {
  box-shadow: var(--ufpa-shadow) !important;
}

input, select, textarea {
  color: var(--ufpa-text) !important;
}

.focus\:ring-brand-500:focus,
.focus\:border-brand-500:focus {
  --tw-ring-color: rgba(0, 75, 135, 0.28) !important;
  border-color: var(--ufpa-blue) !important;
}

/* Barra de navegação inferior */
.fixed.bottom-4 {
  border-color: #bfdbfe !important;
  background: rgba(239, 246, 255, 0.96) !important;
  box-shadow: 0 18px 42px rgba(0, 75, 135, 0.16) !important;
}

/* Rodapé institucional UFPA */
footer.mt-24 {
  background: var(--ufpa-blue-dark) !important;
  border-top: 0 !important;
  color: #fff !important;
  padding: 34px 0 !important;
}

footer.mt-24 .max-w-6xl {
  max-width: 1280px !important;
}

footer.mt-24 img {
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3)) !important;
  opacity: 0.95 !important;
  width: auto !important;
  height: 42px !important;
  max-height: 42px !important;
  object-fit: contain !important;
}

footer.mt-24,
footer.mt-24 p,
footer.mt-24 span,
footer.mt-24 a,
footer.mt-24 .text-slate-400,
footer.mt-24 .text-slate-500,
footer.mt-24 .text-slate-600,
footer.mt-24 .dark\:text-slate-300,
footer.mt-24 .dark\:text-slate-400 {
  color: #fff !important;
}

footer.mt-24 a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

footer.mt-24 .h-6.w-px {
  background: rgba(255, 255, 255, 0.35) !important;
}

/* Modo escuro (Dark Mode) */
.dark body,
.dark .min-h-screen {
  background: #09131d !important;
}

.dark main.max-w-6xl > div:first-child > header:first-child {
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.98), rgba(10, 37, 64, 0.96));
  border-color: rgba(255, 255, 255, 0.1);
}

.dark main.max-w-6xl > div:first-child > header:first-child::after {
  color: rgba(255, 255, 255, 0.04);
}

@media (max-width: 768px) {
  .min-h-screen > header:first-of-type .max-w-6xl {
    align-items: flex-start !important;
  }
  .min-h-screen > header:first-of-type img {
    width: 210px !important;
  }
  main.max-w-6xl > div:first-child > header:first-child {
    padding: 24px;
  }
}
