/* Responsive Header Padding */
.headerpadding { padding-right: 80px; padding-left: 80px; transition: padding 0.3s ease-in-out; }
@media (max-width: 1399px) { .headerpadding { padding-right: 30px; padding-left: 30px; } }
@media (max-width: 767px) { .headerpadding { padding-right: 15px; padding-left: 15px; } }

/* User Icon & Modal CSS (Prefixed) */
.header-account-icon.loginmodalpopup-open-login-modal-trigger, .icon-btn.loginmodalpopup-open-login-modal-trigger { background: none; border: none; padding: 0; cursor: pointer; vertical-align: middle; }
.loginmodalpopup-otp-button {width:100%; background-color: #1c714e; color: white; padding: 10px 16px; border: none; border-radius: 6px; cursor: pointer; font-weight: 600; transition: background-color 0.3s; }
.loginmodalpopup-otp-button:hover { background-color: #b88f4c; }
.loginmodalpopup-otp-button:disabled { background-color: #cccccc; cursor: not-allowed; }
.loginmodalpopup-otp-button.secondary { background-color: #aaa; margin-left: 10px; flex-basis: 48%; }
.loginmodalpopup-otp-button[name="verify_otp"] { flex-basis: 48%; }
.loginmodalpopup-otp-modal-overlay { display: none; position: fixed; z-index: 99999; top: 0; left: 0; height: 100vh; width: 100vw; background: rgba(0, 0, 0, 0.6); justify-content: center; align-items: center; }
.loginmodalpopup-otp-modal { position: relative; background: white; border-radius: 8px; max-width: 420px; width: 90%; animation: loginmodalpopup-fadeInScale 0.3s ease-in-out; }
.loginmodalpopup-otp-modal-close { position: absolute; top: 10px; right: 15px; font-size: 22px; font-weight: bold; color: #333; cursor: pointer; }
@keyframes loginmodalpopup-fadeInScale { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.loginmodalpopup-otp-card-wrapper { display: flex; justify-content: center; align-items: center; }
.loginmodalpopup-otp-card { width: 100%; max-width: 400px; background: white; border-radius: 8px;  overflow: hidden; display: flex; flex-direction: column; }
.loginmodalpopup-otp-card-image { background-color: #faf7f1; }
.loginmodalpopup-otp-card-image img { width: 100%; height: 160px; object-fit: cover; }
.loginmodalpopup-otp-card-content { padding: 30px 20px; display: flex; flex-direction: column; justify-content: center; text-align:center }
.loginmodalpopup-otp-title { font-size: 20px; font-weight: bold; margin-bottom: 5px; text-align: center; }
.loginmodalpopup-otp-subtitle { font-size: 14px; margin-bottom: 16px; color: #444; text-align: center; }
.loginmodalpopup-input-group { display: flex; align-items: center; border: 1px solid #ccc; border-radius: 6px; overflow: hidden; margin-bottom: 15px; }
.loginmodalpopup-flag-prefix { background: #f2f2f2; padding: 15px 12px; font-size: 14px; white-space: nowrap; }
.loginmodalpopup-otp-input { width: 100%; box-sizing: border-box; flex: 1; border: none; padding: 12px; font-size: 14px; outline: none; }
.loginmodalpopup-checkbox-wrap { margin-top: 8px; text-align: left; font-size: 12px; }
.loginmodalpopup-checkbox-wrap input { margin-right: 8px; }
.loginmodalpopup-checkbox-wrap label { font-size: 12px !important; color: #444; }

/* Styles for Inline Messages within the modal */
#loginmodalpopup-otp-message .success { color: #1c714e; }
#loginmodalpopup-otp-message .error { color: #d9534f; }