/* Style the MoMo payment iframe area */
#momo_number_wrap,
#woomomo-momo-iframe-area,
#woomomo-momo-iframe-area * {
    box-sizing: border-box;
}

#woomomo-momo-iframe-area {
    max-width: 380px;
    margin: 30px auto 0 auto;
    background: #fffbe7;
    border: 1px solid #ffe28a;
    border-radius: 12px;
    padding: 28px 32px 20px 32px;
    box-shadow: 0 4px 16px rgba(255,194,51,0.12);
    text-align: center;
    font-family: 'Segoe UI', Arial, sans-serif;
}

#woomomo-momo-iframe-area h4 {
    margin-top: 0;
    color: #ffbb00;
    letter-spacing: 0.02em;
    font-weight: 700;
    font-size: 1.18em;
}

#woomomo-momo-iframe-area ol {
    margin: 0 0 18px 20px;
    padding: 0;
    color: #333;
    font-size: 0.97em;
}

#woomomo-momo-iframe-area label {
    display: block;
    margin: 15px 0 8px 0;
    font-weight: 600;
    color: #795900;
    font-size: 1.04em;
}

#woomomo-momo-iframe-area input[type="text"]#momo_number {
    background: #fff9e1;
    border: 1.5px solid #ffbb00;
    border-radius: 6px;
    font-size: 1.13em;
    color: #795900;
    padding: 7px 13px;
    width: 100%;
    max-width: 240px;
    text-align: center;
    letter-spacing: 1px;
    outline: none;
    margin-bottom: 0;
    font-weight: bold;
    box-shadow: 0 2px 8px rgba(255,221,77,0.06);
}

#woomomo-momo-iframe-area #commonname {
    min-height: 26px;
    margin-bottom: 10px;
    font-size: 1em;
    font-weight: 500;
}

#woomomo-momo-iframe-area button {
    appearance: none;
    border: none;
    border-radius: 7px;
    padding: 11px 32px;
    background: linear-gradient(90deg, #ffbb00 0%, #ffe28a 100%);
    color: #795900;
    font-size: 1.09em;
    font-weight: 700;
    cursor: pointer;
    margin: 8px 9px 0 9px;
    transition: background 0.18s, color 0.18s, box-shadow 0.18s;
    box-shadow: 0 2px 8px rgba(255,221,77,0.10);
}
#woomomo-momo-iframe-area button#pay_btn {
    background: linear-gradient(90deg, #ffbb00 0%, #ffe28a 100%);
    color: #795900;
}
#woomomo-momo-iframe-area button#complete_btn {
    background: linear-gradient(90deg, #ddd 0%, #fff 100%);
    color: #7a7a7a;
}
#woomomo-momo-iframe-area button:disabled {
    background: #f3e0a0 !important;
    color: #b6a46a !important;
    cursor: not-allowed;
    opacity: 0.7;
}

#woomomo-momo-iframe-area .momo-success {
    color: #0a8b2f;
    background: #e8fee8;
    border-radius: 6px;
    padding: 7px 7px;
    margin: 6px 0 0 0;
    font-weight: 600;
    font-size: 1em;
    display: inline-block;
}
#woomomo-momo-iframe-area .momo-error {
    color: #b90000;
    background: #ffe3e3;
    border-radius: 6px;
    padding: 7px 7px;
    margin: 6px 0 0 0;
    font-weight: 600;
    font-size: 1em;
    display: inline-block;
}