/* Plantin MT Std – Italic */
@font-face {
  font-family: 'PlantinMTStd';
  font-style: italic;
  font-weight: normal;
  font-display: swap;
  src: url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/PlantinMTStd-Italic.otf') format('opentype');
}

/* Plantin MT Std – Regular */
@font-face {
  font-family: 'PlantinMTStd';
  font-style: normal;
  font-weight: normal;
  font-display: swap;
  src: url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/PlantinMTStd-Regular.otf') format('opentype');
}

/* The Balvenie Grotesque Web – Black */
@font-face {
  font-family: 'BalvenieGrotesqueWeb';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src:
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-black.woff2') format('woff2'),
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-black.woff') format('woff');
}

/* The Balvenie Grotesque Web – Bold */
@font-face {
  font-family: 'BalvenieGrotesqueWeb';
  font-style: normal;
  font-weight: bold;
  font-display: swap;
  src:
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-bold.woff2') format('woff2'),
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-bold.woff') format('woff');
}

/* The Balvenie Grotesque Web – Regular */
@font-face {
  font-family: 'BalvenieGrotesqueWeb';
  font-style: normal;
  font-weight: normal;
  font-display: swap;
  src:
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-regular.woff2') format('woff2'),
    url('https://external-stylesheets.s3.us-east-1.amazonaws.com/fonts/balvenie/thebalveniegrotesqueweb-regular.woff') format('woff');
}

/* Variables */
:root {
  --primary-color: #180c04;
  --secondary-color: #B86136;
  --tertiary-color: #8C8C77;
  --hover-color: #938977;
  --background-color: #f0ecd7;
  --font-primary: "PlantinMTStd", serif;
  --font-secondary: "BalvenieGrotesqueWeb", sans-serif;
  --font-button: "BalvenieGrotesqueWeb", serif;
  --font-tagline: "Tinos", serif;
  --font-ornament: "Tinos", serif;
  --transition: .1s;
  --transform: uppercase;
}

/* containers */
/* .tour-wrapper {
  background: var(--tertiary-color) !important;
}

.tour-wrapper a {
  border: 1px solid var(--tertiary-color) !important;
} */

.TourPage-About, .Plugins-TourPage-GlanceWrapper, .Plugins-TourPage-GlanceWrapper .TourPage-Glance .ui.grid .row:nth-child(2n), .ar-radio-item, .ar-multi_select-item, .grid.tour-page #booking-container {
  background: transparent !important;
}

#plugins-wrapper>div.ui.equal.height.grid.stackable.tour-page {
    margin-top: 14px;
}

/* dividers */
/* .CheckoutDesktopPage .DiscountCodeContainer, .CheckoutDesktopPage .ColumnContainer .CheckoutPayment, .CheckoutQuestion, .CheckoutDesktopPage .ColumnContainer .CheckoutPersonal {
    border-bottom: 1px solid var(--primary-color);
}

.MessageGuideContainer {
    border-bottom: 1px solid var(--primary-color);
    border-top: 1px solid var(--primary-color);
}

.CheckoutSummary-ContentBox {
  border-bottom: 1px solid var(--primary-color);
} */


/* Typography */
body {
  color: var(--primary-color) !important;
  font-family: var(--font-primary) !important;
  font-weight: 400;
  font-optical-sizing: auto;
  font-style: normal;
  background: var(--background-color) !important;
}

.TourPage-About-description a {
  color: var(--primary-color) !important;
  text-decoration: underline !important;
}

.TourPage-About-description a:hover {
  color: var(--hover-color) !important;
}

h1, h2, h3, h4, h5, h6, .infoPanel .tourName {
  font-family: var(--font-secondary) !important;
  font-weight: 700 !important;
  color: var(--primary-color) !important;
  font-optical-sizing: auto;
  font-style: normal;
}

.tour-title {
  font-size: 26px !important;
  line-height: 1 !important;
  color: var(--primary-color) !important;
  text-transform: var(--transform) !important;
}

