/* =========================================
   ROW WEST — PIQ MASTER THEME
   WARM / CLEAN / BRAND-LED
   ========================================= */


/* =========================================
   BRAND + UI TOKENS
   ========================================= */

:root {
  --rw-navy: #000D2E;
  --rw-deep-blue: #1769AA;
  --rw-blue: #32ADFF;
  --rw-light-blue: #A0D9FF;

  --rw-white: #FFFFFF;
  --rw-warm-mist: #F3F0EA;

  --rw-text: #172033;
  --rw-muted: #50545A;

  --rw-soft-gray: #F4F2EE;
  --rw-mid-gray: #D8D6D1;
  --rw-border: #DED9D2;
}


/* =========================================
   PAGE
   ========================================= */

body {
  background-color: var(--rw-white) !important;
  color: var(--rw-text);
}


/* =========================================
   TOP HEADER
   ========================================= */

.navbar,
.navbar-inverse {
  background-color: var(--rw-navy) !important;
  border-color: var(--rw-navy) !important;
}


/* =========================================
   NAVIGATION
   ========================================= */

.navbar a {
  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}

.navbar a:hover,
.navbar a:focus {
  color: var(--rw-light-blue) !important;
}


/* =========================================
   SECONDARY NAV / TABS
   ========================================= */

.nav-tabs > li > a,
.nav-pills > li > a {
  color: var(--rw-text) !important;
  border-radius: 4px;
}

.nav-tabs > li > a:hover,
.nav-pills > li > a:hover {
  color: var(--rw-navy) !important;
  background-color: var(--rw-warm-mist) !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.nav-pills > li.active > a {
  color: var(--rw-navy) !important;
  background-color: var(--rw-light-blue) !important;
  border-color: var(--rw-light-blue) !important;
}


/* =========================================
   BUTTONS
   ========================================= */

.btn-primary {
  background-color: var(--rw-navy) !important;
  border-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--rw-blue) !important;
  border-color: var(--rw-blue) !important;
  color: var(--rw-navy) !important;
}

.btn-info {
  background-color: var(--rw-navy) !important;
  border-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;
}

.btn-info:hover,
.btn-info:focus {
  background-color: var(--rw-blue) !important;
  border-color: var(--rw-blue) !important;
  color: var(--rw-navy) !important;
}


/* =========================================
   LINKS
   ========================================= */

a {
  color: var(--rw-deep-blue);
}

a:hover,
a:focus {
  color: var(--rw-navy);
}


/* =========================================
   CARDS / PANELS
   ========================================= */

.panel,
.well {
  background-color: var(--rw-white) !important;
  border-color: var(--rw-border) !important;

  box-shadow:
    0 2px 8px rgba(0, 13, 46, 0.06);
}

.panel-heading {
  background-color: var(--rw-navy) !important;
  color: var(--rw-light-blue) !important;
  border-color: var(--rw-navy) !important;
}


/* =========================================
   PAGE TITLES
   ========================================= */

.panel-heading .page-title {
  color: var(--rw-light-blue) !important;

  margin: 0 !important;
  padding: 10px 18px !important;

  line-height: 1.2 !important;
}


/* =========================================
   GENERAL HEADINGS
   ========================================= */

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--rw-navy);
}


/* =========================================
   TABLES
   ========================================= */

.table > thead > tr > th {
  background-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;
  border-color: var(--rw-navy) !important;
}

/* Warm neutral zebra */
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: var(--rw-warm-mist) !important;
}

.table-hover > tbody > tr:hover {
  background-color: #E9F3F9 !important;
}


/* =========================================
   FORMS
   ========================================= */

.form-control {
  background-color: var(--rw-white);
}

.form-control:focus {
  border-color: var(--rw-blue) !important;

  box-shadow:
    0 0 0 2px rgba(50, 173, 255, 0.12) !important;
}


/* =========================================
   DROPDOWNS
   ========================================= */

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: var(--rw-warm-mist) !important;
  color: var(--rw-navy) !important;
}


/* =========================================
   DASHBOARD STAT CARDS
   ========================================= */

/* METERS */
.bg-green-400 {
  background-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;
}

/* AVG PACE */
.bg-orange-400,
.bg-yellow-400 {
  background-color: var(--rw-deep-blue) !important;
  color: var(--rw-white) !important;
}

/* AVG POWER */
.bg-indigo-600 {
  background-color: var(--rw-blue) !important;
  color: var(--rw-navy) !important;
}

/* AVG RATE */
.bg-grey-600 {
  background-color: var(--rw-light-blue) !important;
  color: var(--rw-navy) !important;
  border: none !important;
}

.widget-content.widget-shadow {
  border-radius: 3px;

  box-shadow:
    0 3px 10px rgba(0, 13, 46, 0.08) !important;
}


/* =========================================
   INTERNAL CLASS SCHEDULE
   ========================================= */


/* DAY GROUP */

