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

:root {
  --primary: #1E4E8C;
  --primary-rgb: 30, 78, 140;
  --text: #000000;
  --bg: #ffffff;
  --white: #ffffff;
  --gray-light: #f9fafb;
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --nav-bg: var(--white);
  --nav-text: var(--text);
  --sidebar-bg: #f8f9fa;
  --divider-color: rgba(0, 0, 0, 0.2);
  --btn-bg: var(--primary);
  --btn-text: var(--white);
  --action-primary-text: var(--primary);
  --action-primary-hover-bg: #f0f0f0;
  --submit-hover-text: var(--primary);
  --shadow-inset-dark: inset -14px -14px 50px rgba(0, 0, 0, 0.36);
  --shadow-inset-light: inset 14px 14px 50px rgba(0, 0, 0, 0.26);
  --shadow-outer: 0 10px 24px rgba(30, 78, 140, 0.16);
  --shadow-outer-light: 0 10px 24px rgba(30, 78, 140, 0.14);
  --form-border: rgba(255, 255, 255, 0.3);
  --form-label: rgba(255, 255, 255, 0.8);
  --login-bg: var(--primary);
  --token-bg: #222222;
  --key-bg: rgba(255, 255, 255, 0.1);
  --key-border: rgba(255, 255, 255, 0.3);
  --key-hover-bg: rgba(255, 255, 255, 0.2);
  --clear-btn-bg: rgba(255, 80, 80, 0.2);
  --clear-btn-border: rgba(255, 80, 80, 0.4);
  --clear-btn-hover-bg: rgba(255, 80, 80, 0.3);
  --alert-bg: var(--primary);
  --alert-icon-color: #dc3545;
  --alert-title-color: #ff4d4d;
  --alert-text-color: rgba(255, 255, 255, 0.9);
  --alert-expired-icon: #ffcc00;
  --alert-expired-title: #ffd700;
  --alert-expired-text: rgba(255, 255, 255, 0.95);
  --error-bg: #f8d7da;
  --error-text: #721c24;
  --text-link: #02204e;
  --facebook-icon: #4267B2;
  --linkedin-icon: #0077B5;
  --instagram-gradient: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  --google-gradient: linear-gradient(45deg, #4285F4 0%, #EA4335 25%, #FBBC05 50%, #34A853 75%);
  --home-icon: #02204e;
  --servicos-icon: #4B0082;
  --segmentos-icon: #88B04B;
  --calendario-icon: #FF6B35;
  --whatsapp-bg: #25d366;
  --whatsapp-hover-bg: #20b358;
  --checkbox-border: rgba(255, 255, 255, 0.5);
}

/* Overlay da modal */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  padding: 20px;
  box-sizing: border-box;
}

/* Conteúdo da modal */
.modal-content {
  background-color: var(--white);
  border-radius: 1rem;
  max-width: 480px;
  width: 100%;
  padding: 2rem 2.5rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
  color: var(--text);
  font-family: var(--font-family);
}

/* Título da modal */
.modal-content h2 {
  font-size: 1.8rem;
  margin-bottom: 1rem;
  font-weight: 700;
  color: var(--primary);
}

/* Texto da modal */
.modal-content p {
  font-size: 1.1rem;
  line-height: 1.5;
  margin-bottom: 2rem;
}

/* Botão da modal */
.modal-content button {
  background-color: var(--primary);
  color: var(--white);
  border: none;
  border-radius: 8px;
  padding: 0.75rem 2.5rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.modal-content button:hover {
  background-color: #02204e;
  transform: scale(1.05);
}

/* Responsividade */
@media (max-width: 576px) {
  .modal-content {
    padding: 1.5rem;
  }

  .modal-content h2 {
    font-size: 1.4rem;
  }

  .modal-content p {
    font-size: 1rem;
  }

  .modal-content button {
    font-size: 1rem;
    padding: 0.6rem 2rem;
    width: 100%;
  }
}