
/**
Subject: Create Dynamic Styles
#029b9b;     Firouzeh

**/

:root {
--GridHeaderBackColor: #029b9b00;
--GridHeaderColor: #6effff;
--GridHeaderFontSize: inherit;
--GridBodyFontSize: small;
--FilterIconColor: #15ffa8;

--DetailTabColor: #ffffff;
--DetailTabBackColor: #029b9b;
--ProcessLinkColor: #ffffff;

--FormsControlFontSize: 14px;

--ActiveMenuColor: #ffffff;
--ActiveMenuBackColor: #029b9b;

--FilterPanelBackColor:#4b5a69;
--FilterPanelColor:#fcfdff;
--FilterPanelFontSize:14px;

--FilterItemsColor:#c2c7d0;
--FilterItemsFontSize:12px;

--TooltipColor: #0ea3b9;

--SwalTitleFontSize: 16px;
--SwalTextFontSize: 12px;

--GridRowOddColor: #ffffff;

--GridRowEvenBackColor: #68878b00;
--GridRowEvenColor: #ffffff;

--DetailLinkColor: #ffffff;
--DetailLinkBackColor: #029b9b4d;
--DetailLinkHoverColor: #ffffff;
--DetailLinkHoverBackColor: #df691ad4;

--DetailLinkBadgeBackColor:rgb(75 90 105 / 37%);

--GridStandardIconColor: #ffffff; 

--BadgeColor: #029b9b;

--GridDetailInscriptionColor: #ffffff; 
--GridDetailInscriptionBackColor: #029b9b; 

--ScmLogoBackground: #2d303361;
}

/**
Subject: System Logo in Global Pages Exclude Menu Page and Login Page
**/
/* Main container for the combined header */
.header-combined-container {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--ScmLogoBackground);
    padding: 5px 10px;
    width: 100%;
    border-radius: 9px;
}

