/*
 * Heraklion Car Rentals — VikRentCar search form layout
 * Version 6.9.0
 *
 * This stylesheet targets the native VikRentCar Search Form markup directly.
 * It does not depend on generated classes, DOM movement, :has(), floats, or
 * plugin percentage widths.
 */

.hcr-vik-search__mount {
  --hcr-vik-gap: 12px;
  --hcr-vik-height: 50px;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.hcr-vik-search__mount,
.hcr-vik-search__mount *,
.hcr-vik-search__mount *::before,
.hcr-vik-search__mount *::after {
  box-sizing: border-box !important;
}

/* Neutralise VikRentCar's old module wrappers. */
.hcr-vik-search__mount .vrcdivsearch,
.hcr-vik-search__mount .vrcdivsearchmodule,
.hcr-vik-search__mount .vrc-searchmod-wrap,
.hcr-vik-search__mount .widget_vikrentcar_search,
.hcr-vik-search__mount .hcr-vik-search-widget {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  float: none !important;
  clear: none !important;
  overflow: visible !important;
}

/*
 * Exact native markup: .vrcdivsearchmodule > form > .vrcsfentrycont
 * Apply the grid directly to the form. This is deliberately not conditional.
 */
.hcr-vik-search__mount .vrcdivsearchmodule > form,
.hcr-vik-search__mount .vrcdivsearch > form,
.hcr-vik-search__mount form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--hcr-vik-gap) !important;
  align-items: end !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
  overflow: visible !important;
}

/* Hidden values must never occupy a grid track. */
.hcr-vik-search__mount form > input[type="hidden"],
.hcr-vik-search__mount form > script,
.hcr-vik-search__mount form > style {
  display: none !important;
}

/* Each native logical field group is one grid cell. */
.hcr-vik-search__mount form > .vrcsfentrycont,
.hcr-vik-search__mount .vrcsfentrycont {
  display: flex !important;
  flex-flow: row wrap !important;
  align-content: flex-end !important;
  align-items: flex-end !important;
  gap: 7px 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  float: none !important;
  clear: none !important;
  vertical-align: bottom !important;
  overflow: visible !important;
}

/* Labels and simple location fields. */
.hcr-vik-search__mount .vrcsfentrycont > label,
.hcr-vik-search__mount .vrcsfentrylabsel > label,
.hcr-vik-search__mount .vrcsfentrytime > label {
  display: block !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #536575 !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  white-space: normal !important;
  float: none !important;
}

.hcr-vik-search__mount .vrcsfentryselect {
  display: block !important;
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  float: none !important;
  overflow: visible !important;
}

/* Pickup/drop-off date portion and time portion in the same native group. */
.hcr-vik-search__mount .vrcsfentrylabsel {
  position: relative !important;
  display: flex !important;
  flex: 1 1 calc(58% - 4px) !important;
  flex-direction: column !important;
  gap: 7px !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.hcr-vik-search__mount .vrcsfentrydate {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  overflow: visible !important;
}

.hcr-vik-search__mount .vrcsfentrytime {
  display: grid !important;
  flex: 1 1 calc(42% - 4px) !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  grid-template-rows: auto var(--hcr-vik-height) !important;
  align-items: end !important;
  gap: 7px 4px !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  overflow: visible !important;
}

.hcr-vik-search__mount .vrcsfentrytime > label {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
}

.hcr-vik-search__mount #vrcmodselph,
.hcr-vik-search__mount #vrcmodselpm,
.hcr-vik-search__mount #vrcmodseldh,
.hcr-vik-search__mount #vrcmodseldm {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  float: none !important;
  overflow: visible !important;
}

.hcr-vik-search__mount .vrctimesep {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 4px !important;
  height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #536575 !important;
  font-weight: 800 !important;
  line-height: var(--hcr-vik-height) !important;
  float: none !important;
}

