/* ============================================================
   B2C 2.5 - restyle modali (Passeggeri / Veicoli / Animali)
   Si appoggia alla struttura/posizionamento di css/modalbox.css
   (che resta invariato: .md-modal fixed positioning, overlay,
   animazioni .md-effect-1) e riscrive solo l'aspetto visivo per
   allinearlo alla palette del mockup header/paxlist:
   navy #1c3f6e, accento arancione #f4801f, bordi #e0e3e8/#e6e9ed,
   etichette #2f6fb0/#3a4a5e.
   ============================================================ */

.md-content {
    background: #fff;
    color: #1c3f6e;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0,0,0,.25);
}

.md-content h3 {
    background: #1c3f6e;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    text-align: left;
    padding: 14px 20px;
    margin: 0;
    border-radius: 4px 4px 0 0;
}

.md-content .box {
    background: #fff;
    border-radius: 0;
    margin: 0;
    padding: 18px 20px;
}

.md-content .box h2 {
    color: #2f6fb0;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
    text-align: left;
    margin: 0 0 14px;
    padding: 0 0 10px;
    border-bottom: 1px solid #e6e9ed;
}

.md-content .box .sbox {
    padding: 0;
}

.md-content .box .sbox td {
    width: 290px;
    padding: 0 16px 14px 0;
    vertical-align: top;
}

.md-content .box .text,
.md-content .box .textd,
.md-content .box .terms {
    float: none;
    display: inline-block;
    color: #3a4a5e;
    font-weight: 600;
    font-size: 12.5px;
    padding: 0 0 6px;
    width: auto;
}

.md-content .box select,
.md-content .box .fieldt {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    width: auto;
    height: auto;
    padding: 7px 9px;
    font-size: 13px;
    font-weight: 600;
    color: #1c3f6e;
    text-align: left;
    line-height: normal;
}

.md-content .box .control {
    color: #3a4a5e;
    font-size: 12.5px;
    font-weight: 600;
    margin: 5px 0;
}

.md-content .box .control__indicator {
    border-color: #ccc;
}

.md-content .box .control input:checked ~ .control__indicator {
    background: #1c3f6e;
}

.md-content .box a {
    color: #2f6fb0;
}
.md-content .box a:hover {
    color: #1c3f6e;
    text-decoration: underline;
}

/* Confirm button - was a fixed 383x50px background image (createbtn.png) */
.md-content .box .createacc {
    text-align: center;
    margin: 14px 0 0;
    padding: 16px 0 0;
    border-top: 1px solid #e6e9ed;
}
.md-content .box .createacc .createbtn {
    background: #f4801f;
    width: 100%;
    max-width: 340px;
    height: auto;
    padding: 12px 20px;
    border: none;
    border-radius: 3px;
    color: #fff;
    text-shadow: none;
    text-transform: uppercase;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: .3px;
    font-family: inherit;
    cursor: pointer;
    transition: background-color .15s ease-in-out;
}
.md-content .box .createacc .createbtn:hover {
    background: #d96e17;
}

/* Close button - was a 39x39 background image (closebox.png/closeboxh.png) */
.closebox {
    background: #1c3f6e;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    box-shadow: 0 2px 10px rgba(0,0,0,.35);
    transition: background-color .15s ease-in-out;
}
.closebox::before,
.closebox::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 2px;
    background: #fff;
}
.closebox::before { transform: translate(-50%, -50%) rotate(45deg); }
.closebox::after { transform: translate(-50%, -50%) rotate(-45deg); }
.closebox:hover {
    background: #0f2a4d;
}

/* Warning/error sub-boxes (no accommodation/pet/vehicle available, bike/rental notes) */
.md-content .box[id^="boxBottom"] {
    padding: 20px;
}

@media (max-width: 480px) {
    .md-content .box .sbox td {
        display: block;
        width: 100% !important;
        padding: 0 0 12px;
    }
    .md-content .box select,
    .md-content .box .fieldt {
        width: 100%;
        box-sizing: border-box;
    }
}

