Page History

<div id="mediq-login-page" dir="rtl">

<style>
/* ============================================================
   MEDIQ LOGIN PAGE
   Confluence Server / Data Center
   Page ID: 174855060

   BACKGROUND:
   Modern Hospital Room with Medical Bed.png

   LOGO:
   MediQ Heart Medical LogoLogo1.png
   ============================================================ */

#mediq-login-page,
#mediq-login-page * {
    box-sizing: border-box;
}

#mediq-login-page {
    --mq-navy: #082b4b;
    --mq-text: #173b59;
    --mq-muted: #7089a0;
    --mq-primary: #08b8b0;
    --mq-primary-dark: #05a49e;
    --mq-border: rgba(175, 202, 218, .60);

    position: relative;

    width: 100%;
    min-height: 760px;

    overflow: hidden;

    direction: rtl;

    font-family:
        Tahoma,
        Arial,
        sans-serif;

    color: var(--mq-text);

    background:
        url("/download/attachments/174855060/Modern%20Hospital%20Room%20with%20Medical%20Bed.png")
        center center / cover
        no-repeat;
}


/* ============================================================
   LEFT LIGHT OVERLAY
   ============================================================ */

#mediq-login-page::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.98) 0%,
            rgba(255,255,255,.94) 17%,
            rgba(255,255,255,.70) 31%,
            rgba(255,255,255,.22) 44%,
            rgba(255,255,255,0) 58%
        );
}


/* ============================================================
   MAIN LAYOUT
   ============================================================ */

.mq-layout {
    position: relative;
    z-index: 5;

    width: 100%;
    min-height: 760px;

    padding:
        54px
        clamp(50px, 7vw, 120px);

    display: grid;

    grid-template-columns:
        minmax(480px520px, 600px620px)
        minmax(80px, 1fr)
        minmax(410px, 465px);

    align-items: center;

    gap: 20px;

    direction: ltr;
}


/* ============================================================
   LEFT CONTENT
   ============================================================ */

.mq-intro {
    grid-column: 1;

    width: 100%;
    max-width: 580px620px;

    direction: rtl;
    text-align: right;

    align-self: center;
}


/* ============================================================
   MAIN LOGO
   وسط چین
   ============================================================ */

.mq-main-logo-wrap {
    width: 100%;

    display: flex;

    justify-content: flex-startcenter;
    align-items: center;

    direction: ltr;

    margin-bottom: 29px30px;
}

.mq-main-logo {
    display: block;

    width: 335px330px;
    max-width: 74%76%;

    height: auto;

    object-fit: contain;

    object-position: leftcenter center;
}


/* ============================================================
   SHORT LINE
   ============================================================ */

.mq-accent-line {
    width: 62px;
    height: 4px;

    margin:
        0
        0
        31px
        0auto;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            #0ccbc0,
            #049f9c
        );
}


/* ============================================================
   TITLE
   یک خط + راست چین + Bold
   ============================================================ */

.mq-title {
    margin: 0;

    width: 100%;

    color: var(--mq-navy);

    direction: rtl;
    text-align: right;

    font-size: clamp(40px, 3.2vw, 56px);
38px;
    line-height: 1.4855;

    font-weight: 800900;

    letter-spacing: -1.3px1px;
}

.mq-title-line {
    displaywhite-space: blocknowrap;
}


/* ============================================================
   DESCRIPTION
   یک خط + راست چین + Bold
   ============================================================ */

.mq-description {
    width: 100%;

    margin-top: 14px15px;

    color: #617d96#58758f;

    direction: rtl;
    text-align: right;

    font-size: 16px;

    font-weight: 400700;

    line-height: 2.05;

    white-space: nowrap;
}


/* ============================================================
   FEATURE CARDS
   ============================================================ */

.mq-features {
    width: 100%;

    margin-top: 36px;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 12px;

    direction: rtl;
}

.mq-feature {
    min-height: 128px;

    padding:
        15px
        8px
        13px;

    border:
        1px solid
        rgba(202, 224, 235, .78);

    border-radius: 15px;

    background:
        rgba(255,255,255,.7072);

    box-shadow:
        0 9px 30px
        rgba(26, 82, 105, .045);

    backdrop-filter:
        blur(12px);

    -webkit-backdrop-filter:
        blur(12px);

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;
}

.mq-feature-icon {
    width: 45px;
    height: 45px;

    margin-bottom: 10px;

    border-radius: 13px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.mq-feature-icon svg {
    width: 25px;
    height: 25px;

    fill: none;

    stroke: currentColor;

    stroke-width: 2;

    stroke-linecap: round;

    stroke-linejoin: round;
}


/* CARD 1 */

.mq-feature:nth-child(1)
.mq-feature-icon {
    color: #0ab3aa;

    background:
        linear-gradient(
            145deg,
            #e0fbf8,
            #c8f4f0
        );
}


/* CARD 2 */

.mq-feature:nth-child(2)
.mq-feature-icon {
    color: #3d92e5;

    background:
        linear-gradient(
            145deg,
            #eaf5ff,
            #dcecff
        );
}


/* CARD 3 */

.mq-feature:nth-child(3)
.mq-feature-icon {
    color: #05ad94;

    background:
        linear-gradient(
            145deg,
            #e2faf5,
            #d1f6ee
        );
}


/* CARD 4 */

.mq-feature:nth-child(4)
.mq-feature-icon {
    color: #6689b6;

    background:
        linear-gradient(
            145deg,
            #edf3fa,
            #e2ebf7
        );
}


.mq-feature-title {
    color: #133956;

    direction: rtl;

    font-size: 11px13px;

    font-weight: 700800;

    line-height: 1.98;

    text-align: center;
}


/* ============================================================
   LOGIN CARD
   ============================================================ */

.mq-login-card {
    grid-column: 3;

    width: 100%;
    min-height: 610px;

    padding:
        42px
        38px
        30px;

    direction: rtl;

    border:
        1px solid
        rgba(255,255,255,.88);

    border-radius: 28px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.88),
            rgba(238,249,252,.79)
        );

    box-shadow:
        0 30px 85px
        rgba(17, 68, 90, .18);

    backdrop-filter:
        blur(25px);

    -webkit-backdrop-filter:
        blur(25px);
}


