body {
  font-family: "Raleway", sans-serif !important;
  background-color: white;
}

/* ── Suppress browser-native password reveal button ─────────────────────
   Edge / IE add a built-in eye icon inside <input type="password">.
   Chrome (newer) can also add one via :-webkit-credentials-auto-fill-button.
   Both clash visually with our custom input-group toggle button.         */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear {
  display: none;
}
input[type="password"]::-webkit-credentials-auto-fill-button {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
}

.site-content {
  overflow: hidden;
}

.mukta-font {
  font-family: 'Mukta', sans-serif;
  font-size: 15px !important;
}

/* IMP */
/* Navbar css */
@media (max-width: 991.98px) {
  .offcanvas-body ul {
    margin-top: 1px !important;
  }
}

/* ── Admin sidebar ──────────────────────────────────────────────────────
   Merged from app.blade.php <style> block (removed from there).
   Dark navy background, scroll when nav items overflow.                 */
#adminSidebar {
  width: 250px;
  overflow-y: auto;
  background-color: #1e2130 !important;
  min-width: 220px;
}

/* Bootstrap 5.3 CSS variables: control active pill appearance */
#adminSidebar .nav-pills {
  --bs-nav-pills-link-active-bg: rgba(255, 255, 255, 0.15);
  --bs-nav-pills-link-active-color: #ffffff;
}

/* Hover effect on non-active items */
#adminSidebar .nav-link:not(.active):hover {
  background-color: rgba(255, 255, 255, 0.08);
  color: #ffffff !important;
}

/* Blue left border accent on the active item */
#adminSidebar .nav-link.active {
  border-left: 3px solid #7eb3ff;
  padding-left: calc(var(--bs-nav-link-padding-x) - 3px);
}

/* ── Admin panel utility classes ────────────────────────────────────────
   Replace inline style="..." attributes across admin blade files.
   All classes are prefixed with "admin-" to avoid collision with
   Bootstrap utilities or public-site styles.                            */

/* Card header background used across all admin cards */
.admin-card-header {
  background-color: #f8f9fc;
}

/* Table <thead> background / admin main-content area background */
.admin-thead-bg {
  background-color: #f0f2f7;
}

/* Main content area background (same shade as admin-thead-bg) */
.admin-main-bg {
  background-color: #f0f2f7;
}

/* Font-size utilities for admin list/table text */
.admin-text-sm  { font-size: 0.875rem; }   /* ~14 px — primary list text   */
.admin-text-xs  { font-size: 0.78rem;  }   /* ~12.5 px — secondary text    */
.admin-text-xxs { font-size: 0.75rem;  }   /* ~12 px — tertiary / dates    */

/* Modal body text */
.admin-modal-body { font-size: 0.9rem; }

/* Sidebar monogram badge (32 × 32 square used in both mobile & desktop) */
.admin-sidebar-badge {
  width: 32px;
  height: 32px;
  font-size: 14px;
  letter-spacing: 0;
}

/* User avatar initials circle in the users table */
.admin-user-avatar {
  width: 34px;
  height: 34px;
  font-size: 13px;
}

/* Square icon-only action buttons (edit / delete) */
.admin-icon-btn {
  width: 32px;
  height: 32px;
  padding: 0;
  line-height: 30px;
  text-align: center;
}
.admin-icon-btn i {
  font-size: 0.75rem;
}

/* Table column width constraints */
.admin-col-serial { width: 56px;      }
.admin-col-action { width: 90px;      }
.admin-col-email  { max-width: 220px; }

/* Responsive: event_image and event_time (still used in blade) */
@media screen and (min-width: 576px) and (max-width: 768px) {
  .event_image {
    justify-content: flex-start;
  }
}
@media screen and (max-width: 576px) {
  .event_time {
    font-size: 10px !important;
  }
}

/* for event page */
.highlight {
  background-color: #ddd;
  border: 1px solid black !important;
  color: white;
  text-decoration: none;
}

.date-highlight {
  background-color: rgb(170, 50, 16) !important;
  text-decoration: none;
}

.time {
  cursor: pointer !important;
}

/* seat booking box highlight css — kept for JS compatibility */
.seat_highlight {
  background-color: #198754 !important;
  color: #fff !important;
}


.hr-class {
  border: none;
  border-top: 2px solid #F08143;
  opacity: 0.6;
}

/* for slider images */
.img-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;

}

.img-wrapper img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

/* para scroll css */
#scrollBox::-webkit-scrollbar {
  display: none;
}

#scrollBox {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Imp — scoped to public site, not admin sidebar */
.site-content .nav-link.active {
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 3px;
}

/* Imp */
.navbar-toggler:focus {
  outline: none !important;
  box-shadow: none !important;
}

.card-footer {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 2px;
  background: rgb(238, 238, 238);
}

/* IMP */
.eque {
  background-color: rgb(234, 215, 204);
}
/* IMP */
.eque-dark {
  background-color: rgb(231, 205, 189);
}


.bi-chevron-down {
  transition: transform 0.3s ease;
}
/* Imp */
.cyan-color {
  background-color: #66C3D0 !important;
}
/* Imp */
.orange-btn-bg {
  background-color: #F08143 !important;
}