#ClassesSection .ClassDate {
  margin-bottom: 12px;

  background-color: var(--rw-white) !important;

  border:
    1px solid var(--rw-border) !important;
}


/* DATE HEADERS */

#ClassesSection .ClassDate > day {
  display: block;

  background-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;

  padding: 8px 10px !important;

  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;

  letter-spacing: 0.01em;
}


/* TODAY */

#ClassesSection .ClassDate.today > day {
  color: var(--rw-light-blue) !important;

  box-shadow:
    inset 4px 0 0 var(--rw-blue);
}


/* CLASS ROWS */

#ClassesSection
.ClassDate
> div
> div[id^="display-class-link-"] {

  background-color: var(--rw-white) !important;

  padding: 7px 9px !important;

  border-bottom:
    1px solid var(--rw-border) !important;

  color: var(--rw-text) !important;

  transition:
    background-color 0.18s ease;
}


/* WARM ZEBRA */

#ClassesSection
.ClassDate
> div
> div[id^="display-class-link-"]:nth-child(even) {

  background-color: var(--rw-warm-mist) !important;
}


/* TIME */

#ClassesSection time {
  color: var(--rw-text) !important;
  font-weight: 500 !important;
}


/* CLASS NAME */

#ClassesSection desc {
  color: var(--rw-text) !important;
  font-weight: 500 !important;
}


/* CAPACITY */

#ClassesSection stat {
  color: var(--rw-muted) !important;
  font-weight: 400 !important;
}


/* PAST / DISABLED */

#ClassesSection .disabled,
#ClassesSection .past,
#ClassesSection .inactive {
  color: #62666C !important;
  opacity: 0.84 !important;
}

#ClassesSection .disabled *,
#ClassesSection .past *,
#ClassesSection .inactive * {
  color: #62666C !important;
}


/* HOVER */

#ClassesSection
.ClassDate
> div
> div[id^="display-class-link-"]:hover {

  background-color: #E8F3FA !important;
  cursor: pointer;
}


/* =========================================
   BOOKING SEATS / ERGS
   ========================================= */


/* AVAILABLE */

#BookingSeatsTable a[data-spot] {
  background-color: var(--rw-white) !important;
  color: var(--rw-navy) !important;

  border:
    1.5px solid var(--rw-navy) !important;

  transition:
    background-color 0.18s ease,
    border-color 0.18s ease;
}


/* AVAILABLE HOVER */

#BookingSeatsTable a[data-spot]:hover {
  background-color: var(--rw-light-blue) !important;
  color: var(--rw-navy) !important;

  border-color: var(--rw-blue) !important;
}


/* TAKEN */

#BookingSeatsTable .disabled {
  background-color: var(--rw-mid-gray) !important;
  color: var(--rw-muted) !important;

  border:
    1.5px solid #B8B5AF !important;

  opacity: 0.88;
}


/* SELECTED */

#BookingSeatsTable .members_spot {
  background-color: var(--rw-blue) !important;
  color: var(--rw-navy) !important;

  border:
    1.5px solid var(--rw-navy) !important;

  opacity: 1 !important;

  font-weight: 600;
}


/* =========================================
   PUBLIC BOOKING CALENDAR
   ========================================= */

.fc-event-title,
.fc-title,
.schedule-class-name,
.class-name {
  color: var(--rw-navy) !important;
  font-weight: 600 !important;
}


/* Remove default gray hover where possible */

.class:hover,
.class:focus,
.class .description:hover {
  background-color: transparent !important;
}


/* Class title hover */

.class .description a:hover,
.class .description:hover a {
  background-color: #E9F3F9 !important;

  color: var(--rw-navy) !important;

  border-left:
    3px solid var(--rw-blue) !important;

  padding-left: 6px !important;
}


/* =========================================
   PUBLIC BOOKING POPOVERS
   ========================================= */

.popover {
  background-color: var(--rw-white) !important;

  border:
    1px solid var(--rw-border) !important;

  box-shadow:
    0 4px 14px rgba(0, 13, 46, 0.12) !important;
}

.popover-title {
  background-color: var(--rw-warm-mist) !important;
  color: var(--rw-navy) !important;

  border-bottom:
    1px solid var(--rw-border) !important;

  font-weight: 600 !important;
}

.popover-content {
  background-color: var(--rw-white) !important;
  color: var(--rw-text) !important;
}

.popover > .arrow:after {
  border-bottom-color: var(--rw-white) !important;
  border-top-color: var(--rw-white) !important;
}


/* =========================================
   CHALLENGE DETAIL HEADER
   ========================================= */

.panel-heading#question-1 {
  height: auto !important;
  min-height: 0 !important;

  overflow: visible !important;

  padding:
    10px 18px 16px !important;

  background-color:
    var(--rw-navy) !important;
}

.panel-heading#question-1 .page-title {
  color: var(--rw-light-blue) !important;

  padding: 0 !important;

  margin:
    0 0 14px 0 !important;
}

.panel-heading#question-1 h4,
.panel-heading#question-1 li {
  color: var(--rw-white) !important;
}


