/**
 * Style: Weekly Interface Page Style
 * Theme: Premium B-School Aesthetics
 * Colors: Primary (#003399), Secondary (#ff4401), Accent (#fee600)
 */

/* Design Tokens & Variables */
:root {
	--primary-color: #003399;
	--primary-hover: #002570;
	--secondary-color: #ff4401;
	--secondary-hover: #d63900;
	--accent-color: #fee600;
	--accent-hover: #e0ca00;
	--dark-color: #1e293b;
	--dark-muted: #64748b;
	--light-bg: #f8fafc;
	--border-radius: 16px;
	--border-radius-lg: 24px;
	--border-radius-sm: 8px;
	--box-shadow: 0 10px 30px rgba(0, 51, 153, 0.05);
	--box-shadow-hover: 0 20px 40px rgba(0, 51, 153, 0.1);
	--transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Typography & General Helper Classes */
.font-poppins {
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.font-inter {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

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

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

.bg-primary-color {
	background-color: var(--primary-color) !important;
}

.bg-secondary-color {
	background-color: var(--secondary-color) !important;
}

.line-height-1-8 {
	line-height: 1.8 !important;
}

.fs-7 {
	font-size: 0.875rem !important;
}

.fs-7.5 {
	font-size: 0.8125rem !important;
}

.fs-8 {
	font-size: 0.75rem !important;
}

.fs-9 {
	font-size: 0.6875rem !important;
}

.text-white-80 {
	color: rgba(255, 255, 255, 0.8) !important;
}

.text-white-50 {
	color: rgba(255, 255, 255, 0.5) !important;
}

.text-dark-80 {
	color: #334155 !important;
}

.text-dark-50 {
	color: #64748b !important;
}

.bg-primary-subtle {
	background-color: rgba(0, 51, 153, 0.06) !important;
}

.bg-white-10 {
	background-color: rgba(255, 255, 255, 0.1) !important;
}

.tracking-wider {
	letter-spacing: 0.05em !important;
}

.shadow-xs {
	box-shadow: 0 2px 10px rgba(0, 51, 153, 0.02) !important;
}

/* 1. Breadcrumbs */
.weekly-breadcrumb-section {
	background-color: transparent;
}

.weekly-breadcrumb-section .breadcrumb-item a {
	color: var(--dark-muted);
	font-weight: 500;
	transition: var(--transition);
}

.weekly-breadcrumb-section .breadcrumb-item a:hover {
	color: var(--primary-color);
}

.weekly-breadcrumb-section .breadcrumb-item + .breadcrumb-item::before {
	color: #cbd5e1;
	content: "\F285"; /* bootstrap-icons chevron-right */
	font-family: "bootstrap-icons";
	font-size: 0.75rem;
}

/* 2. Page Header */
.weekly-header-section {
	position: relative;
}

.badge-college-cat {
	background-color: rgba(255, 68, 1, 0.08) !important;
	color: var(--secondary-color) !important;
	border: 1px solid rgba(255, 68, 1, 0.15);
	font-family: 'Poppins', sans-serif;
	letter-spacing: 0.02em;
}

.weekly-title {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	color: var(--primary-color);
	line-height: 1.25;
}

/* 3. Event & Speaker Cards */
.weekly-info-cards-section .card {
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	transition: var(--transition);
}

.weekly-info-cards-section .card:hover {
	transform: translateY(-5px);
	box-shadow: var(--box-shadow-hover);
}

.speaker-details-card {
	overflow: hidden;
}

.card-bg-gradient {
	background: linear-gradient(135deg, rgba(255, 68, 1, 0.25) 0%, rgba(0, 51, 153, 0) 100%);
	opacity: 0.75;
	pointer-events: none;
}

.speaker-img-wrapper {
	position: relative;
	transition: var(--transition);
}

.speaker-details-card:hover .speaker-img-wrapper {
	transform: scale(1.05) rotate(2deg);
	border-color: rgba(255, 255, 255, 0.8) !important;
}

/* 4. Featured Image */
.featured-image-wrapper {
	border-radius: var(--border-radius);
	position: relative;
	background-color: var(--light-bg);
}

.hover-zoom-img {
	transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.featured-image-wrapper:hover .hover-zoom-img {
	transform: scale(1.03);
}

/* 5. Main Content Area */
.weekly-article-body {
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
}

.entry-content {
	font-family: 'Inter', sans-serif;
	color: #334155;
	font-size: 1.0625rem;
}

.entry-content p {
	margin-bottom: 1.75rem;
}

.entry-content h2, 
.entry-content h3, 
.entry-content h4 {
	font-family: 'Poppins', sans-serif;
	color: var(--primary-color);
	font-weight: 700;
	margin-top: 2.5rem;
	margin-bottom: 1.25rem;
}

.entry-content h2 { font-size: 1.75rem; }
.entry-content h3 { font-size: 1.45rem; }
.entry-content h4 { font-size: 1.25rem; }

/* 6. Event Gallery Section */
.event-gallery-container {
	animation-duration: 0.8s;
}

.gallery-item-link {
	display: block;
	position: relative;
	border-radius: var(--border-radius);
	overflow: hidden;
	box-shadow: 0 4px 15px rgba(0, 51, 153, 0.03);
	background-color: #000;
}

.gallery-image-wrapper {
	transition: var(--transition);
	position: relative;
	aspect-ratio: 4 / 3;
}

.gallery-image-wrapper img {
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery-item-link:hover .gallery-image-wrapper img {
	transform: scale(1.06);
	opacity: 0.85;
}

.gallery-item-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0, 51, 153, 0.8) 0%, rgba(0, 51, 153, 0) 100%);
	opacity: 0;
	transition: var(--transition);
	display: flex;
	align-items: flex-end;
	padding: 1.25rem;
	color: #fff;
}

.gallery-item-link:hover .gallery-item-overlay {
	opacity: 1;
}

.gallery-item-caption {
	font-family: 'Poppins', sans-serif;
	font-size: 0.85rem;
	font-weight: 500;
	transform: translateY(10px);
	transition: var(--transition);
}

.gallery-item-link:hover .gallery-item-caption {
	transform: translateY(0);
}

/* 7. Sticky Sidebar */
.weekly-sticky-sidebar {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
	z-index: 10;
}

.weekly-sidebar-card {
	border-radius: var(--border-radius) !important;
	box-shadow: var(--box-shadow) !important;
	transition: var(--transition);
}

.weekly-sidebar-card:hover {
	box-shadow: var(--box-shadow-hover) !important;
}

.weekly-sidebar-cats li {
	padding-bottom: 0.5rem;
	border-bottom: 1px solid #f1f5f9;
}

.weekly-sidebar-cats li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.hover-primary:hover span {
	color: var(--primary-color) !important;
	transform: translateX(3px);
}

.hover-primary span {
	transition: var(--transition);
}

.text-truncate-2 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.weekly-sidebar-item-title {
	line-height: 1.35;
	transition: var(--transition);
}

.weekly-sidebar-item-title:hover {
	color: var(--secondary-color) !important;
}

.weekly-sidebar-thumb img {
	transition: var(--transition);
}

.weekly-sidebar-item:hover .weekly-sidebar-thumb img {
	transform: scale(1.1);
}

/* 8. Swiper Carousel Section */
.weekly-carousel-swiper {
	padding-bottom: 3.5rem !important;
}

.weekly-carousel-card {
	transition: var(--transition);
}

.weekly-carousel-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--box-shadow-hover) !important;
}