.orange-text {
  color: #F08143 !important;
}
/* Imp — scoped to public site, not admin sidebar */
:not(#adminSidebar) > .offcanvas-body .nav-link,
.site-content .nav-link {
  color: #000;
  border-bottom: 2px solid transparent;
  transition: border-color 0.3s;
}
/* Imp */
.site-content .nav-link.active-border {
  border-bottom: 4px solid #F08143 !important;
  color: #000;
}

/* contribute table css */

/* For mobile view  */
@media screen and (max-width: 767px) {
  .table thead {
    display: none;
    /* hide table header */
  }

  .table tr {
    display: block;
    margin-bottom: 1rem;
    border: 1px solid black;
  }

  .table td {
    display: grid;
    grid-template-columns: 40% 60%;
    gap: 0.5rem;
    border-bottom: 1px solid black !important;
    padding: 0 !important;
    padding-right: 0.5rem !important;
  }

  .table td:last-child {
    border-bottom: none;
  }

  .table td::before {
    content: attr(data-label);
    font-weight: bold;
    border-right: 1px solid black !important;
    padding-left: 0.5rem !important;
  }

  /* Section rows stay full width */
  .table .section {
    display: block;
    padding: 0.75rem;
    border: none;
    background: #e9ecef;
  }

  .table .section-row td {
    display: block !important;
    grid-template-columns: none !important;

    text-align: left;
    padding: 0.75rem !important;
    font-weight: bold;
  }

  .table .section-row td::before {
    content: none !important;
    border-right: none !important;
    border: none !important;
    padding: 1px !important;
  }

  .table td:empty,
  .table td[data-empty="1"] {
    display: none !important;
    border: none !important;
    padding: 0 !important;
  }

}

/* ── Bootstrap 5.3 Utility Extensions ──────────────────────────────────────
   These extend Bootstrap 5.3 with additional utilities for common styling
   patterns used throughout the admin dashboard. Replaces inline styles.       */

/* Width utilities (custom pixel values) */
.w-50px  { width: 50px;  }
.w-80px  { width: 80px;  }
.w-120px { width: 120px; }
.w-130px { width: 130px; }
.w-210px { width: 210px; }

/* Height utilities */
.h-130px { height: 130px; }

/* Max-height utilities */
.max-h-150px { max-height: 150px; }

/* Min-width utilities */
.min-w-140px { min-width: 140px; }

/* Max-width utilities */
.max-w-200px  { max-width: 200px;  }
.max-w-350px  { max-width: 350px;  }

/* Word-break utilities */
.word-break-break-word { word-break: break-word; }

/* ══════════════════════════════════════════════════════════════════════════
   Event Calendar Page — Public Site Redesign
   All classes prefixed rm- to avoid collision with existing styles.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Event Calendar Page Layout ───────────────────────────────────────── */
.rm-page-bg {
  background: #f5f6fa;
  min-height: 100vh;
}

/* ── Hero Banner ─────────────────────────────────────────────────────── */
.rm-page-hero {
  background: linear-gradient(135deg, #1e2130 0%, #2a3045 100%);
  padding: 1.25rem 0;
  position: relative;
  overflow: hidden;
  border-radius: 0 0 16px 16px;
}
/* Decorative half-circles */
.rm-page-hero::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -60px;
  width: 140px;
  height: 140px;
  background: #F08143;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.08;
}
.rm-page-hero::after {
  content: '';
  position: absolute;
  bottom: -35px;
  left: -45px;
  width: 100px;
  height: 100px;
  background: #66C3D0;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.07;
}
.rm-hero-half {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.rm-hero-half-1 {
  width: 60px;
  height: 60px;
  top: 50%;
  right: 12%;
  transform: translateY(-50%);
  background: transparent;
  border: 2px solid #66C3D0;
  opacity: 0.1;
}
.rm-hero-half-2 {
  width: 50px;
  height: 50px;
  bottom: -25px;
  right: 30%;
  background: #F08143;
  opacity: 0.05;
}

.rm-hero-title {
  font-size: 1.25rem;
  font-weight: 800;
  color: #fff;
  margin: 0;
  white-space: nowrap;
}
.rm-hero-title i {
  color: #F08143;
  margin-right: 5px;
  font-size: 1.1rem;
}

.rm-hero-desc {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.45);
  margin: 0.15rem 0 0;
}

/* Stats */
.rm-hero-stat-num {
  font-size: 1.3rem;
  font-weight: 800;
  color: #F08143;
  line-height: 1;
}
.rm-hero-stat-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.rm-hero-stat-divider {
  width: 1px;
  height: 22px;
  background: rgba(255,255,255,0.15);
}

/* ── Welcome Strip (Calendar Page) ───────────────────────────────────── */
.rm-welcome-strip {
  background: linear-gradient(135deg, #1e2130 0%, #2a3045 100%);
  padding: 0.85rem 0;
  position: relative;
  overflow: hidden;
}
.rm-welcome-strip::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, #F08143 0%, #66C3D0 50%, #F08143 100%);
  opacity: 0.6;
}
.rm-welcome-decor-1 {
  position: absolute;
  top: -45px;
  right: -50px;
  width: 130px;
  height: 130px;
  background: #F08143;
  border-radius: 50%;
  opacity: 0.07;
  pointer-events: none;
}
.rm-welcome-decor-2 {
  position: absolute;
  bottom: -25px;
  left: 35%;
  width: 75px;
  height: 75px;
  background: #66C3D0;
  border-radius: 50%;
  opacity: 0.06;
  pointer-events: none;
}
.rm-welcome-icon-box {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(240, 129, 67, 0.15);
  border: 1px solid rgba(240, 129, 67, 0.25);
  border-radius: 10px;
  color: #F08143;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.rm-welcome-title {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: 0.2px;
}
.rm-welcome-subtitle {
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.55);
  margin: 0.15rem 0 0;
  letter-spacing: 0.3px;
}

/* ── Compact Professional Navbar ─────────────────────────────────────── */
.rm-navbar {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
  position: relative;
}
.rm-navbar::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #F08143 0%, #66C3D0 50%, #F08143 100%);
}
.rm-navbar-logo-link {
  display: inline-flex;
  align-items: center;
  line-height: 0;
}
.rm-navbar-logo {
  transition: transform 0.25s ease, filter 0.25s ease;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.06));
}
.rm-navbar-logo:hover {
  transform: scale(1.04);
  filter: drop-shadow(0 2px 4px rgba(240,129,67,0.2));
}

