.elementor-3877 .elementor-element.elementor-element-57786226 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-3877 .elementor-element.elementor-element-7987152e:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-3877 .elementor-element.elementor-element-7987152e > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#fbfbfb;}.elementor-bc-flex-widget .elementor-3877 .elementor-element.elementor-element-7987152e.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-3877 .elementor-element.elementor-element-7987152e.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-3877 .elementor-element.elementor-element-7987152e > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-3877 .elementor-element.elementor-element-7987152e > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.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-3877 .elementor-element.elementor-element-52afae5 img{width:250px;max-width:250px;}.elementor-3877 .elementor-element.elementor-element-788f6aee:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-3877 .elementor-element.elementor-element-788f6aee > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFBFB;background-image:url("https://www.roomii.de/wp-content/uploads/2026/02/carpenter-male-dressed-safety-yellow-cap-works-with-chn-saw-garage.webp");background-position:center center;background-repeat:no-repeat;}.elementor-3877 .elementor-element.elementor-element-788f6aee > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-3877 .elementor-element.elementor-element-788f6aee > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-3877 .elementor-element.elementor-element-20b89dde{--spacer-size:100vh;}body.elementor-page-3877:not(.elementor-motion-effects-element-type-background), body.elementor-page-3877 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFBFB;}@media(max-width:1023px){.elementor-3877 .elementor-element.elementor-element-52afae5 img{width:150px;max-width:150px;}}@media(max-width:767px){.elementor-3877 .elementor-element.elementor-element-7987152e > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:50px 0px 50px 0px;}}@media(max-width:480px){.elementor-3877 .elementor-element.elementor-element-7987152e > .elementor-element-populated{padding:30px 0px 30px 0px;}}@media(max-width:767px) and (min-width:481px){.elementor-3877 .elementor-element.elementor-element-7987152e{width:100%;}}/* Start custom CSS for hivepress-user-login-form, class: .elementor-element-497abd82 *//* --- 1. Main Form Card Container --- */
.hp-form--user-login {
    background-color: #ffffff;
    padding: 40px 35px; /* More padding for a spacious look */
    border-radius: 12px; /* Smooth rounded corners */
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08); /* Soft shadow */
    border: 1px solid #e5e7eb;
    max-width: 420px;
    margin: 0 auto;
}

/* --- 2. Input Fields (The Text Boxes) --- */
/* Fix: Changed from "Pill" shape to "Rounded Rectangle" to match card */
.hp-form--user-login input.hp-field {
    background-color: #ffffff;
    border: 1px solid #d1d5db; /* Clean grey border */
    border-radius: 8px !important; /* Forces 8px corners */
    padding: 12px 16px;
    font-size: 15px;
    color: #333;
    width: 100%;
    transition: all 0.3s ease;
    height: auto; /* Prevents Elementor from squashing them */
}

/* Input Focus State (Active) */
.hp-form--user-login input.hp-field:focus {
    border-color: #255886; /* Your Brand Blue */
    box-shadow: 0 0 0 4px rgba(37, 88, 134, 0.1); /* Blue glow */
    outline: none;
}

/* --- 3. Labels (Username/Password text) --- */
.hp-form--user-login .hp-field__label {
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
    margin-bottom: 8px;
    display: block;
    text-transform: none; /* Removed uppercase for a friendlier look */
}

/* --- 4. Submit Button --- */
.hp-form--user-login button.hp-form__button {
    width: 100%;
    background-color: #255886; /* Your Brand Blue */
    color: #ffffff;
    font-weight: 600;
    font-size: 16px;
    padding: 14px;
    border-radius: 8px !important; /* Matches the inputs */
    border: none;
    cursor: pointer;
    margin-top: 15px;
    transition: background-color 0.3s ease;
}

.hp-form--user-login button.hp-form__button:hover {
    background-color: #1a4266; /* Darker blue on hover */
    transform: translateY(-1px);
}

/* --- 5. Footer Links (Register / Forgot Password) --- */
.hp-form--user-login .hp-form__footer {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid #f3f4f6; /* Separator line */
    text-align: center;
}

.hp-form--user-login .hp-form__actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    color: #6b7280;
}

/* Link Colors */
.hp-form--user-login .hp-form__actions a {
    color: #255886; /* Brand Blue */
    text-decoration: none;
    font-weight: 500;
}

.hp-form--user-login .hp-form__actions a:hover {
    text-decoration: underline;
}

/* Removes default margins on the "Register" text */
.hp-form--user-login .hp-form__action--user-register {
    margin: 0;
}

/* --- 6. Hide Password Eye Icon Adjustments --- */
.hp-form--user-login .hp-field__icon {
    /* Use 'auto' to stop it from looking at the label height */
    top: auto; 
    /* Anchor it from the bottom so it sits inside the input padding */
    bottom: 12px; 
    right: 15px;
    color: #9ca3af;
    transform: none; /* Remove the previous centering shift */
}/* End custom CSS */