.weekly-carousel-card .transition-zoom {
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.weekly-carousel-card:hover .transition-zoom {
	transform: scale(1.05);
}

/* Custom Swiper Navigation Buttons placed outside container on desktop */
.weekly-carousel-swiper .swiper-btn {
	position: absolute;
	top: 45%;
	z-index: 15;
	width: 44px;
	height: 44px;
	background-color: #fff;
	color: var(--primary-color);
	cursor: pointer;
	transition: var(--transition);
}

.weekly-carousel-swiper .swiper-btn:hover {
	background-color: var(--primary-color);
	color: #fff;
	border-color: var(--primary-color) !important;
}

.weekly-carousel-swiper .swiper-btn-prev {
	left: -20px;
}

.weekly-carousel-swiper .swiper-btn-next {
	right: -20px;
}

/* 9. CTA Section */
.weekly-cta-section {
	background-color: var(--primary-color) !important;
}

.cta-bg-gradient {
	background: radial-gradient(circle at 80% 20%, rgba(255, 68, 1, 0.3) 0%, rgba(0, 51, 153, 0) 80%);
	pointer-events: none;
}

.weekly-cta-section .btn {
	transition: var(--transition);
}

.weekly-cta-section .btn:hover {
	transform: scale(1.04);
}

.weekly-cta-section .btn-light:hover {
	background-color: var(--accent-color) !important;
	color: var(--primary-color) !important;
	box-shadow: 0 10px 25px rgba(254, 230, 0, 0.25) !important;
}

/* GSAP Pre-animation Hide class to prevent flash of raw content */
.gsap-init-hide {
	opacity: 0;
	visibility: hidden;
}

/* Responsive Overrides */
@media (max-width: 1200px) {
	.weekly-carousel-swiper .swiper-btn-prev {
		left: 0;
	}
	.weekly-carousel-swiper .swiper-btn-next {
		right: 0;
	}
}

@media (max-width: 991.98px) {
	.weekly-sticky-sidebar {
		position: static;
		margin-top: 2rem;
	}
	:root {
		--border-radius: 12px;
	}
	.weekly-title {
		font-size: 2.25rem;
	}
}

@media (max-width: 575.98px) {
	.weekly-title {
		font-size: 1.75rem;
	}
	.weekly-article-body {
		padding: 1.5rem !important;
	}
	.weekly-info-cards-section .card {
		padding: 1.5rem !important;
	}
}