.elementor-510 .elementor-element.elementor-element-bab8d7c{--display:flex;--min-height:100vh;--justify-content:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-login .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-login .elementor-field-group > a{color:var( --e-global-color-text );}.elementor-widget-login .elementor-field-group > a:hover{color:var( --e-global-color-accent );}.elementor-widget-login .elementor-form-fields-wrapper label{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-login .elementor-field-group .elementor-field{color:var( --e-global-color-text );}.elementor-widget-login .elementor-field-group .elementor-field, .elementor-widget-login .elementor-field-subgroup label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-login .elementor-widget-container .elementor-login__logged-in-message{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-510 .elementor-element.elementor-element-efbe28f .elementor-field-group{margin-bottom:10px;}.elementor-510 .elementor-element.elementor-element-efbe28f .elementor-form-fields-wrapper{margin-bottom:-10px;}body .elementor-510 .elementor-element.elementor-element-efbe28f .elementor-field-group > label{padding-bottom:0px;}.elementor-510 .elementor-element.elementor-element-efbe28f .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-510 .elementor-element.elementor-element-efbe28f .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}@media(max-width:1024px){.elementor-510 .elementor-element.elementor-element-efbe28f > .elementor-widget-container{padding:0px 0px 0px 0px;}}/* Start custom CSS *//* COMPLETE HAMPTON EXTERIORS LOGIN PAGE DESIGN - RESPONSIVE */

/* Page Background */
body.elementor-page-510 {
    background: #000000;
    background-image: 
        radial-gradient(circle at 20% 50%, rgba(255, 140, 66, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(255, 140, 66, 0.1) 0%, transparent 50%);
    min-height: 100vh;
    position: relative;
    overflow: hidden;
    padding: 20px !important;
}

/* Container for all content - Centers everything */
body.elementor-page-510 .elementor-container {
    max-width: 500px !important;
    margin: 0 auto !important;
    width: 100% !important;
}

/* LOGO STYLING - Responsive */
body.elementor-page-510 .elementor-widget-image {
    margin-bottom: 20px !important;
}

body.elementor-page-510 .elementor-widget-image img {
    max-width: 220px !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    filter: 
        drop-shadow(0 0 30px rgba(255, 140, 66, 0.5))
        brightness(1.1);
    animation: floatLogo 6s ease-in-out infinite;
}

@keyframes floatLogo {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

/* LOGIN FORM CONTAINER - Responsive */
body.elementor-page-510 .elementor-login {
    width: 100% !important;
}

body.elementor-page-510 .elementor-form-fields-wrapper {
    background: linear-gradient(135deg, 
        rgba(20, 20, 20, 0.98) 0%, 
        rgba(30, 30, 30, 0.95) 100%);
    border: 2px solid rgba(255, 140, 66, 0.2);
    border-radius: 20px;
    padding: 30px !important;
    box-shadow: 
        0 30px 60px rgba(0, 0, 0, 0.8),
        0 0 100px rgba(255, 140, 66, 0.15);
    width: 100% !important;
    max-width: 450px !important;
    margin: 0 auto !important;
}

/* Form field containers */
body.elementor-page-510 .elementor-field-group {
    margin-bottom: 20px !important;
}

body.elementor-page-510 .elementor-field-group:last-of-type {
    margin-bottom: 0 !important;
}

/* LABELS */
body.elementor-page-510 .elementor-field-label {
    color: #FF8C42 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 8px !important;
    display: block !important;
}

/* INPUT FIELDS */
body.elementor-page-510 .elementor-field {
    background: rgba(230, 230, 250, 0.95) !important;
    border: 2px solid transparent !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
    font-size: 16px !important;
    color: #1a1a1a !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
}

body.elementor-page-510 .elementor-field:focus {
    background: #ffffff !important;
    border-color: #FF8C42 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(255, 140, 66, 0.2) !important;
}

/* SUBMIT BUTTON */
body.elementor-page-510 .elementor-button {
    background: linear-gradient(135deg, #FF8C42 0%, #ff6b1a 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 16px 32px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    color: #ffffff !important;
    width: 100% !important;
    margin-top: 20px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 6px 20px rgba(255, 140, 66, 0.4) !important;
}

body.elementor-page-510 .elementor-button:hover {
    background: linear-gradient(135deg, #ff9d5c 0%, #FF8C42 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 140, 66, 0.5) !important;
}

/* Remember Me Checkbox */
body.elementor-page-510 .elementor-field-type-checkbox {
    margin: 15px 0 !important;
}

body.elementor-page-510 .elementor-field-option label {
    color: #cccccc !important;
    font-size: 14px !important;
}

/* Lost Password Link */
body.elementor-page-510 .elementor-lost-password {
    color: #FF8C42 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    display: inline-block !important;
    margin-top: 15px !important;
    transition: color 0.3s ease !important;
}

body.elementor-page-510 .elementor-lost-password:hover {
    color: #ffffff !important;
}

/* ============================================
   RESPONSIVE DESIGN - TABLET & MOBILE
   ============================================ */

/* Tablet View (768px - 1024px) */
@media (max-width: 1024px) and (min-width: 768px) {
    body.elementor-page-510 {
        padding: 40px 30px !important;
    }
    
    body.elementor-page-510 .elementor-container {
        max-width: 600px !important;
    }
    
    body.elementor-page-510 .elementor-form-fields-wrapper {
        padding: 35px !important;
        max-width: 100% !important;
    }
    
    body.elementor-page-510 .elementor-widget-image img {
        max-width: 200px !important;
    }
    
    body.elementor-page-510 .elementor-field {
        font-size: 16px !important;
        padding: 14px 16px !important;
    }
    
    body.elementor-page-510 .elementor-button {
        padding: 16px 30px !important;
        font-size: 16px !important;
    }
}

/* Mobile View (max-width: 767px) */
@media (max-width: 767px) {
    body.elementor-page-510 {
        padding: 20px 15px !important;
    }
    
    body.elementor-page-510 .elementor-container {
        padding: 0 !important;
    }
    
    body.elementor-page-510 .elementor-widget-image img {
        max-width: 180px !important;
    }
    
    body.elementor-page-510 .elementor-form-fields-wrapper {
        padding: 25px 20px !important;
        border-radius: 15px !important;
    }
    
    body.elementor-page-510 .elementor-field-label {
        font-size: 11px !important;
    }
    
    body.elementor-page-510 .elementor-field {
        font-size: 15px !important;
        padding: 12px 14px !important;
    }
    
    body.elementor-page-510 .elementor-button {
        padding: 14px 24px !important;
        font-size: 14px !important;
        letter-spacing: 1px !important;
    }
    
    body.elementor-page-510 .elementor-lost-password {
        font-size: 13px !important;
    }
}

/* Small Mobile (max-width: 480px) */
@media (max-width: 480px) {
    body.elementor-page-510 .elementor-widget-image img {
        max-width: 150px !important;
    }
    
    body.elementor-page-510 .elementor-form-fields-wrapper {
        padding: 20px 15px !important;
    }
    
    body.elementor-page-510 .elementor-button {
        font-size: 13px !important;
        padding: 12px 20px !important;
    }
}

/* Ensure form stays centered on all devices */
@media (max-width: 1024px) {
    body.elementor-page-510 .elementor-login-form,
    body.elementor-page-510 .elementor-form {
        margin: 0 auto !important;
        width: 100% !important;
    }
    
    body.elementor-page-510 .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
        padding: 10px !important;
    }
}

/* Fix for Elementor columns on mobile */
@media (max-width: 767px) {
    body.elementor-page-510 .elementor-column {
        width: 100% !important;
    }
    
    body.elementor-page-510 .elementor-widget-wrap {
        padding: 0 !important;
    }
}
/* Prevent ALL horizontal scrolling and movement */
html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
    position: relative !important;
}

/* Specific fix for login page */
body.login {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    max-width: 100vw !important;
    position: fixed !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    touch-action: pan-y pinch-zoom !important; /* Only allow vertical scroll */
}

/* Prevent elastic scrolling on iOS */
body.login #login {
    overflow-x: hidden !important;
    max-width: 100% !important;
    position: relative !important;
    touch-action: pan-y pinch-zoom !important;
}

/* Lock the login form container */
body.login #loginform,
body.login form {
    overflow-x: hidden !important;
    touch-action: pan-y pinch-zoom !important;
}

/* Prevent any element from causing horizontal scroll */
body.login * {
    max-width: 100% !important;
}

/* Additional prevention for all pages in PWA */
@media all and (display-mode: standalone) {
    html, body {
        overflow-x: hidden !important;
        overscroll-behavior-x: contain !important;
        touch-action: pan-y pinch-zoom !important;
    }
}

/* Nuclear option - prevent ALL horizontal touch movement */
.login {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: none !important;
    -ms-touch-action: pan-y pinch-zoom !important;
    touch-action: pan-y pinch-zoom !important;
}/* End custom CSS */