:root {
    --primary: #7c0404;
    --primary-dark: #5a0303;
    --accent: #ffc107;
    --bg-light: #f8f9fc;
    --text-dark: #1f2937;
    --text-muted: #6b7280;
    --radius-lg: 20px;
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.08);
    --shadow-hover: 0 18px 40px rgba(0, 0, 0, 0.12);
}

/* Section Spacing */
.section-spacing {
    /* padding: 100px 0; */
}

/* Modern Card */
.modern-card {
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    transition: all 0.3s ease;
}

.modern-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-hover);
}

/* Clean Section Background Alternate */
.bg-soft {
    background-color: var(--bg-light);
}

/* Modern Button */
.btn-modern {
    border-radius: 50px;
    padding: 12px 28px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-modern-primary {
    background-color: var(--primary);
    color: #fff;
    border: none;
}

.btn-modern-primary:hover {
    background-color: var(--primary-dark);
	color: #ffc107;
}

.btn-modern-accent {
    background-color: var(--accent);
    color: #000;
    border: none;
}

.btn-modern-accent:hover {
    transform: scale(1.05);
	color: #7c0404
}

.btn-modern-success {
    /* background-color: #198754; */
	background-color: transparent;
    color: #28a745;
    /* border: none; */
	border-color: #198754;
}

.btn-modern-success:hover {
    background-color: #28a745;   /* lighter glossy green */
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(32, 201, 151, 0.35);
}


/* Typography Upgrade */
h2.section-title {
    font-weight: 700;
    margin-bottom: 15px;
}

.section-subtitle {
    color: var(--text-muted);
    font-size: 1rem;
}

.hero-modern {
    background: linear-gradient(135deg, #7c0404, #ad0000);
    position: relative;
    padding: 90px 0 40px 0;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-bottom: 30px;
}

.hero-content-box {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255,255,255,0.15);
    padding: 45px;
    border-radius: 24px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

@keyframes fadeInHero {
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.hero-image-modern {
    animation: float 8s ease-in-out infinite;
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-12px); }
    100% { transform: translateY(0px); }
}









/* styles of index.php */

/* Gold text */
		.css_user-text-gold {
			color: #FFD700;	/* Elegant academic gold */
		}


/* Mobile First */
		.hero-subtitle {
			font-size: 1rem;
		}

		.hero-image-modern {
			max-height: 220px;
			margin-top: 20px;
		}

		


/* Desktop (768px and up) */
		@media (min-width: 768px) {

			.hero-subtitle {
				font-size: 1.2rem;
			}

			.hero-image-modern {
				max-height: 350px;
				margin-top: 0;
			}
			
		}































footer {
    background-color: #7c0404;
    color: white; /* Change text color to white */
    margin-top: 50px;
    border-top: 50px solid #EFEFEF;
}

footer h5 {
    color: #f6c500; /* Keep headings in yellow */
}

footer a.text-muted {
    color: white !important; /* Change all links to white */
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

footer small.text-muted {
    color: white !important; /* Change © GNDLS 2025 to white */
}


.inquirer-title {
    font-family: 'Dancing Script', 'Lucida Handwriting'; /* Signature-style font */
    font-size: 2rem; /* Increased size for emphasis */
    font-weight: 800; /* Makes the font thicker */
    text-align: center; /* Centers the text */
    color: #7c0404; /* Maroon for strong impact */
}

.inquirer-subtitle {
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center; /* Centers the text */
    color: #333;
}

.inquirer-subtitle span {
    color: #d9534f; /* Emphasized text in red */
    font-style: italic;
    font-weight: 700; /* Makes it stand out */
}

.inquirer-text {
    font-size: 1.2rem;
    text-align: center; /* Centers the text */
    color: #555;
    font-weight: 500;
}


.btn-primary {
    background: #007bff; /* Primary blue */
    border: none;
    transition: all 0.3s ease-in-out;
}

.btn-primary:hover {
    background: #0056b3; /* Darker blue on hover */
    transform: scale(1.05); /* Slight zoom effect */
}

.btn-primary:active {
    background: #004085; /* Even darker when clicked */
    transform: scale(0.98); /* Slight press effect */
}

.btn-warning:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}


.faq-center {
	padding: 15px 0 15px 20px;
	margin-bottom: 26px;
	/* background-color: #E3E3E3; */
	background-color: #e6f2e6 ;
	border: 0;
	border-radius: 6px;
  	border-bottom: 1px solid #DADFE3;
  }

.faq-center-categories {
	/* padding: 15px 0 15px 20px; */
	margin-bottom: 26px;
	background-color: #C1E1C1;
	border: 0;
	border-radius: 6px;
  	border-bottom: 1px solid #DADFE3;
  }

.faq_alternative-bg-right {
	background-color: #C1E1C1;  /* Different background for col-md-4 */
}

.faq-center-categories a.text-dark:hover {
	color: #B8860B !important; /* EVSU Gold */
	text-decoration: underline; /* Optional: Adds underline on hover */
  }

  
.text-maroon {
	color: #7c0404;
}


.announcement_carousel-inner img {
    width: 100%;           /* Ensure the images span the full width of the carousel */
    height: 500px;         /* Set a consistent height for the carousel */
    object-fit: cover;     /* Ensures the image covers the entire space without distorting */
}

/* body { */
    /* padding-top: 50px; adjust depending on navbar height */
/* } */


.custom-navbar {
    background-color: #900303;
    padding-top: 6px;
    padding-bottom: 6px;
}


/* Menu links */
.menu-item {
    color: #ffffff !important;
    padding: 10px 18px;
    font-weight: 500;
}

/* Hover */
.menu-item:hover {
    background-color: #a00000;
    color: #ffffff !important;
}

.menu-item.active {
    position: relative;
}

.menu-item.active::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 20%;
    width: 60%;
    height: 2px;
    background: var(--accent);
}

