/* ========== Layout base ========== */
body {
  padding-top: 0px; /* margine superiore sotto la navbar (logo 100px) */
}





/* Link nelle griglie */
.row a { text-decoration: none; color: #59918c; }
.row a:hover { text-decoration: none; color: #3f7b76; }

/* ===========================
   Navbar
=========================== */
.navbar { transition: background-color 220ms ease, box-shadow 220ms ease; }
.navbar.scrolled { background-color: rgba(20,24,31,.9) !important; box-shadow: 0 8px 24px rgba(0,0,0,.18); }



/* Link nelle griglie (marine) */
.card-marina .card-title a,
.card-marina .spiagge a,
.row .card-marina a {
  color: #59918c;
  text-decoration: none;
}

.card-marina .card-title a:hover,
.card-marina .spiagge a:hover,
.row .card-marina a:hover {
  color: #3f7b76;
  text-decoration: underline; /* "si" = underline */
}


/* Toggle "Alfabetico / Geografico" con colori delle spiagge */
.btn-outline-marine{
  color:#59918c;
  border-color:#59918c;
  background:transparent;
}
.btn-outline-marine:hover,
.btn-outline-marine.active,
.btn-outline-marine:focus{
  color:#fff;
  background:#3f7b76;
  border-color:#3f7b76;
  box-shadow:0 0 0 .2rem rgba(89,145,140,.15);
}

  /* Layout media: thumb 100x100 + contenuti */
  .marina-media{
    display:grid;
    grid-template-columns: 100px 1fr;
    gap:.9rem;
    align-items:start;
  }
  .marina-thumb{
    width:100px; height:100px; object-fit:cover; display:block; border-radius:.5rem;
  }
  .marina-thumb-ph{
    width:100px; height:100px; display:block; border-radius:.5rem;
    background:#e9ecef; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  }

  /* Colori coerenti con i link spiagge */
  .card-marina .card-title a,
  .card-marina .spiagge a{ color:#59918c; text-decoration:none; }
  .card-marina .card-title a:hover,
  .card-marina .spiagge a:hover{ color:#3f7b76; text-decoration:underline; }