﻿/* =========================================================
   DEFAULT THEME FIX FOR NEW HEADER
   ========================================================= */

.CompactHeader {
    background: #f3f3f3 !important;
    padding: 15px !important;
    border-bottom: 1px solid #d8d8d8 !important;
}





.SystemTitle,
#Name {
    color: #222 !important;
    font-size: 26px !important;
    font-weight: bold !important;
}


.QuickActionBtn {
    opacity: 1 !important;
    filter: none !important;
}

.HeaderField span,
.HeaderOrgArea,
.HeaderSearchArea,
.HeaderLocationArea {
    color: #222 !important;
    font-weight: bold !important;
}

.HeaderField {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}


/* إزالة أى شفافية قديمة */

.CompactHeader * {
    opacity: 1 !important;
}
/* =========================================================
   RESET NEW HEADER INSIDE DEFAULT THEME
   ========================================================= */

.CompactHeader,
.CompactHeader * {
    box-sizing: border-box;
}

/* الهيدر بالكامل */

.CompactHeader {
    width: 100%;
    background: #f2f2f2 !important;
    border: 1px solid #d6d6d6 !important;
    border-radius: 0 !important;
    padding: 14px 18px !important;
    margin: 0 !important;
    color: #222 !important;
    font-family: Tahoma !important;
}

/* الصفوف */

/* الصف السفلى */

.BottomHeaderRow {
    margin-top: 12px !important;
    padding-top: 10px !important;
    border-top: 1px solid #dddddd !important;
}



.SystemTitle,
#Name {
    color: #222 !important;
    font-size: 24px !important;
    font-weight: bold !important;
    text-shadow: none !important;
}


.QuickActionBtn {
    width: 36px !important;
    height: 36px !important;
    opacity: 1 !important;
    filter: none !important;
}

/* النصوص */

.HeaderField span,
.HeaderOrgArea,
.HeaderSearchArea {
    color: #222 !important;
    font-weight: bold !important;
    text-shadow: none !important;
}

/* الفورمز */

.HeaderField {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.HeaderSearchArea input,
.HeaderSearchArea select,
.HeaderOrgArea select {
    background: #fff !important;
    border: 1px solid #cfcfcf !important;
    color: #222 !important;
}

/* إزالة ألوان الثيم القديم */

.CompactHeader table,
.CompactHeader tr,
.CompactHeader td,
.CompactHeader div {
    background-image: none !important;
}

/* إزالة الشفافية القديمة */

.CompactHeader * {
    opacity: 1 !important;
    filter: none !important;
}
/* =========================================================
   NEW HEADER SUPPORT FOR DEFAULT THEME
   ========================================================= */

.CompactHeader {
    background: linear-gradient( to bottom, #5f5aa8 0%, #4d4897 45%, #3f3a87 52%, #55509d 100% ) !important;
    border-top: 2px solid #7070b4 !important;
    border-bottom: 1px solid #2d236f !important;
    padding: 14px 18px !important;
    color: white !important;
    font-family: Normal !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 3px 10px rgba(0,0,0,.28) !important;
}

/* الصفين */

/* الصف السفلى */

.BottomHeaderRow {
    margin-top: 12px !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
}

/* عنوان النظام */

.SystemTitle,
#Name {
    color: #fb9d23 !important;
    font-weight: bold !important;
    text-shadow: 1px 1px 0px #222288 !important;
}

/* النصوص */

.HeaderField span,
.HeaderOrgArea,
.HeaderLocationArea {
    color: white !important;
    text-shadow: 1px 1px 0px #222288 !important;
    font-weight: bold;
}

/* الأزرار */

.QuickActionBtn {
    opacity: .9;
    transition: all .15s ease;
}

    .QuickActionBtn:hover {
        opacity: 1;
        transform: translateY(-1px);
    }

/* الفورمز */

.HeaderSearchArea input,
.HeaderSearchArea select,
.HeaderOrgArea select {
    border: 1px solid #a9a2d6 !important;
    background: #ebe9f9 !important;
    color: #383862 !important;
}

/* منع تأثيرات الجداول القديمة */

.CompactHeader table,
.CompactHeader tr,
.CompactHeader td {
    background: transparent !important;
}
.BottomHeaderRow .HeaderSearchArea {
    flex: 1;
    justify-content: flex-end !important;
}
/* =========================================================
   DEFAULT THEME - MODERN ICONS
   ========================================================= */


/* زر الأيقونة */

.QuickActionBtn {
    width: 42px !important;
    height: 42px !important;
    padding: 7px !important;
    border-radius: 10px !important;
    gap: 8px !important;
    background: linear-gradient( to bottom, rgba(255,255,255,.10) 0%, rgba(255,255,255,.04) 100% ) !important;
    border: 1px solid rgba(255,220,120,.25) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 3px 8px rgba(0,0,0,.20) !important;
    transition: all .18s ease !important;
    opacity: 1 !important;
}

    /* صورة الأيقونة */

    .QuickActionBtn img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        filter: brightness(0) invert(1);
        opacity: .92;
    }

    /* Hover */

    .QuickActionBtn:hover {
        transform: translateY(-2px) !important;
        background: linear-gradient( to bottom, rgba(255,255,255,.18) 0%, rgba(255,255,255,.07) 100% ) !important;
        border-color: rgba(255,230,140,.55) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 14px rgba(0,0,0,.28) !important;
    }

        /* Hover للصورة */

        .QuickActionBtn:hover img {
            opacity: 1;
        }
.ThemeToggleBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 14px;
    border-radius: 10px;
    background: linear-gradient( to bottom, rgba(255,255,255,.12), rgba(255,255,255,.04) );
    border: 1px solid rgba(255,255,255,.18);
    color: #fff !important;
    font-weight: bold;
    text-decoration: none !important;
    transition: all .18s ease;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 2px 6px rgba(0,0,0,.18);
}

    .ThemeToggleBtn:hover {
        transform: translateY(-1px);
        background: linear-gradient( to bottom, rgba(255,255,255,.18), rgba(255,255,255,.07) );
        box-shadow: 0 5px 12px rgba(0,0,0,.22);
    }
.ThemeIconBtn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    text-decoration: none !important;
    color: white !important;
    padding: 0 !important;
}
/* =========================================================
   MODERN USER MENU - DEFAULT THEME
========================================================= */

.ModernUserWrapper {
    position: relative;
    z-index: 99999;
}

/* BUTTON */

.ModernUserButton {
    min-width: 240px;
    height: 44px;
    padding: 0 18px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    background: linear-gradient( to bottom, rgba(255,255,255,.10), rgba(0,0,0,.10) );
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 6px 18px rgba(0,0,0,.18);
    transition: all .18s ease;
}

    .ModernUserButton:hover {
        border-color: rgba(255,255,255,.28);
        transform: translateY(-1px);
    }

/* USER NAME */

.ModernUserName {
    color: #ffffff;
    font-size: 15px;
    font-weight: bold;
}

/* ARROW */

.UserArrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 14px;
    transition: transform .18s ease;
}

.ModernUserWrapper:hover .UserArrow {
    transform: rotate(180deg);
}

/* DROPDOWN */

.ModernUserDropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    min-width: 250px;
    width: auto;
    padding: 14px;
    border-radius: 22px;
    background: linear-gradient( to bottom, rgba(86,76,170,.96), rgba(63,54,140,.98) );
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 18px 45px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(10px);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all .20s ease;
    z-index: 999999;
}

.ModernUserWrapper:hover .ModernUserDropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* DIVIDER */

.ModernDropDivider {
    height: 1px;
    margin: 16px 4px;
    background: linear-gradient( to left, transparent, rgba(255,255,255,.18), transparent );
}

/* GRID */

.ModernDropGrid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

    /* ICON BUTTON */

    .ModernDropGrid .HeaderIconBtn {
        width: 32px;
        height: 32px;
        border-radius: 12px;
        background: linear-gradient( to bottom, rgba(255,255,255,.10), rgba(0,0,0,.12) );
        border: 1px solid rgba(255,255,255,.12);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 3px 10px rgba(0,0,0,.18);
        transition: all .18s ease;
    }

        .ModernDropGrid .HeaderIconBtn:hover {
            transform: translateY(-2px);
            border-color: rgba(255,255,255,.24);
        }

        .ModernDropGrid .HeaderIconBtn img {
            width: 13px !important;
            height: 13px !important;
        }

/* ORG BOX */

.OrgSelectorBox {
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
}

/* TITLE */

.OrgSelectorTitle {
    display: block;
    margin-bottom: 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
}

/* SELECT */

.ModernUserDropdown select {
    width: 100%;
    height: 40px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.94);
    padding: 0 12px;
    font-weight: bold;
}

/* OPTIONS */

/* dropdown options */

.ModernUserDropdown option {
    background: #f3f3f7 !important;
    color: #222 !important;
    font-weight: bold;
    padding: 10px;
}

    /* selected */

    .ModernUserDropdown option:checked {
        background: #dcdcff !important;
        color: #111 !important;
    }

    /* hover */

    .ModernUserDropdown option:hover {
        background: #cfcfff !important;
        color: #000 !important;
    }

/* ACCOUNT ITEMS */

