/* theme.css - Professional Dark/Light Mode for MBA Website */

:root {
  /* Light Theme - Professional Blue & Gold */
  --primary-color: #1e3a8a;
  --secondary-color: #3b82f6;
  --accent-color: #d97706;
  --background-color: #f8fafc;
  --surface-color: #ffffff;
  --text-primary: #1e293b;
  --text-secondary: #64748b;
  --border-color: #e2e8f0;
  --card-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  --hover-shadow: 0 16px 48px rgba(0, 0, 0, 0.15);
  /* --gradient-primary: linear-gradient(135deg, #1e3a8a, #3b82f6); */
  --gradient-accent: linear-gradient(135deg, #d97706, #b45309);
  
  /* Dark Theme */
  --dark-primary: #60a5fa;
  --dark-secondary: #3b82f6;
  --dark-accent: #f59e0b;
  --dark-background: #000000;
  --dark-surface: #000000;
  --dark-text-primary: #f1f5f9;
  --dark-text-secondary: #cbd5e1;
  --dark-border: #334155;
  --dark-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --dark-hover-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
  --dark-gradient-primary: linear-gradient(135deg, #60a5fa, #3b82f6);
  /* --dark-gradient-accent: linear-gradient(135deg, #f59e0b, #d97706); */
}

/* Base Theme Styles */
body {
  background-color: var(--background-color);
  color: var(--text-primary);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body.dark-mode {
  background-color: var(--dark-background);
  color: var(--dark-text-primary);
}

/* Theme Toggle Button */
.theme-toggle {
  position: absolute;
  top: 30px;
  right: 160px;
  /* background: transparent; */
  color: rgb(13, 12, 43);
  border: none;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1000;
  /* box-shadow: 0 4px 20px rgba(30, 58, 138, 0.3); */
  transition: all 0.3s ease;
  font-size: 1.2rem;
}

body.dark-mode .theme-toggle {
  background: var(--dark-gradient-accent);
  box-shadow: 0 4px 20px rgba(245, 158, 11, 0.3);
}

.theme-toggle:hover {
  transform: scale(1.1) rotate(15deg);
  box-shadow: 0 6px 25px rgba(30, 58, 138, 0.4);
}

body.dark-mode .theme-toggle:hover {
  box-shadow: 0 6px 25px rgba(245, 158, 11, 0.4);
}

/* Header & Navigation */
/* #header {
  background: var(--surface-color) !important;
  border-bottom: 1px solid var(--border-color);
} */

body.dark-mode .navbar {
  background:transparent !important;
  color:white;
}
body.dark-mode .navbar-nav .nav-link  {
  color:white;
}
body.dark-mode #login  {
  color:white;
  background-color: rgb(34, 114, 212);
}
body.dark-mode .mega-menu{
  background-color: var(--dark-surface);
}
body.dark-mode .mega-menu a{
  color: white;
}



/* Hero Section */
.hero-content h3 {
  color: white;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

/* College Cards */
.college-card-new {
  background: var(--surface-color);
  border: 1px solid var(--border-color);
  box-shadow: var(--card-shadow);
}

body.dark-mode .college-card-new {
  background: var(--dark-surface);
  border: 1px solid var(--dark-border);
  box-shadow: var(--dark-card-shadow);
}
body.dark-mode .college {
  background: var(--dark-surface);
  /* border: 1px solid var(--dark-border); */
  box-shadow: var(--dark-card-shadow);
}

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

body.dark-mode .college-card-new:hover {
  box-shadow: var(--dark-hover-shadow);
}

.college-name-new {
  color: var(--text-primary);
}

body.dark-mode .college-name-new {
  color: var(--dark-text-primary);
}

.college-location-new {
  color: var(--text-secondary);
}

body.dark-mode .college-location-new {
  color: var(--dark-text-secondary);
}

.college-location-new i {
  color: var(--secondary-color);
}

body.dark-mode .college-location-new i {
  color: var(--dark-secondary);
}

.college-rank {
  background: var(--gradient-primary);
}

body.dark-mode .college-rank {
  background: var(--dark-gradient-primary);
}

.stat-value {
  color: var(--primary-color);
}

body.dark-mode .stat-value {
  color: var(--dark-primary);
}

.stat-label {
  color: var(--text-secondary);
}

body.dark-mode .stat-label {
  color: var(--dark-text-secondary);
}

.college-stats {
  border-top: 1px solid var(--border-color);
}

body.dark-mode .college-stats {
  border-top: 1px solid var(--dark-border);
}

/* Section Titles */
.section-title {
  color: var(--primary-color);
}

body.dark-mode .section-title {
  color: white;
}

/* Trending News */
.trending-news-section {
  background: linear-gradient(360deg, var(--surface-color) 0%, var(--surface-color) 31%, var(--surface-color) 75%, rgba(255, 255, 255, 0.79) 95%, rgba(255, 255, 255, 0.4) 99%);
}

body.dark-mode.navbar {     
  background-color: black !important;
}

body.dark-mode .trending-news-section {
  background: linear-gradient(360deg, var(--dark-surface) 0%, var(--dark-surface) 31%, var(--dark-surface) 75%, rgba(30, 41, 59, 0.79) 95%, rgba(30, 41, 59, 0.4) 99%);
}

.trending-title {
  color: var(--primary-color);
}

body.dark-mode .trending-title {
  color: white;
}

/* Buttons */
.btn-group button {
  background-color: var(--primary-color);
  color: white;
}

body.dark-mode .btn-group button {
  background-color: var(--dark-primary);
}

.btn-group button:hover {
  background-color: var(--secondary-color);
  transform: translateY(-2px);
}

.search-box button {
  background: var(--accent-color);
}

body.dark-mode .search-box button {
  background: var(--dark-accent);
}

.search-box button:hover {
  background: #b45309;
  transform: translateY(-2px);
}
body.dark-mode .container1 {
  background: var(--dark-surface);
}
/* Search Box */
.search-box input {
  background: var(--surface-color);
  color: var(--text-primary);
  border: 2px solid var(--border-color);
}

body.dark-mode .search-box input {
  background: var(--dark-surface);
  color: var(--dark-text-primary);
  border: 2px solid var(--dark-border);
}

.search-box input:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

body.dark-mode .search-box input:focus {
  border-color: var(--dark-primary);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1);
}

/* Scroll Buttons */
.scroll-btn {
  background: var(--gradient-primary);
}

body.dark-mode .scroll-btn {
  background: var(--dark-gradient-primary);
}

.scroll-btn:hover {
  box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4);
  transform: scale(1.1);
}

.scroll-dot {
  background: var(--border-color);
}

.scroll-dot.active {
  background: var(--primary-color);
}

body.dark-mode .scroll-dot {
  background: var(--dark-border);
}

body.dark-mode .scroll-dot.active {
  background: var(--dark-primary);
}

/* City Section */
.city-container {
  background: var(--surface-color);
}

body.dark-mode .city-container {
  background: var(--dark-surface);
}

.overlayer h5 {
  color: var(--text-primary);
  background: rgba(255, 255, 255, 0.9);
}

body.dark-mode .overlayer h5 {
  color: var(--dark-text-primary);
  background: rgba(30, 41, 59, 0.9);
}

/* Courses & Exams Section */
.tab-buttons {
  background: var(--surface-color);
}

body.dark-mode .tab-buttons {
  background: var(--dark-surface);
}

.tab-btn {
  background: var(--surface-color);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

body.dark-mode .tab-btn {
  background: var(--dark-surface);
  color: var(--dark-text-primary);
  border: 1px solid var(--dark-border);
}

.tab-btn.active {
  background: var(--primary-color);
  color: white;
  border-color: var(--primary-color);
}

body.dark-mode .tab-btn.active {
  background: var(--dark-primary);
  border-color: var(--dark-primary);
}

.course-card {
  background: var(--surface-color);
  border: 1px solid var(--border-color);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

body.dark-mode .course-card {
  background: var(--dark-surface);
  border: 1px solid var(--dark-border);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.course-card:hover {
  border-color: var(--primary-color);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  transform: translateY(-4px);
}

body.dark-mode .course-card:hover {
  border-color: var(--dark-primary);
}

.course-card h5 {
  color: var(--text-primary);
}

body.dark-mode .course-card h5 {
  color: var(--dark-text-primary);
}

/* Book Section */
.page-side {
  background: #fefcf5;
  color: #1e293b;
}

body.dark-mode .page-side {
  background: #1e293b;
  color: #f1f5f9;
}

.book-title, .chapter-title {
  color: #8B4513;
}

body.dark-mode .book-title,
body.dark-mode .chapter-title {
  color: #f59e0b;
}

.page-number {
  color: #8B4513;
}

body.dark-mode .page-number {
  color: #f59e0b;
}

.nav-btn {
  background: var(--primary-color);
}

body.dark-mode .nav-btn {
  background: var(--dark-primary);
}

.nav-btn:hover:not(:disabled) {
  background: var(--secondary-color);
}

body.dark-mode .nav-btn:hover:not(:disabled) {
  background: var(--dark-secondary);
}

.auto-btn {
  background: var(--accent-color);
}

body.dark-mode .auto-btn {
  background: var(--dark-accent);
}

/* Scroll to Top Button */
#scrollTopBtn {
  background: var(--gradient-primary);
}

body.dark-mode #scrollTopBtn {
  background: var(--dark-gradient-primary);
}

#scrollTopBtn:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4);
}

/* Chatbot */
#chatbox {
  background: var(--surface-color);
  border: 1px solid var(--border-color);
}