.css-1gk8mqy svg, .css-etf6eh svg {
    fill: var(--primary-color) !important;
}

.TourPage-About-title {
  font-family: var(--font-secondary) !important;
  color: var(--primary-color) !important;
  font-size: 26px !important;
  line-height: 1 !important;
  text-transform: var(--transform) !important;
}

.tour-tagline {
  font-family: var(--font-primary) !important;
  color: var(--primary-color) !important;
  font-weight: 400 !important;
  font-size: 21px;
  font-style: italic;
  text-transform: var(--transform) !important;
}

.TourPage-About-tagline {
  font-family: var(--font-primary) !important;
  color: var(--primary-color) !important;
  font-weight: 400 !important;
  font-size: 21px !important;
  font-style: italic;
  text-transform: var(--transform) !important;
}

.TourPage-About-description, .TourPage-BookingDetails,
.TourPage-BookingDetails .BookingRequest-form .ui.dropdown .text.default, .CheckoutSummary-ContentBox table td, .css-lkdkks {
  color: var(--primary-color) !important;
  font-weight: 400 !important;
}

.tour-description, .tour-dates-available, .book-tour-details {
  color: var(--primary-color) !important;
}

/* .tour-description {
  font-size: 17px;
  line-height: 1.4;
} */

/* .TourPage-About-description p {
  font-size: 18px;
  line-height: 1.4;
} */

/* .ui.grid > .row > .column {
    font-size: 1.2rem;
} */

/* .filter-buttons {
  font-weight: 600 !important;
} */

/* onsite form fieds for dark maode */
/* .Plugins-TourPage-GlanceWrapper {
  color: var(--primary-color) !important;
}

.Plugins-TourPage-GlanceWrapper .TourPage-Glance .ui.grid .row:nth-child(2n) {
  background-color: transparent !important;
}

.ContactModal-header {
  color: var(--secondary-color) !important;
} */

/* Buttons */
.button, .ui.anygreen.button, .TourPage-ContactGuide-submit-button.ui.large.button,
#request-booking-mobile .ui.button, .ConfirmationContainer .ButtonContainer .ui.button,
.CheckoutNavigationController button.BookingRequest-submit, [data-testid="update-email-btn"],
.rescheduleModal .modalActions .submitButton, .contactModal .modalActions .submitButton, .ConfirmationDefault .GoGAdditionalInfoButton, [data-testid="apply-filter"], .multi-select-wrapper .multi-select-done-wrapper .ui.multi-select-done {
  font-family: var(--font-button) !important;
  font-weight: 700 !important;
  color: var(--background-color) !important;
  background: var(--primary-color) !important;
  border: 1px solid var(--primary-color) !important;
  box-shadow:
    0 2px 3px rgba(0, 0, 0, 0.15), /* soft inner shadow */
    0 8px 10px rgba(0, 0, 0, 0.08); /* diffuse drop shadow */
  border-radius: 4px;
  transition: var(--transition);
  font-style: normal;
}

.ConfirmationContainer .ButtonContainer .ui.button {
  height: 56px;
}

.button:hover, .ui.anygreen.button:hover, .TourPage-ContactGuide-submit-button.ui.large.button:hover,
.ConfirmationContainer .ButtonContainer .ui.button:hover, .CheckoutNavigationController button.BookingRequest-submit:hover, .ConfirmationDefault .GoGAdditionalInfoButton:hover, .rescheduleModal .modalActions .submitButton:hover, .contactModal .modalActions .submitButton:hover, [data-testid="apply-filter"]:hover, .multi-select-wrapper .multi-select-done-wrapper .ui.multi-select-done:hover {
  background-color: transparent !important;
  color: var(--primary-color) !important;
}