/* Title text container */
.header-title-wrapper {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

/* Title text styling */
.header-title-text {
    font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-weight: 700;
    font-style: italic;
    font-size: 3vmin;
    color: #c0c0c0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Logo container */
.header-brand-logo {
    display: flex;
    align-items: center;
}

/* Logo image styling */
.header-brand-image {
    height: 28px;
    width: auto;
    border: none;
}


/**
Subject: Grid header Style
**/
[data-location] .r-ori-vert > [data-itemid]:not([data-hidden]):not([data-media-hidden])[data-itemtype="grid_field_label"] > .text-label {
    white-space: normal;
    text-decoration: none;
    flex: 1 1 auto;
    color: var(--GridHeaderColor);
    padding: 0px 0px 0px 0px;
    background-color: var(--GridHeaderBackColor);
    border-radius: 4px;
    font-size: var(--GridHeaderFontSize);
    text-align: center;
}
/* Delete Underline below Text */
[data-location] .r-ori-vert > [data-itemid]:not([data-hidden]):not([data-media-hidden])[data-itemtype="grid_field_label"]
{
    text-decoration: none;
}
/**
Subject: Grid Body Style
**/
[data-itemtype="grid_field"] {
    text-align: center;
    font-size: var(--GridBodyFontSize);
}

/* Grid Body Item in Table will be middle Vertically  */
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td
{
    vertical-align: middle    
}

/**
Subject: Grid header Filter Icon
**/

[data-itemtype="grid_field_label"] > .dropdown > button {
    margin-right: 5px;
    background-color: #1f5a6700;
    color: #6effffad;
    position: relative;
    left: -12px;
    height: 19px;
    border-radius: 4px;
}
/**
Subject: User profile Picture
**/
.r-user-image > img {
    height: 35px;
    margin: -10px 4px;
    border-radius: 50%;
}
.function-userinfo [data-itemtype="user_picture"] img {
    max-width: 400px;
    width: 200px;
    border-radius: 50%;
}

/**
Subject: Tabs In Details
**/
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: var(--DetailTabColor);
    background-color: var(--DetailTabBackColor);
    border: 1px solid var(--DetailTabBackColor);
    /*border-bottom: 0px;
    border-bottom-color: #f39c12; */
    cursor: pointer;
    font-weight: 600;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
table a:not(.btn), .table a:not(.btn) {
    text-decoration: none;
}
/* Color of Icon Detail Link Process (Icon Direct Link Page to another Page) */
.bs-proceed-icon.bs-proceed-icon {
    color: var(--ProcessLinkColor);
}
/* Detail Link */
.nav-tabs li.active a[data-toggle="tab"].bs-proceed-link {
    text-decoration: none;
}

/**
Subject: Detail Link
**/
[data-cellid="grid_cell_details"]
{
    text-align: left;
    background-color: var(--DetailLinkBackColor);
    color: var(--DetailLinkColor);
    /*border-radius: 4px; */
    transition: background-color 1s cubic-bezier(1, -0.25, 0.2, 1), color 1s cubic-bezier(0.18, 0.89, 0.32, 1.28);
    height: 45px;
}
[data-cellid="grid_cell_details"]:hover {
    background-color: var(--DetailLinkHoverBackColor); 
    color: var(--DetailLinkHoverColor); 

}
/* Border DtailPanel */
.panel-body {
    padding: 10px;
    border-color: var(--GridDetailInscriptionBackColor);
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}
/**
Subject: Controls On Forms
**/
.form-control {
    font-size: var(--FormsControlFontSize);
	border-radius: 4px;
}
/* LOVs */
.chosen-container-multi .chosen-choices.chosen-choices {
    border-radius: 4px;
    font-size: var(--FormsControlFontSize);
}
.btn {
    font-size: var(--FormsControlFontSize);
}

/**
Subject: Menu Bar Active Menu Background Color
**/
.r-left .r-menu li.active.active.active > [data-menu-link] {
    background: var(--ActiveMenuBackColor);
    color: var(--ActiveMenuColor);
}
.r-vbar-page .r-left [data-itemtype="filter_panel"] .panel .panel-heading {
    background-color: var(--FilterPanelBackColor);
    color: var(--FilterPanelColor);
    font-size: var(--FilterPanelFontSize);
}
.r-vbar-page .r-left [data-itemtype="filter_panel"] .panel ul > li a {
    color: var(--FilterItemsColor);
    font-size: var(--FilterItemsFontSize);
}

.filter-indicator {
    font-size: smaller;
}
/*Filter Apply Button */
.r-vbar-page .r-left [data-itemtype="filter_panel"] .panel .filter-show-more, .r-vbar-page .r-left [data-itemtype="filter_panel"] .panel .filter-multiselect {
    background: #5c6670;
    padding: 7px;
}
.filterPanelContainer.filterPanelContainer.filterPanelContainer.filterPanelContainer .filter-show-more > a, .filterPanelContainer.filterPanelContainer.filterPanelContainer.filterPanelContainer .filter-multiselect > a {
    padding: 15px;
}

/**
Subject: Tooltips
**/
table .text-muted, .table .text-muted {
    color: var(--TooltipColor);
}

/**
Subject: SweetAlart
**/

.swal-title {
    font-size: var(--SwalTitleFontSize);
    text-align: center;
}
.swal-text {
    font-size: var(--SwalTextFontSize);
    text-align: center;
}


/**
Subject: Grid Background and Fore Color Rows -- Odd and even Rows
**/

table[data-location="grid"].table-striped[data-body-height="2"] > tbody > tr:nth-child( 4n + 2)
{
    color: var(--GridRowOddColor);
}
table[data-location="grid"].table-striped[data-body-height="1"] > tbody > tr:nth-child( 2n + 1)
{
    background: var(--GridRowEvenBackColor);
    color: var(--GridRowEvenColor);
}

/**
Subject: Welcome items in Menu Page
**/
.bs-welcome-item.bs-welcome-item {
    border-radius: 12px;
}

.bs-welcome-item .bs-welcome-header {
    border: solid #d8d8d8 0px;
}

/**
Subject: Badge (Number Of records show in Detail Links)
**/
.badge {

    font-family: "Orbitron";
    font-size: 10px;
    text-align: center;
    border-radius: 4px;
    background-color: var(--BadgeColor) !important;
    height: 16px;
    width: 33px;
    padding-top: 3px;
    padding-left: 5px;
    vertical-align: top;
}

[data-itemtype="grid_details_link"], [data-itemtype="grid_alldetails_link"] {
    display: inline-block;
    background: var(--DetailLinkBadgeBackColor);
    padding: 7px;
    border-radius: 4px;
    display: inherit !important;
}

/**
Subject: Standard Icons for Edit, View, Copy, Detail Link , ... in Grid First Coloumn
**/
table a:not(.btn), .table a:not(.btn) {
    color: var(--GridStandardIconColor);
    text-decoration: none !important;
}

/**
Subject: Inscription above detail forms
**/
.panel-primary > .panel-heading
{
    color: var(--GridDetailInscriptionColor);
    background-color: var(--GridDetailInscriptionBackColor);
}


/**
Subject: General Items
**/

/* That the filters do not move to the next line in the list and are on a line next to the checkboxes */
.filterPanelContainer .filter-values > *:first-child, .filterPanelContainer .filter-show-more > *:first-child, .filterPanelContainer .filter-multiselect > *:first-child, .filterPanelContainer .filter-btn-apply > *:first-child {
    padding: 5px 5px;
    display: unset;
    flex: 1 1 auto;
}

/* In the grid header titles, a line is placed below the titles, which has been removed. */
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td
{
    border: 0px solid #4f5966;
}

/* Admin Area Copy permission */
.groupCopyLink {
    font-size: 15px;
    line-height: 20px;
    text-decoration: none;
    display: block;
    color: #cfccc9;
}

/* Go To Master Table Link that Create box For better visibility  */
[data-itemtype="master_info"] > .panel > .panel-heading .btn-link {
    color: inherit;
    background-color: #029b9b;
    font-size: smaller;
}

/* Scm Logo Place in Pages  */
.r-vbar-page .r-left [data-logo-cell][data-logo-cell]
{
    background-color: #3d587100;
}



/**
Subject: Welcome Widget in Home Menu
**/

/* استایل باکس اصلی */
.welcome-widget {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    width: 400px;
    padding: 20px;
    overflow: hidden;

    /* موقعیت‌دهی */
    position: absolute;
    top: 68px; /* فاصله از بالای صفحه */
    left: 47px; /* فاصله از سمت چپ صفحه */

    /* افکت برای هاور */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* افکت هاور */
.welcome-widget:hover {
    transform: scale(1.02); /* کمی بزرگ‌تر شدن */
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3); /* افزایش سایه */
}

/* بخش لوگو */
.widget-logo {
    flex: 0 0 80px; /* ثابت نگه داشتن عرض لوگو */
    display: flex;
    justify-content: center;
    align-items: center;
}

.widget-logo img {
    width: 60px;
    height: 60px;
    object-fit: cover;
}

/* خط عمودی جداکننده */
.widget-divider {
    width: 2px;
    background-color: #ddd;
    height: 100%;
    margin: 0 15px;
}

/* بخش اطلاعات */
.widget-info {
    flex: 1;
}

.widget-info h1 {
    margin: 0;
    font-size: 18px;
    color: #333;
}

.widget-info h2 {
    margin: 5px 0;
    font-size: 14px;
    color: #666;
}

.widget-info p {
    margin: 5px 0;
    font-size: 14px;
    color: #888;
}

/**
Subject: Select2
**/
.select2-container {
    width: 100% !important; /* تنظیم عرض */
    direction: rtl; /* تنظیم راست به چپ */
}

.select2-container .select2-selection {
    height: auto !important; /* تنظیم ارتفاع */
    min-height: 38px; /* حداقل ارتفاع */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    text-align: right; /* متن راست‌چین */
}

.select2-container--default .select2-selection--multiple {
    min-height: 38px; /* ارتفاع مناسب */
    text-align: right; /* متن راست‌چین */
}

/**
Subject: Top Menu in Manu Page padding from Right that space with Logo
**/
@media print, (min-width: 768px) {
    [data-location="supertop"] > [data-cellid]:not( .r-align-right ) {
        padding-right: 12px;
    }
}

/**
Subject: Swal Modal CSS
**/
.swal-del-button{
  background-color: red !important;
  color: white !important; 
}


.filterPanelContainer {
    border: #7d7d7d;
    border-width: thin;
    border-style: solid;
}

/*Text Color Result of Search */
.r-search-highlight {
    color: #f1a776;
    font-weight: bold;
}

/* Search Box Spec */
.r-vbar-page .r-left .panel .panel-heading {
    background-color: var(--GridDetailInscriptionBackColor);
}

/* Back to Master table Link (master Data) */
[data-itemtype="master_info"] > .panel > .panel-heading .btn-link {
    color: inherit;
    background-color: #029b9b;
    font-size: smaller;
    background-color: black;
    padding: 5px;
    text-decoration: none;
}

/**
Subject: Effect in OEM Logo (such as Tesla Logo)
**/

/* تنظیم استایل اولیه برای ظرف تصویر */
.image-container {
    position: relative;
    display: inline-block;
    overflow: hidden; /* جلوگیری از خروج افکت از مرز تصویر */
    top: 3px;
}

/* استایل خود تصویر */
.header-brand-image {
    display: block;
    width: 28px;;
    height: auto;
}

/* شبه‌المان برای افکت براق */
.image-container::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%; /* شروع افکت از بیرون تصویر */
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%);
    transform: skewX(-30deg); /* ایجاد زاویه برای افکت */
    transition: none;
    opacity: 0; /* پنهان کردن افکت در حالت عادی */
}

/* انیمیشن افکت براق هنگام hover */
.image-container:hover::before {
    animation: shine 0.8s ease-in-out; /* مدت زمان و نوع انیمیشن */
    opacity: 1; /* ظاهر شدن افکت هنگام hover */
}

/* تعریف انیمیشن */
@keyframes shine {
    0% {
        left: -100%; /* شروع از بیرون تصویر */
    }
    100% {
        left: 100%; /* عبور کامل از تصویر */
    }
}