body.dark-mode #chatbox {
  background: var(--dark-surface);
  border: 1px solid var(--dark-border);
}

#chat-header {
  background: var(--gradient-primary);
}

body.dark-mode #chat-header {
  background: var(--dark-gradient-primary);
}

#chat-messages {
  background: var(--background-color);
}

body.dark-mode #chat-messages {
  background: var(--dark-background);
}

#userInput {
  background: var(--surface-color);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

body.dark-mode #userInput {
  background: var(--dark-surface);
  color: var(--dark-text-primary);
  border: 1px solid var(--dark-border);
}

#chat-input button {
  background: var(--primary-color);
}

body.dark-mode #chat-input button {
  background: var(--dark-primary);
}

.bot-message {
  background: var(--surface-color);
  border: 1px solid var(--border-color);
  color: var(--text-primary);
}

body.dark-mode .bot-message {
  background: var(--dark-surface);
  border: 1px solid var(--dark-border);
  color: var(--dark-text-primary);
}

.user-message {
  background: var(--gradient-primary);
  color: white;
}

body.dark-mode .user-message {
  background: var(--dark-gradient-primary);
}

/* Background Sections */
.stick-background::before {
  background-color: rgba(255, 255, 255, 0);
}

body.dark-mode .stick-background::before {
  background-color: rgba(0, 0, 0, 0.7);
}

