/* ============================================================
   CONTACT US PAGE STYLES
   ============================================================ */

/* 1. Direct Contact Channels (Phone, Email, YouTube) */
.dvk-header-phone-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #AD4F70, #7F3865) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    flex-shrink: 0 !important;
    box-shadow: 0 4px 12px rgba(173, 79, 112, 0.25) !important;
}
.dvk-header-phone-icon i {
    color: #ffffff !important;
    font-size: 14px !important;
}
.dvk-header-phone-icon[style*="#FF0000"] {
    background: linear-gradient(135deg, #FF0000 0%, #CC0000 100%) !important;
    box-shadow: 0 4px 12px rgba(255, 0, 0, 0.28) !important;
}

/* Card Hover States */
.content-wrapper.style-32 .row.g-3 .bg-white {
    transition: all 0.3s ease;
    border: 1px solid rgba(173, 79, 112, 0.12) !important;
    border-radius: 16px !important;
}
.content-wrapper.style-32 .row.g-3 .bg-white:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(45, 15, 30, 0.08) !important;
    border-color: rgba(173, 79, 112, 0.3) !important;
}

/* 2. Contact Form Card */
.content-wrapper.style-32 .form-wrapper.style-1 {
    background: #FFFFFF !important;
    border-radius: 20px !important;
    padding: 40px !important;
    border: 1px solid rgba(173, 79, 112, 0.15) !important;
    box-shadow: 0 12px 35px rgba(45, 15, 30, 0.06) !important;
}
.content-wrapper.style-32 .floating-underline.underline-1 .form-control {
    border-bottom: 2px solid rgba(173, 79, 112, 0.2) !important;
    font-size: 15px !important;
    color: #2D0F1E !important;
    font-weight: 500 !important;
    transition: border-color 0.3s ease !important;
}
.content-wrapper.style-32 .floating-underline.underline-1 .form-control:focus {
    border-bottom-color: #AD4F70 !important;
}
.content-wrapper.style-32 .floating-underline .input-group-text {
    color: #AD4F70 !important;
}
.content-wrapper.style-32 button[type="submit"] {
    background: linear-gradient(135deg, #AD5D4F 0%, #AD4F70 50%, #431A57 100%) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: 0 8px 24px rgba(173, 79, 112, 0.3) !important;
    transition: all 0.3s ease !important;
}
.content-wrapper.style-32 button[type="submit"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 30px rgba(173, 79, 112, 0.45) !important;
    background: linear-gradient(135deg, #8C3558 0%, #BB153D 100%) !important;
}

/* 3. Inline Country Code + Phone Group */
.content-wrapper.style-32 .contact-phone-group-wrap,
.contact-phone-group-wrap {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    border-bottom: 2px solid rgba(173, 79, 112, 0.2) !important;
    transition: border-color 0.3s ease !important;
    padding-left: 36px !important;
    box-sizing: border-box !important;
}
.content-wrapper.style-32 .contact-phone-group-wrap:focus-within,
.contact-phone-group-wrap:focus-within {
    border-bottom-color: #AD4F70 !important;
}
.content-wrapper.style-32 .contact-phone-group-wrap .input-group-text,
.contact-phone-group-wrap .input-group-text {
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #AD4F70 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    font-size: 16px !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
}
.content-wrapper.style-32 .contact-phone-inner,
.contact-phone-inner {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    flex: 1 1 auto !important;
}
.content-wrapper.style-32 select.contact-country-select,
select.contact-country-select {
    display: inline-block !important;
    width: 86px !important;
    min-width: 86px !important;
    max-width: 86px !important;
    flex: 0 0 86px !important;
    height: 48px !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #2D0F1E !important;
    padding: 6px 2px !important;
    outline: none !important;
    cursor: pointer !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
}
.content-wrapper.style-32 select.contact-country-select:focus,
select.contact-country-select:focus {
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
}
.content-wrapper.style-32 .contact-phone-divider,
.contact-phone-divider {
    color: rgba(173, 79, 112, 0.4) !important;
    font-weight: 300 !important;
    font-size: 18px !important;
    margin: 0 8px 0 2px !important;
    user-select: none !important;
    line-height: 1 !important;
}
.content-wrapper.style-32 input.contact-phone-input,
input.contact-phone-input {
    display: inline-block !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 48px !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 6px 4px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #2D0F1E !important;
    outline: none !important;
}
.content-wrapper.style-32 input.contact-phone-input:focus,
input.contact-phone-input:focus {
    border-bottom: none !important;
    box-shadow: none !important;
    outline: none !important;
}
.content-wrapper.style-32 input.contact-phone-input::placeholder,
input.contact-phone-input::placeholder {
    color: rgba(45, 15, 30, 0.6) !important;
    font-weight: 400 !important;
}