/* ============================================================
   LOGIN LOGO
   ============================================================ */

.mq-login-logo-wrap {
    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;
}

.mq-login-logo {
    display: block;

    width: 245px;

    max-width: 78%;

    height: auto;

    object-fit: contain;
}


/* ============================================================
   WELCOME
   وسط چین + Bold
   ============================================================ */

.mq-welcome {
    margin-topwidth: 32px100%;

    colormargin-top: 32px;

    color: var(--mq-navy);

    direction: rtl;

    text-align: rightcenter;

    font-size: 20px23px;

    font-weight: 700900;

    line-height: 1.8;
}

.mq-welcome-description {
    width: 100%;

    margin-top: 5px;

    color: #718aa0;

    direction: rtl;

    text-align: rightcenter;

    font-size: 11px13px;

    font-weight: 400600;

    line-height: 1.9;
}


/* ============================================================
   FORM
   ============================================================ */

.mq-form {
    width: 100%;

    margin-top: 27px;

    direction: rtl;
}


/* ============================================================
   FIELD
   ============================================================ */

.mq-field {
    position: relative;

    width: 100%;

    margin-bottom: 14px;
}

.mq-input {
    display: block;

    width: 100%;
    height: 58px;

    padding:
        0
        49px
        0
        52px;

    border:
        1px solid
        rgba(171, 198, 215, .67);

    border-radius: 13px;

    outline: none;

    background:
        rgba(255,255,255,.76);

    color: #173b59;

    direction: rtl;
    text-align: right;

    font-family:
        Tahoma,
        Arial,
        sans-serif;

    font-size: 12px14px;

    font-weight: 400600;

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.mq-input::placeholder {
    color: #70889f;

    opacity: 1;

    direction: rtl;

    text-align: right;

    font-size: 14px;

    font-weight: 400600;
}

.mq-input:focus {
    background:
        rgba(255,255,255,.96);

    border-color:
        var(--mq-primary);

    box-shadow:
        0 0 0 3px
        rgba(8,184,176,.10);
}


/* ============================================================
   RIGHT FIELD ICON
   ============================================================ */

.mq-field-icon {
    position: absolute;

    right: 17px;

    top: 50%;

    transform:
        translateY(-50%);

    width: 21px;
    height: 21px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #66829c;

    pointer-events: none;
}

.mq-field-icon svg {
    width: 20px;
    height: 20px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;

    stroke-linejoin: round;
}


/* ============================================================
   PASSWORD EYE
   ============================================================ */

.mq-password-toggle {
    position: absolute;

    left: 12px;

    top: 50%;

    transform:
        translateY(-50%);

    width: 36px;
    height: 36px;

    padding: 0;

    border: 0;

    border-radius: 9px;

    outline: none;

    background: transparent;

    color: #66829c;

    cursor: pointer;

    display: flex;

    align-items: center;

    justify-content: center;

    transition:
        background .15s ease,
        color .15s ease;
}

.mq-password-toggle:hover {
    background:
        rgba(8,184,176,.08);

    color:
        var(--mq-primary-dark);
}

.mq-password-toggle svg {
    width: 20px;
    height: 20px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;

    stroke-linejoin: round;
}


/* ============================================================
   REMEMBER
   ============================================================ */

.mq-options {
    width: 100%;

    margin:
        13px
        0
        19px;

    display: flex;

    align-items: center;

    justify-content: flex-start;

    direction: rtl;
}

.mq-remember {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #59748b;

    direction: rtl;

    font-size: 11px13px;

    font-weight: 400700;

    cursor: pointer;

    user-select: none;
}

.mq-remember input {
    width: 17px;
    height: 17px;

    margin: 0;

    accent-color:
        var(--mq-primary);
}


/* ============================================================
   SUBMIT
   ============================================================ */

.mq-submit {
    width: 100%;
    height: 60px;

    border: 0;

    border-radius: 13px;

    outline: none;

    background:
        linear-gradient(
            90deg,
            #05aaa5,
            #0bc2b8
        );

    color: #fff;

    font-family:
        Tahoma,
        Arial,
        sans-serif;

    font-size: 15px17px;

    font-weight: 700800;

    cursor: pointer;

    box-shadow:
        0 13px 28px
        rgba(3, 166, 160, .20);

    transition:
        transform .17s ease,
        box-shadow .17s ease,
        filter .17s ease;
}

.mq-submit:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 18px 35px
        rgba(3,166,160,.27);

    filter:
        brightness(1.015);
}

.mq-submit:active {
    transform:
        translateY(0);
}


/* ============================================================
   ERROR
   ============================================================ */