/* Active link (Yellow style like your image) */
.active-link {
    background-color: #ffcc00;
    color: #900303 !important;
    font-weight: 600;
}

/* Remove Bootstrap default focus border */
.navbar-toggler {
    border: none;
}

/* Custom hamburger color */
.custom-toggler {
    color: white;
    font-size: 24px;
}

/* Mobile dropdown background */
@media (max-width: 767px) {
    .navbar-collapse {
        background-color: #900303;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .menu-item {
        display: block;
        padding: 12px;
    }
}



/* styles of index.php */

/* Gold text */
		.css_user-text-gold {
			color: #FFD700;	/* Elegant academic gold */
		}


/* Mobile First */
		.hero-subtitle {
			font-size: 1rem;
		}

		.hero-image {
			max-height: 220px;
			margin-top: 20px;
		}

		


/* Desktop (768px and up) */
		@media (min-width: 768px) {

			.hero-subtitle {
				font-size: 1.2rem;
			}

			.hero-image {
				max-height: 350px;
				margin-top: 0;
			}
			
		}



/* ===== Modern Timeline Calendar ===== */

.timeline-month {
    margin-top: 20px;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary);
	padding-left: 50px;
}

.timeline-item {
    position: relative;
    /* border-left: 3px solid var(--primary); */
    padding-left: 100px;
    margin-bottom: 18px;
}

.timeline-item::before {
    content: "";
    position: absolute;
    left: 75px;
    top: 8px;
    width: 10px;
    height: 10px;
    background-color: var(--primary);
    border-radius: 50%;
}

.timeline-date {
    font-weight: 600;
    color: #444;
}

.timeline-activity {
    color: #333;
    margin-top: 4px;
	padding-left: 25px;
}

.timeline-badge {
    display: inline-block;
    margin-top: 6px;
	margin-left: 25px;
    padding: 4px 10px;
    font-size: 0.75rem;
    border-radius: 20px;
    background-color: rgba(124,4,4,0.1);
    color: var(--primary);
}






