/*
 * Live search form (partials/search-form.blade.php + public/js/live-search.js).
 * Colours (new palette, see the top of site.css):
 * turf green #306B34, dark slate grey #1C5253, white #FFFFFF.
 * Light grey #F5F8F7 marks fields and hovered rows (white on white would not show).
 */

/* ---------- Search card ---------- */
/* White card with rounded corners, a soft shadow and a green bar on top.
   Solid colours only (no gradients, see .cursor/rules/no-gradients.mdc). */
.search-box-site {
    padding: 32px 32px 12px;
    border-radius: 20px;
    border-top: 5px solid #306B34;
    box-shadow: 0 18px 50px rgba(28, 82, 83, 0.14);
}
.search-box-site .search-title { margin-bottom: 4px; font-weight: 700; color: #1C5253; }
.search-box-site .search-subtitle { margin-bottom: 24px; color: #6b7c78; font-size: 15px; }

/* Less space between the fields than the theme default (30px). */
.search-box-site.site-form form .form-group { margin-bottom: 18px; }

/* Labels: small, uppercase, quiet. */
.search-box-site.site-form form .form-group .f-label {
    margin-bottom: 6px; font-size: 12px; font-weight: 600; line-height: 18px;
    letter-spacing: 1px; text-transform: uppercase; color: #6b7c78;
}

/* Fields: light grey fill, rounded corners. They turn white with a soft green ring on focus.
   The date / time types are listed because the theme does not style them. */
.search-box-site.site-form form .form-group input[type="text"],
.search-box-site.site-form form .form-group input[type="number"],
.search-box-site.site-form form .form-group input[type="date"],
.search-box-site.site-form form .form-group input[type="time"] {
    width: 100%; height: 56px; padding: 14px 44px 14px 18px;
    background: #F5F8F7; border: 1px solid #E1E8E5; border-radius: 12px;
    color: #1C5253; font-weight: 500;
    transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;
}
.search-box-site.site-form form .form-group input:hover { border-color: #C9D6D1; }
.search-box-site.site-form form .form-group input:focus {
    outline: none; background: #ffffff; border-color: #306B34;
    box-shadow: 0 0 0 4px rgba(48, 107, 52, 0.12);
}
.search-box-site.site-form form .form-group .alt-icon { right: 18px; font-size: 16px; }

/* Big, full-width button. */
.search-box-site .search-submit { display: block; width: 100%; padding: 16px 20px; border-radius: 12px; font-weight: 600; }

@media (max-width: 575px) {
    .search-box-site { padding: 24px 20px 6px; }
}

/* The text box looks like the other theme fields; the list opens under it. */
.point-input { position: relative; }
.site-form form .form-group .point-input-text { width: 100%; }

.point-input-list {
    position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 4px);
    margin: 0; padding: 6px 0; list-style: none; max-height: 320px; overflow-y: auto;
    background: #fff; border: 1px solid #e5e9ec; border-radius: 12px; /* same corners as the fields */
    box-shadow: 0 10px 30px rgba(28, 82, 83, 0.12);
}
.point-input-list li { padding: 8px 14px; cursor: pointer; line-height: 1.3; }
.point-input-list li b { display: block; font-weight: 600; color: #1C5253; }
.point-input-list li small { display: block; color: #7a8a86; font-size: 12px; text-transform: capitalize; }
.point-input-list li.is-active,
.point-input-list li:hover { background: #F5F8F7; }
.point-input-list li.point-input-empty { cursor: default; color: #7a8a86; }

/* Live prices: one row per car, the whole row is a "Book" link. */
.live-prices { margin-top: 5px; }
.live-prices-title { margin: 0 0 8px; font-weight: 600; color: #1C5253; }
.live-prices-note { margin: 0; color: #7a8a86; }
.live-price {
    display: flex; align-items: center; gap: 12px; padding: 10px 14px; margin-bottom: 8px;
    background: #fff; border: 1px solid #e5e9ec; border-radius: 8px; color: #1C5253;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.live-price:hover { border-color: #306B34; box-shadow: 0 4px 14px rgba(48, 107, 52, 0.18); color: #1C5253; }
.live-price span { flex: 1; }
.live-price b { font-size: 18px; }
.live-price em { font-style: normal; font-weight: 600; color: #fff; background: #306B34; padding: 4px 12px; border-radius: 6px; }