.mq-error {
    display: none;

    width: 100%;

    margin-top: 12px;

    padding:
        10px
        12px;

    border:
        1px solid
        #fecdd3;

    border-radius: 9px;

    background:
        #fff1f2;

    color:
        #be123c;

    direction: rtl;

    text-align: right;

    font-size: 11px;

    font-weight: 10px600;

    line-height: 1.8;
}


/* ============================================================
   DIVIDER
   ============================================================ */

.mq-divider {
    width: 100%;
    height: 1px;

    margin:
        29px
        0
        22px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(131,160,179,.35),
            transparent
        );
}


/* ============================================================
   SUPPORT
   ============================================================ */

.mq-support {
    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    direction: rtl;

    color: #6f879c;

    text-align: rightcenter;

    font-size: 10px12px;

    font-weight: 400600;

    line-height: 1.9;
}

.mq-support-icon {
    flex: 0 0 auto;

    width: 19px;
    height: 19px;

    color: #163d5d;
}

.mq-support-icon svg {
    width: 19px;
    height: 19px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap: round;

    stroke-linejoin: round;
}


/* ============================================================
   LOADING
   ============================================================ */

.mq-loader {
    display: none;

    width: 21px;
    height: 21px;

    margin: auto;

    border:
        3px solid
        rgba(255,255,255,.38);

    border-top-color:
        #fff;

    border-radius: 50%;

    animation:
        mq-spin
        .7s
        linear
        infinite;
}

.mq-submit.loading {
    pointer-events: none;

    opacity: .88;
}

.mq-submit.loading
.mq-submit-text {
    display: none;
}

.mq-submit.loading
.mq-loader {
    display: block;
}

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


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 1200px) {

    .mq-layout {
        grid-template-columns:
            minmax(400px430px, 1fr)
            30px
            400px;

        padding:
            45px
            35px;
    }

    .mq-title {
        font-size: 32px;
    }

    .mq-description {
        font-size: 40px14px;
    }

    .mq-main-logo {
        width: 290px;
    }

    .mq-features {
        grid-template-columns:
            repeat(2, 1fr);
    }
}


@media (max-width: 900px) {

    #mediq-login-page {
        overflow: visible;

        background-position:
            65%
            center;
    }

    .mq-layout {
        display: flex;

        flex-direction: column;

        min-height: auto;

        padding:
            35px
            20px;

        gap: 35px;
    }

    .mq-login-card {
        order: 1;

        width:
            min(100%, 470px);

        min-height: auto;
    }

    .mq-intro {
        order: 2;

        width:
            min(100%, 580px620px);
    }
}


@media (max-width: 520px) {

    .mq-layouttitle {
        padding:white-space: normal;
    }

        .mq-description {
        white-space: normal;
    }
}


@media (max-width: 520px) {

    .mq-layout {
        padding:
            22px
            12px
            40px;
    }

    .mq-login-card {
        padding:
            32px
            22px
            27px;

        border-radius:
            22px;
    }

    .mq-login-logo {
        width:
            210px;
    }

    .mq-main-logo {
        width:
            265px;
    }

    .mq-title {
        font-size:
            29px;

        31pxwhite-space: normal;
    }

    .mq-description {
        font-size:
            13px;

        white-space: normal;
    }

    .mq-features {
        grid-template-columns:
            repeat(2, 1fr);
    }
}


</style>


<div class="mq-layout">


    <!-- * ============================================================
   MEDIQ - FINAL FULL SCREEN FIX
 LEFT CONTENT
  Confluence Server / Data Center
   ====================================================== -->

    <section class="mq-intro">


====== */


/* ------------------------------------------------------------
   1. حذف کامل Footer کانفلوئنس
   ------------------------------------------------------------ */

#footer,
footer#footer,
footer.aui-footer,
.aui-footer,
#footer-logo,
#poweredby,
#footer-build-information,
.footer-body,
.footer-logo,
#footer .footer-body,
#footer .footer-logo {
    display: none !important;
    visibility: hidden !important;

    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    overflow: hidden !important;
}


/* ------------------------------------------------------------
   2. حذف فضای خالی خود Confluence
   ------------------------------------------------------------ */

html,
body {
    width: 100% !important;
    height: 100% !important;

    min-height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}


#page,
#full-height-container,
#main,
#content,
#main-content,
.aui-page-panel,
.aui-page-panel-inner,
.aui-page-panel-content,
.content-body {
    width: 100% !important;
    height: 100% !important;

    min-height: 100% !important;

    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
}


/* ------------------------------------------------------------
   3. خود صفحه MediQ تمام Viewport
   ------------------------------------------------------------ */

#mediq-login-page {
    position: fixed !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    min-width: 100vw !important;
    min-height: 100vh !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    z-index: 9999 !important;

    background-size: cover !important;
    background-position: center center !important;
}


/* ------------------------------------------------------------
   4. Layout داخلی دقیقاً هم‌اندازه صفحه
   ------------------------------------------------------------ */

#mediq-login-page .mq-layout {
    width: 100% !important;
    height: 100vh !important;

    min-height: 0 !important;

    margin: 0 !important;

    padding:
        clamp(25px, 4vh, 55px)
        clamp(45px, 7vw, 120px) !important;

    align-items: center !important;
}


/* ------------------------------------------------------------
   5. پنل Login متناسب با ارتفاع صفحه
   ------------------------------------------------------------ */

