/* ==========================================================================
   Booking Engine - Custom Color Scheme for Eagle Ridge Resort & Spa
   ========================================================================== */

/* --------------------------------------------------------------------------
   Color Palette - Customized to match eagleridge.com 🎨
   -------------------------------------------------------------------------- */

:root {
  --primary-color: #f7941e; /* Gold from the "Book Now" button */
  --secondary-color: #650942; /* Deep Magenta from headings and links */
  --light-bg-color: #ffffff; /* White background for content areas */
  --dark-text-color: #4a4a4a; /* Dark grey for body text */
  --light-text-color: #ffffff; /* Light text for dark backgrounds */
  --border-color: #e0e0e0; /* Light grey for subtle borders */
  --accent-color: #650942; /* Deep Magenta for highlights */
  --warning-bg-color: #faf2cc; /* Yellow from the "Hot Deals" banner */
  --warning-text-color: #333333; /* Dark text for warnings */
}

/* --------------------------------------------------------------------------
   General Styles
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.btn-primary {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: var(--light-text-color) !important;
  border-radius: 2px !important; /* Slightly squared corners */
  text-transform: uppercase !important; /* Match "Book Now" button style */
  font-weight: bold !important;
}

.btn-primary:hover {
  opacity: 0.9 !important;
  background-color: var(--primary-color) !important;
  color: var(--light-text-color) !important;
}
.btn-info {
  background-color: var(--secondary-color) !important;
  border-color: var(--secondary-color) !important;
  color: var(--light-text-color) !important;
  border-radius: 2px !important; /* Slightly squared corners */
  text-transform: uppercase !important; /* Match "Book Now" button style */
  font-weight: bold !important;
}

.btn-info:hover {
  opacity: 0.9 !important;
  background-color: var(--secondary-color) !important;
  color: var(--light-text-color) !important;
}

/* --------------------------------------------------------------------------
   Search Form
   -------------------------------------------------------------------------- */

#search-form {
  background-color: var(--light-bg-color) !important;
  border-color: #650942;
  border-width: 7px
}

#search-form .form-control {
  border-color: var(--border-color) !important;
}

#search-form-warning-message {
  background-color: var(--warning-bg-color) !important;
  color: var(--warning-text-color) !important;
  border-color: var(--warning-bg-color) !important;
}

/* --------------------------------------------------------------------------
   Room Results & Unit Cards
   -------------------------------------------------------------------------- */

.gd-room-results-grid-unit-main.card {
  border: 1px solid var(--border-color) !important;
  background-color: var(--light-text-color) !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important; /* Subtle shadow for depth */
}

.card-title,
.grid-unit-header-title {
  color: var(--dark-text-color) !important;
  font-weight: bold !important;
  text-transform: none!important;
  font-style: normal!important
}

.grid-unit-image-overlay {
  background-color: rgba(0, 0, 0, 0.5) !important;
  color: var(--light-text-color) !important;
}

/* --------------------------------------------------------------------------
   Toolbar & Action Bar
   -------------------------------------------------------------------------- */

.toolbar-row {
  background-color: var(--light-bg-color) !important;
  color: var(--dark-text-color) !important;
  border-bottom: 2px solid var(--secondary-color) !important; /* Magenta accent border */
}

.toolbar-title {
  color: var(--secondary-color) !important; /* Use magenta for the main title */
  font-weight: bold !important;
  text-transform: none!important;
  font-style: normal!important
}

.gd-action-bar-item-caption {
  color: var(--dark-text-color) !important;
}

.text-info {
  color: var(--accent-color) !important;
}

/* --------------------------------------------------------------------------
   Icons & Toggles
   -------------------------------------------------------------------------- */



.fa-heart-o:hover,
.fa-regular.fa-right-left:hover {
  color: var(--primary-color) !important;
}

/* --------------------------------------------------------------------------
   Modals
   -------------------------------------------------------------------------- */

.modal-dialog {
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2) !important;
}

.modal-header {
    background-color: var(--secondary-color) !important; /* Magenta for modal headers */
    color: var(--light-text-color) !important;
}

/* others*/
#gd-main-content, .col-md-12 {padding-left: 0px!important; padding-right: 0px!important;}
.gd-main-container .container-fluid {background-color:white!important}
.date-picker-content .form-group:first-child {
    padding-left: 0px !important;
}
.grid-unit-details .col-md-12.ng-star-inserted {
    padding-left: 15px !important;
    padding-right: 15px !important;
}
body.modal-open #header,
body.modal-open #nav, body.modal-open .rex-banner {
	display: none;
}
.gd-room-results .gd-room-results-grid-unit .grid-unit-footer .grid-unit-rate-label {
  color: var(--secondary-color)!important;
}
guestdesk a {
  color: var(--secondary-color)!important;
}