/* Custom Color Palette Override
 * Colors: #8ecae6 (Sky Blue) // #219ebc (Ocean Blue) // #023047 (Dark Blue) 
 *         #ffb703 (Golden Yellow) // #fb8500 (Orange)
 */

/* ========== TABLE STYLES ========== */
.schedule-section-area th {
  background-color: #219ebc !important; /* Ocean Blue for table headers */
  color: #fff !important;
}

.schedule-section-area th:hover {
  background-color: #023047 !important; /* Dark Blue on hover */
}

.schedule-section-area td {
  background: #fff !important;
  border: 1px solid rgba(142, 202, 230, 0.3) !important; /* Sky Blue border */
}

.schedule-section-area td:hover {
  background: rgba(142, 202, 230, 0.1) !important; /* Light Sky Blue on hover */
}

/* Bootstrap table overrides */
.table-bordered th {
  background-color: #219ebc !important; /* Ocean Blue */
  color: #fff !important;
  border-color: #023047 !important;
}

.table-bordered td {
  border-color: rgba(142, 202, 230, 0.3) !important; /* Sky Blue border */
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(142, 202, 230, 0.05) !important; /* Very light Sky Blue */
}

.table-striped tbody tr:hover {
  background-color: rgba(142, 202, 230, 0.15) !important; /* Light Sky Blue on hover */
}

/* ========== BUTTON STYLES ========== */

/* Primary buttons - Ocean Blue */
.vl-btn1 {
  background: #219ebc !important;
  color: #fff !important;
}

.vl-btn1:hover {
  background: #023047 !important;
  color: #fff !important;
}

.vl-btn1::after {
  background: #8ecae6 !important;
}

.vl-btn1::before {
  background: #023047 !important;
}

/* Secondary buttons - Golden Yellow */
.vl-btn2 span.demo {
  background: #ffb703 !important;
  color: #023047 !important;
}

.vl-btn2 span.arrow {
  background: #ffb703 !important;
  color: #023047 !important;
}

.vl-btn2:hover {
  color: #023047 !important;
}

.vl-btn2:hover span.demo {
  background: #fb8500 !important; /* Orange on hover */
}

.vl-btn2:hover span.arrow {
  background: #fb8500 !important; /* Orange on hover */
}

/* Accent buttons - Orange */
.vl-btn3 {
  background: #fb8500 !important;
  color: #fff !important;
}

.vl-btn3::after {
  background: #023047 !important; /* Dark Blue accent */
}

.vl-btn3:hover {
  color: #fff !important;
}

/* Dark buttons - Dark Blue */
.vl-btn4 {
  background: #023047 !important;
  color: #fff !important;
}

.vl-btn4::after {
  background: #219ebc !important; /* Ocean Blue accent */
}

.vl-btn4:hover {
  color: #fff !important;
}

