@font-face {
    font-family: 'IRANSans';
    src: url('../Font/IRANSansWeb(FaNum).woff2') format('woff2'), url('../Font/IRANSansWeb(FaNum).woff') format('woff'), url('../Font/IRANSansWeb(FaNum).ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
/*تنظیم فونت برای کل صفحات*/
body, h1, h2, h3, h4, h5, h6, p, div, span, input, button, textarea {
    font-family: 'IRANSans', Arial, sans-serif !important;
    direction: rtl;
    text-align: right;
}

/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@  Start Style TEXTBOX @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
.My_textbox_Style_input {
    direction: rtl;
    padding: 6px;
    width: 100%;
    font-size: 12px;
    border-radius: 20px;
}
/*کل تکست باکس و کپشن دو اکسپرس مدیریت میشود*/
.dxeRoot_Aqua {
    background-color: #cbc8c8;
    width: 100%;
    border-radius: 20px !important; /*گرد کردن تکست باکس و کپشن*/
    margin: 4px; /*فاصله یک تکست باکس با تکست باکس دیگر*/
}
/*کپشن مربوط به تکست باکس در کنترلهای دو اکسپرس*/
.dxeCaptionCell_Aqua {
    font-family: 'IRANSans' !important;
    white-space: normal;
    line-height: 16px;
    height: 100%;
    border-radius: 20px;
    width: 35%;
}
    /*متن کپشن رو دقیق در وسط قرار میدهد*/
    .dxeCaptionCell_Aqua.dxeCaptionVATSys.dxeTextEditCTypeSys {
        padding-top: 9px;
    }
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@     END  Style TEXTBOX   @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Start <Hr> With Caption @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
.My_hr_text {
    /*Sample >>>>>>>>>>>>>>>>>><div class="My_hr_text ">متن وسط خط </div>*/
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    text-align: center;
    margin: 0px 0;
}

    .My_hr_text::before, .My_hr_text::after {
        content: "";
        flex: 1;
        height: 2px;
        background-color: darkgray;
        margin: 0 10px;
    }
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ End <Hr> With Caption @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/

/*تمام فیلدها در یک خط قرار میگیرند*/
.My_fields-inline-flex {
    display: inline-flex;
    gap: 7px;
    justify-content: flex-start;
}

/* استایل کلی فرم */
.My_form-container {
    max-width: 400PX;
    margin: 12px auto;
    padding: 10px;
    background: #F7F7F7;
    border-radius: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
}

    .form-row .My_form-container {
        flex: 1;
        min-width: 300px;
        max-width: 50%;
    }

/* کانتینر فیلدها */
.fields-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: flex-start;
}

/* کانتینر تکست‌باکس */
.textbox-container {
    position: relative;
    flex-grow: 1;
    min-width: 200px;
    display: flex;
    align-items: center;
    flex-direction: row-reverse; /* راست‌چین کردن */
}

/* استایل لیبل */
.textbox-label {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: gray;
    transition: all 0.3s ease;
    pointer-events: none;
    background: white;
    padding: 0 5px;
    text-align: right;
}

/* هنگام فوکوس */
.textbox-focused .textbox-label {
    top: -10px;
    font-size: 12px;
    color: #007bff;
}

/* استایل ورودی */
.textbox-input {
    padding: 5px;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 20px;
    text-align: right;
}


/* استایل دکمه‌ها */
.buttons-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 1px;
}

.responsive-button {
    flex: 1 1 200px !important; /* اطمینان از تطبیق عرض */
    padding: 10px !important;
    font-size: 16px !important;
    border: none !important;
    border-radius: 20px !important; /*گرد کردن گوشه دکمه ها*/
    background-color: #007BFF !important;
    color: white !important;
    cursor: pointer !important; /*تغییر موس به اشاره گر*/
    /*transition: background-color 0.3s ease !important;*/
    text-align: center !important;
    display: flex !important; /* تنظیم برای ریسپانسیو */
    justify-content: center !important; /*محتوا در مرکز افقی قرار می‌گیرد*/
    align-items: center !important;
}
/* مخصوص دکمه‌های DevExpress */
.dxeButton {
    width: 100% !important; /* اطمینان از پر کردن فضای دکمه */
    max-width: 150px !important;
}
/*مربوط به منوی سه خطی کنترل دواکسپرس در نمایش صفحه موبایل میباشد*/
.dxm-side-menu-mode .dxm-side-menu-button > div {
    top: 50%;
    left: -30%;
    margin-left: -8px;
    margin-top: -1px;
}

.responsive-button:hover {
    background-color: #00B394 !important;
}