.ModernDropItem {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    color: #ffffff;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: bold;
    transition: all .18s ease;
    color: #f5f5ff !important;
    font-weight: 700;
    border-radius: 12px;
    padding: 12px 14px;
}

    .ModernDropItem i {
        width: 18px;
        text-align: center;
        color: #d9c7ff;
        transition: all .18s ease;
    }

    .ModernDropItem:hover {
        background: rgba(255,255,255,.10);
        color: #ffffff !important;
        transform: translateX(-2px);
    }

.LogoutItem:hover {
    background: rgba(255,90,90,.12);
}
.ModernUserDropdown option {
    background: #564ab2;
    color: #ffffff;
    font-weight: bold;
}
/* hover icons */

.ModernDropItem:hover i {
    color: #ffe082;
}

/* logout special hover */

.LogoutItem:hover {
    background: rgba(255,90,90,.14);
}

    .LogoutItem:hover i {
        color: #ffb3b3;
    }

/* =========================================
   OTHER USER TITLE
========================================= */

.OrgSelectorTitle {
    color: #222 !important;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}
/* النصوص الأساسية داخل الدروب */

.ModernUserDropdown,
.ModernUserDropdown span,
.ModernUserDropdown label,
.ModernUserDropdown a {
    color: #222 !important;
}

    /* عنوان الفرع */

    .ModernUserDropdown #laorg,
    .ModernUserDropdown #orgname {
        color: #222 !important;
        font-weight: bold;
    }

/* روابط الحساب */

.ModernDropItem {
    color: #222 !important;
    font-weight: 700;
}

    /* أيقونات الحساب */

    .ModernDropItem i {
        color: #5c4fc9 !important;
    }

    /* hover */

    .ModernDropItem:hover {
        background: rgba(92,79,201,.10);
        color: #000 !important;
    }

/* عنوان الدخول كمستخدم آخر */

.OrgSelectorTitle {
    color: #222 !important;
    font-weight: bold;
}
/* =========================================
   CLEAN EMPTY BOTTOM HEADER
========================================= */

.BottomHeaderRow {
    min-height: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: none !important;
    background: transparent !important;
}

/* old unused blocks */

.HeaderOrgArea,
.HeaderSearchArea,
.HeaderLocationArea {
    display: none !important;
}
/* =========================================
   DEFAULT HEADER FINAL FIX
========================================= */


/* center logo */

.HeaderCenterArea,
.HeaderActionsArea,
.HeaderOrgArea,
.HeaderSearchArea,
.HeaderLocationArea {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* اللوجو والعنوان */

.HeaderCenterArea {
    flex-direction: column !important;
    justify-content: center !important;
}

/* menu row */

.SiteMasterHeader {
    width: 100% !important;
    table-layout: fixed;
}

/* menu cell */

.MenuMainCell {
    width: auto !important;
}

    .MenuInlineSearch input[type=text] {
        width: 100% !important;
        height: 38px !important;
        border-radius: 12px !important;
    }

/* keep bottom row normal */

.BottomHeaderRow {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: 10px !important;
}
/* =========================================
   INLINE MENU SEARCH - DEFAULT
========================================= */

.MenuSearchCell {
    width: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    position: relative;
}

.MenuMainCell {
    width: 100% !important;
}

/* search floating inside menu */

.MenuInlineSearch {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(calc(-50% - 4px));
}

    /* input */

    .MenuInlineSearch input[type=text],
    .MenuInlineSearch select {
        width: 150px !important;
        height: 30px !important;
        border-radius: 10px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        background: rgba(255,255,255,.94) !important;
        border: 1px solid rgba(255,255,255,.18) !important;
        box-shadow: 0 2px 6px rgba(0,0,0,.12);
        transition: all .18s ease;
    }

        /* expand on focus */

        .MenuInlineSearch input[type=text]:focus,
        .MenuInlineSearch select:focus {
            width: 230px !important;
            background: #fff !important;
        }

.HeaderCenterArea,
.HeaderActionsArea,
.HeaderOrgArea,
.HeaderSearchArea,
.HeaderLocationArea {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* اللوجو والعنوان */

.HeaderCenterArea {
    flex: 1;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-width: 0 !important;
    position: relative !important;
}

.SystemTitle {
    position: fixed !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    white-space: nowrap !important;
    z-index: 1000;
}

.CompanySmallLogo {
    position: absolute !important;
    right: 0px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: block !important;
}

    .CompanySmallLogo img,
    #Companylogo {
        height: 35px !important;
        width: auto !important;
    }
.TopHeaderRow,
.BottomHeaderRow {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    position: relative !important;
}
.TopHeaderRow {
    display: flex;
    justify-content: space-between;
    align-items: center;
}