/* DR_WEB_UI_POLISH_V1 */

/* =========================================================
   زر الوصول إلى الملفات
========================================================= */

#fsGoBtn.dr-fs-go-polished {
    min-width: 155px !important;
    min-height: 46px !important;

    padding: 11px 20px !important;

    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            var(--vip-primary, #2858d7),
            var(--vip-primary-light, #4c7df0)
        ) !important;

    border: 0 !important;
    border-radius: 13px !important;

    font-size: 0.91rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.1px !important;

    box-shadow:
        0 9px 22px
        rgba(40, 88, 215, 0.22) !important;

    transition:
        transform 0.18s ease,
        filter 0.18s ease,
        box-shadow 0.18s ease !important;
}

#fsGoBtn.dr-fs-go-polished:hover {
    transform: translateY(-2px);
    filter: brightness(1.04);
    box-shadow:
        0 13px 27px
        rgba(40, 88, 215, 0.27) !important;
}

#fsGoBtn.dr-fs-go-polished:active {
    transform: translateY(0);
}


/* =========================================================
   أزرار تنزيل الملفات
========================================================= */

#fileList .dr-file-download-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;

    margin-inline: 4px !important;
    padding: 0 !important;

    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            #3476e8,
            #2858d7
        ) !important;

    border:
        1px solid
        rgba(40, 88, 215, 0.2) !important;

    border-radius: 11px !important;

    font-size: 1.08rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    text-decoration: none !important;
    cursor: pointer !important;

    box-shadow:
        0 6px 15px
        rgba(40, 88, 215, 0.2) !important;

    transition:
        transform 0.17s ease,
        filter 0.17s ease !important;
}

#fileList .dr-file-download-action:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
}

#fileList .dr-file-download-action:active {
    transform: translateY(0);
}


/* =========================================================
   سجل مختصر مثل رسالة
========================================================= */

#logMessages {
    transition:
        max-height 0.26s ease,
        opacity 0.2s ease;
}

#logMessages.dr-log-collapsed {
    max-height: 58px !important;
    min-height: 58px !important;
    overflow: hidden !important;

    padding: 0 !important;
}

#logMessages.dr-log-collapsed > * {
    display: none !important;
}

#logMessages.dr-log-collapsed > :first-child {
    display: block !important;

    width: fit-content;
    max-width: min(100%, 720px);

    margin: 0 !important;
    padding: 11px 14px !important;

    overflow: hidden !important;

    color: #263249 !important;
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f3f7ff
        ) !important;

    border:
        1px solid
        rgba(74, 104, 174, 0.16) !important;

    border-radius:
        15px 15px 4px 15px !important;

    box-shadow:
        0 5px 14px
        rgba(31, 49, 82, 0.07) !important;

    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.dr-log-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 36px;
    margin: 10px 0 0;
    padding: 7px 14px;

    color: var(--vip-primary, #2858d7);
    background:
        rgba(40, 88, 215, 0.07);

    border:
        1px solid
        rgba(40, 88, 215, 0.16);

    border-radius: 10px;

    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 750;

    cursor: pointer;

    transition:
        background 0.17s ease,
        transform 0.17s ease;
}

.dr-log-toggle:hover {
    background:
        rgba(40, 88, 215, 0.12);

    transform: translateY(-1px);
}


/* =========================================================
   بطاقة جهات الاتصال بعد الإشعارات
========================================================= */

.dr-contacts-promoted {
    animation:
        drContactsPromotedFade
        0.28s ease both;
}

@keyframes drContactsPromotedFade {
    from {
        opacity: 0;
        transform: translateY(7px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   أيقونة تحميل التطبيق بجانب تسجيل الخروج
========================================================= */

.dr-header-download-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;

    margin: 8px 5px !important;
    padding: 0 !important;

    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            #2b76e5,
            #2858d7
        ) !important;

    border: 0 !important;
    border-radius: 12px !important;

    font-size: 1.18rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    text-decoration: none !important;
    cursor: pointer !important;

    box-shadow:
        0 9px 21px
        rgba(40, 88, 215, 0.23) !important;

    transition:
        transform 0.18s ease,
        filter 0.18s ease !important;
}

.dr-header-download-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
}

.dr-header-download-btn:active {
    transform: translateY(0);
}


/* =========================================================
   الهاتف
========================================================= */

@media (max-width: 600px) {
    #fsGoBtn.dr-fs-go-polished {
        width: 100% !important;
        min-width: 100% !important;
    }

    .dr-header-download-btn {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
    }

    #logMessages.dr-log-collapsed > :first-child {
        max-width: 100%;
    }
}