/* Gradient buttons - Ocean to Dark Blue */
.vl-btn5 span.demo {
  background: linear-gradient(135deg, #219ebc 0%, #023047 100%) !important;
  color: #fff !important;
}

.vl-btn5 span.arrow {
  background: linear-gradient(135deg, #219ebc 0%, #023047 100%) !important;
  color: #fff !important;
}

.vl-btn5:hover {
  color: #fff !important;
}

/* Feature buttons - Golden Yellow */
.vl-btn6 {
  background: #ffb703 !important;
  color: #023047 !important;
}

.vl-btn6::after {
  background: #fb8500 !important; /* Orange accent */
}

.vl-btn6:hover {
  color: #fff !important;
}

/* Rounded buttons - Sky Blue */
.vl-btn7 {
  background: #8ecae6 !important;
  color: #023047 !important;
}

.vl-btn7 span {
  background: #219ebc !important; /* Ocean Blue accent */
  color: #fff !important;
}

.vl-btn7:hover {
  background: #219ebc !important;
  color: #fff !important;
}

.vl-btn7:hover span {
  background: #023047 !important; /* Dark Blue accent */
}

/* Alternative buttons - Orange */
.vl-btn8 span.demo {
  background: #fb8500 !important;
  color: #fff !important;
}

.vl-btn8 span.arrow {
  background: #fb8500 !important;
  color: #fff !important;
}

.vl-btn8:hover {
  color: #fff !important;
}

/* Nav tabs styling */
.nav-tabs .nav-link {
  background-color: #8ecae6 !important; /* Sky Blue */
  color: #023047 !important;
  border: 1px solid #219ebc !important;
  margin-right: 5px;
  border-radius: 8px 8px 0 0;
}

.nav-tabs .nav-link:hover {
  background-color: #219ebc !important; /* Ocean Blue */
  color: #fff !important;
}

.nav-tabs .nav-link.active {
  background-color: #219ebc !important; /* Ocean Blue */
  color: #fff !important;
  border-bottom-color: #219ebc !important;
}

/* Bootstrap button overrides */
.btn-primary {
  background-color: #219ebc !important;
  border-color: #219ebc !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: #023047 !important;
  border-color: #023047 !important;
  color: #fff !important;
}

.btn-secondary {
  background-color: #8ecae6 !important;
  border-color: #8ecae6 !important;
  color: #023047 !important;
}

.btn-secondary:hover {
  background-color: #219ebc !important;
  border-color: #219ebc !important;
  color: #fff !important;
}

.btn-warning {
  background-color: #ffb703 !important;
  border-color: #ffb703 !important;
  color: #023047 !important;
}

.btn-warning:hover {
  background-color: #fb8500 !important;
  border-color: #fb8500 !important;
  color: #fff !important;
}

.btn-info {
  background-color: #8ecae6 !important;
  border-color: #8ecae6 !important;
  color: #023047 !important;
}

.btn-info:hover {
  background-color: #219ebc !important;
  border-color: #219ebc !important;
  color: #fff !important;
}

/* Card styling for accommodation page */
.card {
  border: 2px solid rgba(142, 202, 230, 0.3) !important;
  transition: all 0.3s ease;
}

.card:hover {
  border-color: #219ebc !important;
  box-shadow: 0 4px 12px rgba(33, 158, 188, 0.2) !important;
  transform: translateY(-2px);
}

.card-title {
  color: #023047 !important;
}

.card a {
  color: #219ebc !important;
}

.card a:hover {
  color: #fb8500 !important;
}

/* ========== FORM SELECT STYLES ========== */
/* Match select fields to input field styling */
.contact-inner-section .contact4-boxarea .row > [class*="col-"] {
  margin-bottom: 16px;
}

.contact4-section-area .contact4-boxarea .row > [class*="col-"] {
  margin-bottom: 16px;
}

.contact-inner-section .contact4-boxarea .input-area select {
  width: 100%;
  color: var(--ztc-text-text-2);
  font-family: var(--ztc-family-font2);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  border-radius: 8px;
  border: 1px solid rgba(95, 89, 91, 0.2);
  padding: 16px;
  margin-top: 16px;
  background-color: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235F595B' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  cursor: pointer;
}

.contact-inner-section .contact4-boxarea .input-area select:focus {
  outline: none;
  border-color: #219ebc;
}

.contact-inner-section .contact4-boxarea .input-area select option {
  color: var(--ztc-text-text-2);
  padding: 8px;
}

/* Also style for contact4-section-area if needed */
.contact4-section-area .contact4-boxarea .input-area select {
  width: 100%;
  color: var(--ztc-text-text-1);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  border-radius: 8px;
  border: 1px solid rgba(95, 89, 91, 0.2);
  padding: 16px;
  margin-top: 16px;
  background-color: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235F595B' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  cursor: pointer;
}

.contact4-section-area .contact4-boxarea .input-area select:focus {
  outline: none;
  border-color: #219ebc;
}

.contact4-section-area .contact4-boxarea .input-area select option {
  color: var(--ztc-text-text-1);
  padding: 8px;
}