/* JESUS FILM PROJECT - TOGETHER FOR THE NATIONS CRUISE
   Mediterranean fundraiser cruise theme.
   Palette inspired by new reference artwork:
   warm sand / peach, Mediterranean sea teal, soft ivory, charcoal gray,
   terracotta, muted lavender dusk, and restrained donor-event styling.
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --jfp-ivory: #fffaf3;
  --jfp-white: #ffffff;
  --jfp-sand: #f6c98d;
  --jfp-sand-soft: #fde4bd;
  --jfp-sand-pale: #fff3df;
  --jfp-sea: #3f7f7d;
  --jfp-sea-dark: #245d62;
  --jfp-sea-soft: rgba(63,127,125,.12);
  --jfp-terracotta: #b95f3f;
  --jfp-terracotta-dark: #934832;
  --jfp-dusk: #7f6f86;
  --jfp-charcoal: #4a4a4a;
  --jfp-ink: #3f3f3f;
  --jfp-muted: #6d6a66;
  --jfp-border: rgba(74,74,74,.14);
  --jfp-shadow: rgba(74,74,74,.10);
}

html,
body {
  background:
    radial-gradient(circle at 18% 8%, rgba(246,201,141,.20), transparent 34%),
    radial-gradient(circle at 88% 22%, rgba(63,127,125,.10), transparent 28%),
    linear-gradient(180deg, var(--jfp-ivory) 0%, #fffdf8 100%);
  color: var(--jfp-ink);
  font-family: "Inter", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
}

.container,
#content-wrapper {
  background: rgba(255,255,255,.96) !important;
  color: var(--jfp-ink);
}

.headerRezbanner {
  background-color: var(--jfp-ivory);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  border-bottom: 5px solid var(--jfp-sand);
}

#main-header { background: var(--jfp-ivory); }

.navbar-inverse,
.navbar-inverse .container,
.dropdown-menu,
.navbar-inverse .navbar-nav > li > a,
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a,
.navbar-inverse .navbar-brand {
  background: var(--jfp-white) !important;
  color: var(--jfp-charcoal) !important;
  font-family: "Inter", Arial, sans-serif;
  font-weight: 700;
}

.navbar-inverse {
  border-top: 4px solid var(--jfp-sand);
  border-bottom: 1px solid var(--jfp-border);
  box-shadow: 0 4px 18px rgba(74,74,74,.08);
}

.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: var(--jfp-sand-pale) !important;
  color: var(--jfp-sea-dark) !important;
}

h1, h2, h3, h4, h5, h6,
li#tripname,
.cat-header h3,
.rez-content h2,
.rez-content h3 {
  color: var(--jfp-charcoal) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-weight: 600;
  letter-spacing: .015em;
}

h1, li#tripname { font-size: 3.1rem; line-height: 1.08; }
h2, .rez-content h2 { font-size: 2.3rem; }
h3, .rez-content h3, .cat-header h3 { font-size: 1.75rem; }

body, p, ul, li, td, label, input, select, textarea, button, a.btn {
  font-family: "Inter", Arial, sans-serif;
}

.rez-content h2,
.rez-content h3 {
  border-bottom: 2px solid var(--jfp-sand);
  padding-bottom: 8px;
}

hr,
.rez-content hr {
  border-top: 1px solid var(--jfp-border);
}

.rez-progress-bar {
  border-bottom: 3px solid var(--jfp-sand);
  padding-bottom: 8px;
}

.rez-progress-bar li {
  color: var(--jfp-charcoal);
  font-weight: 700;
}

.rez-progress-bar li:after {
  content: " ◆";
  color: var(--jfp-terracotta);
  font-size: 10px;
  margin-left: 8px;
  margin-right: 8px;
}

#rez-summary-list,
.account-status,
.rez-start-over {
  color: var(--jfp-charcoal);
}

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

.rez-summary,
.panel,
.card,
.well,
.modal-content {
  background: var(--jfp-white) !important;
  border: 1px solid var(--jfp-border);
  border-radius: 14px;
  box-shadow: 0 10px 26px var(--jfp-shadow);
}

.jfp-donor-note,
.notice,
.alert-info {
  background: var(--jfp-sand-pale);
  border-left: 5px solid var(--jfp-sand);
  color: var(--jfp-charcoal);
}

.jfp-donor-note *,
.notice *,
.alert-info * {
  color: var(--jfp-charcoal) !important;
}

a {
  color: var(--jfp-sea-dark);
  font-weight: 700;
  text-decoration: none;
}

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

a.btn,
button,
input[type="submit"],
input[type="button"],
#account-status-link {
  background: linear-gradient(180deg, var(--jfp-sea) 0%, var(--jfp-sea-dark) 100%);
  border: 1px solid var(--jfp-sea-dark);
  border-radius: 999px;
  color: #ffffff !important;
  font-family: "Inter", Arial, sans-serif;
  font-weight: 700;
  padding: 11px 24px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 8px 18px rgba(36,93,98,.18);
  text-decoration: none;
  letter-spacing: .01em;
  display: inline-block;
  width: auto;
}

a.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
#account-status-link:hover {
  background: linear-gradient(180deg, var(--jfp-terracotta) 0%, var(--jfp-terracotta-dark) 100%);
  border-color: var(--jfp-terracotta-dark);
  color: #ffffff !important;
  transform: translateY(-1px);
}

.party-count-btn {
  background: linear-gradient(180deg, var(--jfp-sea) 0%, var(--jfp-sea-dark) 100%) !important;
  border: 1px solid var(--jfp-sea-dark) !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  font-weight: 700;
  min-width: 145px;
  padding: 11px 24px !important;
  text-align: center;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 8px 18px rgba(36,93,98,.18) !important;
}

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

.account-status,
.rez-start-over,
#account-status,
#account-status-wrapper,
.rez-account-status,
.reservation-login,
.account-actions,
.rez-actions,
#content-wrapper .rez-actions {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 18px 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  text-align: left !important;
}

#account-status-link,
a#account-status-link,
.account-status #account-status-link,
.rez-account-status #account-status-link,
.reservation-login #account-status-link,
.account-status a.btn,
.rez-account-status a.btn,
.reservation-login a.btn,
.rez-start-over a.btn {
  display: inline-block !important;
  width: auto !important;
  min-width: 145px !important;
  max-width: 260px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 11px 24px !important;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  text-align: center !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, var(--jfp-sea) 0%, var(--jfp-sea-dark) 100%) !important;
  border: 1px solid var(--jfp-sea-dark) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 8px 18px rgba(36,93,98,.18) !important;
}

label,
.control-label,
legend {
  color: var(--jfp-charcoal);
  font-weight: 700;
}

legend {
  color: var(--jfp-sea-dark);
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 1.6rem;
}

input,
select,
textarea {
  background: var(--jfp-white);
  color: var(--jfp-ink);
  border: 1px solid rgba(74,74,74,.20);
  border-radius: 8px;
  padding: 9px 11px;
  font-family: "Inter", Arial, sans-serif;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--jfp-sea);
  box-shadow: 0 0 0 3px rgba(63,127,125,.14);
  outline: none;
}

table {
  background: var(--jfp-white);
  border-collapse: collapse;
  border: 1px solid var(--jfp-border);
  box-shadow: 0 8px 22px rgba(74,74,74,.08);
}

th {
  background: var(--jfp-sea-dark);
  color: #ffffff;
  font-weight: 800;
  padding: 12px;
}

td {
  color: var(--jfp-ink);
  padding: 12px;
  border-bottom: 1px solid rgba(74,74,74,.08);
}

tr:nth-child(even) td {
  background: var(--jfp-sand-pale);
}

tr:hover td {
  background: var(--jfp-sea-soft);
}

p,
ul,
li {
  color: var(--jfp-ink);
}

.price,
.total,
.amount,
.balance {
  color: var(--jfp-terracotta-dark);
  font-weight: 800;
}

#main-footer {
  background: var(--jfp-charcoal);
  color: #ffffff;
  border-top: 5px solid var(--jfp-sand);
}

#main-footer,
#main-footer span,
#main-footer a {
  color: #ffffff !important;
}

.copyrightStyle {
  background: var(--jfp-charcoal);
  color: #ffffff;
}

#rezmagic-contact {
  display: none;
}

@media (max-width: 767px) {
  html,
  body {
    font-size: 15px;
    background: var(--jfp-ivory);
  }

  .container,
  #content-wrapper {
    background: var(--jfp-white) !important;
  }

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

  h2 {
    font-size: 1.75rem;
  }

  h3,
  .cat-header h3 {
    font-size: 1.35rem;
  }

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

  .party-count-btn,
  #account-status-link {
    min-width: 130px !important;
  }

  .rez-summary,
  .panel,
  .card,
  .well,
  .modal-content {
    border-radius: 10px;
    box-shadow: 0 5px 14px rgba(74,74,74,.08);
  }
}


/* =========================================================
   JESUS FILM V2 PRICING REFINEMENT
   Make cabin price values the same size and weight as
   "Double Occupancy Standard Price (Per Person)".
   ========================================================= */