/* ── Dark Calendar Section ───────────────────────────────────────────── */
.rm-calendar-section {
  background: linear-gradient(135deg, #1e2130 0%, #2a3045 100%);
  padding: 0.85rem 0;
  position: relative;
  overflow: hidden;
}
.rm-calendar-section::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, #F08143 0%, #66C3D0 50%, #F08143 100%);
  opacity: 0.7;
}
.rm-cal-decor-1 {
  position: absolute;
  top: -45px;
  right: -50px;
  width: 130px;
  height: 130px;
  background: #F08143;
  border-radius: 50%;
  opacity: 0.06;
  pointer-events: none;
}
.rm-cal-decor-2 {
  position: absolute;
  bottom: -25px;
  left: 30%;
  width: 75px;
  height: 75px;
  background: #66C3D0;
  border-radius: 50%;
  opacity: 0.05;
  pointer-events: none;
}

.rm-calendar-box {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Month header (small nav arrows next to title) */
.rm-cal-month-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 0.5rem;
}
.rm-cal-month-nav {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.85);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  font-size: 0.65rem;
  cursor: pointer;
  transition: all 0.15s ease;
}
.rm-cal-month-nav:hover {
  border-color: #F08143;
  color: #F08143;
  background: rgba(240, 129, 67, 0.15);
}
.rm-cal-month-title {
  font-size: 0.95rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.2px;
  margin: 0 4px;
  background: transparent;
  border: none;
  padding: 2px 6px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.rm-cal-month-title:hover {
  background: rgba(240, 129, 67, 0.15);
  color: #F08143;
}

/* Chips row: slide arrows + scrollable chips */
.rm-cal-chips-row {
  display: flex;
  align-items: stretch;
  gap: 4px;
}
.rm-cal-chips-row .rm-cal-chips-scroll {
  flex: 1;
  min-width: 0;
  scroll-behavior: smooth;
}
.rm-cal-slide-arrow {
  flex-shrink: 0;
  width: 22px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.85);
  border-radius: 6px;
  font-size: 0.7rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: all 0.15s ease;
}
.rm-cal-slide-arrow:hover {
  background: rgba(240, 129, 67, 0.2);
  border-color: #F08143;
  color: #F08143;
}

/* ── Date Chips (Horizontal Scroll) ──────────────────────────────────── */
.rm-cal-chips-scroll {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 2px 2px 4px;
  /* Hide the scrollbar — navigation is handled by the ‹ › arrow buttons +
     native touch-swipe on mobile. Scroll functionality is preserved. */
  scrollbar-width: none;         /* Firefox */
  -ms-overflow-style: none;      /* IE / old Edge */
}
.rm-cal-chips-scroll::-webkit-scrollbar {
  display: none;                 /* Chrome / Safari / new Edge */
}

.rm-cal-chip {
  flex: 0 0 auto;
  min-width: 56px;
  padding: 6px 8px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  cursor: pointer;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.1;
  transition: all 0.15s ease;
  user-select: none;
}
.rm-cal-chip:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(240, 129, 67, 0.6);
  box-shadow: 0 2px 8px rgba(240, 129, 67, 0.25);
}

.rm-cal-chip-day {
  font-size: 0.6rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.rm-cal-chip-num {
  font-size: 1.1rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  margin: 1px 0;
}
.rm-cal-chip-count {
  font-size: 0.58rem;
  font-weight: 600;
  color: #F08143;
}
.rm-cal-chip-month {
  font-size: 0.6rem;
  font-weight: 700;
  color: #F08143;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

/* Past-date chip — visible but muted (user can scroll left to reach them) */
.rm-cal-chip-past {
  opacity: 0.55;
}

/* Selected state */
.rm-cal-chip-selected {
  background: linear-gradient(135deg, #F08143 0%, #ff9659 100%);
  border-color: #F08143;
  box-shadow: 0 4px 12px rgba(240, 129, 67, 0.4);
}
.rm-cal-chip-selected .rm-cal-chip-day,
.rm-cal-chip-selected .rm-cal-chip-num,
.rm-cal-chip-selected .rm-cal-chip-count,
.rm-cal-chip-selected .rm-cal-chip-month {
  color: #fff;
}

/* Tabs wrapper: centers the segmented control, spinner overlaps on the right */
.rm-cal-tabs-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.rm-cal-tabs-spinner {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
}

/* Compact pill segmented control.
   Track = full pill, very small footprint. Active segment is filled orange.
   In Mode B the active segment becomes a month picker (‹ Month Year ›). */
.rm-cal-tabs {
  display: inline-flex;
  align-items: stretch;
  padding: 3px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  gap: 0;
}
.rm-cal-tab {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  padding: 4px 14px;
  font-size: 0.72rem;
  font-weight: 600;
  border-radius: 999px;
  letter-spacing: 0.2px;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  line-height: 1.4;
}
.rm-cal-tab-icon {
  font-size: 0.7rem;
  opacity: 0.85;
}
.rm-cal-tab:hover:not(.rm-cal-tab-active) {
  color: #fff;
  background: rgba(255, 255, 255, 0.06);
}
.rm-cal-tab-active {
  background: linear-gradient(135deg, #F08143 0%, #ff9659 100%) !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(240, 129, 67, 0.3) !important;
}

/* Active pill in Mode B = month picker embedded in place */
.rm-cal-tab-picker {
  padding: 0;
  overflow: hidden;
}
.rm-cal-picker-arrow {
  background: transparent;
  border: none;
  color: #fff;
  width: 26px;
  font-size: 0.72rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease;
}
.rm-cal-picker-arrow:hover {
  background: rgba(0, 0, 0, 0.2);
}
.rm-cal-picker-label {
  padding: 4px 8px;
  font-size: 0.72rem;
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.2px;
  min-width: 74px;
  text-align: center;
  user-select: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

/* Slide arrows: disabled state (when scrollLeft at boundary) */
.rm-cal-slide-disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}

/* Today indicator (when not selected) */
.rm-cal-chip-today:not(.rm-cal-chip-selected) {
  border-color: #66C3D0;
  border-width: 2px;
}

/* Empty (no-event) chip — visible but not interactive */
.rm-cal-chip-empty {
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.03);
}
.rm-cal-chip-empty .rm-cal-chip-day,
.rm-cal-chip-empty .rm-cal-chip-num {
  color: rgba(255, 255, 255, 0.55);
}
.rm-cal-chip-empty .rm-cal-chip-count {
  color: rgba(255, 255, 255, 0.3);
}

/* Empty state — matches chip strip height so section stays consistent */
.rm-cal-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 60px;
  padding: 2px 8px 6px;
  color: rgba(255, 255, 255, 0.5);
}
.rm-cal-empty i {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.3);
}
.rm-cal-empty p {
  font-size: 0.78rem;
  margin: 0;
}

/* ── Section Heading ──────────────────────────────────────────────────── */
.rm-section-heading {
  border-left: 4px solid #F08143;
  margin: 0 0 1.25rem;
}

/* ── Age Rating Badge ────────────────────────────────────────────────── */
.rm-age-badge {
  display: inline-block;
  background: #f0f0f0;
  color: #555;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 4px;
  border: 1px solid #e0e0e0;
  cursor: help;
  vertical-align: middle;
}

/* ── Price Badge ─────────────────────────────────────────────────────── */
.rm-price-badge {
  display: inline-block;
  background: #fff5f0;
  color: #F08143;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 50px;
  border: 1px solid rgba(240,129,67,0.2);
  white-space: nowrap;
  flex-shrink: 0;
}
.rm-price-free {
  background: #f0fdf4;
  color: #22c55e;
  border-color: rgba(34,197,94,0.2);
}

/* ── Event Card (compact side-by-side) ───────────────────────────────── */
.rm-event-card {
  transition: box-shadow 0.2s, transform 0.2s;
  padding: 0.9rem !important;
}
.rm-event-card:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(-2px);
}
.rm-event-title {
  font-size: 1.1rem;
  line-height: 1.3;
}

