/* SWEATFEST PUNTA CANA 2027 - RWD CSS
   Premium SweatFest Punta Cana event theme.
   Inspired by supplied artwork:
   hip-hop, R&B, Afrobeats, Caribbean music, nightlife, celebration, and luxury cruise energy.

   Palette:
   purple, maroon, silver, white, navy.
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=Oswald:wght@500;600;700&display=swap');

:root {
  --bc-black: #001f4b;
  --bc-charcoal: #00152f;
  --bc-deep-purple: #4b008c;
  --bc-purple: #6d00c9;
  --bc-magenta: #a6000e;
  --bc-orange: #a6000e;
  --bc-orange-dark: #78000a;
  --bc-gold: #d0cfd2;
  --bc-cream: #f4f3f5;
  --bc-white: #ffffff;
  --bc-ink: #001f4b;
  --bc-muted: #6f6d73;
  --bc-border: rgba(208,207,210,.42);
}

/* Base */
body {
  background:
    radial-gradient(circle at 18% 0%, rgba(109,0,201,.30), transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(166,0,14,.28), transparent 34%),
    linear-gradient(135deg, #001f4b 0%, #4b008c 42%, #00152f 100%);
  color: var(--bc-ink);
  font-family: "Montserrat", Arial, sans-serif;
  line-height: 1.6;
}

/* Main reservation content */
.container,
#content-wrapper {
  background: rgba(255,255,255,.96);
  color: var(--bc-ink);
  box-shadow: 0 20px 60px rgba(0,31,75,.30);
}

/* Header image area */
.headerRezbanner {
  background-image: url("images/black-cruise-header.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-color: var(--bc-black);
  border-bottom: 4px solid var(--bc-orange);
}

#main-header {
  background: var(--bc-black);
}

/* Navigation */
.dropdown-menu,
.navbar-inverse,
.navbar-inverse .container,
.navbar-inverse .navbar-nav > li > a,
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a,
.navbar-inverse .navbar-brand {
  background-color: var(--bc-black);
  color: var(--bc-white) !important;
  font-family: "Montserrat", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.navbar-inverse {
  border-top: 4px solid var(--bc-orange);
  border-bottom: 1px solid rgba(208,207,210,.28);
  box-shadow: 0 8px 24px rgba(0,31,75,.24);
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus,
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover {
  background-color: rgba(109,0,201,.18);
  color: var(--bc-gold) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
li#tripname {
  color: var(--bc-black) !important;
  font-family: "Oswald", "Montserrat", Arial, sans-serif !important;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}

h1,
li#tripname {
  font-size: 3rem;
  line-height: 1.08;
}

/* Category / section headers */
.cat-header h3,
.rez-content h2,
.rez-content h3 {
  color: var(--bc-deep-purple) !important;
}

.rez-content h2,
.rez-content h3 {
  border-bottom: 3px solid rgba(166,0,14,.28);
  padding-bottom: 8px;
}

/* Progress bar */
.rez-progress-bar {
  border-bottom: 3px solid var(--bc-orange);
  padding-bottom: 8px;
}

.rez-progress-bar li {
  color: var(--bc-black);
  font-weight: 800;
}

.rez-progress-bar li:after {
  content: '\00a0\00a0 \25b6';
  color: var(--bc-magenta);
  font-size: 10px;
}

/* Summary / trip info */
#rez-summary-list,
.account-status,
.rez-start-over {
  color: var(--bc-black);
  text-align: center;
}

li#tripvenue,
li#tripdates {
  color: var(--bc-muted) !important;
}

/* Links */
a {
  color: var(--bc-purple);
  font-weight: 700;
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--bc-orange);
  text-decoration: none;
}

/* Primary buttons */
a.btn,
button,
input[type="submit"],
input[type="button"],
.party-count-btn,
#account-status-link {
  background: linear-gradient(180deg, var(--bc-orange) 0%, var(--bc-orange-dark) 100%);
  border: 1px solid var(--bc-orange-dark);
  border-radius: 999px;
  color: var(--bc-white) !important;
  font-family: "Montserrat", Arial, sans-serif;
  font-weight: 900;
  padding: 11px 24px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 8px 18px rgba(166,0,14,.24);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .04em;
}

a.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.party-count-btn:hover,
#account-status-link:hover {
  background: linear-gradient(180deg, #c31928 0%, var(--bc-orange) 100%);
  color: var(--bc-white) !important;
  transform: translateY(-1px);
}

/* Guest count / selection buttons */
.party-count-btn {
  background: linear-gradient(180deg, var(--bc-purple) 0%, var(--bc-deep-purple) 100%) !important;
  border-color: var(--bc-deep-purple) !important;
  box-shadow: 0 8px 18px rgba(109,0,201,.24) !important;
}

.party-count-btn:hover {
  background: linear-gradient(180deg, var(--bc-magenta) 0%, var(--bc-purple) 100%) !important;
}

/* Tables / pricing */
table {
  background: var(--bc-white);
  border-collapse: collapse;
  border: 1px solid var(--bc-border);
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
}

th {
  background: linear-gradient(180deg, var(--bc-deep-purple), var(--bc-black));
  color: var(--bc-white);
  font-weight: 900;
  padding: 12px;
  text-transform: uppercase;
}

td {
  color: var(--bc-ink);
  padding: 12px;
  border-bottom: 1px solid rgba(0,31,75,.10);
}

tr:nth-child(even) td {
  background: rgba(208,207,210,.18);
}

tr:hover td {
  background: rgba(109,0,201,.10);
}