/* General price/value selectors used across RezMagic templates */
.price,
.total,
.amount,
.balance,
.rate,
.rate-price,
.price-value,
.priceValue,
.priceAmount,
.price-amount,
.cabin-price,
.room-price,
.category-price,
.stateroom-price {
  font-size: 1.15em !important;
  font-weight: 800 !important;
  color: var(--jfp-charcoal) !important;
  font-family: "Inter", Arial, sans-serif !important;
  line-height: 1.35 !important;
  vertical-align: baseline !important;
}

/* Entire pricing sentence/row */
.price-row,
.cabin-price-row,
.category-price-row,
.stateroom-price-row,
.rate-row {
  font-size: 1.15em !important;
  font-weight: 800 !important;
  color: var(--jfp-charcoal) !important;
  font-family: "Inter", Arial, sans-serif !important;
  line-height: 1.35 !important;
}

/* If the dollar amount is wrapped in span/small/sup, prevent shrinking */
.price span,
.price small,
.price sup,
.total span,
.total small,
.total sup,
.amount span,
.amount small,
.amount sup,
.balance span,
.balance small,
.balance sup,
.rate span,
.rate small,
.rate sup,
.rate-price span,
.rate-price small,
.rate-price sup,
.price-value span,
.price-value small,
.price-value sup,
.priceAmount span,
.priceAmount small,
.priceAmount sup,
.price-amount span,
.price-amount small,
.price-amount sup,
.cabin-price span,
.cabin-price small,
.cabin-price sup,
.room-price span,
.room-price small,
.room-price sup,
.category-price span,
.category-price small,
.category-price sup,
.stateroom-price span,
.stateroom-price small,
.stateroom-price sup {
  font-size: inherit !important;
  font-weight: inherit !important;
  color: inherit !important;
  vertical-align: baseline !important;
  line-height: inherit !important;
}

