.elementor-1413 .elementor-element.elementor-element-6f4a16ac{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1413 .elementor-element.elementor-element-6f4a16ac:not(.elementor-motion-effects-element-type-background), .elementor-1413 .elementor-element.elementor-element-6f4a16ac > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#E6E6E6;}.elementor-1413 .elementor-element.elementor-element-6f4a16ac.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-1413 .elementor-element.elementor-element-10fb59c img{width:450px;border-radius:8px 8px 8px 8px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1413 .elementor-element.elementor-element-33f08db7{width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}@media(min-width:768px){.elementor-1413 .elementor-element.elementor-element-6f4a16ac{--width:100%;}}@media(max-width:1024px){.elementor-1413 .elementor-element.elementor-element-6f4a16ac{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-1413 .elementor-element.elementor-element-33f08db7.elementor-element{--align-self:center;}}@media(max-width:767px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-1413 .elementor-element.elementor-element-10fb59c img{border-radius:0px 0px 8px 8px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}}/* Start custom CSS for shortcode, class: .elementor-element-33f08db7 */@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Vidaloka&display=swap');

/* ===============================
   1. BACKGROUND HALAMAN LOGIN
================================ */
.woocommerce-account .site-main {
    background-color: #f2f2f2 !important;
    padding: 60px 0 !important;
}

/* ===============================
   2. CONTAINER PUTIH LOGIN
================================ */
.um {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    padding: 50px 50px !important;
    max-width: 450px !important;
    margin: 10px auto !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05) !important;
}

/* ===============================
   3. LOGO DI ATAS
================================ */
.custom-um-logo {
    display: block;
    margin: 0 auto 35px auto !important;
    max-width: 160px !important;
    height: auto !important;
}

/* ===============================
   4. HEADER / TITLE
================================ */
.um .um-field-label,
.um .um-field-label label {
    font-family: 'Vidaloka', serif !important;
    font-size: clamp(24px, 4vw, 24px) !important;
    font-weight: 600 !important;
    color: #1A383A !important;
    margin-bottom: 2px !important;
}

/* ===============================
   5. TEXT & LABEL BIASA
================================ */
.um,
.um * {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    color: #000000 !important;
}

/* ===============================
   6. INPUT FIELD
================================ */
.um .um-field-area input[type="text"],
.um .um-field-area input[type="password"],
.um .um-field-area input[type="email"] {
    background-color: #E3D5C8 !important;
    border: 2px solid #d1c1b2 !important;
    color: #000000 !important;
    height: 50px !important;
    border-radius: 8px !important;
    padding: 0 45px 0 15px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    font-family: 'Poppins', sans-serif !important;
}

/* Hilangkan efek biru default */
.um input:focus {
    background-color: #E3D5C8 !important;
    border-color: #1A383A !important;
    box-shadow: none !important;
}

/* ===============================
   7. TOGGLE PASSWORD ICON
================================ */
.um .password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 18px;
    color: #1A383A;
}

/* ===============================
   8. AREA BUTTON (SATU KOLOM)
================================ */
.um .um-col-alt {
    display: block !important;
    width: 100% !important;
    margin-top: 25px !important;
}

/* ===============================
   9. LOGIN BUTTON (PRIMARY)
================================ */
.um .um-button.um-login-button,
.um input[type=submit].um-button {
    background-color: #1A383A !important;
    color: #E3D5C8 !important;
    height: 55px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: 'Vidaloka', serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;

    border-radius: 8px !important;
    border: none !important;
    width: 100% !important;
    margin-bottom: 20px !important;
    transition: all 0.3s ease !important;
}

.um .um-button.um-login-button:hover,
.um input[type=submit].um-button:hover {
    background-color: #244d50 !important;
}

/* ===============================
   10. REGISTER JADI LINK "CREATE ACCOUNT"
================================ */
.um a.um-register-link {
    display: block !important;
    text-align: center !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    color: #1A383A !important;
    font-weight: 500 !important;
    margin-top: 10px !important;
    text-decoration: none !important;
}

.um a.um-register-link:hover {
    text-decoration: underline !important;
}

/* ===============================
   11. RESPONSIVE
================================ */
@media (max-width: 768px) {
    .um {
        padding: 35px 25px !important;
        margin: 40px 20px !important;
    }

    .custom-um-logo {
        max-width: 120px !important;
    }

    .um .um-field-label {
        font-size: 28px !important;
        text-align: center !important;
    }
}/* End custom CSS */