/* Easy Rental Vehicle Booking — frontend styles (Dutch layout) */
.easy-rental-wrap, .easy-rental-wrap * { box-sizing: border-box; }

.easy-rental-wrap {
    font-family: inherit;
    color: #1d2530;
    line-height: 1.5;
    max-width: 1160px;
    margin: 0 auto;
    font-size: 15px;
}

.er-breadcrumb { font-size: 13px; color: #98a2b3; margin-bottom: 14px; }
.er-breadcrumb a { color: #98a2b3; text-decoration: none; }
.er-breadcrumb a:hover { color: #2563eb; }
.er-breadcrumb .er-sep { margin: 0 6px; color: #c4ccd8; }
.er-breadcrumb .er-current { color: #667085; }

.er-grid { display: flex; flex-wrap: wrap; gap: 36px; }

.er-left { flex: 1 1 55%; min-width: 320px; }

.er-vehicle-title { font-size: 32px; font-weight: 800; margin: 0 0 12px; color: #101828; letter-spacing: -0.5px; }

.er-quick-specs { list-style: none; margin: 0 0 4px; padding: 0; color: #475467; font-size: 14px; display: flex; flex-wrap: wrap; gap: 6px 22px; }
.er-quick-specs li { display: flex; align-items: center; gap: 7px; }
.er-quick-specs svg { flex-shrink: 0; }

.er-all-specs-link { display: inline-block; font-size: 14px; color: #2563eb; text-decoration: none; margin-bottom: 18px; }
.er-all-specs-link:hover { text-decoration: underline; }

.er-main-image { border-radius: 6px; overflow: hidden; background: #eef1f5; margin-bottom: 12px; }
.er-main-image img { width: 100%; display: block; height: auto; }

.er-thumbs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 30px; }
.er-thumb { width: 76px; height: 76px; border-radius: 6px; overflow: hidden; border: 2px solid transparent; display: block; transition: border-color .15s ease; opacity: .85; }
.er-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.er-thumb.er-active, .er-thumb:hover { border-color: #2563eb; opacity: 1; }

.er-specs { margin-bottom: 30px; }
.er-specs-title { font-size: 17px; font-weight: 700; margin: 0 0 10px; color: #101828; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
.er-chevron { color: #98a2b3; font-size: 18px; font-weight: 400; }
.er-specs-table { margin: 0; }
.er-spec-line { display: flex; padding: 8px 0; font-size: 14px; }
.er-spec-line dt { width: 40%; color: #667085; font-weight: 400; margin: 0; }
.er-spec-line dd { width: 60%; color: #101828; font-weight: 600; margin: 0; }

.er-description { color: #475467; font-size: 15px; }

.er-right { flex: 1 1 38%; min-width: 320px; }

.er-card { background: #f5f6f8; border-radius: 10px; padding: 26px 26px 30px; position: sticky; top: 20px; }

.er-card-title { margin: 0 0 16px; font-size: 20px; font-weight: 700; color: #101828; }

.er-prices { display: flex; gap: 10px; margin-bottom: 22px; }
.er-price-block { flex: 1; background: #fff; border-radius: 8px; padding: 14px 8px; text-align: center; }
.er-price { display: block; font-size: 20px; font-weight: 800; color: #101828; }
.er-price-label { display: block; font-size: 12px; color: #667085; margin-top: 4px; }

.er-row { display: flex; gap: 12px; }
.er-row .er-field { flex: 1; }
.er-field { margin-bottom: 12px; }
.er-field label { display: block; font-size: 13px; font-weight: 600; color: #344054; margin-bottom: 6px; }
.er-hint { font-weight: 400; color: #98a2b3; font-size: 12px; }
.er-label-hidden { position: absolute; left: -9999px; }

.er-field input[type="text"], .er-field input[type="email"], .er-field input[type="tel"],
.er-field input[type="date"], .er-field input[type="number"], .er-select {
    width: 100%; padding: 11px 13px; border: 1px solid #e4e7ec; border-radius: 8px; background: #fff;
    font-size: 14px; color: #101828; font-family: inherit;
    transition: border-color .15s ease, box-shadow .15s ease; appearance: none; -webkit-appearance: none;
}
.er-field input::placeholder { color: #a8b0bd; }
.er-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23667085' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 13px center;
}
.er-field input:focus, .er-select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.er-field input.er-invalid, .er-select.er-invalid { border-color: #f04438; }

.er-extras { margin: 16px 0 4px; }
.er-extras-title { font-size: 15px; font-weight: 700; margin: 0 0 12px; color: #101828; }
.er-extras-title span { font-weight: 400; color: #98a2b3; font-size: 13px; }
.er-extras-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.er-extra-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; background: #fff; border: 1px solid #e4e7ec; border-radius: 8px; cursor: pointer; font-size: 14px; margin: 0; }
.er-extra-item:hover { border-color: #2563eb; }
.er-extra-item input[type="checkbox"] { width: 17px; height: 17px; accent-color: #2563eb; flex-shrink: 0; margin-top: 2px; }
.er-extra-text { display: flex; flex-direction: column; line-height: 1.35; }
.er-extra-name { color: #344054; font-weight: 500; }
.er-extra-price { color: #98a2b3; font-size: 12px; }
.er-extras-total { text-align: right; font-size: 13px; color: #344054; margin-top: 10px; }
.er-extras-total strong { color: #101828; }

.er-totals { background: #fff; border: 1px solid #e4e7ec; border-radius: 8px; padding: 14px 16px; margin: 16px 0; }
.er-total-row { display: flex; justify-content: space-between; font-size: 14px; color: #475467; padding: 5px 0; }
.er-total-row .er-val { font-weight: 600; color: #101828; }
.er-total-row[data-row="extras"], .er-total-row[data-row="km"] { display: none; }
.er-total-row.er-total-grand { border-top: 1px solid #eaecf0; margin-top: 8px; padding-top: 11px; font-size: 16px; font-weight: 700; color: #101828; }
.er-total-row.er-total-grand .er-val { font-size: 18px; font-weight: 800; }
.er-total-row em { font-style: normal; color: #98a2b3; font-size: 12px; }

.er-keylocker { font-size: 13px; color: #475467; margin: 4px 0 14px; }

.er-terms { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: #475467; margin-bottom: 14px; cursor: pointer; }
.er-terms input { width: 17px; height: 17px; accent-color: #2563eb; margin-top: 1px; flex-shrink: 0; }
.er-terms a { color: #2563eb; }

.er-form-error { display: none; background: #fef3f2; border: 1px solid #fecdca; color: #b42318; border-radius: 8px; padding: 10px 14px; font-size: 13px; margin-bottom: 14px; }
.er-form-error.er-show { display: block; }

.er-submit { width: 100%; padding: 15px; border: none; border-radius: 8px; background: #2563eb; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; font-family: inherit; transition: background .15s ease; }
.er-submit:hover { background: #1d4fd7; }
.er-submit:disabled { opacity: .6; cursor: not-allowed; }

.er-success { margin-top: 16px; background: #ecfdf3; border: 1px solid #abefc6; color: #067647; border-radius: 8px; padding: 16px; font-size: 15px; font-weight: 600; text-align: center; }

.easy-rental-price-widget { display: flex; gap: 10px; }
.easy-rental-gallery-widget { display: flex; flex-wrap: wrap; gap: 10px; }
.easy-rental-gallery-widget img { border-radius: 10px; }
.easy-rental-specs-widget dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 20px; }
.easy-rental-specs-widget dt { font-weight: 700; color: #344054; }
.easy-rental-specs-widget dd { margin: 0; color: #475467; }

/* Vehicle archive / listing grid */
.er-archive-wrap { padding: 30px 20px 60px; }
.er-archive-title { font-size: 30px; font-weight: 800; color: #101828; margin: 0 0 26px; letter-spacing: -0.5px; }
.er-archive-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 22px; }
.er-card-item { display: flex; flex-direction: column; background: #fff; border: 1px solid #e4e7ec; border-radius: 10px; overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .15s ease, transform .15s ease; }
.er-card-item:hover { box-shadow: 0 8px 24px rgba(16,24,40,.08); transform: translateY(-2px); }
.er-card-item-img { aspect-ratio: 4 / 3; background: #eef1f5; overflow: hidden; }
.er-card-item-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.er-card-item-noimg { width: 100%; height: 100%; }
.er-card-item-body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 4px; }
.er-card-item-title { font-size: 17px; font-weight: 700; color: #101828; margin: 0; }
.er-card-item-specs { font-size: 13px; color: #667085; margin: 0; }
.er-card-item-price { font-size: 18px; font-weight: 800; color: #101828; margin: 6px 0 10px; }
.er-card-item-price span { font-size: 12px; font-weight: 400; color: #667085; margin-left: 4px; }
.er-card-item-cta { margin-top: auto; font-size: 13px; font-weight: 700; color: #2563eb; }

/* Vehicle Grid Elementor widget — same cards as the archive, with a fixed
   desktop column count chosen in the widget settings. */
.er-single-wrap { padding: 0; }
.er-vehicle-grid-empty { color: #667085; }
.er-vehicle-grid-widget.er-cols-2 { grid-template-columns: repeat(2, 1fr); }
.er-vehicle-grid-widget.er-cols-3 { grid-template-columns: repeat(3, 1fr); }
.er-vehicle-grid-widget.er-cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 900px) {
    .er-grid { flex-direction: column; gap: 24px; }
    .er-left, .er-right { flex: 1 1 100%; min-width: 0; }
    .er-card { position: static; padding: 20px; }
    .er-vehicle-title { font-size: 26px; }
    .er-vehicle-grid-widget.er-cols-3,
    .er-vehicle-grid-widget.er-cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .er-row-2 { flex-direction: column; gap: 0; }
    .er-extras-grid { grid-template-columns: 1fr; }
    .er-vehicle-grid-widget.er-cols-2,
    .er-vehicle-grid-widget.er-cols-3,
    .er-vehicle-grid-widget.er-cols-4 { grid-template-columns: 1fr; }
}

/* Vehicle Slider Elementor widget (auto-playing card slider with arrows). */
.er-vslider-section { padding: 40px 0; font-family: inherit; }
.er-vslider-container { max-width: 1400px; margin: 0 auto; position: relative; padding: 0 60px; }
.er-vslider-viewport { overflow: hidden; }
.er-vslider-track { display: flex; gap: 30px; transition: transform .5s ease; }
.er-vslider-track.no-transition { transition: none; }

.er-vslider-card { background: #f4f4f4; border-radius: 12px; padding: 20px 20px 24px; box-sizing: border-box; display: flex; flex-direction: column; border: 2px solid transparent; text-decoration: none; color: inherit; transition: box-shadow .3s ease, background .3s ease, border-color .3s ease; }
.er-vslider-card:hover { box-shadow: 0 12px 30px rgba(0,0,0,.12); background: #fff; border-color: var(--er-vs-accent, #D8952B); }
.er-vslider-card-img { width: 100%; height: 150px; border-radius: 8px; overflow: hidden; margin-bottom: 18px; background: #eef1f5; }
.er-vslider-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.er-vslider-card h3 { color: var(--er-vs-accent, #D8952B); font-size: 18px; font-weight: 700; margin: 0 0 8px; line-height: 1.3; }
.er-vslider-card p { color: #333; font-size: 14px; line-height: 1.5; margin: 0; }
.er-vslider-card-cta { margin-top: auto; padding-top: 14px; font-size: 13px; font-weight: 700; color: var(--er-vs-accent, #D8952B); }

.er-vslider-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; background: var(--er-vs-accent, #D8952B); color: #fff; border: none; font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: filter .3s ease; z-index: 2; }
.er-vslider-arrow:hover { filter: brightness(.9); }
.er-vslider-arrow.prev { left: 0; }
.er-vslider-arrow.next { right: 0; }

.er-vslider-track[data-visible="3"] .er-vslider-card { flex: 0 0 calc((100% - 60px) / 3); }
.er-vslider-track[data-visible="4"] .er-vslider-card { flex: 0 0 calc((100% - 90px) / 4); }
.er-vslider-track[data-visible="5"] .er-vslider-card { flex: 0 0 calc((100% - 120px) / 5); }
.er-vslider-track[data-visible="6"] .er-vslider-card { flex: 0 0 calc((100% - 150px) / 6); }

@media (max-width: 1200px) {
    .er-vslider-track[data-visible] .er-vslider-card { flex: 0 0 calc((100% - 90px) / 4); }
}
@media (max-width: 992px) {
    .er-vslider-container { padding: 0 50px; }
    .er-vslider-track { gap: 24px; }
    .er-vslider-track[data-visible] .er-vslider-card { flex: 0 0 calc((100% - 48px) / 3); padding: 16px 16px 20px; }
    .er-vslider-card h3 { font-size: 16px; }
    .er-vslider-card p { font-size: 13px; }
}
@media (max-width: 768px) {
    .er-vslider-container { padding: 0 46px; }
    .er-vslider-track { gap: 18px; }
    .er-vslider-track[data-visible] .er-vslider-card { flex: 0 0 calc((100% - 18px) / 2); }
}
@media (max-width: 480px) {
    .er-vslider-container { padding: 0 0 56px; }
    .er-vslider-track[data-visible] .er-vslider-card { flex: 0 0 100%; }
    .er-vslider-arrow { top: auto; bottom: 0; transform: none; }
    .er-vslider-arrow.prev { left: calc(50% - 56px); }
    .er-vslider-arrow.next { right: calc(50% - 56px); }
}