/* =========================================
   CHALLENGE LEADERBOARD
   ========================================= */

#challengeTable tbody tr:nth-child(1) {
  background-color: #FFD700 !important;
  color: var(--rw-navy) !important;
}

#challengeTable tbody tr:nth-child(2) {
  background-color: #C0C0C0 !important;
  color: var(--rw-navy) !important;
}

#challengeTable tbody tr:nth-child(3) {
  background-color: #C9AE5D !important;
  color: var(--rw-navy) !important;
}


/* =========================================
   PRICING CARDS
   ========================================= */


/* RECURRING MEMBERSHIPS */

.pricing-title-featured {
  background-color: var(--rw-light-blue) !important;
  color: var(--rw-navy) !important;
}

.pricing-title-featured *,
.pricing-title-featured .pricing-name,
.pricing-title-featured .pricing-classes,
.pricing-title-featured .pricing-classes-unlimited {
  color: var(--rw-navy) !important;
}


/* CLASS PACKS / DROP INS */

.pricing-title:not(.pricing-title-featured) {
  background-color: var(--rw-white) !important;
  color: var(--rw-navy) !important;
}

.pricing-title:not(.pricing-title-featured) * {
  color: var(--rw-navy) !important;
}


/* GENERIC UNLIMITED MEMBERSHIPS */

.pricing-classes-unlimited {
  font-size: 0 !important;
  color: transparent !important;
  line-height: 1 !important;
}

.pricing-classes-unlimited strong {
  display: none !important;
}

.pricing-classes-unlimited::before {
  content: "UNLIMITED";

  display: block;

  color: var(--rw-navy) !important;

  font-size: 30px !important;
  font-weight: 700 !important;

  letter-spacing: 0.03em;

  line-height: 1.05;

  margin-top: 12px;
}


/* GENERAL PRICING CARD POLISH */

.pricing-list {
  border-radius: 10px !important;

  overflow: hidden;

  border:
    1px solid var(--rw-border);

  box-shadow:
    0 3px 10px rgba(0, 13, 46, 0.08) !important;
}

.pricing-price {
  color: var(--rw-navy) !important;
}

.pricing-footer .btn:hover,
.pricing-footer .btn:focus {
  background-color: var(--rw-blue) !important;
  border-color: var(--rw-blue) !important;
  color: var(--rw-navy) !important;
}


/* =========================================
   LABOR DAY SPECIAL — FEATURED PROMO
   ========================================= */


/* WHOLE PROMO CARD */

.pricing-list:has(#pricing-title-18482) {
  background-color: var(--rw-navy) !important;

  border: none !important;

  border-radius: 10px !important;

  box-shadow:
    inset 0 0 0 3px var(--rw-blue),
    0 5px 16px rgba(0, 13, 46, 0.20) !important;
}


/* PROMO HEADER */

#pricing-title-18482 {
  background-color: var(--rw-navy) !important;
  color: var(--rw-white) !important;

  border-bottom:
    1px solid rgba(255, 255, 255, 0.16) !important;
}


/* PACKAGE NAME */

#pricing-name-18482 {
  font-size: 0 !important;
}

#pricing-name-18482::before {
  content: "Labor Day Special";

  display: inline-block;

  font-size: 18px !important;
  font-weight: 700 !important;

  line-height: 1.2;

  color: var(--rw-light-blue) !important;
}


/* INFO ICON */

#pricing-name-18482 .fa-info-circle {
  display: inline-block !important;

  font-size: 14px !important;

  color: var(--rw-light-blue) !important;

  margin-left: 6px;

  vertical-align: middle;
}


/* OFFER LABEL */

#pricing-title-18482
.pricing-classes-unlimited::before {

  content: "2 WEEKS UNLIMITED";

  font-size: 27px !important;
  font-weight: 700 !important;

  letter-spacing: 0.015em;

  line-height: 1.05;

  color: var(--rw-white) !important;
}


/* PROMO BODY */

.pricing-list:has(#pricing-title-18482)
.pricing-features,

.pricing-list:has(#pricing-title-18482)
.pricing-price,

.pricing-list:has(#pricing-title-18482)
.pricing-footer {

  background-color: var(--rw-navy) !important;
}


/* PRICE */

#pricing-price-18482 {
  color: var(--rw-white) !important;
  font-weight: 700 !important;
}


/* PURCHASE BUTTON */

.pricing-list:has(#pricing-title-18482)
.pricing-footer .btn {

  background-color: var(--rw-light-blue) !important;

  border-color: var(--rw-light-blue) !important;

  color: var(--rw-navy) !important;

  font-weight: 600 !important;
}


/* PURCHASE BUTTON HOVER */

.pricing-list:has(#pricing-title-18482)
.pricing-footer .btn:hover,

.pricing-list:has(#pricing-title-18482)
.pricing-footer .btn:focus {

  background-color: var(--rw-white) !important;

  border-color: var(--rw-white) !important;

  color: var(--rw-navy) !important;
}