@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_UltraLight.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_UltraLight.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_UltraLight.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_UltraLight.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_UltraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Light.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Light.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_Light.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_Light.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Regular.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Regular.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_Regular.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_Regular.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Medium.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Medium.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_Medium.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_Medium.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Bold.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Bold.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_Bold.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_Bold.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_Bold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Black.otf');
    src: url('../fonts/IRANSans/otf/IRANSansWeb_Black.otf?#iefix') format('embedded-opentype'),
         url('../fonts/IRANSans/woff/IRANSansWeb_Black.woff') format('woff'),
         url('../fonts/IRANSans/woff2/IRANSansWeb_Black.woff2') format('woff2'),
         url('../fonts/IRANSans/ttf/IRANSansWeb_Black.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

 .otp-login-wrapper {
     font-family: "IRANSans";
     min-height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px;
     background: #fafafa;
     background-size: 400% 400%;
     direction: rtl;
 }

 .otp-card {
     background: #ffffff;
     border-radius: 6px;
     box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
     width: 100%;
     max-width: 440px;
     overflow: hidden;
     box-shadow: 0 0 10px rgb(0 0 0 / 3%);
     padding: 30px;
 }

 .otp-icon-wrapper {
     width: 80px;
     height: 80px;
     margin: 0 auto 20px;
     background: rgba(255, 255, 255, 0.2);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     backdrop-filter: blur(10px);
     border: 2px solid rgba(255, 255, 255, 0.3);
     position: relative;
     z-index: 1;
 }

 .otp-icon-wrapper i {
     font-size: 36px;
     color: #ffffff;
 }

 .otp-card-header {
     text-align: center;
     margin-bottom: 50px;
 }

 .otp-card-header h2 {
     text-align: center;
     color: #0082FD;
     font-size: 22px;
     font-weight: 800;
 }

 .otp-card-header p {
     color: #5aa2e5;
     font-size: 14px;
     margin: 0;
     position: relative;
     z-index: 1;
 }

 .otp-field-group {
     margin-bottom: 20px;
 }

 .otp-field-group label {
     display: block;
     font-size: 15px;
     color: #6d6b6b;
     margin-bottom: 8px;
 }

 .otp-input-wrapper {
     position: relative;
 }

 .otp-input-wrapper i {
     position: absolute;
     right: 16px;
     top: 50%;
     transform: translateY(-50%);
     color: #9ca3af;
     font-size: 18px;
     transition: color 0.3s;
 }

 .otp-input {
     width: 100%;
     padding: 14px 50px 14px 16px;
     border: 1px solid #e0e0e2;
     border-radius: 8px;
     font-size: 16px;
     transition: all 0.3s;
     color: #111827;
     direction: ltr;
     text-align: center;
     letter-spacing: 2px;
 }

 .otp-input:focus {
     outline: none;
     border-color: #667eea;
     background: #ffffff;
     box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.1);
 }

 .otp-input:focus+i,
 .otp-input-wrapper:focus-within i {
     color: #667eea;
 }

 .otp-btn-primary {
     width: 100%;
     padding: 14px;
     color: #ffffff;
     border: none;
     border-radius: 8px;
     font-size: 16px;
     cursor: pointer;
     transition: all 0.3s;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     background: #097eec;
 }

 .otp-btn-primary:active:not(:disabled) {
     transform: translateY(0);
 }

 .otp-btn-primary:disabled {
     opacity: 0.7;
     cursor: not-allowed;
 }

 .otp-btn-link {
     width: 100%;
     padding: 10px;
     background: transparent;
     color: #667eea;
     border: none;
     font-size: 14px;
     font-weight: 500;
     cursor: pointer;
     transition: color 0.3s;
     margin-top: 8px;
 }

 .otp-btn-link:hover {
     color: #764ba2;
     text-decoration: underline;
 }

 /* پیام خطا */
 .otp-alert {
     padding: 12px 16px;
     border-radius: 10px;
     font-size: 14px;
     margin-bottom: 16px;
     display: flex;
     align-items: center;
     gap: 10px;
     animation: shake 0.4s;
 }

 @keyframes shake {

     0%,
     100% {
         transform: translateX(0);
     }

     25% {
         transform: translateX(-5px);
     }

     75% {
         transform: translateX(5px);
     }
 }

 .otp-alert-danger {
     background: #fef2f2;
     color: #991b1b;
     border: 1px solid #fecaca;
 }

 .otp-alert-success {
     background: #f0fdf4;
     color: #166534;
     border: 1px solid #bbf7d0;
 }

 /* تایمر شمارش معکوس */
 .otp-timer {
     text-align: center;
     font-size: 13px;
     color: #6b7280;
     margin-top: 12px;
     padding: 10px;
     background: #f9fafb;
     border-radius: 8px;
 }

 .otp-timer span {
     font-weight: 700;
     color: #667eea;
     font-size: 16px;
 }

 /* جداکننده */
 .otp-divider {
     display: flex;
     align-items: center;
     margin: 24px 0;
     color: #9ca3af;
     font-size: 13px;
 }

 .otp-divider::before,
 .otp-divider::after {
     content: '';
     flex: 1;
     height: 1px;
     background: #e5e7eb;
 }

 .otp-divider span {
     padding: 0 16px;
 }

 /* لینک ورود معمولی */
 .otp-native-link {
     display: block;
     text-align: center;
     padding: 12px;
     background: #f9fafb;
     color: #374151;
     text-decoration: none;
     border-radius: 10px;
     font-size: 14px;
     font-weight: 500;
     transition: all 0.3s;
     border: 1px solid #e5e7eb;
 }

 .otp-native-link:hover {
     background: #f3f4f6;
     border-color: #d1d5db;
     color: #111827;
 }

 /* فوتر */
 .otp-card-footer {
     padding: 20px 30px;
     background: #f9fafb;
     text-align: center;
     border-top: 1px solid #f3f4f6;
 }

 .otp-card-footer p {
     margin: 0;
     font-size: 12px;
     color: #9ca3af;
 }

 .d-none {
     display: none !important;
 }

 .otp-spinner {
     display: inline-block;
     width: 16px;
     height: 16px;
     border: 2px solid rgba(255, 255, 255, 0.3);
     border-radius: 50%;
     border-top-color: #fff;
     animation: spin 0.8s linear infinite;
 }

 @keyframes spin {
     to {
         transform: rotate(360deg);
     }
 }

 .otp-btn-odoo-login:hover {
     color: #374151;
 }

 .otp-btn-odoo-login:active {
     transform: translateY(0);
 }

 .otp-btn-odoo-login i {
     font-size: 16px;
 }

 .otp-odoo-login-wrapper {
     margin-top: 24px;
     padding-top: 20px;
     border-top: 1px solid #eee;
 }

 .otp-btn-odoo-login {
     width: 100%;
     padding: 12px 20px;
     background: #ffffff;
     color: #62666d;
     border: none;
     border-radius: 10px;
     font-size: 15px;
     cursor: pointer;
     transition: all 0.3s;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     padding: 0;
 }

 nav.navbar {
     display: block !important;
 }

 nav.navbar.d-none {
     display: block !important;
 }

 .o_main_nav {
     display: flex !important;
 }



 nav.navbar.d-block.d-lg-none {
     display: none !important;
 }