/* ================================================================
 * Sharper MMS booking widget brand-match overrides
 * Scope: .sdms-online-booking-search and #sdms-search descendants
 * Loaded globally on any page that mounts the widget.
 *
 * Maps Sharper plugin defaults (blue/gray/Arial-ish) to the SLM
 * design system (--yacht-navy navy, --yacht-gold gold, Montserrat).
 * Selectors are intentionally generous because Sharper does not
 * publish a stable class contract; if Sharper renames internals,
 * this file is the only place to update.
 * ================================================================ */

/* ----------------------------------------------------------------
 * Surface + container
 * ---------------------------------------------------------------- */
.sdms-online-booking-search,
#sdms-search {
    font-family: var(--font-sans, 'Montserrat', sans-serif);
    color: var(--yacht-navy, #0A192F);
    background: var(--yacht-white, #FFFFFF);
}

/* ----------------------------------------------------------------
 * Tab strip (Boats / RV)
 * ---------------------------------------------------------------- */
.sdms-online-booking-search .nav-link,
#sdms-search .nav-link {
    color: var(--yacht-navy, #0A192F);
    font-family: var(--font-sans, 'Montserrat', sans-serif);
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: color 200ms ease;
}

.sdms-online-booking-search .nav-link:hover,
#sdms-search .nav-link:hover {
    color: var(--yacht-gold, #D4AF37);
}

.sdms-online-booking-search .nav-link.active,
#sdms-search .nav-link.active {
    color: var(--yacht-navy, #0A192F);
    border-bottom: 2px solid var(--yacht-gold, #D4AF37);
}

/* ----------------------------------------------------------------
 * Search button (primary CTA inside the widget)
 * Sharper actually uses Bootstrap's .btn-info on the Search button,
 * with type="button" (not type="submit"). Verified live via DevTools
 * on 2026-04-27. The earlier .btn-primary / .sdms-btn-primary entries
 * are kept as version-drift insurance.
 * ---------------------------------------------------------------- */
.sdms-online-booking-search button.btn-info,
.sdms-online-booking-search button[type="submit"],
.sdms-online-booking-search .sdms-btn-primary,
.sdms-online-booking-search .btn-primary,
.sdms-online-booking-search button.search,
#sdms-search button.btn-info,
#sdms-search button[type="submit"],
#sdms-search .sdms-btn-primary,
#sdms-search .btn-primary {
    background-color: var(--yacht-gold, #D4AF37) !important;
    color: var(--yacht-navy, #0A192F) !important;
    border: 1px solid var(--yacht-gold, #D4AF37) !important;
    font-family: var(--font-sans, 'Montserrat', sans-serif) !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase;
    transition: background-color 200ms ease, border-color 200ms ease;
}

.sdms-online-booking-search button.btn-info:hover,
.sdms-online-booking-search button[type="submit"]:hover,
.sdms-online-booking-search .sdms-btn-primary:hover,
.sdms-online-booking-search .btn-primary:hover,
#sdms-search button.btn-info:hover,
#sdms-search button[type="submit"]:hover,
#sdms-search .sdms-btn-primary:hover,
#sdms-search .btn-primary:hover {
    background-color: var(--yacht-gold-light, #E5C565) !important;
    border-color: var(--yacht-gold-light, #E5C565) !important;
}

/* ----------------------------------------------------------------
 * Inputs and date picker
 * ---------------------------------------------------------------- */
.sdms-online-booking-search input[type="text"]:focus,
.sdms-online-booking-search input[type="email"]:focus,
.sdms-online-booking-search input[type="number"]:focus,
.sdms-online-booking-search select:focus,
#sdms-search input[type="text"]:focus,
#sdms-search input[type="email"]:focus,
#sdms-search input[type="number"]:focus,
#sdms-search select:focus {
    outline: 2px solid var(--yacht-navy, #0A192F);
    outline-offset: 2px;
    border-color: var(--yacht-navy, #0A192F);
}

/* ----------------------------------------------------------------
 * Result cards (when results render)
 * ---------------------------------------------------------------- */
.sdms-online-booking-search .product-card,
.sdms-online-booking-search .booking-result,
#sdms-search .product-card,
#sdms-search .booking-result {
    border: 1px solid var(--yacht-gray, #F8F9FA);
    border-radius: 8px;
    background: var(--yacht-white, #FFFFFF);
}

/* ----------------------------------------------------------------
 * Radio (Result View toggle) restyle for system consistency
 * ---------------------------------------------------------------- */
.sdms-online-booking-search input[type="radio"]:checked,
#sdms-search input[type="radio"]:checked {
    accent-color: var(--yacht-gold, #D4AF37);
}