/* ===========================
   Sonar Med • Tema 2025
   Paleta:
   bg         #c6ecf2
   primary    #00838f
   secondary  #4f9da6
   text       #5f6f73
   light      #f9fdfd
   success    #26a69a
   warning    #ffb74d
   danger     #e57373
   footer     #005662
   =========================== */

:root{
  --sonar-bg:#c6ecf2;
  --sonar-text:#5f6f73;
  --sonar-primary:#00838f;
  --sonar-primary-600:#00707b;
  --sonar-secondary:#4f9da6;
  --sonar-secondary-600:#3f8790;
  --sonar-light:#f9fdfd;
  --sonar-card:#ffffff;
  --sonar-shadow:0 2px 6px rgba(0,0,0,.10);
  --sonar-success:#26a69a;
  --sonar-warning:#ffb74d;
  --sonar-danger:#e57373;
  --sonar-footer:#005662;
  --radius:10px;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--sonar-bg);
  color: var(--sonar-text);
  margin:0;
  padding:0;
  line-height:1.5;
}

/* Layout helpers */
.container{max-width:1100px;margin:24px auto;padding:0 16px}
.site-main{max-width:960px;margin:20px auto;padding:0 15px}

/* Header / Footer */
.site-header,
.site-footer{
  background: var(--sonar-primary);
  color:#fff;
  padding:16px 20px;
  text-align:center;
  font-weight:600;
  box-shadow: var(--sonar-shadow);
}
.site-header{
  text-transform:uppercase;
  letter-spacing:.5px;
}
.site-footer{
  background: var(--sonar-footer);
  margin-top:40px;
  font-size:.95rem;
}
.site-header a,
.site-footer a{
  color:#fff;
  text-decoration:none;
}

/* Cards */
.card{
  background: var(--sonar-card);
  border-radius: var(--radius);
  box-shadow: var(--sonar-shadow);
  padding:20px;
}

