:root {
  /* India Tricolor Inspired Base Colors */
  --saffron: #ff9933; /* Reference only, not used as solid UI bg */
  --white: #ffffff;
  --green: #138808;
  --navy-blue: #000080;

  /* UI Theme */
  --theme-gradient: linear-gradient(
    135deg,
    #ffb347,
    #ff7e5f
  ); /* Main gradient */
  --theme-light: #fff7f3; /* Soft warm background */
  --theme-bg: #fff4ec; /* Slightly deeper warm bg */
  --theme-border: rgba(255, 179, 71, 0.25); /* Light warm border */
}

/* General layout */
.row > * {
  padding-left: 0;
  padding-right: 0;
}

.d-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Hall title */
.hall-name {
  font-size: 35px;
  margin-top: 20px;
  margin-bottom: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  font-family: "Roboto Mono";
  color: var(--navy-blue); /* No solid orange, use navy */
}

/* Sessions wrapper */
.sessions {
  margin: 30px 5px;
}

/* Session card */
.session {
  margin-top: 20px;
  background-color: #fff;
  box-shadow: 0px 0px 2.7px rgba(0, 0, 0, 0.022),
    0px 0px 6.9px rgba(0, 0, 0, 0.031), 0px 0px 14.2px rgba(0, 0, 0, 0.039),
    0px 0px 29.2px rgba(0, 0, 0, 0.048), 0px 0px 80px rgba(0, 0, 0, 0.07);
}

/* Session header bar */
.session-name {
  background: linear-gradient(135deg, #ff8c42 0%, #2e5990 100%);
  color: #fff;
  padding: 5px;
  font-size: 20px;
  font-family: "Cutive Mono";
  font-weight: 500;
}

/* Faculty section */
.faculty {
  margin-top: 14px;
}

.fac-name {
  margin-top: 3px;
  margin-bottom: 0px;
  padding-bottom: 0px;
  font-family: "Roboto Mono";
  color: var(--navy-blue);
}

.fac-city {
  margin-top: 0;
  padding-top: 0;
  font-size: 12px;
  font-family: "Roboto Mono";
}

/* Faculty image */
.fac-img {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.fac-img img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--navy-blue); /* Green ring to match tricolor */
}

/* Managing / meta section */
.managing {
  background-color: var(--theme-light);
  padding: 10px;
}

/* Topics layout */
.topics {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

.topics .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 7px;
}

/* Role text */
.managing-role {
  font-weight: 600;
  margin-top: 10px;
  color: var(--navy-blue);
}

/* Custom borders */
.custom-border {
  border: 1px solid var(--theme-border) !important;
}

.custom-border-top {
  border-top: 1px solid var(--theme-border) !important;
}

.custom-border-bottom {
  border-bottom: 1px solid var(--theme-border) !important;
}

.custom-border-start {
  border-left: 1px solid var(--theme-border) !important;
}

.custom-border-end {
  border-right: 1px solid var(--theme-border) !important;
}

/* Mobile border tweak */
@media only screen and (max-width: 768px) {
  .custom-border {
    border-bottom: none !important;
  }
}

/* Talk title */
.talk-title {
  color: var(--navy-blue);
  font-weight: 500;
}

/* Light background helper */
.light-bg {
  background-color: var(--theme-light);
}

/* Width utility */
.w-95 {
  width: 95%;
}

/* Hall visibility switcher */
.hall {
  display: none;
}

.hall.active {
  display: block;
}

/* Buttons row */
.btns {
  overflow-x: auto;
}

/* Hall buttons */
.hall-btn {
  background: var(--gradient-orange);
  color: var(--white);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-align: center;
  box-shadow: var(--shadow-lg);
  border-radius: var(--radius-xl);
  padding: 16px 20px;
  border: 0;
}

.hall-btn:hover,
.hall-btn:active,
.hall-btn.active {
  background: linear-gradient(135deg, #ff8c42 0%, #2e5990 100%);
  transform: translateX(0.5rem);
  box-shadow: var(--shadow-md);
}

/* Layout and Grid Classes */

/* .row: Establishes a flex container for columns and negates horizontal padding/margins for alignment */
.row {
  --bs-gutter-x: 1.5rem; /* Standard Bootstrap horizontal gutter */
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(
    var(--bs-gutter-y) * -1
  ); /* Counteracts vertical gutter if set */
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}

/* .mx-0: Sets horizontal margins to 0 (mx-auto, mx-1, mx-2, etc. are also common) */
.mx-0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Column Classes (Medium breakpoint and up) */
/* Columns use the horizontal gutter for padding */
[class^="col-"],
[class*=" col-"] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  width: 100%; /* Default to full width for mobile-first */
}

@media (min-width: 768px) {
  /* .col-md-3: Takes up 3/12 = 25% of the row space */
  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  /* .col-md-4: Takes up 4/12 = 33.333333% of the row space */
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.333333%;
  }

  /* .col-md-6: Takes up 6/12 = 50% of the row space */
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  /* .col-md-9: Takes up 9/12 = 75% of the row space */
  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  /* .col-md-12: Takes up 12/12 = 100% of the row space */
  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

/* Utility Classes (Display and Text Alignment) */

/* .text-center: Centers text horizontally */
.text-center {
  text-align: center !important;
}

/* .d-flex: Sets display to flex */
.d-flex {
  display: flex !important;
}

/* .align-items-center: Vertically centers content within a flex container */
.align-items-center {
  align-items: center !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-around {
  justify-content: space-around !important;
}