#mediq-login-page .mq-login-card {
    align-self: center !important;

    min-height: 0 !important;

    max-height: calc(100vh - 70px) !important;
}


/* ------------------------------------------------------------
   6. بخش سمت چپ دقیقاً وسط ارتفاع صفحه
   ------------------------------------------------------------ */

#mediq-login-page .mq-intro {
    align-self: center !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* ------------------------------------------------------------
   7. جلوگیری از Scroll اضافی Confluence
   ------------------------------------------------------------ */

body {
    position: relative !important;

    overflow: hidden !important;
}


/* ------------------------------------------------------------
   8. جلوگیری از فضای خالی پایین صفحه
   ------------------------------------------------------------ */

#content,
#main-content,
.aui-page-panel-content {
    min-height: 0 !important;
}


/* ------------------------------------------------------------
   9. تنظیم برای مانیتورهای با ارتفاع کمتر
   مثل Laptop در Zoom 100%
   ------------------------------------------------------------ */

@media (max-height: 850px) {

    #mediq-login-page .mq-layout {
        padding:
            20px
            clamp(45px, 7vw, 110px) !important;
    }


    #mediq-login-page .mq-main-logo {
        width: 285px !important;
    }


    #mediq-login-page .mq-main-logo-wrap {
        margin-bottom: 20px !important;
    }


    #mediq-login-page .mq-accent-line {
        margin-bottom: 20px !important;
    }


    #mediq-login-page .mq-title {
        font-size: 32px !important;
    }


    #mediq-login-page .mq-description {
        margin-top: 9px !important;

        font-size: 14px !important;
    }


    #mediq-login-page .mq-features {
        margin-top: 24px !important;
    }


    #mediq-login-page .mq-feature {
        min-height: 105px !important;

        padding: 10px 7px !important;
    }


    #mediq-login-page .mq-feature-icon {
        width: 40px !important;
        height: 40px !important;

        margin-bottom: 6px !important;
    }


    #mediq-login-page .mq-login-card {
        min-height: 0 !important;

        padding:
            28px
            34px
            24px !important;
    }


    #mediq-login-page .mq-login-logo {
        width: 210px !important;
    }


    #mediq-login-page .mq-welcome {
        margin-top: 20px !important;

        font-size: 20px !important;
    }


    #mediq-login-page .mq-form {
        margin-top: 18px !important;
    }


    #mediq-login-page .mq-input {
        height: 52px !important;
    }


    #mediq-login-page .mq-submit {
        height: 54px !important;
    }


    #mediq-login-page .mq-divider {
        margin:
            20px
            0
            16px !important;
    }

}


/* ------------------------------------------------------------
   10. مانیتورهای خیلی کوتاه
   ------------------------------------------------------------ */

@media (max-height: 700px) {

    #mediq-login-page .mq-layout {
        transform: scale(.92);

        transform-origin: center center;

        width: 108.695% !important;
        height: 108.695vh !important;

        margin-left: -4.347% !important;
    }

}

</style>


<div class="mq-layout">


    <!-- ======================================================
         LEFT CONTENT
         ====================================================== -->

    <section class="mq-intro">


        <!-- REAL MEDIQ LOGO -->

        <div class="mq-main-logo-wrap">

            <img
                class="mq-main-logo"
                src="/download/attachments/174855060/MediQ%20Heart%20Medical%20Logo1.png"
                alt="MediQ"
            >

        </div>


        <div class="mq-accent-line"></div>


        <!-- TITLE -->

        <h1 class="mq-title">
            مدیریت هوشمند تجهیزات پزشکی
        </h1>


        <!-- DESCRIPTION -->

        <div class="mq-description">
            ثبت، پیگیری و مدیریت کامل چرخه عمر تجهیزات پزشکی در یک پلتفرم یکپارچه
        </div>



        <!-- ==================================================
             FEATURES
             ================================================== -->

        <div class="mq-features">


            <!-- ACCURATE INFORMATION -->

            <div class="mq-feature">

                <div class="mq-feature-icon">

                    <svg viewBox="0 0 24 24">

                        <path
                            d="M12 3l7 3v5c0 5-3 8-7 10-4-2-7-5-7-10V6l7-3z"
                        ></path>

                        <path
                            d="M9 12l2 2 4-5"
                        ></path>

                    </svg>

                </div>

                <div class="mq-feature-title">

                    اطلاعات دقیق

                    <br>

                    و به‌روز

                </div>

            </div>



            <!-- MAINTENANCE -->

            <div class="mq-feature">

                <div class="mq-feature-icon">

                    <svg viewBox="0 0 24 24">

                        <circle
                            cx="12"
                            cy="12"
                            r="3"
                        ></circle>

                        <path
                            d="
                            M19.4 15
                            a1.7 1.7 0 0 0 .3 1.9
                            l.1.1
                            -2.1 2.1
                            -.1-.1
                            a1.7 1.7 0 0 0-1.9-.3
                            1.7 1.7 0 0 0-1 1.5
                            V20
                        <!-- REAL MEDIQ LOGO h-->
3
        <div class="mq-main-logo-wrap">

            <img
       v-.2
            class="mq-main-logo"
                src="/download/attachments/174855060/MediQ%20Heart%20Medical%20Logo.png"
    a1.7 1.7 0 0 0-1-1.5
            alt="MediQ"
            >

    1.7 1.7 0  </div>