/* Top row: image (left) + details (right) — image stays fixed size */
.rm-event-top {
  display: flex;
  gap: 10px;
  margin-bottom: 0.4rem;
  align-items: flex-start;
}
.rm-event-img-col {
  flex: 0 0 35%;
  max-width: 35%;
}
.rm-event-details-col {
  flex: 1;
  min-width: 0;
}

/* Event image wrapper — FIXED height, won't stretch with details */
.rm-event-img-wrap {
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f5;
  width: 100%;
  height: 160px;
}
.rm-event-img-wrap .carousel,
.rm-event-img-wrap .carousel-inner {
  border-radius: 8px;
  height: 100%;
}
.rm-event-img-wrap .carousel-item,
.rm-event-img-wrap .img-wrapper {
  height: 100%;
  padding: 0;
}
.rm-event-img-wrap .img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.rm-event-img-placeholder {
  height: 100%;
  background: #f5f5f5;
  border-radius: 8px;
}

/* ── Image Carousel Polish ───────────────────────────────────────────── */
.rm-event-carousel {
  height: 100%;
}
/* Image count badge (e.g., "1/3") in top-left */
.rm-img-count-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 4;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 10px;
  letter-spacing: 0.3px;
  backdrop-filter: blur(4px);
  pointer-events: none;
}
/* Carousel indicators (dots at bottom) */
.rm-event-img-wrap .carousel-indicators {
  margin-bottom: 0.4rem;
  margin-left: 0;
  margin-right: 0;
}
.rm-event-img-wrap .carousel-indicators [data-bs-target] {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: none;
  margin: 0 3px;
  background-color: rgba(255, 255, 255, 0.6);
  opacity: 1;
  transition: all 0.2s ease;
}
.rm-event-img-wrap .carousel-indicators .active {
  background-color: #F08143;
  width: 18px;
  border-radius: 4px;
}
/* Prev/Next controls — hidden by default, fade in on hover */
.rm-event-img-wrap .carousel-control-prev,
.rm-event-img-wrap .carousel-control-next {
  width: 28px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.rm-event-img-wrap:hover .carousel-control-prev,
.rm-event-img-wrap:hover .carousel-control-next {
  opacity: 1;
}
.rm-event-img-wrap .carousel-control-prev-icon,
.rm-event-img-wrap .carousel-control-next-icon {
  background-color: rgba(0, 0, 0, 0.45);
  border-radius: 50%;
  padding: 10px;
  background-size: 50% 50%;
}

/* ── Date Stamp Below Image (single line) ────────────────────────────── */
.rm-event-date-stamp {
  margin-top: 6px;
  padding: 3px 6px;
  background: linear-gradient(135deg, #fff5f0 0%, #ffe8d9 100%);
  border: 1px solid rgba(240, 129, 67, 0.25);
  border-radius: 6px;
  text-align: center;
  white-space: nowrap;
}
.rm-date-day {
  font-size: 0.9rem;
  font-weight: 800;
  color: #F08143;
}
.rm-date-month {
  font-size: 0.7rem;
  font-weight: 800;
  color: #F08143;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-left: 2px;
}
.rm-date-weekday {
  font-size: 0.65rem;
  color: #888;
  font-weight: 600;
  margin-left: 6px;
  padding-left: 6px;
  border-left: 1px solid rgba(240, 129, 67, 0.3);
}

/* Time slots: wrap nicely, tight gaps for many pills */
.rm-event-details-col .field-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 0.4rem;
}
.rm-event-details-col .field-group .rm-time-pill,
.rm-event-details-col .field-group .rm-time-pill-past {
  margin: 0;
}

/* Event metadata icon color */
.rm-meta-icon {
  color: #F08143;
  margin-right: 3px;
}

/* Description strip below image + action area */
.rm-event-desc-strip {
  line-height: 1.6;
  color: #555;
  font-size: 0.92rem;
}

/* Social media icons row */
.rm-social-link {
  color: #555;
  font-size: 1.05rem;
  margin-right: 0.5rem;
  transition: color 0.15s;
}
.rm-social-link:hover {
  color: #F08143;
}

/* ── Time Slot Pills ──────────────────────────────────────────────────── */
.rm-time-pill {
  display: inline-block;
  border: 1.5px solid rgba(240, 129, 67, 0.4);
  border-radius: 6px;
  padding: 0.26rem 0.55rem;
  margin: 0 0.2rem 0.3rem 0;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
  background: #fff;
  color: #333;
  transition: all 0.15s ease;
  transition: background 0.15s, border-color 0.15s, transform 0.1s;
  text-decoration: none !important;
  white-space: nowrap;
}
.rm-time-pill:hover {
  border-color: #66C3D0;
  background: #f0fafb;
  transform: translateY(-1px);
}

/* Time separator */
.rm-time-sep {
  color: #bbb;
  margin: 0 2px;
  font-size: 0.7rem;
}

/* Selected time slot */
.rm-time-pill.highlight {
  background-color: #66C3D0 !important;
  border-color: #66C3D0 !important;
  color: #fff !important;
}

/* Past event time slots */
.rm-time-pill-past {
  display: inline-block;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 0.32rem 0.6rem;
  margin: 0 0.2rem 0.3rem 0;
  font-size: 0.8rem;
  line-height: 1.25;
  text-align: center;
  background: #f8f9fa;
  color: #aaa;
  pointer-events: none;
  white-space: nowrap;
}

/* Sold-out time slots: muted so they recede behind bookable pills */
.rm-time-pill-soldout {
  cursor: not-allowed;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  opacity: 0.75;
  box-shadow: none;
  font-weight: 500;
}
.rm-time-pill-soldout:hover {
  background: #fef2f2;
  border-color: #fecaca;
  transform: none;
  opacity: 0.75;
}
.rm-time-pill-soldout .rm-time-soldout-text {
  font-weight: 500;
}
.rm-time-pill-soldout .rm-time-sep {
  color: rgba(185, 28, 28, 0.45);
}
.rm-soldout-badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.04rem 0.4rem;
  background: transparent;
  color: #b91c1c;
  border: 1px solid rgba(185, 28, 28, 0.35);
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  vertical-align: middle;
}