/* Common RezMagic content pattern: bold price label followed by a smaller value */
.rez-content strong + span,
.rez-content b + span,
.cat-description strong + span,
.cat-description b + span,
.category-description strong + span,
.category-description b + span {
  font-size: 1em !important;
  font-weight: 800 !important;
  color: var(--jfp-charcoal) !important;
  vertical-align: baseline !important;
}

/* Slightly improve spacing and divider warmth between categories */
.cat-header h3,
.rez-content h3 {
  border-bottom: 3px solid var(--jfp-sand) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
}

.category,
.category-item,
.stateroom-category,
.accommodation-category {
  padding-top: 18px;
  padding-bottom: 24px;
  border-bottom: 1px dashed rgba(74,74,74,.22);
}


/* =========================================================
   JESUS FILM V3 CAT-PRICE FIX
   The category price is rendered as:
   <h6 class="cat-price"><label><b>...</b></label> $5,733.25</h6>
   This forces the price text node to inherit the same size/weight
   as the label by styling the entire h6.
   ========================================================= */

.cat-price {
  font-size: 1.15em !important;
  font-weight: 800 !important;
  color: var(--jfp-charcoal) !important;
  font-family: "Inter", Arial, sans-serif !important;
  line-height: 1.35 !important;
  margin-top: 10px !important;
  margin-bottom: 18px !important;
}

.cat-price label,
.cat-price b,
.cat-price strong,
.cat-price span,
.cat-price small,
.cat-price sup {
  font-size: inherit !important;
  font-weight: inherit !important;
  color: inherit !important;
  font-family: inherit !important;
  line-height: inherit !important;
  vertical-align: baseline !important;
}

.cat-price label {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Mobile adjustment */
@media (max-width: 767px) {
  .cat-price {
    font-size: 1.05em !important;
  }
}