0 0-1.9.3
        <div class="mq-accent-line"></div>


        <!-- TITLE -->

        <h1 class="mq-title">

l-.1.1
             <span class="mq-title-line">
              -2.1-2.1
  مدیریت هوشمند
            </span>

            <span class="mq-title-line"> .1-.1
                تجهیزات پزشکی
            </span>

  A1.7 1.7 0 0 0 7 14.6
      </h1>


        <!-- DESCRIPTION -->

        <div class="mq-description">

   a1.7 1.7 0 0 0-1.5-1
     ثبت، پیگیری و مدیریت کامل چرخه عمر تجهیزات پزشکی

            <br>

   H5
         در یک پلتفرم یکپارچه

        </div>



        <!-- ==================================================
v-3
              FEATURES
             ================================================== -->

 h.5
            <div class="mq-features">


            <!-- ACCURATE INFORMATION -->

       A1.7 1.7 0 0 0 7 9.6
      <div class="mq-feature">

                <div class="mq-feature-icon">

    a1.7 1.7 0 0 0-.3-1.9
            <svg viewBox="0 0 24 24">

            l-.1-.1
            <path
                2.1-2.1
            d="M12 3l7 3v5c0 5-3 8-7 10-4-2-7-5-7-10V6l7-3z"
           .1.1
             ></path>

               a1.7 1.7 0 0 0 1.9.3
    <path
                        1.7 1.7 0 0 d="M9 12l2 2 4-5"0 1-1.5
                        ></path>

    V4
                </svg>

            h3
    </div>

                <div class="mq-feature-title">

       v.4
             اطلاعات دقیق

              a1.7 1.7 0 0 0 1 <br>1.5

                    و به‌روز

       1.7 1.7 0 0   0 1.9-.3
   </div>

            </div>



            <!-- MAINTENANCE -->
 l.1-.1
            <div class="mq-feature">

                <div class="mq-feature-icon">
2.1 2.1
                    <svg viewBox="0 0 24 24">

    -.1.1
                    <circle
        a1.7 1.7 0 0 0-.3 1.9
               cx="12"
             1.7 1.7 0 0 0 1.5 1
         cy="12"
                   h.5
         r="3"
                   v3
     ></circle>

                        <pathh-.5
                            d="
    a1.7 1.7 0 0 0-1.5 1z
                        M19.4 15
   "
                         a1.7 1.7 0 0 0 .3 1.9
></path>

                    </svg>

                l.1.1</div>

                <div class="mq-feature-title">

           -2.1 2.1
        نگهداری و تعمیرات

                  -.1-.1
  <br>

                    کارآمد

      a1.7 1.7 0 0 0-1.9-.3
      </div>

            </div>



          1.7 1.7 0 0 0-1 1.5 <!-- REPORT -->

            <div class="mq-feature">

               V20 <div class="mq-feature-icon">

                    <svg viewBox="0 0 24 24">

      h-3
                  <path
          v-.2
                  d="M5 20V11"
         a1.7 1.7 0 0 0-1-1.5
           ></path>

                 1.7 1.7 0 0 0-1.9.3
   <path
                         l-.1.1
   d="M10 20V6"
                        -2.1-2.1></path>

                            .1-.1<path
                            A1.7 1.7 0 0 0 7 14.6
d="M15 20V9"
                        ></path>

         a1.7 1.7 0 0 0-1.5-1
           <path
                 H5
           d="M20 20V3"
                v-3
        ></path>

                    h.5</svg>

                </div>

            A1.7 1.7 0 0 0 7 9.6<div class="mq-feature-title">

                    گزارش‌های

        a1.7 1.7 0 0 0-.3-1.9
        <br>

                    l-.1-.1تحلیلی

                </div>

            2.1-2.1</div>



            <!-- ASSETS -->

              .1.1<div class="mq-feature">

                <div class="mq-feature-icon">

           a1.7 1.7 0 0 0 1.9.3
    <svg viewBox="0 0      24 24">

                1.7 1.7 0 0 0 1-1.5
    <path
                        V4
    d="M12 3l7 4-7 4-7-4 7-4z"
                    h3
    ></path>

                        v.4<path
                            a1.7 1.7 0 0 0 1 1.5
d="M5 7v9l7 4 7-4V7"
                        ></path>

       1.7 1.7 0 0 0 1.9-.3
            <path
                l.1-.1
            d="M12 11v9"
               2.1 2.1
        ></path>

                    -.1.1
</svg>

                </div>

             a1.7 1.7 0 0 0-.3 1.9<div class="mq-feature-title">

                    مدیریت  کامل

      1.7 1.7 0 0 0 1.5 1
        <br>

                    h.5دارایی‌ها

                </div>

            v3</div>


        </div>


    </section>



    <!-- ======================================================
         LOGIN CARD
   h-.5
      ====================================================== -->

    <section class="mq-login-card">


        <!-- REAL LOGO -->

     a1.7 1.7 0 0 0-1.5 1z<div class="mq-login-logo-wrap">

            <img
                class="mq-login-logo"
                src="/download/attachments/174855060/MediQ%20Heart%20Medical%20Logo1.png"
        ></path>

        alt="MediQ"
            </svg>>

                </div>



        <!-- WELCOME -->

        <div class="mq-feature-titlewelcome">

            به پلتفرم مدیکیو      نگهداری و تعمیرات