/* Closed / Booking-Closed: muted — readable but visually quieter than bookable */
.rm-time-pill-closed {
  cursor: not-allowed;
  background: #efefef;
  border: 1px solid #c8c8c8;
  color: #555;
  opacity: 0.9;
  box-shadow: none;
  font-weight: 500;
}
.rm-time-pill-closed:hover {
  background: #efefef;
  border-color: #c8c8c8;
  transform: none;
  opacity: 0.9;
}
.rm-time-pill-closed .rm-time-closed-text {
  font-weight: 600;
  color: #555;
}
.rm-time-pill-closed .rm-time-sep {
  color: rgba(85, 85, 85, 0.55);
}
.rm-booking-closed-badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.04rem 0.4rem;
  background: transparent;
  color: #555;
  border: 1px solid #b5b5b5;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  vertical-align: middle;
}

/* ── Mobile: stack time-range + badge vertically inside closed/sold-out pills ── */
/* Prevents horizontal overflow on narrow viewports. Also tightens padding +
   shrinks badge text so the pill takes minimal space. */
@media (max-width: 575.98px) {
  /* On mobile, stack time + badge vertically inside the closed/sold-out pill.
     Pill padding and time font-size match the bookable pill so all three pill
     types have the same width (determined by the time text). The badge sits
     below at a smaller font, narrower than the time, so it never widens the
     pill beyond the bookable size. */
  .rm-time-pill-closed,
  .rm-time-pill-soldout {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 0.26rem 0.55rem;
    font-size: 0.78rem;
  }
  .rm-time-pill-closed .rm-booking-closed-badge,
  .rm-time-pill-soldout .rm-soldout-badge {
    margin-left: 0;
    font-size: 0.52rem;
    padding: 0.02rem 0.35rem;
    letter-spacing: 0.3px;
  }
}

/* ── Price Overlay (on image) ────────────────────────────────────────── */
.rm-price-overlay {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  background: linear-gradient(135deg, #F08143 0%, #ff9659 100%);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 50px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.rm-price-overlay-free {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

/* ── Age Overlay (on image) ──────────────────────────────────────────── */
.rm-age-overlay {
  position: absolute;
  bottom: 8px;
  left: 8px;
  z-index: 3;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
  cursor: help;
  letter-spacing: 0.3px;
  backdrop-filter: blur(4px);
}

/* ── Quick Info Chips (Lang · Type · Duration) ───────────────────────── */
.rm-event-quick-info {
  font-size: 0.85rem;
  color: #777;
  font-weight: 500;
  letter-spacing: 0.2px;
}

/* ── Meta Block (date, venue, producer with icons) ───────────────────── */
.rm-event-meta-block {
  margin-bottom: 0.5rem;
}
.rm-meta-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.88rem;
  color: #555;
  margin-bottom: 3px;
  line-height: 1.35;
}
.rm-meta-row i {
  color: #F08143;
  flex-shrink: 0;
  margin-top: 3px;
  font-size: 0.9rem;
}

/* ── Section Label (subtle uppercase divider) ────────────────────────── */
.rm-section-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #888;
  margin-top: 0.4rem;
  margin-bottom: 0.4rem;
  padding-bottom: 0.3rem;
  border-bottom: 1px dashed #e0e0e0;
}

/* ── Socials Inline (next to title — legacy) ─────────────────────────── */
.rm-socials-inline {
  margin-top: 2px;
}
.rm-socials-inline .rm-social-link {
  font-size: 0.9rem;
  margin: 0;
}

/* ── Socials cluster (next to quick-info on desktop, below on mobile) ── */
/* justify-content is controlled by Bootstrap responsive utility classes on
   the element itself:
     justify-content-start      → left-align on mobile/tablet (stacked layout)
     justify-content-lg-end     → right-align on desktop (inline layout) */
.rm-event-socials-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.rm-social-footer-link {
  color: #F08143;
  font-size: 0.8rem;
  line-height: 1;
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease;
}
.rm-social-footer-link:hover {
  color: #d96b2a;
  transform: translateY(-1px);
}
.rm-social-footer-link i {
  display: inline-block;
  vertical-align: middle;
}