/* ===== Announcement Hero Section ===== */

	.page-hero {
		background: linear-gradient(135deg, var(--primary), #ad0000);
		padding: 100px 0 60px;   /* extra top padding because navbar is fixed */
		color: white;
		margin-bottom: 30px;
	}

	.page-hero-title {
		font-size: 2.2rem;
		font-weight: 800;
		letter-spacing: 0.6px;
		text-transform: uppercase;
		margin-bottom: 10px;
		text-shadow: 0 4px 20px rgba(255, 255, 255, 0.15);
	}

	/* AI-style subtle glow effect */		

		/* Subtitle refinement */
		.page-hero-subtitle {
			font-size: 1rem;
			font-weight: 400;
			letter-spacing: 0.3px;
			opacity: 0.85;			
			margin-bottom: 35px;
		}

		.page-hero-title::after {
			content: "";
			display: block;
			width: 80px;
			height: 3px;
			margin: 15px auto 25px;
			background: var(--accent);
			border-radius: 50px;
		}


	.announcement-search-box {
		background: rgba(255,255,255,0.08);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		padding: 30px;
		border-radius: 20px;
		box-shadow: 0 10px 40px rgba(0,0,0,0.15);
	}

	.modern-input {
		border-radius: 50px;
		/* padding: 14px 20px; */
		border: none;
		box-shadow: 0 4px 15px rgba(0,0,0,0.08);
		width: 100%;       /* ensure it fills the column */
		box-sizing: border-box; /* include padding inside width */
	}

	
	/* MOBILE FIRST IMPROVEMENTS */
		@media (max-width: 767px) {

			.page-hero {
				padding: 100px 15px 50px;
				text-align: center;
			}

			.page-hero-title {
				font-size: 1.6rem;
			}

			/* .announcement-subtitle {
				font-size: 0.9rem;
				margin-bottom: 25px;
			} */

			.announcement-search-box {
				padding: 20px;
				border-radius: 15px;
			}

			.modern-input {
				font-size: 0.9rem;
				/* padding: 10px 15px; */
			}

			.btn-modern {
				padding: 10px 20px;
				font-size: 0.95rem;
			}
		}








		
	
	/* AI-style subtle glow effect */		

		/* Subtitle refinement */
		.announcement-subtitle {
			font-size: 1rem;
			font-weight: 400;
			letter-spacing: 0.3px;
			opacity: 0.85;			
			margin-bottom: 35px;
		}

		.announcement-title::after {
			content: "";
			display: block;
			width: 80px;
			height: 3px;
			margin: 15px auto 25px;
			background: var(--accent);
			border-radius: 50px;
		}

/* ===== FAQ HERO SECTION ===== */

		.faq-search-box {
			background: rgba(255,255,255,0.08);
			backdrop-filter: blur(10px);
			padding: 30px;
			border-radius: 20px;
			box-shadow: 0 10px 40px rgba(0,0,0,0.15);
		}

		.modern-search {
			border-radius: 50px;
			overflow: hidden;
		}

		.modern-search .form-control {
			border-radius: 50px 0 0 50px;
			border: none;
		}

		.modern-search .input-group-append .btn {
			border-radius: 0 50px 50px 0;
		}


/* Space from fixed navbar */
	.faq-header-spacing {
		padding-top: 100px; /* adjust based on navbar height */
		padding-bottom: 30px;
	}

	.about-faq-btn {
		font-size: 1.1rem;
		padding: 5px 3px;   /* smaller top/bottom */    	
	}
	



/* ===== Modern Query Card ===== */
		.modern-query-card {
			max-width: 850px;
			margin-top: 40px;
			margin-bottom: 60px;
			padding: 30px 40px;
			border-radius: 24px;
			/* background: rgba(255, 255, 255, 0.75); */
			background: #e6f2e6;
			backdrop-filter: blur(18px);
			-webkit-backdrop-filter: blur(18px);
			box-shadow: 0 25px 60px rgba(0,0,0,0.12);
			border: 1px solid rgba(255,255,255,0.4);
			transition: all 0.3s ease;
		}

		.modern-query-card:hover {
			transform: translateY(-6px);
			box-shadow: 0 30px 70px rgba(0,0,0,0.15);
		}

		.modern-curve-input{
			border-radius: 25px !important;
		}




/* .alert {
    border-radius: 14px;
    padding: 16px 20px;
    border: none;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
} */
		

.container{
    max-width: 1300px;
}