/* --- estilos conservados --- */
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif;}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}
body{
	display:flex;
	flex-direction:
	column;
	min-height:100vh;
}
header,footer{
	background:#002a5c;
	color:#fff;
	padding:1rem;
	text-align:
	center;
}

#footer_content {
  flex: 1; /* Esto empuja el footer al final si hay poco contenido */
  padding: 1rem;
}

nav{display:flex;justify-content:space-between;align-items:center;}
nav .logo{font-size:1.5rem;font-weight:bold;}
nav .avatar{position:relative;cursor:pointer;}
nav .avatar img{width:40px;height:40px;border-radius:50%;}
nav .dropdown{position:absolute;right:0;top:50px;background:#fff;color:#000;border:1px solid #ddd;border-radius:4px;display:none;min-width:150px;z-index:1000;}
nav .dropdown a{display:block;padding:.5rem 1rem;text-decoration:none;color:#000;}
nav .dropdown a:hover{background:#f0f0f0;}
#donation{background:#ffeac0;color:#333;padding:1rem;text-align:center;}
#content{flex:1;padding:1rem;}
.section-title{margin:1.5rem 0 .5rem;font-size:1.3rem;font-weight:bold;border-bottom:2px solid #ccc;}

.detail ul{list-style:decimal;margin-left:1rem;font-size:.85rem;}
.filter-area{margin:1rem 0;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;}
select{padding:.3rem;border-radius:4px;border:1px solid #ccc;}
.two-column{display:grid;gap:1rem;}@media(min-width:700px){.two-column{grid-template-columns:1fr 1fr;}}
.three-column {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}
footer nav{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-bottom:.5rem;font-size:.85rem;}
footer nav a{color:#fff;text-decoration:none;}footer nav a:hover{text-decoration:underline;}

#visitas{
	color:#CCC;
	font-size:.6rem;
	line-height:1.45rem;
	text-align:center;
}


/* --- estilos el nav --- */
.auth-links a {
  text-decoration: none;
  color: #333;
  font-weight: bold;
}

.auth-links a:hover {
  text-decoration: underline;
}
.auth-links a {
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  font-size:80%;
  text-align:right;
}


.user-area {
	
	display: flex;
	align-items: center;
	gap: 2rem;
	margin-left: auto;

}
.user-area a{
	
	padding-left: 10px;
	padding-right: 10px;
}



.avatar {
  position: relative;
  cursor: pointer;
}

.dropdown {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background: white;
  border: 1px solid #ccc;
  border-radius: 4px;
  z-index: 100;
  margin-top:-20px;
}

.avatar:hover .dropdown {
  display: block;
}