/* Secondary Buttons */
.ui.basic.button, .DiscountCodeContainer .DiscountCode-Input .ui.button,
[data-testid="dont-cancel-btn"], .ModifyBooking .ModifyBooking-Column.left .actionButtons .rescheduleButton,
.ModifyBooking .ModifyBooking-Column.left .actionButtons .contactButton,
.TourPage-ContactGuide-link.ui.basic.button {
  font-family: var(--font-button) !important;
  font-weight: 700 !important;
  color: var(--primary-color) !important;
  background: transparent !important;
  border: 1px solid var(--primary-color) !important;
  border-radius: 4px;
  transition: var(--transition);
  font-style: normal;
}

.ui.basic.button:hover, .DiscountCodeContainer .DiscountCode-Input .ui.button:hover, .ModifyBooking .ModifyBooking-Column.left .actionButtons .rescheduleButton:hover {
  background: var(--primary-color) !important;
  color: var(--background-color) !important;
}

.DiscountCodeContainer .DiscountCode-Input .ui.button {
  height: 47px;
  padding-top: 11px;
}

.TourPage-ContactGuide-link.ui.basic.button .ContactGuide-link-text, .TourPage-ContactGuide-link.ui.basic.button .icon.anyfont {
    height: 18px;
    font-size: 16px;
    color: var(--primary-color) !important;
}


.TourPage-ContactGuide-link.ui.basic.button:hover,
.TourPage-ContactGuide-link.ui.basic.button:hover .ContactGuide-link-text,
.TourPage-ContactGuide-link.ui.basic.button:hover .icon.anyfont {
    color: var(--background-color) !important;
    background: var(--primary-color) !important;
}

.css-3ztlt5 {
    border-style: solid !important;
    border-radius: 0 !important;
}

/* Additional Styles */

/*Hide "more" link on Experience details, display full details on desktop and mobile*/
.TourPage-About-description {/*Description section- remove collapse*/
  height: auto !important;
}

.TourPage-About-description:after, .TourPage-About-description-more {/*Description section- remove collapse and hides more button*/
  display: none !important;
}

/* .TourPage-About, .Plugins-TourPage-GlanceWrapper, .grid.tour-page #booking-container {
  background: transparent;
}

.ConfirmationDefault h1 .titleRow {
  font-weight: 400 !important;
  line-height: 1 !important;
} */

/* form fields for dark mode */
.multi-select-wrapper .ui.multi-select-dropdown, .multi-select-wrapper .ui.multi-select-options, .TourPage-BookingDetails .BookingRequest-form .ui.dropdown, #payment-main > div > div > div > div.ColumnContainer > div.ComponentContainer.RightColumn > div > div.CheckoutSummary > div.CheckoutSummary-Subtotal-PriceBreakdown-Deposit > div > div > div.Toggleable-Handler > table > tbody > tr > td.value > button, .CheckoutSummary-Container {
  background: transparent !important;
}

.CheckoutSummary, #payment-main > div > div > div > div.ColumnContainer > div.ComponentContainer.LeftColumn > div:nth-child(3) > div.CheckoutPayment.CheckoutSection > div:nth-child(2) > form > div > div.css-1lh4im4.exbukip1 > div.ui.input.t-Default.stripe-element.css-kgo85i.exbukip0 > label, #payment-main > div > div > div > div.ColumnContainer > div.ComponentContainer.LeftColumn > div:nth-child(3) > div.CheckoutPayment.CheckoutSection > div:nth-child(2) > form > div > div.css-1lh4im4.exbukip1 > div.ui.input.t-Default.stripe-element.css-gb4ymw.exbukip0 > label {
  color: var(--primary-color) !important;
}

.Checkbox .Checkbox-label, .ar-radio-wrapper .question-subtext {
  color: var(--primary-color) !important;
}

.Checkbox .Checkbox-label .popup-link a, .contains-brand-link a {
    text-decoration: underline !important;
}


@media (max-width: 600px) {
  .book-tour-btn {
    width: 250px;
    padding: 13px 0;
    /* margin-top: 32px; */
    height: 50px;
    font-size: 16px;
  }
  .CheckoutNavigationController button.BookingRequest-submit {
    height: 50px;
  }
  .MobileCheckout-CoverPhoto span.text .title .name {
    color: #fff !important;
  }
}