/* ---------- Card wrapper: solid, opaque white ---------- */
    .onetourismo-forms.uk-container {
        max-width: 1100px;
        background: #ffffff;
        border: 1px solid rgba(0,0,0,0.06);
        border-radius: 24px;
        padding: 18px 22px 22px;
        box-shadow: 0 8px 32px rgba(0,0,0,0.25);
    }

    /* ---------- Segmented-control tabs: one pill-shaped capsule, active = teal chip ---------- */
    .onetourismo-forms ul.uk-tab {
        display: flex;
        justify-content: center;
        gap: 4px;
        border: none;
        margin: 0 auto 16px;
        padding: 5px;
        list-style: none;
        background: #eef2f3;
        border-radius: 999px;
        width: fit-content;
    }
    .onetourismo-forms ul.uk-tab::before { display: none; }
    .onetourismo-forms ul.uk-tab > * { padding: 0; }
    .onetourismo-forms ul.uk-tab > li {
        margin: 0;
    }
    .onetourismo-forms ul.uk-tab > li > a {
        display: inline-block;
        padding: 9px 24px;
        border-radius: 999px;
        font-weight: 700;
        font-size: 14px;
        letter-spacing: .02em;
        background: transparent;
        color: #1c2b3a !important;
        text-shadow: none;
        transition: background .2s ease, color .2s ease;
    }
    .onetourismo-forms ul.uk-tab > li.uk-active > a,
    .onetourismo-forms .uk-tab > .uk-active > a {
        background: #027987 !important;
        color: #ffffff !important;
        text-shadow: none;
        box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    }
    .onetourismo-forms ul.uk-tab > li:not(.uk-active) > a:hover {
        background: #efa500;
        color: #ffffff !important;
        text-shadow: none;
    }

    /* ---------- Field row ---------- */
    .onetourismo-forms .uk-switcher { margin: 0; padding: 0; list-style: none; }
    .onetourismo-forms .uk-switcher > li { padding: 0; }
    .onetourismo-forms form > div[uk-grid] {
        display: flex !important;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 10px;
        margin: 0 !important;
    }
    .onetourismo-forms form > div[uk-grid] > div {
        flex: 1 1 140px;
        min-width: 0;
        padding: 0 !important;
        text-align: left !important;
        position: relative;
    }
    /* height:fit-content only for the actual field boxes (label+input) — NOT the submit
       button, which must keep stretching to the full row height via align-self:stretch
       below. An explicit height here would override that stretch per the flexbox spec,
       which is exactly what made the button float at the wrong height instead of matching
       the row. */
    .onetourismo-forms form > div[uk-grid] > div:not(.submit-btn) {
        height: fit-content;
    }
    /* The angucomplete-alt destination autocomplete renders its suggestions dropdown
       in-flow by default (no CSS at all ships with the plugin for it), so an empty or
       hidden dropdown was still pushing real layout height — most visible on mobile where
       fields stack vertically and each extra pushed pixel becomes a huge visible gap. A
       suggestions dropdown should overlay the fields below it, not shove them down, so we
       take it out of flow like any normal autocomplete widget. */
    .onetourismo-forms .angucomplete-holder { position: relative; display: block; }
    .onetourismo-forms .angucomplete-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 30;
    }
    /* Same root cause for Check In/Check Out: their calendar popup is the standard
       angular-ui-bootstrap datepicker, whose ".dropdown-menu" panel relies on Bootstrap's
       own CSS for position:absolute — this site ships only UIkit, not Bootstrap, so nothing
       ever gave that panel absolute positioning and it sat in-flow, pushing every field
       below it down the page (worst on mobile, where fields stack one per row). We only
       fix position/stacking here — never touch display — so we can't accidentally hide a
       calendar the widget's own JS is legitimately showing. */
    .onetourismo-forms .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 30;
    }
    /* Field widths tuned per real field count so the button always fits on the right
       without wrapping to its own row (Hotels has 5 fields, Excursions has 3). */
    search-form form > div[uk-grid] > div:nth-child(1) { flex: 2 1 220px; }
    search-form form > div[uk-grid] > div:nth-child(2),
    search-form form > div[uk-grid] > div:nth-child(3) { flex: 1 1 110px; }
    search-form form > div[uk-grid] > div:nth-child(4) { flex: 0 1 85px; }
    search-form form > div[uk-grid] > div.more-inputs { flex: 1 1 130px; }
    search-form-activity form > div[uk-grid] > div:nth-child(1) { flex: 2 1 220px; }
    search-form-activity form > div[uk-grid] > div:nth-child(2) { flex: 1 1 140px; }
    search-form-activity form > div[uk-grid] > div:nth-child(3) { flex: 1 1 110px; }
    .onetourismo-forms form label {
        display: block;
        font-size: 13px;
        font-weight: 700;
        color: #000000;
        text-shadow: none;
        margin: 0 0 4px 4px;
    }
    .onetourismo-forms form input.uk-input,
    .onetourismo-forms form select.uk-select {
        width: 100%;
        height: 46px;
        border-radius: 14px !important;
        border: none !important;
        background: #f2f4f5 !important;
        box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
        color: #1c2b3a !important;
        font-weight: 600;
        padding: 0 14px;
        font-size: 14px;
        box-sizing: border-box;
    }
    .onetourismo-forms form input.uk-input::placeholder { color: #7a8790; font-weight: 400; }

    /* Destination field: magnifying-glass icon docked on the right, inside the box */
    .onetourismo-forms form > div[uk-grid] > div:first-child {
        position: relative;
    }
    .onetourismo-forms form > div[uk-grid] > div:first-child::after {
        content: "";
        position: absolute;
        right: 14px;
        bottom: 14px;
        width: 17px;
        height: 17px;
        pointer-events: none;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c2b3a' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    }
    .onetourismo-forms form > div[uk-grid] > div:first-child input.uk-input,
    .onetourismo-forms form > div[uk-grid] > div:first-child .angucomplete-holder input {
        padding-right: 38px;
    }

    /* Nights: visually read-only (auto-computed from Check In/Check Out) */
    .onetourismo-forms form input[ng-model="nights"] {
        background: #e6e9ea !important;
        color: #1c2b3a !important;
        cursor: not-allowed;
    }

    /* Rooms / More trigger — style like the other pill fields */
    .onetourismo-forms form .more-inputs a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 46px;
        border-radius: 14px !important;
        border: none !important;
        background: #f2f4f5 !important;
        box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
        color: #1c2b3a !important;
        font-weight: 600;
        padding: 0 14px;
        font-size: 14px;
        box-sizing: border-box;
        text-decoration: none;
    }

    /* ---------- Submit button: full height, right side ---------- */
    .onetourismo-forms form > div[uk-grid] > div.submit-btn {
        flex: 0 0 150px;
        align-self: stretch;
        display: flex;
    }
    .onetourismo-forms form .submit-btn button {
        flex: 1;
        width: 100%;
        height: 100%;
        min-height: 46px;
        border: none;
        border-radius: 14px !important;
        background: #027987 !important;
        color: #ffffff !important;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        cursor: pointer;
        transition: background .2s ease;
    }
    .onetourismo-forms form .submit-btn button:hover {
        background: #efa500 !important;
        color: #ffffff !important;
    }

    /* ---------- Modal (Rooms / More) — light restyle to match ---------- */
    .uk-modal-dialog.uk-modal-body input.uk-input {
        border-radius: 12px !important;
    }
    .uk-modal-dialog.uk-modal-body .save-btn > button,
    .uk-modal-dialog.uk-modal-body .add-btn > div {
        border-radius: 12px !important;
        background: #027987 !important;
        color: #fff !important;
    }
    .uk-modal-dialog.uk-modal-body .save-btn > button:hover,
    .uk-modal-dialog.uk-modal-body .add-btn > div:hover {
        background: #efa500 !important;
    }

    /* ---------- Mobile: button drops to full width below fields ---------- */
    @media (max-width: 768px) {
        .onetourismo-forms.uk-container { padding: 14px 14px 18px; border-radius: 18px; max-width: calc(100vw - 24px); }
        .onetourismo-forms ul.uk-tab { width: 100%; }
        .onetourismo-forms ul.uk-tab > li { flex: 1; }
        .onetourismo-forms ul.uk-tab > li > a { display: block; text-align: center; padding: 9px 10px; font-size: 13px; }
        .onetourismo-forms form > div[uk-grid] { flex-direction: column; }
        .onetourismo-forms form > div[uk-grid] > div,
        .onetourismo-forms form > div[uk-grid] > div.submit-btn {
            flex: 1 1 100%;
            width: 100%;
        }
        .onetourismo-forms form .submit-btn button { height: 46px; }

        /* Hard clamp on mobile: regardless of what Angular renders inside each field
           (calendar popup, autocomplete suggestion box, etc.), the field's OWN box must
           never be taller than its label+input. overflow:visible (not hidden) means any
           actually-open popup still renders fine — it just spills outside the box visually
           instead of the box growing and shoving every field below it down the page. This
           targets the symptom directly since two prior attempts at guessing the exact
           inner element responsible (autocomplete dropdown, then the uib-datepicker popup)
           didn't resolve it and there's no way to inspect the live Angular-rendered DOM
           from here to pin down the real cause precisely. */
        .onetourismo-forms form > div[uk-grid] > div:not(.submit-btn) {
            max-height: 74px;
            overflow: visible;
        }
    }
    @media (max-width: 360px) {
        .onetourismo-forms ul.uk-tab > li > a { font-size: 12px; padding: 8px 6px; }
    }