/* Typography */
h1,h2,h3,h4{color:#294147;margin:0 0 .6em}
p{margin:.5em 0}

/* Buttons (compatível com .btn e .sonar-btn) */
.btn, a.btn,
.sonar-btn, a.sonar-btn{
  display:inline-block;
  background: var(--sonar-primary);
  color:#fff;
  padding:10px 16px;
  border-radius:8px;
  border:0;
  text-decoration:none;
  text-align:center;
  cursor:pointer;
  transition:.15s ease-in-out;
}
.btn:hover, a.btn:hover,
.sonar-btn:hover, a.sonar-btn:hover{
  background: var(--sonar-primary-600);
  color:#fff;
}
.btn:focus,.sonar-btn:focus{outline:2px solid rgba(0,0,0,.12);outline-offset:2px}

/* Variantes */
.btn.btn-secondary, .sonar-btn.sonar-btn-secondary{
  background: var(--sonar-secondary);
}
.btn.btn-secondary:hover, .sonar-btn.sonar-btn-secondary:hover{
  background: var(--sonar-secondary-600);
}
.btn.btn-danger{background: var(--sonar-danger)}
.btn.btn-danger:hover{background:#d65f5f}
.btn.btn-outline-primary{
  background:transparent;
  color:var(--sonar-primary);
  border:1px solid var(--sonar-primary);
}
.btn.btn-outline-primary:hover{
  background:var(--sonar-primary);
  color:#fff;
}
.btn.btn-outline-secondary{
  background:transparent;
  color:var(--sonar-secondary);
  border:1px solid var(--sonar-secondary);
}
.btn.btn-outline-secondary:hover{
  background:var(--sonar-secondary);
  color:#fff;
}

/* Badges */
.sonar-badge{
  display:inline-block;
  background: var(--sonar-secondary);
  color:#fff;
  font-size:.75rem;
  padding:2px 8px;
  border-radius:999px;
  margin-left:8px;
  vertical-align:middle;
}

/* Alerts (compatível com .flash e .alert) */
.flash, .alert,
.sonar-alert{padding:12px 14px;border-radius:8px;margin:10px 0}
.flash-success, .alert-success, .sonar-alert-success{
  background: var(--sonar-success);
  color:#fff;
}
.flash-error, .alert-danger, .sonar-alert-danger{
  background: var(--sonar-danger);
  color:#fff;
}
.alert-warning, .sonar-alert-warning{
  background: var(--sonar-warning);
  color:#4a3a16;
}
.alert-info, .sonar-alert-info{
  background:#d9f3f6;
  color:#27535a;
}

/* Forms */
label{display:block;margin:0 0 .35rem}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="file"],
select, textarea{
  width:100%;
  background: var(--sonar-light);
  color: var(--sonar-text);
  border:1px solid #cfe3e6;
  border-radius:8px;
  padding:10px 12px;
  outline:none;
  transition:.15s;
}
input:focus, select:focus, textarea:focus{
  border-color: var(--sonar-secondary);
  box-shadow:0 0 0 3px rgba(79,157,166,.15);
}
.sonar-field{margin-bottom:12px}
.sonar-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Tables (Bootstrap-like) */
.table{width:100%;border-collapse:separate;border-spacing:0;border-radius:10px;overflow:hidden;background:var(--sonar-card);box-shadow:var(--sonar-shadow)}
.table th,.table td{padding:10px 12px;border-bottom:1px solid #e9f0f2;vertical-align:middle}
.table thead th{background:#eef7f9;color:#32545a;font-weight:700}
.table tbody tr:hover{background:#f5fbfc}
.table .text-end{text-align:right}
.table .text-center{text-align:center}
.table .text-nowrap{white-space:nowrap}

/* Utilities */
.mb-0{margin-bottom:0}
.mb-1{margin-bottom:.25rem}
.mb-2{margin-bottom:.5rem}
mb-3{margin-bottom:1rem}
.mb-4{margin-bottom:1.5rem}
.my-4{margin:1.5rem 0}
.me-2{margin-right:.5rem}
.d-flex{display:flex}
.justify-content-between{justify-content:space-between}
.align-items-center{align-items:center}
.gap-2{gap:.5rem}
.gap-3{gap:1rem}

/* Links gerais */
a{color:var(--sonar-primary)}
a:hover{color:var(--sonar-secondary)}

/* Sombras/estados */
.box{box-shadow:var(--sonar-shadow);background:var(--sonar-card);border-radius:var(--radius);padding:16px}

/* Responsividade básica */
@media (max-width: 600px){
  .site-header, .site-footer{padding:14px}
  .btn, .sonar-btn{padding:9px 14px}
  .table th,.table td{padding:9px}
}

/* Logo Sonar Med na página inicial */
.logo-container {
  margin-top: 40px;
  text-align: center;
  position: relative;
}

/* Deslocamento suave da logo para a esquerda */
.sonar-logo {
  width: 600px;
  /* max-width: 90%; */
  opacity: 0.95;
  transition: transform 0.3s ease, opacity 0.3s ease, margin-left 0.3s ease;
  margin-left: -40px; /* ajuste o valor conforme desejar (ex: -20px, -60px) */
}

.sonar-logo:hover {
  transform: scale(1.03);
  opacity: 1;
}

/* === Logo no rodapé === */
/* === Rodapé com logo e texto responsivos === */
.site-footer {
  background-color: var(--sonar-footer);
  color: #fff;
  padding: 15px 0;
  text-align: left;
  display: flex;
  justify-content: center;
}

.footer-content {
  display: flex;
  align-items: center;
  gap: 24px;
  max-width: 1100px;
  width: 100%;
  padding-left: 20px;
}

.footer-logo-text {
  display: flex;
  align-items: center;
  gap: 16px;
}

.footer-logo-img {
  width: 140px;
  max-width: 100%;
  opacity: 0.9;
  transition: opacity 0.3s ease;
}

.footer-logo-img:hover {
  opacity: 1;
}

.footer-logo-text p {
  margin: 100;
  font-size: 0.95rem;
  font-weight: 500;
  color: #ffffff;
}

/* === Responsividade do rodapé === */
@media (max-width: 768px) {
  .site-footer {
    text-align: center;
    padding: 20px 0;
  }

  .footer-content {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding-left: 0;
  }

  .footer-logo-text {
    flex-direction: column;
    gap: 8px;
  }

  .footer-logo-img {
    width: 120px; /* ligeiramente menor no celular */
  }

  .footer-logo-text p {
    font-size: 0.9rem;
  }
}

/* Centralização suave da área principal */
.container {
  max-width: 1100px;   /* limita largura */
  margin: 0 auto;      /* centraliza horizontalmente */
  padding: 0 20px;     /* evita que encoste nas bordas */
}