خوش آمدید
                    <br>

         </div>


        <div class="mq-welcome-description">
  کارآمد

          برای ادامه، وارد حساب کاربری خود </div>

    شوید.
        </div>



            <!-- REPORT -->

==================================================
             <div class="mq-feature">

LOGIN FORM
                <div class="mq-feature-icon"================================================== -->

        <form
            <svg viewBoxid="0 0 24 24">

mqLoginForm"
            class="mq-form"
            <pathmethod="post"
            action="/dologin.action"
        >


        d="M5 20V11"
   <!-- USERNAME -->

            <div class="mq-field">

      ></path>

            <input
            <path
        id="mqUsername"
                    dclass="M10 20V6mq-input"
                    type="text"
         ></path>

           name="os_username"
             <path
       placeholder="نام کاربری"
                    dautocomplete="M15 20V9username"
                    required
    ></path>

            >


            <path
      <span class="mq-field-icon">

                    <svg  dviewBox="M20 20V3"
0 0 24 24">

                        ></path>

<circle
                       </svg>

     cx="12"
           </div>

                <div classcy="mq-feature-title8">

                    گزارش‌های

        r="4"
            <br>

            ></circle>

        تحلیلی

                </div>

<path
               </div>



            <!-- ASSETS -->

     d="M5 20c0-4 3-7 7-7s7 3 7 7"
        <div class="mq-feature">

                <div class="mq-feature-icon">></path>

                    <svg viewBox="0 0 24 24">

</svg>

                </span>

            <path</div>



            <!-- PASSWORD -->

            <div  dclass="M12 3l7 4-7 4-7-4 7-4z"
mq-field">

                <input
        ></path>

            id="mqPassword"
            <path
        class="mq-input"
                    dtype="M5 7v9l7 4 7-4V7password"
                        ></path>
name="os_password"
                    placeholder="رمز عبور"
   <path
                 autocomplete="current-password"
           d="M12 11v9"
        required
                ></path>>


                <!--    </svg>LOCK -->

                </div><span class="mq-field-icon">

                <div class="mq-feature-title    <svg viewBox="0 0 24 24">

                       مدیریت کامل<rect

                    <br>

        x="5"
            دارایی‌ها

                </div>

y="10"
            </div>


        </div>


    </section>



    <!-- ======================================================width="14"
         LOGIN  CARD
         ====================================================== -->

       <section classheight="mq-login-card10">



                <!-- REAL LOGO -->

        <div classrx="mq-login-logo-wrap">

2"
                        <img
></rect>

                  class="mq-login-logo"
      <path
            src="/download/attachments/174855060/MediQ%20Heart%20Medical%20Logo.png"
                altd="MediQM8 10V7a4 4 0 0 1 8 0v3"
                >

        <></div>path>



             <!-- WELCOME -->

        <div class="mq-welcome">

 <path
                 به پلتفرم مدیکیو خوش آمدید

        </div>


d="M12 14v2"
         <div class="mq-welcome-description">

            برای ادامه، وارد></path>

 حساب کاربری خود شوید.

        </div>



        <!-- ==================================================
/svg>

               LOGIN FORM </span>



             ==================================================   <!-- EYE -->

         <form
       <button
                    id="mqLoginFormmqPasswordToggle"
                    class="mq-password-formtoggle"
            method        type="postbutton"
            action="/dologin.action        title="نمایش رمز عبور"
        >


            <!-- USERNAME -->

aria-label="نمایش رمز عبور"
               <div class="mq-field">

                    <input<svg
                        id="mqUsernamemqEyeIcon"
                        classviewBox="mq-input0 0 24 24"
                    type="text">

                    name="os_username"
    <path
                  placeholder="نام کاربری"
         d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 autocomplete="username12z"
                    required
    ></path>

              >


          <circle
      <span class="mq-field-icon">

                    <svg viewBoxcx="012"
  0 24 24">

                        <circlecy="12"
                            cxr="123"
                        ></circle>

    cy="8"
                </svg>

            r="4"
    </button>

            </div>



        ></circle>

    <!-- REMEMBER -->

            <div class="mq-options">

     <path
              <label class="mq-remember">

              d="M5 20c0-4 3-7 7-7s7 3 7 7"<input
                        ></path>

type="checkbox"
                        </svg>

name="os_cookie"
                  </span>

      value="true"
      </div>



            <!-- PASSWORD -->

            <div class="mq-field">

        <span>
                 <input
       مرا به خاطر بسپار
          id="mqPassword"
          </span>

          class="mq-input"
      </label>

            </div>



  type="password"
          <!-- DESTINATION -->

        name="os_password"
    <input
                placeholderid="رمز عبورmqDestination"
                type="hidden"
       autocomplete="current-password"
         name="os_destination"
           required
     value="/"
            >



                <!-- LOCKLOGIN -->

                <span class="mq-field-icon">
<button
                id="mqSubmit"
    <svg viewBox="0 0 24 24">

        class="mq-submit"
                <recttype="submit"
            >

                <span xclass="5mq-submit-text">
                    ورود به سامانه
      y="10"
          </span>

                <span  widthclass="14"
mq-loader"></span>

            </button>



            <!--    height="10"ERROR -->

            <div
                rxid="2mqError"
                class="mq-error"
            ></rect>

   div>


        </form>



        <!--     <pathDIVIDER -->

        <div class="mq-divider"></div>



        <!-- SUPPORT -->

        <div dclass="M8 10V7a4 4 0 0 1 8 0v3"
mq-support">


            <span>
                در صورت مشکل ></path>

