/* =================================================================
   Custom Tour Planner & Contact Form — ctp-forms.css  v3.0
   Peakventure warm-dark theme — matches booking modal exactly.
   All selectors scoped to .ctp-wrap and use !important to defeat
   any theme / page-builder interference.
   bg: #1a1208   card: #211608   border: rgba(245,166,35,.15)
   gold: #F5A623   text: #fff   muted: rgba(255,255,255,.5)
================================================================= */

/* ── Reset scope ─────────────────────────────────────────── */
.ctp-wrap *,
.ctp-wrap *::before,
.ctp-wrap *::after {
    box-sizing: border-box !important;
}

/* ── Outer wrapper ──────────────────────────────────────── */
.ctp-wrap,
div.ctp-wrap,
#ctp-tour-wrap,
#ctp-contact-wrap {
    display:       block !important;
    width:         100% !important;
    max-width:     720px !important;
    margin:        0 auto !important;
    background:    #1a1208 !important;
    border-radius: 16px !important;
    padding:       32px 36px 30px !important;
    box-sizing:    border-box !important;
    font-family:   'Plus Jakarta Sans', sans-serif !important;
    color:         #ffffff !important;
    position:      relative !important;
    border:        1px solid rgba(245,166,35,.15) !important;
    box-shadow:    0 16px 48px rgba(0,0,0,.45) !important;
}

@media screen and (max-width: 680px) {
    .ctp-wrap,
    div.ctp-wrap,
    #ctp-tour-wrap,
    #ctp-contact-wrap {
        padding:       22px 18px 22px !important;
        border-radius: 12px !important;
    }
}

/* ── Header ─────────────────────────────────────────────── */
.ctp-wrap .ctp-head {
    display:       block !important;
    margin-bottom: 20px !important;
    padding:       0 !important;
    background:    none !important;
    border:        none !important;
}

.ctp-wrap .ctp-title {
    display:        block !important;
    font-size:      1.2rem !important;
    font-weight:    800 !important;
    color:          #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    margin:         0 0 7px 0 !important;
    padding:        0 !important;
    line-height:    1.2 !important;
    background:     none !important;
    border:         none !important;
    text-shadow:    none !important;
}

.ctp-wrap .ctp-sub {
    display:     block !important;
    font-size:   0.85rem !important;
    color:       rgba(255,255,255,.5) !important;
    margin:      0 !important;
    padding:     0 !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
}

/* ── Intro info message ─────────────────────────────────── */
.ctp-wrap .ctp-intro-msg {
    display:       flex !important;
    align-items:   flex-start !important;
    gap:           10px !important;
    background:    rgba(245,166,35,.07) !important;
    border:        1px solid rgba(245,166,35,.25) !important;
    border-radius: 8px !important;
    padding:       11px 14px !important;
    margin-bottom: 20px !important;
    font-size:     0.83rem !important;
    color:         rgba(255,255,255,.65) !important;
    line-height:   1.55 !important;
}

.ctp-wrap .ctp-intro-msg svg {
    flex-shrink:   0 !important;
    margin-top:    2px !important;
    stroke:        #F5A623 !important;
}

.ctp-wrap .ctp-intro-msg.ctp-hidden {
    display: none !important;
}

/* ── Grid layout ────────────────────────────────────────── */
.ctp-wrap .ctp-row {
    display:       block !important;
    margin-bottom: 13px !important;
    padding:       0 !important;
}

.ctp-wrap .ctp-cols-1 {
    display: block !important;
}

.ctp-wrap .ctp-cols-2 {
    display:               grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap:                   13px !important;
}

.ctp-wrap .ctp-cols-3 {
    display:               grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap:                   13px !important;
}

@media screen and (max-width: 580px) {
    .ctp-wrap .ctp-cols-2,
    .ctp-wrap .ctp-cols-3 {
        grid-template-columns: 1fr !important;
    }
}

/* ── Field container ────────────────────────────────────── */
.ctp-wrap .ctp-field {
    display:        flex !important;
    flex-direction: column !important;
    gap:            5px !important;
    margin:         0 !important;
    padding:        0 !important;
}

/* ── Labels ─────────────────────────────────────────────── */
.ctp-wrap .ctp-lbl {
    display:        block !important;
    font-size:      0.67rem !important;
    font-weight:    700 !important;
    color:          rgba(255,255,255,.5) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.9px !important;
    line-height:    1.2 !important;
    margin:         0 !important;
    padding:        0 !important;
    background:     none !important;
    border:         none !important;
}

.ctp-wrap .ctp-star {
    color:       #F5A623 !important;
    font-weight: 700 !important;
    margin-left: 2px !important;
}

