/* Custom overrides and simple theme */
:root{
	--brand:#0d6efd;
	--muted:#6c757d;
	--lila:#7a5ad6;
	--font-primary: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.text-lila {
	color: var(--lila) !important;
}

.modal-footer-sticky {
	position: sticky;
	bottom: 0;
	background: #ffffff;
	z-index: 10;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.profile-label {
	color: #000000;
	font-weight: 600;
}

.profile-label i {
	color: #000000 !important;
}

.profile-section-title {
	font-size: 1.35rem;
	font-weight: 700;
}
.profile-section-title-sm {
    font-size: 1rem;
    font-weight: 600;
}

/* Compact section title used in Citas card */
.section-card-title {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-weight: 700;
	font-size: 1rem;
}
.section-card-subtitle {
	font-size: 0.85rem;
	color: var(--muted);
	margin-top: 0.25rem;
}

/* Small title for historial card */
.hist-title {
	display:flex;
	align-items:center;
	gap:0.6rem;
	color: var(--lila);
	font-weight:700;
}
.hist-title .icon-circle { display:inline-flex; width:32px;height:32px;border-radius:50%;align-items:center;justify-content:center;background:#f6f1ff;border:1px solid rgba(122,90,214,0.08); }
.hist-title .bi { color:var(--lila); font-size:1.05rem; }

/* Heading above history section for privileged users */
.hist-top-heading { font-size:1rem; }
.hist-top-heading .text-lila { color: var(--lila); }

/* Enhanced title hero above tables */
.title-hero {
	background: linear-gradient(90deg, rgba(122,90,214,0.06), rgba(255,255,255,0.02));
	padding: 0.6rem 0.9rem;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	border: 1px solid rgba(122,90,214,0.06);
}
.title-hero .title-main {
	display:flex;align-items:center;gap:0.6rem;font-weight:700;color:var(--lila);font-size:1.05rem;
}
.title-hero .title-sub { color:var(--muted); font-size:0.9rem; }

/* Table visual enhancements */
.table-custom {
	background: #ffffff;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,0.06);
}
.table-custom thead { background: linear-gradient(90deg,#fbf9ff,#ffffff); }
.table-custom thead th { border-bottom: none; font-weight:600; color:#313145; }
.table-custom tbody tr:hover { background: rgba(122,90,214,0.03); }
.table-custom td, .table-custom th { vertical-align: middle; padding: 0.40rem 0.50rem; }

/* Restored part of the spacing (about half of previous reduction) so content is readable */
.table-custom thead th { font-size: 0.95rem; padding: 0.35rem 0.45rem; }
.table-custom tbody td { font-size: 0.86rem; padding: 0.40rem 0.50rem; line-height: 1.2; }
.table-custom .small { font-size: 0.80rem; }

/* Compact variant for tighter layouts */
.table-custom.table-sm td, .table-sm td { padding: 0.28rem 0.42rem; font-size: 0.82rem; }

/* Make badges match the table text size */
.table-custom .badge { font-size: 0.86rem; padding: 0.22rem 0.45rem; }

@media (max-width:767.98px) {
	.title-hero { padding: 0.5rem; }
	.title-hero .title-main { font-size: 0.98rem; }
}

.profile-section-title i {
	font-size: 1.2em;
}
body {
	margin:0;
	padding:0;
	font-family: var(--font-primary);
	background:#f8f9fa;
	font-weight: 400;
	line-height: 1.6;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
main { flex: 1 0 auto; }

/* Banner Navbar - Integrated in featured banner */
.banner-navbar {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	padding: 1rem 0;
}

.banner-nav-content {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 3rem;
	height: 100%;
	position: relative;
}

.banner-brand {
	display: flex;
	align-items: center;
	transition: transform 0.3s ease;
	z-index: 101;
	position: absolute;
	left: 2rem;
}

.banner-brand:hover {
	transform: scale(1.05);
}

.banner-logo {
	height: 60px;
	width: auto;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

.banner-nav-menu {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
	justify-content: center;
}

.banner-nav-menu li a {
	color: rgba(255, 255, 255, 0.95) !important;
	font-weight: 500;
	font-size: 0.95rem;
	transition: all 0.3s ease;
	padding: 0.75rem 1rem;
	border-radius: 6px;
	text-decoration: none;
	display: flex;
	align-items: center;
}

.banner-nav-menu li a:hover {
	background-color: rgba(255, 255, 255, 0.15);
	transform: translateY(-2px);
}

.banner-nav-menu li a.banner-cta-btn {
	background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
	color: #ffffff !important;
	padding: 0.6rem 1.5rem;
	border-radius: 25px;
	font-weight: 600;
	box-shadow: 0 4px 12px rgba(13, 110, 253, 0.4);
	margin-left: 0.5rem;
}

.banner-nav-menu li a.banner-cta-btn:hover {
	background: linear-gradient(135deg, #0b5ed7 0%, #0a58ca 100%);
	box-shadow: 0 6px 16px rgba(13, 110, 253, 0.5);
	transform: translateY(-3px);
}

.banner-toggler {
	display: none;
	background: none;
	border: none;
	color: rgba(255, 255, 255, 0.95);
	padding: 0;
	cursor: pointer;
	z-index: 101;
}

.banner-toggler-icon {
	width: 24px;
	height: 24px;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
	background-size: contain;
	display: block;
}

.banner-nav-collapse {
	display: flex !important;
	justify-content: center;
	align-items: center;
	flex: 1;
}

@media (max-width: 991.98px) {
	.banner-nav-collapse {
		display: none !important;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: rgba(26, 26, 46, 0.95);
		flex-direction: column;
		padding: 1.5rem;
		gap: 0.5rem;
		width: 100%;
	}

	.banner-nav-collapse.show {
		display: flex !important;
	}

	.banner-nav-menu {
		flex-direction: column;
		width: 100%;
		gap: 0.5rem;
	}

	.banner-nav-menu li a {
		width: 100%;
		padding: 0.75rem 1rem;
	}

	.banner-toggler {
		display: block;
	}
}

/* Navbar styling - Modern & Integrated */
.navbar-custom {
	display: none;
}

.navbar-custom .navbar-brand {
	display: flex;
	align-items: center;
	transition: transform 0.3s ease;
}

.navbar-custom .navbar-brand:hover {
	transform: scale(1.05);
}

.logo-img-navbar {
	height: 45px;
	width: auto;
	filter: brightness(1);
}

.navbar-custom .navbar-nav .nav-link {
	color: rgba(33, 37, 41, 0.85) !important;
	font-weight: 500;
	font-size: 0.95rem;
	transition: all 0.3s ease;
	position: relative;
	padding: 0.75rem 1rem !important;
	border-radius: 6px;
}

.navbar-custom .navbar-nav .nav-link:hover {
	color: #0d6efd !important;
	background-color: transparent;
	transform: translateY(-2px);
}

.navbar-custom .navbar-nav .nav-link.nav-cta {
	background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
	color: #ffffff !important;
	padding: 0.6rem 1.5rem !important;
	border-radius: 25px;
	font-weight: 600;
	box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
	transition: all 0.3s ease;
}

.navbar-custom .navbar-nav .nav-link.nav-cta:hover {
	background: linear-gradient(135deg, #0b5ed7 0%, #0a58ca 100%);
	box-shadow: 0 6px 16px rgba(13, 110, 253, 0.4);
	transform: translateY(-3px);
}

.navbar-custom .navbar-toggler {
	border: none;
	padding: 0;
	color: rgba(33, 37, 41, 0.85);
}

.navbar-custom .navbar-toggler:focus {
	box-shadow: none;
	outline: none;
}

.navbar-custom .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23212529' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media (max-width: 991.98px) {
	.navbar-custom .navbar-nav .nav-link {
		padding: 0.6rem 0 !important;
		margin: 0.4rem 0;
	}
	
	.navbar-custom .navbar-nav .nav-link.nav-cta {
		margin-top: 1rem;
		display: inline-block;
	}
}


/* Container principal más ancho */
.container {
	max-width: 85% !important;
}
@media (max-width: 1400px) {
	.container {
		max-width: 90% !important;
	}
}
@media (max-width: 991.98px) {
	.container {
		max-width: 90% !important;
	}
}
@media (max-width: 767.98px) {
	.container {
		max-width: 95% !important;
	}
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-primary);
	font-weight: 700;
}
.lead {
	font-weight: 400;
}
.hero { padding:64px 0; background:linear-gradient(90deg,#eef6ff 0%, #ffffff 100%); border-radius:8px; }
.hero h1 { color:var(--brand); font-weight:700; }
.btn-custom { background:var(--brand); color:#fff; }
footer a { color:rgba(255,255,255,0.9); }

/* Event card banners */
.card-banner { 
	height:220px; 
	object-fit:cover; 
	width:100%; 
	background:#f8f9fa; 
	border: 1.5px solid #dee2e6;
	border-radius: 10px 10px 0 0;
}
.card-banner-lg { height:420px; object-fit:contain; width:100%; max-height:500px; background:#f8f9fa; }
.event-meta { font-size:0.9rem; color:var(--muted); }

/* Make cards look modern */
.card { 
	border:0; 
	border-radius:10px;
	font-family: var(--font-primary);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 30px rgba(15,23,42,0.12) !important;
}

/* Buttons using heavier font with slightly larger icons (global) */
.btn-fw-icons { font-weight: 600 !important; }
.btn-fw-icons .bi { font-size: calc(1em + 2px); vertical-align: -0.08em; }
.shadow-sm { box-shadow: 0 6px 18px rgba(15,23,42,0.08); }
.card-title {
	font-weight: 600;
	font-size: 1.1rem;
}

/* Featured full-width banner adjustments - Estilo SICHITUR */
.featured-banner {
	position: relative;
	margin-top: 0;
	padding-top: 0;
}
.featured-banner .carousel,
.featured-banner .carousel-inner {
	height: 85vh;
}
.featured-banner .carousel-item {
	height: 85vh;
	position: relative;
	overflow: hidden;
}
.featured-banner .carousel-item::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, rgba(59, 89, 152, 0.85) 0%, rgba(91, 106, 184, 0.75) 30%, rgba(123, 126, 200, 0.7) 60%, rgba(155, 142, 216, 0.8) 100%);
	z-index: 1;
	pointer-events: none;
}
.featured-banner .carousel-item img { 
	height: 75vh;
	object-fit: cover;
	width: 100%;
	background: #f8f9fa;
	filter: brightness(0.7);
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
.featured-banner .carousel-caption {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	padding: 0;
}
@media (max-width: 991.98px) {
	.featured-banner .carousel,
	.featured-banner .carousel-inner,
	.featured-banner .carousel-item,
	.featured-banner .carousel-item img { height: 60vh; }
}
@media (max-width: 575.98px) {
	.featured-banner .carousel,
	.featured-banner .carousel-inner,
	.featured-banner .carousel-item,
	.featured-banner .carousel-item img { height: 50vh; }
}
.featured-banner .carousel-caption > div { 
	max-width:900px;
	background: transparent !important;
	padding: 3rem !important;
	margin-bottom: 80px;
	z-index: 2;
	position: relative;
}
.featured-banner .card-title {
	font-size: 3.5rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 2px;
	text-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
	margin-bottom: 1rem;
}
.featured-banner .carousel-caption p {
	font-size: 1.2rem;
	color: rgba(255, 255, 255, 0.95) !important;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.featured-banner .btn {
	pointer-events: auto;
	border-radius: 25px;
	padding: 0.7rem 2rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	z-index: 3;
	position: relative;
}

/* Estilos para controles del carousel */
.featured-banner .carousel-control-prev,
.featured-banner .carousel-control-next {
	z-index: 2;
	width: 5%;
}
.featured-banner .carousel-control-prev-icon,
.featured-banner .carousel-control-next-icon {
	background-size: 2rem;
	width: 3rem;
	height: 3rem;
}

/* Aliados carousel: limit image height and keep aspect */
#aliadosCarousel .aliado-img {
	max-height: 10vh;
	object-fit: contain;
}

/* Footer aliados images removed from footer; keep carousel styles only */

/* Profile page small tweaks */
.profile-label i { color: var(--brand); margin-right: 0.45rem; font-size: 0.95rem; }
.card-body .form-control, .card-body textarea { border-radius: 8px; }
.card .card-header { border-radius: 10px 10px 0 0; }
.profile-sidebar .card-body .rounded-circle { background: linear-gradient(135deg,#eef6ff, #ffffff); }
.btn-primary { background: var(--brand); border: none; color: #fff; }
.table-hover tbody tr:hover { background: #f1f5ff; }
.featured-banner .carousel-indicators {
	z-index: 2;
	margin-bottom: 2rem;
}
.featured-banner .carousel-indicators button {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	border: 2px solid rgba(255, 255, 255, 0.8);
}
.featured-banner .carousel-indicators button.active {
	background-color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 767.98px) {
	.featured-banner .card-title {
		font-size: 2rem;
	}
	.featured-banner .card-img-overlay p {
		font-size: 1rem;
	}
}

/* Efecto de olas en la parte inferior del banner */
.wave-container {
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	z-index: 1;
}
.waves {
	position: relative;
	width: 100%;
	height: 12vh;
	min-height: 80px;
	max-height: 120px;
}
.parallax > use {
	animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}
.parallax > use:nth-child(1) {
	animation-delay: -3s;
	animation-duration: 10s;
}
.parallax > use:nth-child(2) {
	animation-delay: -5s;
	animation-duration: 20s;
}
@keyframes move-forever {
	0% {
		transform: translate3d(-90px, 0, 0);
	}
	100% {
		transform: translate3d(85px, 0, 0);
	}
}
@media (max-width: 767.98px) {
	html, body {
		height: 100%;
		min-height: 100vh;
		margin: 0;
		padding: 0;
	}
	body {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		width: 100%;
		box-sizing: border-box;
	}
	footer {
		margin-top: auto !important;
	}
}

/* Hero enhancements */
.hero { 
	background: linear-gradient(135deg, #ffffff 0%, #f1f7ff 100%); 
	padding:50px; 
	border-radius:20px; 
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}
.hero-title { 
	color: var(--brand); 
	font-weight:700; 
	font-size:2.2rem; 
	margin-bottom: 1rem;
	line-height: 1.3;
}
.hero .lead { 
	max-width:820px; 
	font-weight: 500;
}
.hero-icon { 
	width:120px; 
	height:120px; 
	font-size:3rem;
	background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%);
	border: 3px solid #e9ecef;
}
.hero-icon i { font-size:3rem; }
.hero .card { max-width:720px; }

@media (max-width: 767.98px) {
	.hero { padding:24px; }
	.hero-title { font-size:1.5rem; }
	.hero-icon { width:84px; height:84px; font-size:1.6rem; }
}

/* Navbar logo and menu styling - Estilo SICHITUR */
.logo-img { width:48px; height:auto; object-fit:contain; border: none; border-radius:0; }
.navbar { 
	padding-top:1rem; 
	padding-bottom:1rem;
	background: linear-gradient(135deg, #3b5998 0%, #5b6ab8 30%, #7b7ec8 60%, #9b8ed8 100%) !important;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}
.navbar .nav-link { 
	color: rgba(255, 255, 255, 0.95); 
	transition: all .15s ease;
	font-weight: 500;
}
.navbar .nav-link i { font-size:1rem; vertical-align:middle; }
.navbar .nav-link:hover { 
	color: #fff;
	transform: translateY(-2px);
}
.navbar-brand { gap:0.75rem; }
.navbar-brand span {
	color: #fff;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Enhanced nav button styles */
.navbar-nav { align-items:center; }
.navbar-nav .nav-item + .nav-item { margin-left: 0.5rem; }
.navbar .nav-link {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .5rem .9rem;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 8px;
	font-weight: 500;
	transition: all .2s ease;
	background: transparent;
}
.navbar .nav-link:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.15);
	border-color: rgba(255, 255, 255, 0.3);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	transform: translateY(-2px);
}
.navbar .nav-link:focus, .navbar .nav-link.active {
	background: rgba(255, 255, 255, 0.25);
	color: #fff;
	border-color: rgba(255, 255, 255, 0.4);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

@media (max-width: 575.98px) {
	.logo-img { width:40px; height:auto; }
}

/* Button styling: modern, rounded, subtle gradient and shadow */
.btn-primary {
	background: var(--brand);
	border: none;
	color: #fff;
	padding: 0.55rem 1rem;
	border-radius: 10px;
	box-shadow: 0 8px 20px rgba(13,110,253,0.12);
	transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}
.btn-primary:hover, .btn-primary:focus {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(13,110,253,0.18);
	opacity: 0.98;
}

/* Hover effect for gallery images */
.hover-zoom:hover {
	transform: scale(1.05);
	box-shadow: 0 8px 20px rgba(0,0,0,0.15) !important;
}
.btn-outline-primary {
	border-radius: 10px;
	padding: 0.48rem 0.95rem;
	border-width: 1.5px;
}
.btn-secondary {
	background: #6c757d;
	color: #fff;
	border-radius: 10px;
}
.btn-secondary:hover { opacity:0.95; transform: translateY(-2px); }

/* Make small action links look like buttons on cards */
.card .btn { border-radius:8px; }

/* Ensure icons inside circular/square action buttons are perfectly centered */
.btn.rounded-circle, .btn.rounded-0 {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	line-height: 1 !important;
}
.btn.rounded-circle i, .btn.rounded-circle .bi, .btn .bi {
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
}

/* Chihuahua Market Section */
.chihuahua-market .card {
	border-radius: 20px;
	background: #fff;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.chihuahua-market .card:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15) !important;
}
.chihuahua-market-logo {
	object-fit: contain;
	max-height: 250px;
	display: block;
	margin: 0 auto;
}
.chihuahua-market .card-body {
	background: #fff;
}
.chihuahua-market .card-title {
	color: var(--brand);
	font-weight: 700;
	font-size: 1.8rem;
}
@media (max-width: 767.98px) {
	.chihuahua-market .card-body {
		padding: 2rem !important;
	}
	.chihuahua-market .card-title {
		font-size: 1.4rem;
	}
}

/* Event Card Styles */
.event-card {
	border-radius: 12px;
	overflow: hidden;
	transition: all 0.3s ease;
	position: relative;
}

.event-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15) !important;
}

.event-card-header {
	position: relative;
	overflow: hidden;
}

.event-card-header .card-banner {
	transition: transform 0.4s ease;
	border-radius: 0;
}

.event-card:hover .card-banner {
	transform: scale(1.05);
}

.event-badge-container {
	position: absolute;
	bottom: 12px;
	left: 12px;
	z-index: 10;
	display: none;
}

.event-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.8rem;
	border-radius: 20px;
	font-size: 0.8rem;
	font-weight: 600;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	white-space: nowrap;
	flex-shrink: 0;
}

.event-state-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.8rem;
	border-radius: 20px;
	font-size: 0.8rem;
	font-weight: 600;
	background: linear-gradient(135deg, #ffc107 0%, #ffb300 100%);
	color: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	white-space: nowrap;
	flex-shrink: 0;
}

.event-description {
	padding: 1rem;
	background-color: #f8f9fa;
	border-radius: 8px;
	border-left: 4px solid var(--brand);
}

.event-meta-info {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #f0f0f0;
}

.event-meta-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	padding-bottom: 0;
	border-bottom: none;
}

.event-meta-column {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.event-meta-row {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	font-size: 0.85rem;
}

.event-meta-row-group {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.event-meta-row i {
	flex-shrink: 0;
	margin-top: 2px;
}

.event-card .card-title {
	font-weight: 700;
	font-size: 1.15rem;
	line-height: 1.3;
	color: #1a1a2e;
}

.event-card .card-body {
	padding: 1.5rem;
}

.event-card .btn {
	font-size: 0.85rem;
	font-weight: 600;
	transition: all 0.3s ease;
	border-radius: 6px;
}

/* Modal lila theme */
.modal-content.custom-modal {
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 12px 40px rgba(122,90,214,0.12);
	border: none;
}
.modal-header-lila {
	background: linear-gradient(90deg, rgba(122,90,214,0.06), rgba(122,90,214,0.02));
	border-bottom: 1px solid rgba(122,90,214,0.08);
}
.modal-header-lila .modal-title {
	color: var(--lila);
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.modal-header-lila .modal-title .icon-circle {
	display: inline-flex;
	width:36px;height:36px;border-radius:50%;
	align-items:center;justify-content:center;
	background: linear-gradient(135deg, #f6f1ff 0%, #fff 100%);
	border: 1px solid rgba(122,90,214,0.08);
}
.modal-header-lila .modal-title .bi {
	font-size:1.15rem;color:var(--lila);
}
.modal-header-lila .btn-close { margin-left: auto; }
.modal-footer { border-top: 1px solid rgba(0,0,0,0.04); }

.login-modal-left {
  background: #ffffff;
  padding: 15px;
}
.login-modal-right {
  min-height: 560px;
  position: relative;
  padding: 15px;
}
.login-modal-right-bg {
  width: 100%;
  height: 100%;
  background-image: url('../img/modal/modal_registro.png');
  background-size: cover;
  background-position: center;
  border-radius: 0 20px 20px 0;
  position: relative;
  padding: 20px;
  box-sizing: border-box;
}
.login-modal-right-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(17,153,142,0.18) 0%, rgba(56,239,125,0.12) 100%);
  border-radius: 0 20px 20px 0;
}
.login-brand-logo {
  max-width: 140px;
}
.login-brand-label {
  color: var(--brand);
  letter-spacing: 0.2em;
  font-size: 0.85rem;
}
.login-brand-number {
  font-size: 3rem;
  color: var(--brand);
  line-height: 1;
}
.login-modal-left h2 {
  font-size: 2rem;
  color: #000;
}
.login-brand-welcome {
  color: #000;
}
.login-brand-gradient {
  background: linear-gradient(90deg, #142a6b 0%, #6a2caa 55%, #e91e8c 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.login-brand-accent {
  color: var(--brand);
}
.login-brand-subtitle {
  color: #6a2caa;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
}
.login-modal-left p {
  font-size: 1rem;
  color: #6c757d;
}
.login-input-group .input-group-text {
  background: #f4f8ff;
  border: 1px solid #e7effa;
  color: #4f5d78;
  min-width: 50px;
  justify-content: center;
}
.login-input-group .form-control {
  border: 1px solid #e7effa;
  border-left: 0;
  min-height: 50px;
  font-size: 0.95rem;
}
.login-modal-left .form-label {
  font-size: 0.95rem;
  color: #33415b;
}
.login-forgot-link {
  font-size: 0.9rem;
}
.btn-login-submit {
  width: 100%;
  padding: 0.95rem 1.1rem;
  background: var(--brand);
  border: none;
  font-size: 0.95rem;
}
@media (max-width: 991px) {
  .login-modal-right {
    min-height: 260px;
  }
}

/* Auth modals (login/registro/olvidé contraseña) en celulares y tablets:
   el padding combinado del contenedor + el interior dejaba muy poco
   espacio útil, y el botón de cerrar podía quedar fuera de vista si el
   contenido era más alto que la pantalla. */
@media (max-width: 767.98px) {
  #loginModal .login-modal-left {
    padding: 10px !important;
  }
  #loginModal .login-modal-left .p-5 {
    padding: 1.15rem !important;
  }
  #loginModal .login-modal-left h2 {
    font-size: 1.5rem;
  }
  #loginModal .login-brand-logo {
    max-width: 100px;
  }
  #registerModal .modal-body.p-4 {
    padding: 1.1rem !important;
  }
  #forgotPasswordModal .modal-body.p-4 {
    padding: 1.25rem !important;
  }
}

@media (max-width: 575.98px) {
  /* El botón de cerrar se fija a la pantalla (no al contenido) para que
     siempre esté visible y sea fácil de tocar, aunque el modal sea más
     alto que la pantalla y haya que hacer scroll para ver todo. */
  #loginModal .btn-close,
  #registerModal .btn-close,
  #forgotPasswordModal .btn-close {
    position: fixed;
    top: max(10px, env(safe-area-inset-top));
    right: max(10px, env(safe-area-inset-right));
    margin: 0 !important;
    width: 2.2rem;
    height: 2.2rem;
    padding: 0;
    background-position: center;
    border-radius: 50%;
    opacity: 1;
    z-index: 1075 !important;
  }
  #loginModal .btn-close,
  #forgotPasswordModal .btn-close {
    background-color: rgba(255,255,255,0.92);
    box-shadow: 0 2px 10px rgba(0,0,0,0.18);
  }
  #registerModal .btn-close {
    background-color: rgba(0,0,0,0.35);
  }
}

.event-card .btn-outline-primary {
	border-color: #0d6efd;
}

.event-card .btn-outline-primary:hover {
	background-color: #0d6efd;
	border-color: #0d6efd;
	transform: translateY(-2px);
}

.event-card .btn-primary {
	background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
	border: none;
}

.event-card .btn-primary:hover {
	background: linear-gradient(135deg, #0b5ed7 0%, #0a58ca 100%);
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}

.event-card .btn-secondary {
	background-color: #6c757d;
	border: none;
}

.event-card .btn-secondary:hover {
	background-color: #5c636a;
	transform: translateY(-2px);
}

/* Reduce perceived pixelation: show logo smaller than source if low-res */
/* legacy helper removed */

/* Global badge enhancements: larger, bolder and more prominent */
.badge {
	font-size: 0.95rem;
	padding: 0.45rem 0.8rem;
	font-weight: 700;
	border-radius: 0.75rem;
	box-shadow: 0 6px 18px rgba(15,23,42,0.08);
	text-transform: none;
}

/* Slightly larger variants for event/state badges */
.event-badge, .event-state-badge {
	font-size: 0.95rem;
	padding: 0.45rem 0.9rem;
	border-radius: 0.85rem;
}

/* Make badge icons align nicely when used with text */
.badge i, .event-badge i { margin-right: 0.4rem; vertical-align: middle; }