/* ── Load More Events Button ─────────────────────────────────────────── */
.rm-load-more-btn {
  background: #fff;
  border: 1.5px solid #F08143;
  color: #F08143;
  font-weight: 600;
  padding: 0.5rem 1.5rem;
  border-radius: 50px;
  font-size: 0.85rem;
  transition: all 0.2s ease;
}
.rm-load-more-btn:hover {
  background: #F08143;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(240, 129, 67, 0.25);
}
.rm-load-more-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

/* ── Book Now Button ──────────────────────────────────────────────────── */
.rm-book-form {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
/* Hide the empty error div so the form's gap only applies when the error
   actually has text. Without this, the empty div remains a flex item and
   the 10px gap creates dead space before the Book Now button. */
.rm-book-form #frontend-error:empty {
  display: none;
}
.rm-book-btn {
  background: linear-gradient(135deg, #F08143 0%, #ff9659 100%);
  border: none;
  color: #fff;
  font-weight: 600;
  padding: 0.3rem 1rem;
  border-radius: 50px;
  font-size: 0.78rem;
  display: inline-flex;
  align-items: center;
  box-shadow: 0 2px 6px rgba(240, 129, 67, 0.3);
  transition: all 0.2s ease;
  /* Lock button size: don't stretch, grow, or shrink based on parent flex
     state. When the error div fills in beside it, the button stays exactly
     the same dimensions. */
  flex: 0 0 auto;
  align-self: flex-start;
  width: auto;
  height: auto;
}
.rm-book-btn:hover {
  background: linear-gradient(135deg, #d96b2a 0%, #F08143 100%);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(240, 129, 67, 0.4);
}
.rm-book-btn:active {
  transform: translateY(0);
}
/* Suppress Bootstrap's default thick focus ring — keeps button visually
   identical when user clicks it (e.g. when form submission is blocked by
   JS validation, the button stays focused and the default focus shadow
   was making it look "bigger"). */
.rm-book-btn:focus,
.rm-book-btn:focus-visible,
.rm-book-btn.focus {
  box-shadow: 0 2px 6px rgba(240, 129, 67, 0.3) !important;
  outline: none !important;
}

/* House Full Badge (left-aligned pill) */
.rm-house-full-badge {
  display: inline-flex;
  align-items: center;
  background: linear-gradient(135deg, #fff5f5 0%, #ffe3e3 100%);
  color: #c0392b;
  border: 1px solid #ff8a73;
  border-radius: 50px;
  padding: 0.3rem 0.85rem;
  font-weight: 700;
  font-size: 0.72rem;
}

/* ── Responsive adjustments ───────────────────────────────────────────── */
@media (max-width: 991.98px) {
  .rm-event-img-wrap .img-wrapper img {
    height: 220px;
  }
  .rm-section-heading {
    margin-top: 1rem;
  }
}
@media (max-width: 767.98px) {
  .rm-event-img-wrap .img-wrapper img {
    height: 200px;
  }
  .rm-cal-month-title {
    font-size: 0.9rem;
  }
  .rm-cal-chip {
    min-width: 50px;
    padding: 5px 6px;
  }
  .rm-cal-chip-num {
    font-size: 1rem;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   Footer
   ══════════════════════════════════════════════════════════════════════════ */
.rm-footer {
  background: linear-gradient(180deg, #1e2130 0%, #171926 100%);
  color: rgba(255,255,255,0.7);
  position: relative;
  overflow: hidden;
  margin-top: auto;
}

/* Orange accent line at top */
.rm-footer-edge {
  height: 3px;
  background: linear-gradient(90deg, #F08143 0%, #66C3D0 50%, #F08143 100%);
}

.rm-footer-main {
  padding: 2.5rem 0 1.5rem;
}

/* Brand */
.rm-footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0.75rem;
}
.rm-footer-brand i {
  font-size: 1.6rem;
  color: #F08143;
}
.rm-footer-brand span {
  font-size: 1.3rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.3px;
}

.rm-footer-about {
  font-size: 0.84rem;
  line-height: 1.65;
  color: rgba(255,255,255,0.45);
  margin-bottom: 1.25rem;
  max-width: 320px;
}

/* Social icons */
.rm-footer-socials {
  display: flex;
  gap: 8px;
}
.rm-footer-socials a {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  transition: all 0.2s ease;
  text-decoration: none;
}
.rm-footer-socials a:hover {
  background: #F08143;
  border-color: #F08143;
  color: #fff;
  transform: translateY(-2px);
}

/* Column headings */
.rm-footer-heading {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  color: #F08143;
  margin-bottom: 1rem;
  position: relative;
  padding-bottom: 8px;
}
.rm-footer-heading::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 2px;
  background: #F08143;
  border-radius: 2px;
}

/* Links */
.rm-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.rm-footer-links li {
  margin-bottom: 0.6rem;
}
.rm-footer-links a {
  color: rgba(255,255,255,0.5);
  text-decoration: none;
  font-size: 0.84rem;
  transition: color 0.15s, padding-left 0.15s;
}
.rm-footer-links a:hover {
  color: #fff;
  padding-left: 4px;
}

/* Contact icon accent */
.rm-footer-icon {
  color: #66C3D0;
  margin-right: 4px;
  font-size: 0.78rem;
}

/* Bottom bar */
.rm-footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 1rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}
.rm-footer-tagline {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.25);
}
.rm-heart {
  color: #F08143;
  font-size: 0.7rem;
  animation: rm-pulse 2s ease-in-out infinite;
}
@keyframes rm-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}

/* Decorative half-circles clipped at edges */
.rm-footer-half {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.07;
}
/* Large orange half — bottom-right, clipped right */
.rm-footer-half-1 {
  width: 280px;
  height: 280px;
  bottom: -60px;
  right: -140px;
  background: #F08143;
}
/* Medium cyan half — top-left, clipped left */
.rm-footer-half-2 {
  width: 180px;
  height: 180px;
  top: 20px;
  left: -90px;
  background: #66C3D0;
}
/* Small orange half — bottom-left corner */
.rm-footer-half-3 {
  width: 100px;
  height: 100px;
  bottom: -50px;
  left: 8%;
  background: #F08143;
  opacity: 0.04;
}
/* Tiny cyan ring — right side, mid-height */
.rm-footer-half-4 {
  width: 60px;
  height: 60px;
  top: 40%;
  right: 5%;
  background: transparent;
  border: 2px solid #66C3D0;
  opacity: 0.08;
}

/* Footer responsive */
@media (max-width: 767.98px) {
  .rm-footer-main {
    padding: 2rem 0 1rem;
  }
  .rm-footer-bottom {
    justify-content: center;
    text-align: center;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   SEAT SELECTION PAGE
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Progress Bar ───────────────────────────────────────────────────────── */
.rm-progress-active {
  color: #F08143 !important;
}
.rm-progress-dot {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #e9ecef;
  color: #999;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 800;
  flex-shrink: 0;
}
.rm-progress-active .rm-progress-dot {
  background: #F08143;
  color: #fff;
}
.rm-progress-line {
  width: 40px;
  height: 2px;
  background: #e0e0e0;
  margin: 0 6px;
}
/* ── Legend Chips (size only; d-inline-block + rounded-1 in HTML) ───────── */
.rm-seat-legend-chip {
  width: 16px;
  height: 16px;
}
/* Available: orange outline (brand color) */
.rm-seat-legend-available {
  background: #fff;
  border: 2px solid #F08143;
}
/* Selected: green fill */
.rm-seat-legend-selected {
  background: #198754;
  border: 2px solid #198754;
}
/* Booked: gray */
.rm-seat-legend-booked {
  background: #c0c0c0;
  border: 2px solid #b0b0b0;
}

/* ── Seat Grid: row label (size+color only; layout utilities in HTML) ──── */
.rm-row-label {
  font-size: 0.85rem;
  color: #1e2130;
  min-width: 28px;
}

/* Orange scrollbar for the seat layout horizontal scroll
   (everything else is handled by Bootstrap utilities: overflow-x-auto,
    text-center, d-inline-block, text-start, text-nowrap, flex-nowrap) */
.rm-seat-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #F08143 #f0f0f0;
}
.rm-seat-scrollbar::-webkit-scrollbar {
  height: 6px;
}
.rm-seat-scrollbar::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 3px;
}
.rm-seat-scrollbar::-webkit-scrollbar-thumb {
  background: #F08143;
  border-radius: 3px;
}

/* ── Individual Seat (size, radius, font-size, cursor, transition only;
       layout utilities like d-flex / align-items / justify-content / p-0 /
       fw-bold are applied as Bootstrap classes in HTML).
       Default border reset here so state classes can apply their own borders
       (we can't use Bootstrap's .border-0 because it uses !important and
       would block the state borders) */
.rm-seat {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 5px;
  font-size: 0.6rem;
  cursor: pointer;
  transition: all 0.15s ease;
}
/* Available: orange outline (brand color) */
.rm-seat-available {
  background: #fff;
  color: #F08143;
  border: 1.5px solid #F08143;
}
.rm-seat-available:hover {
  background: #fff5f0;
  color: #d96b2a;
  border-color: #d96b2a;
  transform: scale(1.15);
  box-shadow: 0 2px 8px rgba(240, 129, 67, 0.3);
}
/* Selected: solid green fill */
.rm-seat-selected,
.rm-seat.seat_highlight {
  background: #198754 !important;
  color: #fff !important;
  border: 1.5px solid #198754 !important;
  box-shadow: 0 2px 6px rgba(25, 135, 84, 0.3);
}
/* Booked: gray, disabled */
.rm-seat-booked {
  background: #c0c0c0;
  color: #fff;
  border: 1.5px solid #b0b0b0;
  cursor: not-allowed;
  opacity: 0.85;
}

/* ── Stage ──────────────────────────────────────────────────────────────── */
.rm-stage-bar {
  width: 70%;
  max-width: 400px;
  height: 6px;
  background: linear-gradient(90deg, #66C3D0, #F08143);
  border-radius: 3px;
}

/* ── Summary Panel ──────────────────────────────────────────────────────── */
.rm-seat-summary-sticky {
  position: sticky;
  top: 80px;
}
.rm-seat-summary-title {
  border-bottom: 2px solid #F08143;
}
.rm-seat-summary-total span:last-child {
  color: #F08143;
  font-size: 1.15rem;
  transition: transform 0.2s ease;
}
.rm-seat-chip {
  display: inline-block;
  background: #f0fdf4;
  color: #198754;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid rgba(25,135,84,0.2);
}

/* Submit Button */
.rm-seat-submit-btn {
  background: #F08143;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-weight: 700;
  font-size: 0.9rem;
  padding: 0.7rem 1.5rem;
  transition: all 0.18s ease;
}
.rm-seat-submit-btn:hover {
  background: #d96b2a;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(240,129,67,0.3);
}
.rm-seat-submit-btn:disabled {
  background: #ccc;
  color: #888;
  transform: none;
  box-shadow: none;
  cursor: not-allowed;
}

/* ── Floating Seat Selection Bar ─────────────────────────────────────── */
.rm-seat-page-content {
  padding-bottom: 100px !important; /* room for floating bar */
}
/* User-info page: floating bar is mobile-only, so only add padding-bottom there */
@media (max-width: 991.98px) {
  .rm-userinfo-page-content {
    padding-bottom: 80px !important;
  }
}
.rm-seat-floating-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-top: 1px solid #e9ecef;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
  z-index: 1030;
  /* Hidden by default — only shown when at least 1 seat is selected */
  transform: translateY(100%);
  visibility: hidden;
  transition: transform 0.28s ease, visibility 0s linear 0.28s;
}
.rm-seat-floating-bar.show {
  transform: translateY(0);
  visibility: visible;
  transition: transform 0.28s ease;
}
.rm-floating-label {
  font-size: 0.7rem;
  font-weight: 600;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.rm-floating-count {
  font-size: 1.25rem;
  font-weight: 800;
  color: #222;
  transition: transform 0.2s ease;
}
.rm-floating-total {
  font-size: 1.15rem;
  color: #F08143;
}
.rm-floating-submit {
  white-space: nowrap;
}

/* Info line above the Pay button */
.rm-floating-info-line {
  font-size: 0.85rem;
  color: #555;
  margin-bottom: 6px;
}
.rm-floating-info-line .rm-floating-count {
  font-weight: 800;
  font-size: 1rem;
  color: #222;
  margin-right: 4px;
}

/* BookMyShow-style Pay button (centered, solid orange, prominent) */
.rm-bms-pay-btn {
  background: #F08143;
  border: none;
  color: #fff;
  font-weight: 700;
  padding: 0.3rem 1.75rem;
  border-radius: 0.375rem;
  font-size: 1rem;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(240, 129, 67, 0.35);
  transition: all 0.18s ease;
  min-width: 200px;
  justify-content: center;
}
.rm-bms-pay-btn:hover:not(:disabled) {
  background: #d96b2a;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 5px 15px rgba(240, 129, 67, 0.45);
}
/* (disabled state removed — bar only shows when seats are selected, button always active) */
.rm-bms-pay-label {
  font-size: 1rem;
  opacity: 0.95;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.rm-bms-pay-amount {
  font-size: 1rem;
  font-weight: 800;
}

/* ── Seat Page Responsive ───────────────────────────────────────────────── */
@media (max-width: 991.98px) {
  .rm-seat-summary-sticky {
    position: static;
  }
  .rm-progress-line {
    width: 24px;
  }
}
@media (max-width: 575.98px) {
  .rm-seat {
    width: 28px;
    height: 28px;
    font-size: 0.6rem;
  }
  .rm-row-label {
    font-size: 0.75rem;
    min-width: 22px;
    margin-right: 6px;
  }
}

/* ── Brand Utility Classes ──────────────────────────────────────────────── */
.rm-text-orange { color: #F08143 !important; }

/* ── Processing Page ───────────────────────────────────────────────────── */
.rm-processing-ring {
  background: linear-gradient(135deg, #F08143, #d96b2a);
  box-shadow: 0 4px 20px rgba(240,129,67,0.35);
  animation: rm-ring-pulse 2s ease-in-out infinite;
}
@keyframes rm-ring-pulse {
  0%, 100% { box-shadow: 0 4px 20px rgba(240,129,67,0.35); }
  50% { box-shadow: 0 4px 30px rgba(240,129,67,0.15), 0 0 0 12px rgba(240,129,67,0.08); }
}
.rm-processing-dot {
  background: #66C3D0;
  animation: rm-pulse 1.4s ease-in-out infinite;
}
.rm-processing-dot-2 { animation-delay: 0.2s; }
.rm-processing-dot-3 { animation-delay: 0.4s; }
@keyframes rm-pulse {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Auth Pages (Login / Register / Password Reset)
   ══════════════════════════════════════════════════════════════════════════ */
.text-center > div > a > svg {
  filter: invert(0.2);
}
.text-center h1 {
  color: #333;
  letter-spacing: 0.5px;
}
.text-center > p {
  color: #999;
}

/* ══════════════════════════════════════════════════════════════════════════
   Admin Seat Layout (venue seat editor)
   ══════════════════════════════════════════════════════════════════════════ */
.seat-size {
  margin: 2px;
  display: inline-block;
}
.btn-size {
  width: 38px;
  height: 38px;
  font-size: 0.68rem;
  font-weight: 700;
  background: #e9ecef;
  color: #555;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  transition: background 0.15s;
}
.admin-seat-btn:hover .btn-size {
  background: #dc3545;
  color: #fff;
}
.row-label {
  font-weight: 800;
  font-size: 0.9rem;
  color: #1e2130;
  min-width: 28px;
  text-align: center;
}

/* ═══════════════════════════════════════════════════════════════════════
   PRINT STYLES — applied when the user runs window.print() (Save as PDF)
   on a receipt page (success / failed / pending).

   Goal: preserve the receipt card EXACTLY as it appears on screen
   (white card, rounded corners, soft shadow, all internal styling).
   Only the site chrome (nav, footer, hero, progress steps, the print
   button itself) is hidden.
   ═══════════════════════════════════════════════════════════════════════ */
@media print {
  /* Page format: A4 with safe margins */
  @page {
    size: A4;
    margin: 1cm;
  }

  /* Force colors to print as-shown (orange brand, success greens, etc.) */
  body,
  * {
    -webkit-print-color-adjust: exact !important;
            print-color-adjust: exact !important;
  }

  /* Keep the light page background (matches the on-screen rm-page-bg) so the
     white card visually pops the same way it does on screen */
  body {
    background: #f4f6fb;
  }

  /* Hide site chrome but DO NOT touch anything inside the receipt card */
  .rm-no-print,
  nav.navbar,
  .navbar,
  .site-footer,
  footer,
  .rm-page-hero,
  #printReceiptButton,
  .modal,
  .toast,
  .alert-dismissible .btn-close {
    display: none !important;
  }

  /* Hide the booking progress steps row (it's redundant in a saved receipt) */
  .site-content > .container:first-of-type > .d-flex.justify-content-center {
    display: none !important;
  }

  /* Remove the top padding the progress steps left behind */
  .site-content > .container.pt-3 {
    padding-top: 0 !important;
  }

  /* Tighten the page-bg wrapper so the card sits nicely on the printed page */
  .rm-page-bg,
  .site-content {
    padding: 0 !important;
    background: #f4f6fb !important;
  }

  /* Avoid splitting the receipt card across pages */
  .bg-white.border.rounded-4 {
    page-break-inside: avoid;
  }

  /* Don't append the full URL after links (browser default in some setups) */
  a[href]::after {
    content: none !important;
  }
}