@import url("home-prototype.css");

/* WordPress integration-only adjustments layered after the approved prototype stylesheet. */
.ag-home-frame { width: min(100%, var(--ag-content-wide, 1360px)); }
.ag-home-service-button { text-decoration: none; }
.ag-home-input--date { position: relative; }
.ag-home-input--date input { min-width: 0; width: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--color-deep-navy); font: inherit; font-weight: var(--font-weight-semibold); }
.ag-home-input--date input::-webkit-calendar-picker-indicator { margin: 0; cursor: pointer; }
.ag-home-date-control { min-width: 0; width: 100%; min-height: calc(var(--control-touch-target) - 2px); padding: 0; border: 0; background: transparent; color: var(--color-deep-navy); font: inherit; font-weight: var(--font-weight-semibold); text-align: left; white-space: nowrap; cursor: pointer; }
.ag-home-date-control[hidden] { display: none; }
.ag-home-date-control--awaiting-return { color: var(--color-brand-gold); }
.ag-home-input--date:focus-within { border-color: var(--color-caspian-blue); box-shadow: var(--control-focus-ring); }
.ag-home-date-control:focus-visible { outline: 0; }
.ag-home-datepicker-anchor { position: fixed !important; width: 1px !important; height: 1px !important; pointer-events: none; opacity: 0; }
.ag-home-page .flatpickr-calendar { z-index: calc(var(--z-modal, 1000) + 1); max-width: calc(100vw - 24px); overflow: hidden; border: var(--border-subtle); border-radius: var(--radius-lg); background: var(--color-warm-white); box-shadow: var(--shadow-md); }
.ag-home-page .flatpickr-months, .ag-home-page .flatpickr-weekdays { background: var(--color-light-gray); }
.ag-home-page .flatpickr-current-month, .ag-home-page .flatpickr-monthDropdown-months, .ag-home-page .flatpickr-weekday, .ag-home-page .flatpickr-day { color: var(--color-deep-navy); }
.ag-home-page .flatpickr-prev-month, .ag-home-page .flatpickr-next-month { display: grid; min-width: 44px; min-height: 44px; place-items: center; color: var(--color-deep-navy); }
.ag-home-page .flatpickr-prev-month:hover svg, .ag-home-page .flatpickr-next-month:hover svg, .ag-home-page .flatpickr-prev-month:focus-visible svg, .ag-home-page .flatpickr-next-month:focus-visible svg { fill: var(--color-brand-gold); }
.ag-home-page .flatpickr-day.today:not(.selected):not(.startRange):not(.endRange) { border-color: var(--color-brand-gold); }
.ag-home-page .flatpickr-day.selected, .ag-home-page .flatpickr-day.startRange, .ag-home-page .flatpickr-day.endRange, .ag-home-page .flatpickr-day.selected:hover, .ag-home-page .flatpickr-day.startRange:hover, .ag-home-page .flatpickr-day.endRange:hover { border-color: var(--color-brand-gold); background: var(--color-brand-gold); color: var(--color-deep-navy); }
.ag-home-page .flatpickr-day.inRange, .ag-home-page .flatpickr-day.prevMonthDay.inRange, .ag-home-page .flatpickr-day.nextMonthDay.inRange { border-color: var(--color-sand); background: var(--color-sand); box-shadow: -5px 0 0 var(--color-sand), 5px 0 0 var(--color-sand); color: var(--color-deep-navy); }
.ag-home-vehicle-link { display: block; width: 100%; height: 100%; color: inherit; text-decoration: none; }
.ag-home-vehicle-title-link { color: inherit; text-decoration: none; }
.ag-home-vehicle-title-link:hover, .ag-home-vehicle-title-link:focus-visible { color: var(--color-caspian-blue); }
.ag-home-vehicle-media .ag-home-media-fallback { display: block; width: 100%; height: 100%; }
.ag-home-vehicle-media .ag-vehicle-card__favorite { pointer-events: none; }
.ag-home-cta { background-image: linear-gradient(90deg, color-mix(in srgb, var(--color-deep-navy) 88%, transparent), color-mix(in srgb, var(--color-deep-navy) 58%, transparent)), var(--ag-home-cta-image, url("../../images/footer-img.png")); }


@media (max-width: 767px) {
  .ag-home-input--date input { font-size: clamp(12px, 3.4vw, 14px); }
  .ag-home-date-control { font-size: clamp(12px, 3.4vw, 14px); }
  .ag-home-page .flatpickr-calendar { width: calc(100vw - 24px) !important; }
  .ag-home-page .flatpickr-rContainer, .ag-home-page .flatpickr-days, .ag-home-page .dayContainer { width: 100% !important; min-width: 0 !important; max-width: none !important; }
  .ag-home-page .flatpickr-day { max-width: none; height: 44px; line-height: 44px; }
}