/* ── All inputs, textareas, selects ─────────────────────── */
.ctp-wrap input.ctp-inp,
.ctp-wrap textarea.ctp-inp,
.ctp-wrap select.ctp-inp {
    display:            block !important;
    width:              100% !important;
    padding:            9px 12px !important;
    font-size:          0.875rem !important;
    font-family:        'Plus Jakarta Sans', sans-serif !important;
    font-weight:        400 !important;
    color:              #ffffff !important;
    background:         rgba(255,255,255,.07) !important;
    border:             1.5px solid rgba(255,255,255,.12) !important;
    border-radius:      8px !important;
    outline:            none !important;
    transition:         border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
    -webkit-appearance: none !important;
    -moz-appearance:    none !important;
    appearance:         none !important;
    box-shadow:         none !important;
    margin:             0 !important;
    min-height:         42px !important;
    line-height:        1.45 !important;
    box-sizing:         border-box !important;
    color-scheme:       dark !important;
}

.ctp-wrap input.ctp-inp:focus,
.ctp-wrap textarea.ctp-inp:focus,
.ctp-wrap select.ctp-inp:focus {
    border-color: rgba(245,166,35,.75) !important;
    background:   rgba(255,255,255,.09) !important;
    box-shadow:   0 0 0 3px rgba(245,166,35,.12) !important;
    color:        #ffffff !important;
    outline:      none !important;
}

.ctp-wrap input.ctp-inp::placeholder,
.ctp-wrap textarea.ctp-inp::placeholder {
    color:   rgba(255,255,255,.28) !important;
    opacity: 1 !important;
}

/* Autofill — kills browser white bg injection */
.ctp-wrap input.ctp-inp:-webkit-autofill,
.ctp-wrap input.ctp-inp:-webkit-autofill:hover,
.ctp-wrap input.ctp-inp:-webkit-autofill:focus,
.ctp-wrap input.ctp-inp:-webkit-autofill:active {
    -webkit-box-shadow:      0 0 0 100px #1e1508 inset !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color:             #ffffff !important;
    background-color:        #1e1508 !important;
    transition:              background-color 9999s ease !important;
}

/* Number — hide arrows */
.ctp-wrap input[type="number"].ctp-inp::-webkit-outer-spin-button,
.ctp-wrap input[type="number"].ctp-inp::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin:             0 !important;
}
.ctp-wrap input[type="number"].ctp-inp { -moz-appearance: textfield !important; }

/* Date */
.ctp-wrap input[type="date"].ctp-inp { color-scheme: dark !important; }

/* Textarea */
.ctp-wrap textarea.ctp-inp {
    resize:     vertical !important;
    min-height: 95px !important;
}

/* Select — custom chevron */
.ctp-wrap select.ctp-inp {
    cursor:              pointer !important;
    padding-right:       36px !important;
    background-image:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='rgba(245,166,35,0.7)' d='M5 6L0 0h10z'/%3E%3C/svg%3E") !important;
    background-repeat:   no-repeat !important;
    background-position: right 12px center !important;
    background-size:     10px 6px !important;
    color-scheme:        dark !important;
}

/* Dropdown options — aggressive dark override */
.ctp-wrap select.ctp-inp option,
.ctp-wrap select.ctp-inp option:checked,
.ctp-wrap select.ctp-inp option:hover,
.ctp-wrap select.ctp-inp option:focus,
.ctp-wrap select.ctp-inp option:active {
    background:          #1e1508 !important;
    background-color:    #1e1508 !important;
    color:               #ffffff !important;
    font-size:           0.875rem !important;
    font-family:         'Plus Jakarta Sans', sans-serif !important;
}
.ctp-wrap select.ctp-inp option:checked {
    background:          #3a2510 !important;
    background-color:    #3a2510 !important;
    color:               #F5A623 !important;
}

/* ── Pill radio/checkbox buttons ────────────────────────── */
.ctp-wrap .ctp-pills {
    display:   flex !important;
    flex-wrap: wrap !important;
    gap:       8px !important;
    margin:    0 !important;
    padding:   0 !important;
}

.ctp-wrap .ctp-pill {
    display:    inline-flex !important;
    margin:     0 !important;
    padding:    0 !important;
    border:     none !important;
    background: none !important;
    cursor:     pointer !important;
}

.ctp-wrap .ctp-pill input[type="radio"],
.ctp-wrap .ctp-pill input[type="checkbox"] {
    position: absolute !important;
    opacity:  0 !important;
    width:    0 !important;
    height:   0 !important;
    margin:   0 !important;
}

.ctp-wrap .ctp-pill > span {
    display:       inline-block !important;
    padding:       7px 15px !important;
    font-size:     0.8rem !important;
    font-weight:   600 !important;
    border:        1.5px solid rgba(255,255,255,.14) !important;
    border-radius: 6px !important;
    background:    rgba(255,255,255,.06) !important;
    color:         rgba(255,255,255,.6) !important;
    transition:    all .15s ease !important;
    user-select:   none !important;
    cursor:        pointer !important;
    white-space:   nowrap !important;
    line-height:   1.2 !important;
}

.ctp-wrap .ctp-pill:hover > span {
    border-color: rgba(245,166,35,.6) !important;
    color:        rgba(255,255,255,.9) !important;
    background:   rgba(245,166,35,.08) !important;
}