/* ============================================================
   Alert popup ("Messi" plugin - alertMsg() in includes/footer.php,
   used e.g. by js/search_js.php for route/date validation messages).
   Was a dark grey title bar with an animated diagonal-stripe pattern
   (css/messi.min.css .messi-titlebox.anim) - flattened and recolored
   to the same palette as the rest of B2C 2.5, reusing the semantic
   colors already defined in search.css's .info/.warning/.success/
   .error-message blocks instead of messi's own defaults.
   ============================================================ */

.messi-box {
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0,0,0,.25);
}

.messi-titlebox,
.messi-titlebox.anim {
    background-color: #1c3f6e;
    background-image: none;
    -webkit-animation: none;
    animation: none;
    box-shadow: none;
    font: 700 14px/1.4 inherit;
    text-shadow: none;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.messi-titlebox.info,
.messi-titlebox.anim.info {
    background-color: #1c3f6e;
}
.messi-titlebox.error,
.messi-titlebox.anim.error {
    background-color: #c0392b;
}
.messi-titlebox.warning,
.messi-titlebox.anim.warning {
    background-color: #f39b0e;
}
.messi-titlebox.success,
.messi-titlebox.anim.success {
    background-color: #43a046;
}

.messi-content {
    font-size: 13.5px !important;
    color: #3a4a5e !important;
    line-height: 1.5;
}

.messi-footbox {
    background: #f7f8fa;
}
.messi-actions {
    border-top: 1px solid #e6e9ed;
}

.messi .btn {
    min-width: 90px;
    padding: 8px 16px;
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #fff;
    text-shadow: none;
    background: #1c3f6e;
    background-image: none;
    border: none;
    border-radius: 3px;
    box-shadow: none;
    transition: background-color .15s ease-in-out;
}
.messi .btn:hover {
    background: #14304f;
    color: #fff; /* messi.min.css's own .btn:hover sets color:#333, illegible on our dark hover bg */
}
.messi .btn-success {
    background: #43a046;
}
.messi .btn-success:hover {
    background: #357a37;
    color: #fff;
}
.messi .btn-danger {
    background: #c0392b;
}
.messi .btn-danger:hover {
    background: #9c2e21;
    color: #fff;
}

/* ============================================================
   SweetAlert2 "Grimaldi Club" popup (js/search_js.php, shown after a
   search when not logged in). sweetalert2.all.min.js injects its own
   default styles into <head> at runtime, so its rules can end up
   after ours in the cascade regardless of <link> order - !important
   on the few properties that matter (colors) keeps this reliable.
   ============================================================ */

.swal2-popup {
    border-radius: 4px !important;
}
.swal2-title {
    color: #1c3f6e !important;
    font-weight: 800 !important;
}
.swal2-icon.swal2-info {
    border-color: #1c3f6e !important;
    color: #1c3f6e !important;
}
.swal2-confirm {
    background-color: #1c3f6e !important;
    border-radius: 3px !important;
    box-shadow: none !important;
}
.swal2-confirm:hover {
    background-color: #14304f !important;
}
.swal2-deny {
    background-color: #f4801f !important;
    border-radius: 3px !important;
    box-shadow: none !important;
}
.swal2-deny:hover {
    background-color: #d96e17 !important;
}
.swal2-footer {
    color: #3a4a5e;
    border-top-color: #e6e9ed;
}
.swal2-footer a,
#swalContinueAsGuest {
    color: #2f6fb0;
    font-weight: 600;
    text-decoration: underline;
}
.swal2-footer a:hover,
#swalContinueAsGuest:hover {
    color: #1c3f6e;
}
.swal2-dont-show-again {
    margin-top: 14px;
    font-size: 12.5px;
    color: #5a6a80;
}
.swal2-dont-show-again label {
    cursor: pointer;
}