در ورود، با واحد فناوری اطلاعات تماس بگیرید.
            </span>


     <path
       <span class="mq-support-icon">

                <svg viewBox="0 0 24 d="M12 14v2"24">

                        ></path>

<path
                    </svg>

    d="M4 13v-2a8 8 0 0 1 16  0v2"
    </span>



                <!-- EYE --> ></path>

                <button
    <path
                id="mqPasswordToggle"
        d="M4 13H3a2 2 0 0 0-2 2v2a2 2 0 0 0 2 class="mq-password-toggle2h2v-6z"
                    type="button"></path>

                    title="نمایش رمز عبور"
<path
                      aria-label="نمایش رمز عبورd="
M20 13h1a2 2 0 0 1 2 2v2a2 2 0 0      >

1-2 2h-2v-6z"
                    <svg></path>

                        id="mqEyeIcon"<path
                        viewBoxd="0 0 24 24M19 19c0 2-2 2-4 2"
                    >></path>

                        <path</svg>

            </span>


          </div>


    </section>


</div>


<script>
(function  d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"() {

    "use strict";


    /* ========================================================
       MEDIQ CONFIG
       ======================================================== */

    var CFG =  ></path>{

        /*
         * مقصد بعد از Login   <circleموفق
         *
         * فعلاً چون Dashboard       cx="12"ساخته نشده،
         * کاربر به همین صفحه MediQ برمی‌گردد.
             cy="12"*
         * بعداً فقط Page ID داشبورد را اینجا عوض می‌کنیم.
          r="3"*/

        destination:
                ></circle>

           "/pages/viewpage.action?pageId=174855144",



         </svg>*

         * Login      </button>

واقعی Confluence
            </div>

*/

            <!-- REMEMBER -->

 loginAction:
           <div class="mq-options">"/dologin.action"

    };



    /* ========================================================
       ELEMENTS
 <label class="mq-remember">

     ======================================================== */

    var form =
        <input
document.getElementById(
            "mqLoginForm"
        );


    var username type="checkbox"
        document.getElementById(
            "mqUsername"
    name="os_cookie"
    );


    var password =
        document.getElementById(
      value="true"
      "mqPassword"
        );


    var passwordToggle >=

        document.getElementById(
            <span>"mqPasswordToggle"
        );


    var eyeIcon =
        document.getElementById(
   مرا به خاطر بسپار
      "mqEyeIcon"
        );


    var submit </span>=

        document.getElementById(
        </label>

    "mqSubmit"
        </div>);



    var destination =
      <!-- DESTINATION -->

 document.getElementById(
            <input
 "mqDestination"
        );


    var error =
         id="mqDestination"
   document.getElementById(
             type="hiddenmqError"
        );



        name="os_destination"/* ========================================================
       APPLY CONFIG
        value="/"
     ======================================================== */

    if (form)  >{



        form.action =
   <!-- LOGIN -->

       CFG.loginAction;

     <button
   form.method =
            id="mqSubmitpost";

        form.setAttribute(
        class="mq-submit"
    "autocomplete",
            type="submiton"
        );

    >}


    if (destination) {

          <span class="mq-submit-text">

destination.value =
            CFG.destination;

    }



    ورود
 /* ========================================================
       ERROR MESSAGE
        </span>======================================================== */

    function showError(message) {

        if  <span class="mq-loader"></span>

(!error) {
            </button>



return;
        }


    <!-- ERROR -->

  error.innerHTML =
         <div
   message;


             id="mqError"
 error.style.display =
               class="mq-error"
"block";

            ></div>}


     function   </form>hideError() {



        if <(!-- DIVIDER -->

error) {
         <div class="mq-divider"></div>



  return;
      <!-- SUPPORT -->}


        <diverror.innerHTML class="mq-support">


            <span>"";


        error.style.display =
       در صورت مشکل در ورود، با واحد فناوری اطلاعات تماس بگیرید.

   "none";

    }



    /* ========================================================
       SHOW / HIDE </span>PASSWORD


       ======================================================== */

    <span class="mq-support-icon">

if (
        password &&
        <svg viewBox="0 0 24 24">passwordToggle
    ) {

        passwordToggle.addEventListener(
            <path"click",
            function () {

           d="M4 13v-2a8 8 0 0 1var 16showPassword 0v2"=
                    ></path>

 password.type ===
                    <path"password";


                        d="M4 13H3a2 2 0 0 0-2 2v2a2 2 0 0 0 2 2h2v-6z"
password.type =
                    showPassword
            ></path>

            ? "text"
       <path
                 : "password";


      d="M20 13h1a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-2v-6z"if (showPassword) {

                    ></path>
 passwordToggle.title =
                    <path
    "مخفی کردن رمز عبور";


                 d="M19 19c0 2-2 2-4 2"
 passwordToggle.setAttribute(
                     ></path>

   "aria-label",
             </svg>

            </span>


  "مخفی کردن رمز عبور"
      </div>


    </section>


</div>



<script>
(function () {

         "use strict");


     /* ========================================================
       MEDIQ CONFIG
       ======================================================== */if (eyeIcon) {

    var CFG = {

                   /*
 eyeIcon.innerHTML =
       * بعداً Page ID داشبورد اصلی MediQ
         * را اینجا می‌گذاریم.
   '<path d="M2 12s4-7 10-7 10 7 */

        destination:10 7-4 7-10 7S2 12 2 12z"></path>' +
            "/",


        /*
         * Confluence login endpoint'<circle cx="12" cy="12" r="3"></circle>' +
         */

        loginAction:
           '<path d="/dologin.action"M4 4l16 16"></path>';

    };



    /* ========================================================
            }

             ELEMENTS
   }
               ======================================================== */

 else {

       var    form =
        document.getElementById(
passwordToggle.title =
                "mqLoginForm"
         )"نمایش رمز عبور";


     var username =
               passwordToggle.setAttribute(
            document.getElementById(
            "mqUsernamearia-label",
            );


    var password =
      "نمایش  document.getElementById(رمز عبور"
            "mqPassword"
        );


           var passwordToggle =
       if document.getElementById((eyeIcon) {

            "mqPasswordToggle"
        );


    var eyeIcon.innerHTML =
        document.getElementById(
            "mqEyeIcon"
        );


    var submit =
        document.getElementById('<path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"></path>' +
            "mqSubmit"
        );


    var destination =
  '<circle cx="12"     document.getElementById(cy="12" r="3"></circle>';

            "mqDestination"
        );}


      var error =
        document.getElementById(}

            "mqError"}
        );

    }



    /* ========================================================
       REMOVE ERROR WHEN APPLYUSER CONFIGTYPES
       ======================================================== */============== */

    if (username) {

        username.addEventListener(
            "input",
            function () {

                hideError();

            }
        );

    }


    if (formpassword) {

        form.action =password.addEventListener(
            CFG.loginAction;

"input",
        }


    iffunction (destination) {

        destination.value =
        hideError();

            }
        CFG.destination);

    }



    /* ========================================================
       SHOW / HIDE PASSWORDLOGIN VALIDATION
       ======================================================== */======= */

    if (form) {

        form.addEventListener(
            "submit",
            function (event) {

    if (
            var userValue =
                  password  &&username
        passwordToggle
        ) {

       ? passwordToggleusername.value.addEventListenertrim()
            "click",
            function () {: "";


                var showPasswordpasswordValue =
                    password.type ===

                        ? "password";


.value
                        password.type =
: "";


                      showPassword/* --------------------------------------------
                        ? "text"USERNAME EMPTY
                        : "password";


-------------------------------------------- */

                if (showPassword!userValue) {

                    passwordToggle.title =
event.preventDefault();


                    showError(
      "مخفی کردن رمز عبور";

               "لطفاً نام کاربری را وارد passwordToggleکنید.setAttribute("
                        "aria-label",);


                    if (username) {

  "مخفی کردن رمز عبور"
                    username.focus();


                    if (eyeIcon) {

}


                    return false;

     eyeIcon.innerHTML =
          }



                /*  '<path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"></path>' +
--------------------------------------------
                   PASSWORD EMPTY
                   -------------------------------------------- */

  '<circle cx="12" cy="12" r="3"></circle>' +
          if (!passwordValue) {

                '<path d="M4 4l16 16"></path>';    event.preventDefault();


                    }
showError(
                }
        "لطفاً رمز عبور را     else {

وارد کنید."
                    passwordToggle.title =);


                    if (password) {

  "نمایش رمز عبور";

                    passwordTogglepassword.setAttributefocus();

                    }


    "aria-label",
                return false;

         "نمایش   رمز عبور"
   }



                 );


/* --------------------------------------------
                    if (eyeIcon) {

VALID
                   -------------------------------------------- */

    eyeIcon.innerHTML =
           hideError();


                /*
 '<path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"></path>' +
   * Username / Password را خود Confluence
                 * از '<circle cx="12" cy="12" r="3"></circle>';

طریق POST دریافت می‌کند.
                    }

   *
             }

    *      Password در }LocalStorage،
         );

    }



    /* ========================================================
   SessionStorage یا Cookie سفارشی
     VALIDATION
       ======================================================== */

    if* (form) {

ذخیره نمی‌شود.
         form.addEventListener(
        */


    "submit",
            functionif (eventsubmit) {

                var   userValue = submit.classList.add(
                    username
    "loading"
                    ? username.value.trim()
);


                    submit.disabled =
     : "";


                var passwordValue =true;


                    passwordsubmit.setAttribute(
                        ? password.value"aria-busy",
                        : "true";


                   if ();

                }


    !userValue ||
           /*
         !passwordValue
        * اینجا preventDefault نداریم.
     ) {

           *
         event.preventDefault();


        * بنابراین فرم به:
         if (error) {

      *
                 * error.style.display =/dologin.action
                 *
           "block";

      * ارسال می‌شود.
                error.innerHTML = */

                return true;

           "لطفاً }
 نام کاربری و رمز عبور را وارد کنید.");

    }



    /* ========================================================
       RESTORE BUTTON
      }


 اگر Browser با Back به صفحه برگشت
       ======================================================== */

    window.addEventListener(
 return false;

      "pageshow",
        function () }{


                if (errorsubmit) {

                    error.style.display =
    submit.classList.remove(
                    "noneloading";

                });


                if (submit).disabled {=

                    submit.classList.add(false;


                        "loading"submit.removeAttribute(
                    );

"aria-busy"
                });

            }

        );}

    });



    /* ========================================================
       INITIAL FOCUS
       ======================================================== */

    window.setTimeout(
        function () {

            if (
                username &&
                !username.value
            ) {

                username.focus();

            }

        },
        300
    );


})();
</script>

</div>