.ctp-wrap .ctp-pill input:checked + span {
    background:   #F5A623 !important;
    border-color: #F5A623 !important;
    color:        #0F0F0F !important;
    font-weight:  700 !important;
    box-shadow:   0 2px 10px rgba(245,166,35,.3) !important;
}

/* ── Required note ──────────────────────────────────────── */
.ctp-wrap .ctp-req-note {
    display:     block !important;
    font-size:   0.74rem !important;
    color:       rgba(255,255,255,.3) !important;
    margin:      0 0 14px !important;
    padding:     0 !important;
}

.ctp-wrap .ctp-req-note .ctp-star {
    color: #F5A623 !important;
}

/* ── Divider between name/phone and fields ──────────────── */
.ctp-wrap hr,
.ctp-wrap .ctp-sep {
    border:        none !important;
    border-top:    1px solid rgba(255,255,255,.08) !important;
    margin:        4px 0 14px !important;
}

/* ── Submit button ──────────────────────────────────────── */
.ctp-wrap button.ctp-btn {
    display:         inline-flex !important;
    align-items:     center !important;
    justify-content: center !important;
    gap:             9px !important;
    width:           100% !important;
    min-height:      48px !important;
    padding:         12px 24px !important;
    font-size:       0.88rem !important;
    font-weight:     700 !important;
    font-family:     'Plus Jakarta Sans', sans-serif !important;
    letter-spacing:  0.7px !important;
    text-transform:  uppercase !important;
    color:           #0F0F0F !important;
    background:      #F5A623 !important;
    border:          none !important;
    border-radius:   8px !important;
    cursor:          pointer !important;
    transition:      background .18s ease, transform .1s ease, box-shadow .18s !important;
    margin:          4px 0 0 !important;
    -webkit-appearance: none !important;
    appearance:         none !important;
    box-shadow:      0 4px 16px rgba(245,166,35,.25) !important;
    line-height:     1 !important;
}

.ctp-wrap button.ctp-btn:hover {
    background:  #f0a020 !important;
    color:       #0F0F0F !important;
    box-shadow:  0 6px 20px rgba(245,166,35,.38) !important;
}

.ctp-wrap button.ctp-btn:active {
    transform: scale(.985) !important;
}

.ctp-wrap button.ctp-btn:disabled {
    opacity: .5 !important;
    cursor:  not-allowed !important;
}

/* WhatsApp icon */
.ctp-wrap .ctp-wa-ico {
    display:     inline-block !important;
    width:       18px !important;
    height:      18px !important;
    flex-shrink: 0 !important;
    fill:        #0F0F0F !important;
    margin:      0 !important;
    padding:     0 !important;
    vertical-align: middle !important;
}

/* Spinner */
.ctp-wrap .ctp-spinner {
    display:          none !important;
    width:            17px !important;
    height:           17px !important;
    border:           2px solid rgba(15,15,15,0.3) !important;
    border-top-color: #0F0F0F !important;
    border-radius:    50% !important;
    animation:        ctp-spin .65s linear infinite !important;
    flex-shrink:      0 !important;
    margin:           0 !important;
}

.ctp-wrap button.ctp-btn.ctp-loading .ctp-spinner { display: inline-block !important; }
.ctp-wrap button.ctp-btn.ctp-loading .ctp-btn-txt { opacity: .75 !important; }
.ctp-wrap button.ctp-btn.ctp-loading .ctp-wa-ico  { display: none !important; }

@keyframes ctp-spin { to { transform: rotate(360deg); } }

/* ── Messages ───────────────────────────────────────────── */
.ctp-wrap .ctp-msg {
    display:       none;
    margin-top:    14px !important;
    padding:       11px 15px !important;
    border-radius: 7px !important;
    font-size:     0.86rem !important;
    font-weight:   600 !important;
    line-height:   1.5 !important;
    text-align:    center !important;
}

.ctp-wrap .ctp-msg.is-visible {
    display: block !important;
}

.ctp-wrap .ctp-msg-ok {
    background: rgba(40,167,69,.12) !important;
    border:     1px solid rgba(40,167,69,.4) !important;
    color:      #7fd498 !important;
}

.ctp-wrap .ctp-msg-err {
    background:  rgba(220,53,69,.1) !important;
    border:      1px solid rgba(220,53,69,.35) !important;
    color:       #f08080 !important;
    text-align:  left !important;
    font-weight: 500 !important;
}

/* ── Validation error highlight ─────────────────────────── */
.ctp-wrap input.ctp-inp.ctp-err,
.ctp-wrap textarea.ctp-inp.ctp-err,
.ctp-wrap select.ctp-inp.ctp-err {
    border-color: rgba(220,53,69,.7) !important;
    box-shadow:   0 0 0 3px rgba(220,53,69,.1) !important;
}

.ctp-wrap .ctp-field-err {
    display:     block !important;
    font-size:   0.72rem !important;
    color:       #f08080 !important;
    margin:      3px 0 0 !important;
    padding:     0 !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}