/* Every visible control occupies its wrapper, with no inherited fixed width. */
.hcr-vik-search__mount input:not([type="hidden"]):not([type="submit"]),
.hcr-vik-search__mount select {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: var(--hcr-vik-height) !important;
  min-height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 1px solid #d8e2e8 !important;
  border-radius: 8px !important;
  background-color: #fff !important;
  color: #102b43 !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: normal !important;
  text-transform: none !important;
  float: none !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
}

.hcr-vik-search__mount input:not([type="hidden"]):not([type="submit"]):focus,
.hcr-vik-search__mount select:focus {
  border-color: #00a7a5 !important;
  outline: 3px solid rgba(0, 167, 165, .14) !important;
  outline-offset: 0 !important;
}

/* Calendar icon inside the date field; retain the native trigger as hit area. */
.hcr-vik-search__mount .vrcsfentrydate input[type="text"],
.hcr-vik-search__mount .vrcsfentrydate input.hasDatepicker {
  padding-right: 43px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230d3b66' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='17' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 13px center !important;
  background-size: 18px 18px !important;
}

.hcr-vik-search__mount .vrcsfentrydate .ui-datepicker-trigger {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 5 !important;
  display: block !important;
  width: 43px !important;
  height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

/* Submit cell and button. */
.hcr-vik-search__mount .vrcsfentrysubmit {
  display: flex !important;
  align-items: flex-end !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  float: none !important;
}

.hcr-vik-search__mount .vrcsfentrysubmit input[type="submit"],
.hcr-vik-search__mount .vrcsfentrysubmit button[type="submit"],
.hcr-vik-search__mount input.vrcsearch,
.hcr-vik-search__mount button.vrcsearch {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: var(--hcr-vik-height) !important;
  min-height: var(--hcr-vik-height) !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #00a7a5 !important;
  color: #fff !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  float: none !important;
  cursor: pointer !important;
}

.hcr-vik-search__mount .vrcsfentrysubmit input[type="submit"]:hover,
.hcr-vik-search__mount .vrcsfentrysubmit button[type="submit"]:hover {
  background: #008b8a !important;
}

/*
 * True horizontal layout at normal PC/laptop content widths.
 * The previous 1080px container breakpoint caused the live panel to remain in
 * tablet mode. 760px is safe because all tracks can shrink to min-width: 0.
 */
@media (min-width: 760px) {
  .hcr-vik-search__mount .vrcdivsearchmodule > form,
  .hcr-vik-search__mount .vrcdivsearch > form,
  .hcr-vik-search__mount form {
    grid-template-columns:
      minmax(0, 1.1fr)
      minmax(0, 1.1fr)
      minmax(0, 1.45fr)
      minmax(0, 1.45fr)
      minmax(112px, .8fr) !important;
    gap: 10px !important;
  }
}

/* Tablet: two columns and a full-width action. */
@media (min-width: 560px) and (max-width: 759px) {
  .hcr-vik-search__mount .vrcdivsearchmodule > form,
  .hcr-vik-search__mount .vrcdivsearch > form,
  .hcr-vik-search__mount form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .hcr-vik-search__mount form > .vrcsfentrycont:last-of-type {
    grid-column: 1 / -1 !important;
  }
}

/* Phone: one logical field group per row. */
@media (max-width: 559px) {
  .hcr-vik-search__mount {
    --hcr-vik-gap: 12px;
    --hcr-vik-height: 50px;
  }

  .hcr-vik-search__mount .vrcsfentrylabsel,
  .hcr-vik-search__mount .vrcsfentrytime {
    flex-basis: 100% !important;
  }
}

/* Small phone: keep hour/minute usable, not compressed. */
@media (max-width: 379px) {
  .hcr-vik-search__mount .vrcsfentrytime {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  }
}

/* Keep native calendars above Elementor and the hero. */
body .ui-datepicker,
body #ui-datepicker-div,
body .vrc-cal-container,
body [class*="datepicker"] {
  z-index: 999999 !important;
}