/* Auto Scroll Indicator */
.auto-scroll-indicator {
  color: var(--primary-color);
}

body.dark-mode .auto-scroll-indicator {
  color: var(--dark-primary);
}

/* Footer */
#footer {
  background: var(--surface-color);
  border-top: 1px solid var(--border-color);
}

body.dark-mode #footer {
  background: var(--dark-surface);
  border-top: 1px solid var(--dark-border);
}

/* Responsive Design */
@media (max-width: 768px) {
  .theme-toggle {
    top: 100px;
    right: 20px;
    width: 45px;
    height: 45px;
  }
}


/* cube */
body.dark-mode .course-intro h2 {
  color:white;
}

body.dark-mode .course-intro p {
  color:white;
}

body.dark-mode .cube-button{
  background-color: #e2e8f0;
  color: rgb(245, 142, 7);
}

body.dark-mode .cube-marker{
  background-color: #e2e8f0;
}
body.dark-mode .cube-marker.active{
  background-color: rgb(245, 142, 7);
}

body.dark-mode .salvia-item-summary{
  color: rgb(255, 255, 255);
}

body.dark-mode .salvia-item-title{
  color: white;
}

body.dark-mode .salvia-item-date{
  color: white;
}
body.dark-mode .salvia-carousel-title{
  color: white;
}
body.dark-mode .salvia-featured-title{
  color: white;
}
body.dark-mode .salvia-featured-description{
  color: rgb(255, 255, 255);
}
 body.dark-mode .salvia-section-description{
    color: rgb(200, 200, 255);
 }
  body.dark-mode .city-slider{
    background-color: #000000;
  }

  body.dark-mode #popular-exam{
        background-color: rgb(0, 0, 0);
      }