/* ==========================================================================
   PORTAL CONTTROLLER - GLOBAL STYLES & TYPOGRAPHY
   ========================================================================== */

:root {
  --primary-conttroller: #0066FF;
  --navy-conttroller: #002046;
  --dark-navy: #001A38;
  --accent-cyan: #00D2FF;
  
  --bg-page: #F8FAFC;
  --bg-card: #FFFFFF;
  --text-main: #0F172A;
  --text-sub: #64748B;
  --border-light: #E2E8F0;
  
  --font-main: 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --transition-normal: 0.2s ease;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-main);
  background-color: var(--bg-page);
  color: var(--text-main);
  min-height: 100vh;
  overflow-x: hidden;
  line-height: 1.5;
}

/* Typography Defaults */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-main);
  font-weight: 700;
  color: var(--navy-conttroller);
}

a {
  color: var(--primary-conttroller);
  text-decoration: none;
  transition: color var(--transition-normal);
}

a:hover {
  color: #0052CC;
}

/* Utilities */
.d-none { display: none !important; }
.d-flex { display: flex !important; }
.text-center { text-align: center; }
.text-end { text-align: right; }
.text-muted { color: var(--text-sub); }
.ms-1 { margin-left: 0.25rem; }
.ms-2 { margin-left: 0.5rem; }
.me-1 { margin-right: 0.25rem; }
.me-2 { margin-right: 0.5rem; }
.me-3 { margin-right: 1rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }

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

.animate-fade-in {
  animation: fadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}