/* Cards / panels */
.panel,
.card,
.well,
.modal-content,
.rez-summary {
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(109,0,201,.18);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

/* Forms */
label,
.control-label,
legend {
  color: var(--bc-black);
  font-weight: 800;
}

legend {
  color: var(--bc-deep-purple);
  text-transform: uppercase;
  letter-spacing: .03em;
}

input,
select,
textarea {
  background: var(--bc-white);
  color: var(--bc-ink);
  border: 1px solid rgba(0,31,75,.25);
  border-radius: 8px;
  padding: 9px 11px;
  font-family: "Montserrat", Arial, sans-serif;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--bc-magenta);
  box-shadow: 0 0 0 3px rgba(109,0,201,.16);
  outline: none;
}

/* Text */
p,
ul,
li {
  color: var(--bc-ink);
}

hr,
.rez-content hr {
  border-top: 1px solid rgba(0,31,75,.18);
}

/* Price / total emphasis */
.price,
.total,
.amount,
.balance {
  color: var(--bc-orange-dark);
  font-weight: 900;
}

/* Optional culture/music accent block */
.black-cruise-accent,
.notice,
.alert-info {
  background: linear-gradient(135deg, rgba(0,31,75,.95), rgba(109,0,201,.88));
  color: var(--bc-white);
  border-left: 5px solid var(--bc-gold);
}

.black-cruise-accent *,
.notice *,
.alert-info * {
  color: var(--bc-white) !important;
}

/* Footer */
#main-footer {
  background: var(--bc-black);
  color: var(--bc-white);
  border-top: 4px solid var(--bc-orange);
}

#main-footer,
#main-footer span,
#main-footer a {
  color: var(--bc-white) !important;
}

.copyrightStyle {
  background: var(--bc-black);
  color: var(--bc-white);
}

/* Hide RezMagic contact */
#rezmagic-contact {
  display: none;
}

/* Mobile optimization */
@media (max-width: 767px) {
  body {
    background:
      linear-gradient(180deg, var(--bc-black) 0%, var(--bc-deep-purple) 100%);
  }

  .container,
  #content-wrapper {
    background: rgba(255,255,255,.97);
    box-shadow: none;
  }

  h1,
  li#tripname {
    font-size: 2.15rem;
    line-height: 1.12;
  }

  h2 {
    font-size: 1.65rem;
  }

  a.btn,
  button,
  input[type="submit"],
  input[type="button"],
  .party-count-btn,
  #account-status-link {
    display: inline-block;
    margin: 6px 4px;
    padding: 10px 16px;
    font-size: 14px;
    white-space: normal;
  }

  .panel,
  .card,
  .well,
  .modal-content,
  .rez-summary {
    border-radius: 9px;
    box-shadow: 0 6px 16px rgba(0,0,0,.10);
  }

  table,
  thead,
  tbody,
  th,
  td,
  tr {
    font-size: 13px;
  }

  td,
  th {
    padding: 9px;
  }
}

/* SWEATFEST V2 PALETTE
   Purple #6d00c9 | Maroon #a6000e | Silver #d0cfd2
   White #ffffff | Navy #001f4b
*/


/* =========================================================
   SweatV3 - Resize "Your Reservations" button
   ========================================================= */

#account-status-link{
    display:inline-block !important;
    width:auto !important;
}

#account-status-link .btn.account-status,
#account-status-link a.btn,
#account-status-link a.account-status{
    display:inline-block !important;
    width:auto !important;
    min-width:260px !important;
    max-width:340px !important;
    padding:16px 34px !important;
}



/* =========================================================
   SweatV4 - Your Reservations wrapper + button refinement
   - Removes the large full-width wrapper/background
   - Keeps only the compact button visible
   - Matches the purple SweatFest guest buttons
   ========================================================= */

#account-status-link,
.rez-start,
div#account-status-link.rez-start {
    display: inline-block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 22px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
    overflow: visible !important;
}

/* Compact SweatFest purple button */
#account-status-link a.btn,
#account-status-link .btn.account-status,
#account-status-link a.account-status,
div#account-status-link.rez-start > a.btn.account-status {
    display: inline-block !important;
    width: auto !important;
    min-width: 300px !important;
    max-width: 320px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 16px 34px !important;
    background: linear-gradient(180deg, #6d00c9 0%, #4b008c 100%) !important;
    background-image: linear-gradient(180deg, #6d00c9 0%, #4b008c 100%) !important;
    border: 1px solid #4b008c !important;
    border-radius: 999px !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.22),
        0 8px 18px rgba(109,0,201,.24) !important;
    color: #ffffff !important;
    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
    letter-spacing: .04em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}

/* Hover state */
#account-status-link a.btn:hover,
#account-status-link .btn.account-status:hover,
#account-status-link a.account-status:hover,
div#account-status-link.rez-start > a.btn.account-status:hover {
    background: linear-gradient(180deg, #8a2ddb 0%, #6d00c9 100%) !important;
    border-color: #6d00c9 !important;
    color: #ffffff !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.24),
        0 10px 22px rgba(109,0,201,.30) !important;
    transform: translateY(-1px);
}

/* Mobile */
@media (max-width: 767px) {
    #account-status-link,
    .rez-start,
    div#account-status-link.rez-start {
        display: block !important;
        width: 100% !important;
        margin: 18px 0 !important;
    }

    #account-status-link a.btn,
    #account-status-link .btn.account-status,
    #account-status-link a.account-status,
    div#account-status-link.rez-start > a.btn.account-status {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
    }
}