2834 lines
48 KiB
SCSS
2834 lines
48 KiB
SCSS
.rev-div {
|
|
width: 100%;
|
|
//dhana
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
// justify-content: center;
|
|
// gap: 1rem
|
|
// gap:1rem
|
|
//
|
|
}
|
|
|
|
.DashboardHeading {
|
|
display: flex;
|
|
justify-content: center;
|
|
width: 100%;
|
|
gap: 0.5rem;
|
|
font-weight: 600;
|
|
font-size: larger;
|
|
}
|
|
|
|
.rev-head {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
width: 97%;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: baseline;
|
|
margin-left: 1rem;
|
|
// padding: 1rem 1rem;
|
|
}
|
|
|
|
.Dashboardrange {
|
|
margin-right: 5rem;
|
|
}
|
|
|
|
.rev-content {
|
|
display: flex;
|
|
// flex-wrap: wrap;
|
|
width: 88vw;
|
|
overflow: scroll;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.rev-box {
|
|
background-color: #fff;
|
|
width: 200px;
|
|
height: 8rem;
|
|
margin: 1vw 2vh;
|
|
padding: 0.5rem 1rem;
|
|
border-radius: 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
row-gap: 1rem;
|
|
}
|
|
|
|
.rev-box-total {
|
|
background-color: #fff;
|
|
width: 200px;
|
|
height: 8rem;
|
|
margin: 1vw 2vh;
|
|
padding: 0.5rem 1rem;
|
|
border-radius: 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
row-gap: 1rem;
|
|
}
|
|
|
|
.rev-box-cont {
|
|
display: flex;
|
|
flex-direction: row;
|
|
column-gap: 1rem;
|
|
font-weight: 600;
|
|
font-size: 14px;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.rev-badge {
|
|
width: max-content;
|
|
padding: 0.1rem 0.3rem;
|
|
border-radius: 6px;
|
|
background-color: var(--SELECTED_COLOR);
|
|
color: #fff;
|
|
}
|
|
|
|
.rev-badge.negative {
|
|
width: max-content;
|
|
padding: 0.1rem 0.3rem;
|
|
border-radius: 6px;
|
|
background-color: var(--ERROR_COLOR);
|
|
color: #fff;
|
|
}
|
|
|
|
.rev-box-amtcont {
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 0.5rem 1.5rem;
|
|
column-gap: 0.7rem;
|
|
font-weight: 600;
|
|
font-size: 22px;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
// statics
|
|
|
|
.stat-div {
|
|
// background-color: #fff;
|
|
// width: 806px;
|
|
// height: 412px;
|
|
margin: 1vw 2vh;
|
|
padding: 0.5rem 0rem;
|
|
display: flex;
|
|
flex-direction: row;
|
|
column-gap: 1rem;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.stats {
|
|
background-color: #fff;
|
|
width: 1000px;
|
|
height: 300px;
|
|
flex-grow: 1;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
.stock-avl {
|
|
width: 320px;
|
|
height: 400px;
|
|
border-radius: 6px;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.stk-cnt {
|
|
margin: 1rem 0rem;
|
|
height: 50vh;
|
|
overflow: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
row-gap: 1rem;
|
|
}
|
|
|
|
.stk-cont {
|
|
display: flex;
|
|
flex-direction: row;
|
|
column-gap: 1rem;
|
|
font-size: 14px;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.stk-dtl {
|
|
display: flex;
|
|
width: 100%;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.changing-background {
|
|
width: max-content;
|
|
padding: 0px 6px;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
color: #fff;
|
|
font-family: "Poppins";
|
|
font-weight: 600;
|
|
}
|
|
|
|
.stk-cnt-lowprice {
|
|
background: var(--ERROR_COLOR);
|
|
width: max-content;
|
|
padding: 0px 6px;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
color: #fff;
|
|
font-family: "Poppins";
|
|
font-weight: 600;
|
|
}
|
|
|
|
.stk-cnt-midprice {
|
|
background: orange;
|
|
width: max-content;
|
|
padding: 0px 6px;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
color: #fff;
|
|
font-family: "Poppins";
|
|
font-weight: 600;
|
|
}
|
|
|
|
.stk-cnt-highprice {
|
|
background: var(--SELECTED_COLOR);
|
|
width: max-content;
|
|
padding: 0px 6px;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
color: #fff;
|
|
font-family: "Poppins";
|
|
font-weight: 600;
|
|
}
|
|
|
|
.lowstocmain {
|
|
margin: 1vw 2vh;
|
|
display: flex;
|
|
grid-template-columns: 1fr 1fr;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
height: max-content;
|
|
min-height: 8rem;
|
|
border-radius: 8px;
|
|
font-family: "Poppins";
|
|
width: max-content;
|
|
min-width: 250px;
|
|
|
|
> div:nth-child(1) {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.lowstock {
|
|
width: 100%;
|
|
font-size: 12px;
|
|
padding: 0.3rem 1rem;
|
|
background-color: #fff;
|
|
cursor: pointer;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
border-radius: 8px;
|
|
justify-content: space-between;
|
|
flex-direction: column;
|
|
|
|
&:hover {
|
|
background-color: #dfdfdf;
|
|
transition-duration: 0.4s !important;
|
|
}
|
|
}
|
|
|
|
.lowstock:nth-child(3) {
|
|
width: 240px !important;
|
|
}
|
|
|
|
p {
|
|
font-size: 22px;
|
|
color: #1d1d1d;
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
.topsellingPro {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
font-family: "Poppins";
|
|
padding: 0.7rem 1rem;
|
|
margin: 1vw 2vh;
|
|
background-color: #e0e0e0;
|
|
border-radius: 8px;
|
|
width: 50%;
|
|
|
|
.filterTopSelling {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
font-size: 12px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.topsellingPro-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 1rem;
|
|
padding: 0px 0 6px 0;
|
|
}
|
|
|
|
.topsellingPro-card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 130px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: #fff;
|
|
padding: 4px 5px;
|
|
gap: 2px;
|
|
|
|
img {
|
|
width: 100%;
|
|
height: 100px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
div {
|
|
text-align: center;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
width: 97%;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
}
|
|
|
|
.topSellingMain {
|
|
display: flex;
|
|
overflow-x: auto;
|
|
gap: 6px;
|
|
align-items: center;
|
|
scrollbar-width: thin;
|
|
padding-bottom: 10px;
|
|
width: 100%;
|
|
padding-right: 2rem;
|
|
}
|
|
|
|
@media (min-width: 280px) and (max-width: 499px) {
|
|
//srinath
|
|
.ant-picker-dropdown .ant-picker-panel-container .ant-picker-panels {
|
|
width: 50vw !important;
|
|
overflow: scroll !important;
|
|
}
|
|
|
|
// .Dashboardrange .datepickerDashboardrange{
|
|
// width: 100%;
|
|
// }
|
|
.ant-picker-dropdown .ant-picker-panel-container .ant-picker-date-panel-container {
|
|
width: 100px;
|
|
}
|
|
|
|
// .ant-picker-dropdown .ant-picker-panel-container .ant-picker-panels {
|
|
// display: flex;
|
|
// flex-wrap: wrap;
|
|
// direction: ltr;
|
|
// }
|
|
|
|
.rev-div .Dashboardrange .ant-picker-dropdown .ant-picker-panel-container .ant-picker-presets {
|
|
display: flex;
|
|
flex-direction: column !important;
|
|
min-width: 145px;
|
|
max-width: 200px;
|
|
height: 20vh;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.rev-content {
|
|
padding: 0rem -1rem;
|
|
width: 88vw !important;
|
|
transform: scale(0.9);
|
|
}
|
|
|
|
.stat-div {
|
|
width: 100vw;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.stats {
|
|
width: 539px !important;
|
|
overflow: scroll !important;
|
|
}
|
|
|
|
.rev-head {
|
|
flex-wrap: wrap !important;
|
|
}
|
|
|
|
// .rev-box {
|
|
// width: 250px;
|
|
// }
|
|
.DashboardHeading {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
gap: 0.5rem;
|
|
font-weight: 600;
|
|
font-size: smaller;
|
|
// font-size: larger;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 500px) and (max-width: 676px) {
|
|
.rev-head .field-DropDown {
|
|
width: 200px !important;
|
|
}
|
|
|
|
.rev-content {
|
|
padding: 0rem -1rem;
|
|
width: 88vw !important;
|
|
transform: scale(0.9);
|
|
}
|
|
|
|
.stat-div {
|
|
width: 100vw;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.stats {
|
|
width: 539px !important;
|
|
overflow: scroll !important;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 677px) and (max-width: 1024px) {
|
|
.Dashboardrange {
|
|
margin-right: 1rem;
|
|
}
|
|
|
|
.rev-head {
|
|
display: flex;
|
|
width: 100%;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: baseline;
|
|
}
|
|
|
|
.stats {
|
|
overflow: scroll !important;
|
|
}
|
|
}
|
|
|
|
.Togglee {
|
|
display: flex;
|
|
width: inherit;
|
|
height: 2vw;
|
|
flex-direction: row-reverse;
|
|
z-index: 1;
|
|
padding-right: 93px;
|
|
}
|
|
|
|
.Togglee .ant-switch {
|
|
background-color: var(--SELECTED_COLOR) !important;
|
|
}
|
|
|
|
// .rev-div {
|
|
// width: 100%;
|
|
// //dhana
|
|
// display: flex;
|
|
// flex-wrap: wrap;
|
|
// // justify-content: center;
|
|
// // gap: 1rem
|
|
// // gap:1rem
|
|
// //
|
|
// }
|
|
|
|
// .DashboardHeading {
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// width: 100%;
|
|
// gap: 0.5rem;
|
|
// font-weight: 600;
|
|
// font-size: larger;
|
|
// }
|
|
|
|
// .rev-head {
|
|
// display: flex;
|
|
// flex-wrap: wrap;
|
|
// width: 97%;
|
|
// flex-direction: row;
|
|
// justify-content: space-between;
|
|
// align-items: baseline;
|
|
// margin-left: 1rem;
|
|
// // padding: 1rem 1rem;
|
|
// }
|
|
|
|
// .Dashboardrange {
|
|
// margin-right: 5rem;
|
|
// }
|
|
|
|
// .rev-content {
|
|
// display: flex;
|
|
// // flex-wrap: wrap;
|
|
// width: 88vw;
|
|
// overflow: scroll;
|
|
// }
|
|
// .rev-box {
|
|
// background-color: #fff;
|
|
// width: 250px;
|
|
// margin: 1vw 2vh;
|
|
// padding: 0.5rem 0rem;
|
|
// border-radius: 8px;
|
|
// align-items: center;
|
|
// }
|
|
|
|
// .rev-box-cont {
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// column-gap: 1rem;
|
|
// font-weight: 600;
|
|
// font-size: 14px;
|
|
// justify-content: space-around;
|
|
// }
|
|
|
|
// .rev-badge {
|
|
// width: max-content;
|
|
// padding: 0.1rem 0.3rem;
|
|
// border-radius: 6px;
|
|
// background-color: var(--SELECTED_COLOR);
|
|
// color: #fff;
|
|
// }
|
|
|
|
// .rev-badge.negative {
|
|
// width: max-content;
|
|
// padding: 0.1rem 0.3rem;
|
|
// border-radius: 6px;
|
|
// background-color: var(--ERROR_COLOR);
|
|
// color: #fff;
|
|
// }
|
|
|
|
// .rev-box-amtcont {
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// padding: 0.5rem 1.5rem;
|
|
// column-gap: 0.7rem;
|
|
// font-weight: 600;
|
|
// font-size: 22px;
|
|
// justify-content: flex-start;
|
|
// }
|
|
|
|
// // statics
|
|
|
|
// .stat-div {
|
|
// // background-color: #fff;
|
|
// // width: 806px;
|
|
// // height: 412px;
|
|
// margin: 1vw 2vh;
|
|
// padding: 0.5rem 0rem;
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// column-gap: 1rem;
|
|
// overflow: scroll;
|
|
// }
|
|
|
|
// .stats {
|
|
// background-color: #fff;
|
|
// width: 1000px;
|
|
// height: 300px;
|
|
// flex-grow: 1;
|
|
// border-radius: 6px;
|
|
// }
|
|
|
|
// .stock-avl {
|
|
// width: 320px;
|
|
// height: 400px;
|
|
// border-radius: 6px;
|
|
// background-color: #fff;
|
|
// }
|
|
|
|
// .stk-cnt {
|
|
// margin: 1rem 0rem;
|
|
// height: 50vh;
|
|
// overflow: auto;
|
|
// display: flex;
|
|
// flex-direction: column;
|
|
// row-gap: 1rem;
|
|
// }
|
|
|
|
// .stk-cont {
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// column-gap: 1rem;
|
|
// font-size: 14px;
|
|
// justify-content: space-around;
|
|
// }
|
|
|
|
// .stk-dtl {
|
|
// display: flex;
|
|
// width: 100%;
|
|
// justify-content: space-around;
|
|
// }
|
|
|
|
// .changing-background {
|
|
// width: max-content;
|
|
// padding: 0px 6px;
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// border-radius: 4px;
|
|
// color: #fff;
|
|
// font-family: "Poppins";
|
|
// font-weight: 600;
|
|
// }
|
|
|
|
// .stk-cnt-lowprice {
|
|
// background: var(--ERROR_COLOR);
|
|
// width: max-content;
|
|
// padding: 0px 6px;
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// border-radius: 4px;
|
|
// color: #fff;
|
|
// font-family: "Poppins";
|
|
// font-weight: 600;
|
|
// }
|
|
|
|
// .stk-cnt-midprice {
|
|
// background: orange;
|
|
// width: max-content;
|
|
// padding: 0px 6px;
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// border-radius: 4px;
|
|
// color: #fff;
|
|
// font-family: "Poppins";
|
|
// font-weight: 600;
|
|
// }
|
|
|
|
// .stk-cnt-highprice {
|
|
// background: var(--SELECTED_COLOR);
|
|
// width: max-content;
|
|
// padding: 0px 6px;
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// border-radius: 4px;
|
|
// color: #fff;
|
|
// font-family: "Poppins";
|
|
// font-weight: 600;
|
|
// }
|
|
// @media (min-width: 280px) and (max-width: 499px) {
|
|
// .rev-content {
|
|
// padding: 0rem -1rem;
|
|
// width: 88vw !important;
|
|
// transform: scale(0.9);
|
|
// }
|
|
// .stat-div {
|
|
// width: 100vw;
|
|
// overflow: scroll;
|
|
// }
|
|
|
|
// .stats {
|
|
// width: 539px !important;
|
|
// overflow: scroll !important;
|
|
// }
|
|
|
|
// .rev-head {
|
|
// flex-wrap: wrap !important;
|
|
// }
|
|
// .rev-box {
|
|
// width: 250px;
|
|
// }
|
|
// .DashboardHeading {
|
|
// display: flex;
|
|
// justify-content: flex-start;
|
|
// gap: 0.5rem;
|
|
// font-weight: 600;
|
|
// font-size: smaller;
|
|
// // font-size: larger;
|
|
// }
|
|
// }
|
|
|
|
// @media (min-width: 500px) and (max-width: 676px) {
|
|
// .rev-head .field-DropDown {
|
|
// width: 200px !important;
|
|
// }
|
|
// .rev-content {
|
|
// padding: 0rem -1rem;
|
|
// width: 88vw !important;
|
|
// transform: scale(0.9);
|
|
// }
|
|
// .stat-div {
|
|
// width: 100vw;
|
|
// overflow: scroll;
|
|
// }
|
|
// .stats {
|
|
// width: 539px !important;
|
|
// overflow: scroll !important;
|
|
// }
|
|
// }
|
|
|
|
// @media (min-width: 677px) and (max-width: 1024px) {
|
|
// .Dashboardrange {
|
|
// margin-right: 1rem;
|
|
// }
|
|
// .rev-head {
|
|
// display: flex;
|
|
// width: 100%;
|
|
// flex-direction: row;
|
|
// justify-content: space-between;
|
|
// align-items: baseline;
|
|
// }
|
|
// .stats {
|
|
// overflow: scroll !important;
|
|
// }
|
|
// }
|
|
// .Togglee {
|
|
// display: flex;
|
|
// width: inherit;
|
|
// height: 2vw;
|
|
// flex-direction: row-reverse;
|
|
// z-index: 1;
|
|
// padding-right: 93px;
|
|
// }
|
|
|
|
// .Togglee .ant-switch {
|
|
// background-color:var(--SELECTED_COLOR) !important;
|
|
// }
|
|
.modalContentsadminuser {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
gap: 1.5rem;
|
|
|
|
Button:disabled,
|
|
Button[disabled] {
|
|
background-color: #d9d9d9 !important;
|
|
color: #000000b9 !important;
|
|
border: none !important;
|
|
cursor: not-allowed;
|
|
}
|
|
}
|
|
|
|
.inputNumber {
|
|
width: 10%;
|
|
padding: 0.5rem;
|
|
border: 1px solid #a0a0a0 !important;
|
|
border-radius: 5px;
|
|
|
|
:nth-child(1) {
|
|
margin-left: 0 !important;
|
|
}
|
|
}
|
|
|
|
.otpInputsadminuser {
|
|
display: flex;
|
|
gap: 1rem;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
}
|
|
|
|
.size-save-button-retail {
|
|
// width: max-content;
|
|
// background-color: #52c41a;
|
|
// padding: 0rem 1rem;
|
|
// font-size: 15px;
|
|
// font-weight: 500;
|
|
// border-radius: 11px;
|
|
// cursor: pointer;
|
|
// display: flex;
|
|
// text-align: center;
|
|
// justify-content: center;
|
|
// padding-top: 10px;
|
|
width: max-content;
|
|
border: none;
|
|
padding: 10px 16px;
|
|
font-size: 16px;
|
|
text-transform: capitalize;
|
|
font-family: "Gilroy";
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
background-color: #20a720;
|
|
color: #fff;
|
|
border-radius: 6px;
|
|
word-spacing: 1px;
|
|
}
|
|
|
|
// writing by srii
|
|
|
|
.chartsTitle {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
padding: 1rem 0;
|
|
|
|
p {
|
|
font-size: 22px;
|
|
font-weight: 600;
|
|
color: #000000;
|
|
}
|
|
}
|
|
|
|
.g2-tooltip-marker,
|
|
.g2-tooltip-marker {
|
|
padding: 5px !important;
|
|
}
|
|
|
|
.centerPages {
|
|
width: 100%;
|
|
|
|
.breadCrumbClass {
|
|
display: none !important;
|
|
}
|
|
|
|
.content {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
border-radius: 0px;
|
|
flex-direction: row;
|
|
height: 98vh;
|
|
overflow: auto;
|
|
width: 100.4%;
|
|
}
|
|
|
|
@media (max-width: 500px) {
|
|
// width: 85vw !important;
|
|
}
|
|
}
|
|
|
|
.RetailDashboard-Master {
|
|
width: 100%;
|
|
font-family: "Poppins" !important;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 0px;
|
|
margin: 0rem 0rem;
|
|
|
|
@media (max-width: 500px) {
|
|
// width: 90%;
|
|
}
|
|
|
|
.dashboardHeader {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background-color: #23378a;
|
|
padding: 6px 12px;
|
|
color: #ffffff;
|
|
width: 100%;
|
|
// position: fixed;
|
|
top: 0;
|
|
z-index: 100;
|
|
position: sticky;
|
|
}
|
|
|
|
.shopName {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
text-transform: capitalize;
|
|
gap: 0;
|
|
gap: 10px;
|
|
|
|
div {
|
|
font-size: 18px;
|
|
font-weight: 500;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
|
|
@media (max-width: 499px) {
|
|
font-size: 14px !important;
|
|
}
|
|
}
|
|
|
|
div:nth-child(2) {
|
|
font-size: 18px;
|
|
font-weight: 500;
|
|
display: unset;
|
|
}
|
|
|
|
p {
|
|
font-size: 10px;
|
|
font-weight: 400;
|
|
letter-spacing: 0.3px;
|
|
|
|
@media (max-width: 499px) {
|
|
font-size: 7px !important;
|
|
}
|
|
}
|
|
|
|
img {
|
|
border-right: 1px solid #ffffffc5;
|
|
padding-right: 1rem;
|
|
|
|
@media (max-width: 499px) {
|
|
width: 100px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.dashboareduser {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 16px;
|
|
|
|
.userShortName {
|
|
background-color: #d0c8ff;
|
|
color: #8036ff;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
padding: 6px;
|
|
border-radius: 50px;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
> div:nth-child(1) {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
|
|
@media (max-width: 699px) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.infoplan {
|
|
font-size: 11px;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
.dashboardHeader2 {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
padding: 10px;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
|
|
&.top {
|
|
background: #fff !important;
|
|
}
|
|
.ant-select-selection-item {
|
|
margin-top: -13px !important;
|
|
padding-inline-end: 23px !important;
|
|
}
|
|
}
|
|
|
|
.branch-filter-dropdown {
|
|
.branch-filter-select {
|
|
.ant-select {
|
|
min-width: 150px !important;
|
|
|
|
.ant-select-selector {
|
|
background: linear-gradient(90deg, #1565c0 0%, #1976d2 100%) !important;
|
|
border: none !important;
|
|
border-radius: 5px !important;
|
|
color: #fff !important;
|
|
font-size: 13px !important;
|
|
font-weight: 500 !important;
|
|
box-shadow: 0 2px 8px rgba(21, 101, 192, 0.08) !important;
|
|
|
|
.ant-select-selection-item {
|
|
color: #fff !important;
|
|
}
|
|
|
|
.ant-select-selection-placeholder {
|
|
color: rgba(255, 255, 255, 0.8) !important;
|
|
}
|
|
}
|
|
|
|
.ant-select-arrow {
|
|
color: #fff !important;
|
|
}
|
|
|
|
&:hover .ant-select-selector {
|
|
background: linear-gradient(90deg, #1976d2 0%, #2196f3 100%) !important;
|
|
}
|
|
|
|
&.ant-select-focused .ant-select-selector {
|
|
background: linear-gradient(90deg, #1976d2 0%, #2196f3 100%) !important;
|
|
box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.2) !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.FilterAndRefresh {
|
|
.ant-picker-outlined {
|
|
width: 230px !important;
|
|
}
|
|
}
|
|
|
|
.changeDash {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1.5rem;
|
|
padding: 0 10px;
|
|
|
|
div {
|
|
font-size: 14px;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.changeDash {
|
|
display: flex;
|
|
gap: 20px;
|
|
|
|
.tab {
|
|
cursor: pointer;
|
|
color: #0f0f0f;
|
|
border-bottom: 2px solid transparent;
|
|
transition: all 0.2s ease-in-out;
|
|
}
|
|
|
|
.tab.active {
|
|
border-bottom: 2px solid #1890ff;
|
|
color: #1890ff;
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
.FilterAndRefresh {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1rem;
|
|
|
|
div {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 2px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
align-items: flex-end;
|
|
}
|
|
}
|
|
|
|
.dashboardMain {
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
padding: 0 1rem 1rem 1rem;
|
|
gap: 1rem;
|
|
|
|
h4 {
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
padding: 7px 0;
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 0;
|
|
width: 93%;
|
|
}
|
|
}
|
|
|
|
.TotalRevenue-Graph {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
background-color: #fff;
|
|
border-radius: 8px;
|
|
padding: 6px;
|
|
border: 2px solid #eeeeee;
|
|
}
|
|
|
|
.totalRevenue-Graph-Details {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
gap: 10px;
|
|
}
|
|
|
|
.TotalRevenue {
|
|
width: 31%;
|
|
|
|
.curve-graph-container {
|
|
width: 95% !important;
|
|
.labels {
|
|
flex-direction: row-reverse;
|
|
}
|
|
}
|
|
|
|
.graphLineDesign {
|
|
width: 100% !important;
|
|
|
|
@media screen and (max-width: 768px) {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
.tab {
|
|
padding: 10px 10px !important;
|
|
border-radius: 8px;
|
|
|
|
&:active {
|
|
border: 1px solid #000 !important;
|
|
}
|
|
}
|
|
|
|
.tabs {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 10px;
|
|
width: 100%;
|
|
|
|
> .tab:nth-child(1) {
|
|
background-color: #c2bcff;
|
|
color: #1200d3;
|
|
width: 33%;
|
|
}
|
|
|
|
> .tab:nth-child(2) {
|
|
background-color: #fadaf5;
|
|
color: #d100b2;
|
|
width: 33%;
|
|
}
|
|
|
|
> .tab:nth-child(3) {
|
|
background-color: #fde7b8;
|
|
color: #af7800;
|
|
width: 33%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
.detailsProducts {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
background-color: #ffffff;
|
|
padding: 16px 10px;
|
|
border-radius: 8px;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.detailsProductsCard {
|
|
background: linear-gradient(
|
|
90deg,
|
|
rgb(255, 255, 255) 0%,
|
|
rgba(143, 209, 142, 0.71) 4%,
|
|
rgb(255, 255, 255) 7%,
|
|
rgba(143, 209, 142, 0.71) 10%,
|
|
rgb(255, 255, 255) 13%,
|
|
rgba(143, 209, 142, 0.71) 16%,
|
|
rgb(255, 255, 255) 19%,
|
|
rgba(143, 209, 142, 0.71) 22%,
|
|
rgb(255, 255, 255) 25%,
|
|
rgba(143, 209, 142, 0.71) 29%,
|
|
rgb(255, 255, 255) 32%,
|
|
rgba(143, 209, 142, 0.71) 35%,
|
|
rgb(255, 255, 255) 38%,
|
|
rgba(143, 209, 142, 0.71) 41%,
|
|
rgb(255, 255, 255) 44%,
|
|
rgba(143, 209, 142, 0.71) 47%,
|
|
rgb(255, 255, 255) 50%,
|
|
rgba(143, 209, 142, 0.71) 54%,
|
|
rgb(255, 255, 255) 57%,
|
|
rgba(143, 209, 142, 0.71) 60%,
|
|
rgb(255, 255, 255) 63%,
|
|
rgba(143, 209, 142, 0.71) 66%,
|
|
rgb(255, 255, 255) 69%,
|
|
rgba(143, 209, 142, 0.71) 72%,
|
|
rgb(255, 255, 255) 74%,
|
|
rgb(255, 255, 255) 75%,
|
|
rgba(143, 209, 142, 0.71) 78%,
|
|
rgb(255, 255, 255) 79%,
|
|
rgba(143, 209, 142, 0.71) 82%,
|
|
rgb(255, 255, 255) 85%,
|
|
rgba(143, 209, 142, 0.71) 88%,
|
|
rgb(255, 255, 255) 91%,
|
|
rgba(143, 209, 142, 0.71) 94%,
|
|
rgb(255, 255, 255) 97%,
|
|
rgb(255, 255, 255) 97%,
|
|
rgba(143, 209, 142, 0.71) 100%,
|
|
rgb(76, 175, 80) 100%
|
|
);
|
|
background-color: #ffffff;
|
|
width: 95px;
|
|
height: 85px;
|
|
border-radius: 8px;
|
|
position: relative;
|
|
|
|
div {
|
|
position: absolute;
|
|
top: 35%;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
text-align: center;
|
|
font-size: 25px;
|
|
font-weight: 600;
|
|
text-shadow:
|
|
0 0 5px #fff,
|
|
0 0 10px #fff,
|
|
0 0 15px #fff,
|
|
0 0 20px #fff,
|
|
0 0 25px #fff,
|
|
0 0 30px #fff,
|
|
0 0 35px #fff;
|
|
}
|
|
|
|
p {
|
|
position: absolute;
|
|
bottom: 0;
|
|
font-size: 10px;
|
|
font-weight: 500;
|
|
text-transform: uppercase;
|
|
left: 0;
|
|
right: 0;
|
|
white-space: nowrap;
|
|
text-align: center;
|
|
text-shadow:
|
|
0 0 5px #fff,
|
|
0 0 10px #fff,
|
|
0 0 15px #fff,
|
|
0 0 20px #fff,
|
|
0 0 25px #fff,
|
|
0 0 30px #fff,
|
|
0 0 35px #fff;
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
width: 30% !important;
|
|
}
|
|
}
|
|
|
|
.ProductDetailsMain {
|
|
width: 37%;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.CreditList {
|
|
width: 20%;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.CreditList-Details {
|
|
background-color: #ffffff;
|
|
border-radius: 8px;
|
|
padding: 10px;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
overflow: auto;
|
|
height: 25vh;
|
|
|
|
div {
|
|
background-color: #eae9fb;
|
|
padding: 8px 12px;
|
|
border-radius: 6px;
|
|
-webkit-border-radius: 6px;
|
|
-moz-border-radius: 6px;
|
|
-ms-border-radius: 6px;
|
|
-o-border-radius: 6px;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: #000000;
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
height: max-content;
|
|
max-height: 40vh;
|
|
}
|
|
}
|
|
|
|
.tltExpense-PurOrderMain {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
gap: 10px;
|
|
margin-top: 2rem;
|
|
font-family: "Poppins";
|
|
}
|
|
|
|
.tltExpense {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
width: 48%;
|
|
}
|
|
|
|
.tltExpense-amt {
|
|
background-color: #fff;
|
|
padding: 1rem;
|
|
border-radius: 12px;
|
|
text-align: center;
|
|
font-size: 22px;
|
|
font-weight: 600;
|
|
border: 2px solid #eeeeee;
|
|
|
|
p {
|
|
font-size: 11px !important;
|
|
margin-bottom: 6px;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
.tlxHeader {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.refershdashboard {
|
|
display: flex;
|
|
background-color: #f1f9ff;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
padding: 6px 12px;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
|
|
div {
|
|
font-size: 13px;
|
|
color: #0070d9;
|
|
text-align: center;
|
|
}
|
|
|
|
span {
|
|
font-weight: 500;
|
|
font-size: 10px;
|
|
color: #242424;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
flex-direction: row;
|
|
}
|
|
|
|
@media (max-width: 499px) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
.TopSellingProduct {
|
|
width: 40%;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
padding: 0 0 1rem 0;
|
|
|
|
@media screen and (max-width: 768px) {
|
|
width: 93%;
|
|
}
|
|
}
|
|
|
|
.TopSellingProductMain {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
padding: 0 14px;
|
|
}
|
|
|
|
.tsp-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.TopSellingProduct-card {
|
|
background-color: #fff;
|
|
padding: 16px;
|
|
width: 100%;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.TopSellingProduct-list {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 14px;
|
|
gap: 6px;
|
|
background-color: #f0f0f0;
|
|
padding: 4px;
|
|
border: 1px solid #cacaca;
|
|
margin-bottom: 11px;
|
|
border-radius: 4px;
|
|
|
|
img {
|
|
width: 35px;
|
|
height: 35px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.calendar-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
color: #000000;
|
|
border: none;
|
|
border-radius: 6px;
|
|
padding: 4px 1px 4px 1px;
|
|
font-size: 8px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
transition: background 0.2s;
|
|
margin-left: 8px;
|
|
font-family: "Poppins";
|
|
|
|
svg {
|
|
font-size: 18px;
|
|
}
|
|
|
|
&:hover {
|
|
background: #d3d3d3;
|
|
}
|
|
}
|
|
|
|
.calendar-dropdown {
|
|
position: absolute;
|
|
top: 110%;
|
|
right: 0;
|
|
min-width: 90px;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
|
z-index: 100;
|
|
padding: 6px 0;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.calendar-dropdown-item {
|
|
padding: 2px 10px;
|
|
font-size: 12px;
|
|
color: #222;
|
|
cursor: pointer;
|
|
transition:
|
|
background 0.15s,
|
|
color 0.15s;
|
|
|
|
&:hover {
|
|
background: #f0f6ff;
|
|
color: #0057d8;
|
|
}
|
|
}
|
|
|
|
.calendar-dropdown-item.selected {
|
|
background: #e6f0ff;
|
|
color: #0057d8;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.tab-switcher {
|
|
display: inline-flex;
|
|
background: #f0f2f5;
|
|
border-radius: 6px;
|
|
padding: 4px;
|
|
gap: 4px;
|
|
font-family: "Poppins", sans-serif;
|
|
background: #fff;
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
|
|
|
.tab-button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: transparent;
|
|
color: #5f6368;
|
|
border: none;
|
|
border-radius: 4px;
|
|
padding: 8px 16px;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
white-space: nowrap;
|
|
position: relative;
|
|
font-family: "Poppins", sans-serif;
|
|
opacity: 0.6;
|
|
|
|
&:hover {
|
|
background: rgba(21, 101, 192, 0.08);
|
|
color: #1565c0;
|
|
}
|
|
|
|
&.active {
|
|
background: linear-gradient(90deg, #1565c0 0%, #1976d2 100%);
|
|
color: #fff;
|
|
box-shadow: 0 2px 8px rgba(21, 101, 192, 0.2);
|
|
opacity: 1 !important;
|
|
|
|
&:hover {
|
|
background: linear-gradient(90deg, #0d47a1 0%, #1565c0 100%);
|
|
box-shadow: 0 4px 12px rgba(21, 101, 192, 0.3);
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
&:active {
|
|
transform: scale(0.98);
|
|
}
|
|
}
|
|
|
|
@media (max-width: 499px) {
|
|
gap: 2px;
|
|
padding: 3px;
|
|
|
|
.tab-button {
|
|
font-size: 10px;
|
|
padding: 6px 12px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.dashboard-dropdown-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
background: linear-gradient(90deg, #1565c0 0%, #1976d2 100%);
|
|
color: #fff;
|
|
border: none;
|
|
border-radius: 5px;
|
|
padding: 6px 12px 6px 12px;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
box-shadow: 0 2px 8px rgba(21, 101, 192, 0.08);
|
|
transition:
|
|
background 0.18s,
|
|
box-shadow 0.18s;
|
|
// min-width: 130px;
|
|
position: relative;
|
|
font-family: "Poppins";
|
|
justify-content: space-between;
|
|
|
|
svg {
|
|
margin-left: 10px;
|
|
font-size: 20px;
|
|
transition: transform 0.18s;
|
|
}
|
|
|
|
&:hover,
|
|
&:focus {
|
|
background: linear-gradient(90deg, #0d47a1 0%, #1565c0 100%);
|
|
box-shadow: 0 4px 16px rgba(21, 101, 192, 0.16);
|
|
}
|
|
|
|
@media (max-width: 499px) {
|
|
font-size: 10px;
|
|
min-width: max-content !important;
|
|
}
|
|
}
|
|
|
|
.NotificationCD {
|
|
p {
|
|
font-size: 12px;
|
|
background-color: #8275ff;
|
|
width: max-content;
|
|
color: #fff;
|
|
padding: 0 2px;
|
|
border-radius: 2px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
// --- Modern Dashboard Styles ---
|
|
|
|
.dashboardMainGrid {
|
|
display: flex;
|
|
gap: 1rem;
|
|
align-items: flex-start;
|
|
width: 100%;
|
|
font-family: "Inter", sans-serif !important;
|
|
padding: 0 10px 10px 10px;
|
|
}
|
|
|
|
.dashboardMainLeft {
|
|
flex: 1;
|
|
min-width: 320px;
|
|
}
|
|
|
|
.dashboardMainCenter {
|
|
flex: 1.2;
|
|
min-width: 340px;
|
|
}
|
|
|
|
.dashboardMainRight {
|
|
flex: 0.8;
|
|
min-width: 260px;
|
|
background-color: #fff;
|
|
padding: 12px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.chartCard {
|
|
background: #fff;
|
|
border-radius: 16px;
|
|
box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
|
|
padding: 1.5rem 1.5rem 1rem 1.5rem;
|
|
position: relative;
|
|
min-height: 260px;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
|
|
.chartCardHeader {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.chartTitle {
|
|
font-size: 1.2rem;
|
|
font-weight: 600;
|
|
color: #222;
|
|
}
|
|
|
|
.chartGraphWrapper {
|
|
position: relative;
|
|
}
|
|
|
|
.chartRedX {
|
|
position: absolute;
|
|
left: 55%;
|
|
top: 38%;
|
|
z-index: 2;
|
|
pointer-events: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-radius: 50%;
|
|
box-shadow: 0 0 8px #e53935;
|
|
}
|
|
|
|
.chartSummaryRow {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.chartSummaryBox {
|
|
text-align: center;
|
|
}
|
|
|
|
.chartSummaryValue {
|
|
font-weight: 700;
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.chartSummaryValue.green {
|
|
color: #20a720;
|
|
}
|
|
|
|
.chartSummaryLabel {
|
|
color: #7b8a99;
|
|
font-size: 0.85rem;
|
|
}
|
|
|
|
.chartBreakdownRow {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
.chartBreakdownBox {
|
|
color: #1976d2;
|
|
font-weight: 600;
|
|
font-size: 1rem;
|
|
text-align: center;
|
|
|
|
span {
|
|
color: #222;
|
|
font-weight: 700;
|
|
display: block;
|
|
font-size: 1.1rem;
|
|
}
|
|
}
|
|
|
|
.todaySnapshotRow {
|
|
display: flex;
|
|
gap: 0;
|
|
margin-bottom: 1rem;
|
|
background-color: #ffffff;
|
|
border-radius: 8px;
|
|
flex-direction: column;
|
|
padding: 12px;
|
|
}
|
|
|
|
.todaySnapFlex {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
.todaySnapshotBox {
|
|
flex: 1;
|
|
padding: 10px 2px;
|
|
text-align: center;
|
|
font-weight: 600;
|
|
-webkit-text-stroke-width: 0.2px;
|
|
font-size: 1.7rem;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 4px;
|
|
|
|
div {
|
|
color: #2a2a2a;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
margin-top: 0.2rem;
|
|
letter-spacing: -0.3px;
|
|
}
|
|
}
|
|
|
|
.todaySnapshotBox.revenue {
|
|
color: #20a720;
|
|
}
|
|
|
|
.todaySnapshotBox.orders {
|
|
color: #3b3b3b;
|
|
}
|
|
|
|
.todaySnapshotBox.customers {
|
|
color: #3b3b3b;
|
|
}
|
|
|
|
.todaySnapshotBox.pending {
|
|
color: #3b3b3b;
|
|
}
|
|
|
|
.quickActionsRow {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-bottom: 1rem;
|
|
background-color: #fff;
|
|
border-radius: 8px;
|
|
padding: 10px;
|
|
}
|
|
|
|
.quickActionBox {
|
|
flex: 1;
|
|
border-radius: 8px;
|
|
border: 1px solid #e0e6ed;
|
|
padding: 0.5;
|
|
text-align: center;
|
|
font-size: 1.5rem;
|
|
cursor: pointer;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
height: 100px;
|
|
justify-content: center;
|
|
gap: 0.7rem;
|
|
|
|
div {
|
|
color: #2a2a2a;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
margin-top: 0.2rem;
|
|
letter-spacing: -0.3px;
|
|
}
|
|
}
|
|
|
|
.expensesSalesRow {
|
|
display: flex;
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.expenseBox {
|
|
flex: 1;
|
|
background: #fff;
|
|
border-radius: 10px;
|
|
box-shadow: 0 2px 8px #e0e6ed;
|
|
padding: 1rem;
|
|
text-align: center;
|
|
color: #7b8a99;
|
|
font-size: 0.95rem;
|
|
font-weight: 500;
|
|
|
|
div {
|
|
color: #222;
|
|
font-weight: 700;
|
|
font-size: 1.1rem;
|
|
margin-top: 0.2rem;
|
|
}
|
|
|
|
.red {
|
|
color: #e53935;
|
|
}
|
|
}
|
|
|
|
.salesBreakdownRow {
|
|
display: flex;
|
|
gap: 6px;
|
|
}
|
|
|
|
.salesBreakdownBox {
|
|
flex: 1;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
box-shadow: 0 1px 2px #e0e6ed;
|
|
padding: 12px;
|
|
text-align: center;
|
|
color: #686868;
|
|
font-size: 0.85rem;
|
|
font-weight: 500;
|
|
border: 1px solid #eeeeee;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
flex-direction: column;
|
|
|
|
div {
|
|
color: #222;
|
|
font-weight: 700;
|
|
font-size: 1.1rem;
|
|
margin-top: 0.3rem;
|
|
}
|
|
}
|
|
|
|
.productSummaryCard {
|
|
background: #fff;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.productSummaryTitle {
|
|
color: #000000;
|
|
font-weight: 600;
|
|
margin-bottom: 0.3rem;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.productSummaryRow {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 0.5rem;
|
|
flex-wrap: wrap;
|
|
border-radius: 6px;
|
|
padding-top: 7px;
|
|
}
|
|
|
|
.productSummaryBox {
|
|
flex: 1;
|
|
min-width: 80px;
|
|
background: linear-gradient(0deg, #ffffff, #aceec4);
|
|
border-radius: 8px;
|
|
padding: 1.4rem 0.1rem;
|
|
text-align: center;
|
|
font-weight: 700;
|
|
font-size: 1.1rem;
|
|
border: 1px solid #eeeeee;
|
|
|
|
div {
|
|
font-size: 0.7rem;
|
|
color: #2a2a2a;
|
|
margin-top: 6px;
|
|
font-weight: 500;
|
|
}
|
|
p {
|
|
font-size: 1.5rem;
|
|
color: #2a2a2a;
|
|
margin-top: 6px;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
.lastbillcount {
|
|
width: 99%;
|
|
background-color: #fff;
|
|
padding: 1rem 1rem;
|
|
font-size: 18px;
|
|
font-weight: 500;
|
|
margin: 0.5rem 0;
|
|
-webkit-text-stroke-width: 0.2px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.notificationCenterCard {
|
|
background: #fff;
|
|
border-radius: 12px;
|
|
padding: 1rem;
|
|
position: relative;
|
|
height: max-content;
|
|
max-height: 14vh;
|
|
overflow: scroll;
|
|
border: 1px solid #eeeeee;
|
|
}
|
|
|
|
.notificationCenterTitle {
|
|
color: #333;
|
|
font-weight: 500;
|
|
font-family: "Poppins";
|
|
margin-bottom: 0.5rem;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.notificationStock {
|
|
color: #2a2a2a;
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
padding-bottom: 5px;
|
|
text-decoration: underline;
|
|
margin-bottom: 0.2rem;
|
|
width: max-content;
|
|
-webkit-text-stroke-width: 0.3px;
|
|
}
|
|
|
|
.notificationViewAll {
|
|
color: #1976d2;
|
|
font-size: 0.65rem;
|
|
text-decoration: none;
|
|
position: absolute;
|
|
bottom: 2px;
|
|
right: 6px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.preOrderSummaryCardMain {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 8px;
|
|
width: 60%;
|
|
flex-wrap: wrap;
|
|
|
|
@media (max-width: 768px) {
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.dashboardSecondaryGrid {
|
|
display: flex;
|
|
gap: 1rem;
|
|
margin-top: 2rem;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
padding: 10px;
|
|
margin-bottom: 2rem;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
.topSellingProductCard {
|
|
// flex: 1;
|
|
width: 38%;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 8px #e0e6ed;
|
|
padding: 0 1rem 1rem 1rem;
|
|
position: relative;
|
|
height: 50vh;
|
|
overflow: auto;
|
|
max-height: 300px; // Adjust height as needed
|
|
overflow-y: auto;
|
|
/* Optional: for better look */
|
|
scrollbar-width: thin;
|
|
scrollbar-color: #aaa #f5f5f5;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 98% !important;
|
|
}
|
|
}
|
|
|
|
.topSellingHeader {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
/* margin: 0.5rem 0; */
|
|
font-weight: 600;
|
|
position: sticky;
|
|
top: 0px;
|
|
background-color: #fff;
|
|
z-index: 100;
|
|
height: 3rem;
|
|
|
|
div {
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
.topSellingMonth {
|
|
font-size: 0.7rem !important;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
.topSellingProductItem {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.7rem;
|
|
background: #f0f0f0;
|
|
border: 1px solid #cacaca;
|
|
padding: 0.5rem;
|
|
border-radius: 6px;
|
|
margin-bottom: 0.5rem;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.topSellingProductImg {
|
|
width: 35px;
|
|
height: 35px;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
.topSellingProductName {
|
|
font-size: 0.75rem;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.topSellingProductCount {
|
|
font-size: 0.75rem;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.topSellingViewAll {
|
|
color: #1976d2;
|
|
font-size: 0.7rem;
|
|
text-decoration: none;
|
|
position: absolute;
|
|
right: 7px;
|
|
cursor: pointer;
|
|
bottom: 0;
|
|
}
|
|
|
|
.preOrderSummaryCard {
|
|
flex: 0.7;
|
|
min-width: 220px;
|
|
border-radius: 8px;
|
|
background-color: #fff;
|
|
padding: 12px;
|
|
}
|
|
|
|
.preOrderSummaryTitle {
|
|
font-weight: 500;
|
|
margin-bottom: 0.2rem;
|
|
font-size: 13px;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
.preOrderSummaryRow {
|
|
height: 16vh;
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.preOrderSummaryBox {
|
|
flex: 1;
|
|
border-radius: 6px;
|
|
padding: 1rem 0.5rem;
|
|
text-align: center;
|
|
font-weight: 700;
|
|
font-size: 1.5rem;
|
|
background: #c7dafa;
|
|
|
|
&.pending {
|
|
background: #faedc7;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
&.completed {
|
|
background: #d3fac7;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
&.total {
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
div {
|
|
font-size: 0.7rem;
|
|
color: #2a2a2a;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
.creditListCardMain {
|
|
min-width: 220px;
|
|
height: 25.5vh;
|
|
flex: 0.7;
|
|
overflow: scroll;
|
|
border-radius: 8px;
|
|
background-color: #fff;
|
|
padding: 8px;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.creditListCard {
|
|
position: relative;
|
|
background: #fff;
|
|
min-width: 220px;
|
|
border-radius: 10px;
|
|
height: 16vh;
|
|
overflow: auto;
|
|
scrollbar-width: thin;
|
|
}
|
|
|
|
.creditListTitle {
|
|
font-weight: 500;
|
|
margin-bottom: 0.2rem;
|
|
font-size: 13px;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
.creditListHeader {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-weight: 500;
|
|
font-size: 0.75rem;
|
|
// margin-bottom: 0.5rem;
|
|
color: #696868;
|
|
|
|
position: sticky;
|
|
top: 0px;
|
|
background-color: white;
|
|
z-index: 106;
|
|
height: 2rem;
|
|
align-items: center;
|
|
}
|
|
|
|
.creditListRow {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-weight: 500;
|
|
font-size: 0.75rem;
|
|
margin-bottom: 0.2rem;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
.creditListViewAll {
|
|
color: #1976d2;
|
|
font-size: 0.65rem;
|
|
text-decoration: none;
|
|
position: absolute;
|
|
bottom: -1px;
|
|
right: 14px;
|
|
}
|
|
|
|
.stockAlertsCard {
|
|
background: #ffffff;
|
|
border-radius: 8px;
|
|
box-shadow: none;
|
|
padding: 12px;
|
|
min-width: 320px;
|
|
position: relative;
|
|
flex: 1;
|
|
border: 1px solid #eeeeee;
|
|
height: max-content;
|
|
max-height: 30vh;
|
|
overflow: auto;
|
|
}
|
|
|
|
.stockAlertsTitle {
|
|
position: sticky;
|
|
top: -15px;
|
|
background-color: #fff;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.stockAlertsHeaderRow {
|
|
position: sticky;
|
|
top: 8px;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.stockAlertsTable {
|
|
width: 100%;
|
|
margin-top: 0.5rem;
|
|
}
|
|
|
|
.stockAlertsHeaderRow {
|
|
display: flex;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
color: #222;
|
|
border-bottom: 1px solid #e0e0e0;
|
|
padding-bottom: 4px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.stockAlertsRow {
|
|
display: flex;
|
|
font-size: 15px;
|
|
color: #222;
|
|
align-items: center;
|
|
padding: 2px 0;
|
|
}
|
|
|
|
.stockAlertsCol {
|
|
padding: 2px 0;
|
|
}
|
|
|
|
.stockAlertsCol.slno {
|
|
width: 40px;
|
|
min-width: 40px;
|
|
text-align: left;
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.stockAlertsCol.product {
|
|
flex: 1;
|
|
text-align: left;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.stockAlertsCol.count {
|
|
width: 90px;
|
|
min-width: 70px;
|
|
text-align: right;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.stockAlertsProductLink {
|
|
color: #222;
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.stockAlertsViewAll {
|
|
text-align: right;
|
|
margin-top: 6px;
|
|
font-size: 13px;
|
|
|
|
a {
|
|
color: #1976d2;
|
|
text-decoration: underline;
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
// Utility
|
|
.green {
|
|
color: #20a720 !important;
|
|
}
|
|
|
|
.red {
|
|
color: #e53935 !important;
|
|
}
|
|
|
|
// Responsive
|
|
@media (max-width: 1024px) {
|
|
.dashboardMainGrid,
|
|
.dashboardSecondaryGrid {
|
|
flex-direction: column;
|
|
gap: 1.2rem;
|
|
}
|
|
|
|
.dashboardMainLeft,
|
|
.dashboardMainCenter,
|
|
.dashboardMainRight,
|
|
.topSellingProductCard,
|
|
.preOrderSummaryCard,
|
|
.creditListCard,
|
|
.stockAlertsCard {
|
|
min-width: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.TotalRevenue {
|
|
width: 80% !important;
|
|
}
|
|
.preOrderSummaryCardMain {
|
|
width: 100% !important;
|
|
flex-direction: column;
|
|
}
|
|
.creditListCardMain {
|
|
flex: unset;
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
// --- Final Widget Row Styles ---
|
|
.final-widget-row {
|
|
display: flex;
|
|
gap: 1rem;
|
|
margin-top: 1.5rem;
|
|
width: 100%;
|
|
align-items: flex-start;
|
|
|
|
@media (max-width: 1024px) {
|
|
flex-direction: column;
|
|
gap: 1.2rem;
|
|
}
|
|
}
|
|
|
|
.dashboard-widget {
|
|
background: #f7f8fa00;
|
|
border-radius: 12px;
|
|
min-width: 240px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
|
flex: 1;
|
|
position: relative;
|
|
height: 100%;
|
|
}
|
|
|
|
.calendar-box,
|
|
.calendar-days {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.widget-title4 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #222;
|
|
padding: 10px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.widget-title5 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
margin-bottom: 8px;
|
|
padding: 10px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.widget-title6 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #222;
|
|
padding: 10px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.widget-title {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
margin-bottom: 8px;
|
|
color: #222;
|
|
background-color: #fff;
|
|
padding: 10px;
|
|
position: relative;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.widget-title1 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #222;
|
|
position: relative;
|
|
}
|
|
|
|
.widget-title2 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #222;
|
|
position: relative;
|
|
margin-top: 10px !important;
|
|
}
|
|
|
|
.widget-title3 {
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #2a2a2a;
|
|
position: relative;
|
|
margin: 10px 0 !important;
|
|
}
|
|
|
|
.widget-table {
|
|
width: 100%;
|
|
font-size: 15px;
|
|
margin-bottom: 8px;
|
|
border-collapse: collapse;
|
|
background-color: #fff;
|
|
border-radius: 10px;
|
|
|
|
th,
|
|
td {
|
|
padding: 4px 8px;
|
|
text-align: left;
|
|
}
|
|
|
|
th {
|
|
color: #888;
|
|
font-weight: 500;
|
|
font-size: 13px;
|
|
}
|
|
|
|
td {
|
|
color: #222;
|
|
font-size: 15px;
|
|
}
|
|
}
|
|
|
|
.widget-link {
|
|
color: #1976d2;
|
|
font-size: 10px;
|
|
text-align: right;
|
|
cursor: pointer;
|
|
margin-top: 4px;
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 8px;
|
|
}
|
|
|
|
.widget-link1 {
|
|
color: #1976d2;
|
|
font-size: 13px;
|
|
text-align: right;
|
|
cursor: pointer;
|
|
margin-top: 4px;
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 8px;
|
|
}
|
|
|
|
.payment-profit-col {
|
|
flex: 1.5;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
}
|
|
|
|
.payment-method-row {
|
|
display: flex;
|
|
gap: 24px;
|
|
align-items: center;
|
|
font-size: 18px;
|
|
background-color: #fff;
|
|
font-weight: 600;
|
|
padding: 6px;
|
|
justify-content: space-around;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.payment-method {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 2px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.payment-label {
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
color: #888;
|
|
}
|
|
|
|
.canceldashboard {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.profit-row {
|
|
display: flex;
|
|
gap: 24px;
|
|
align-items: center;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
background-color: #ffff;
|
|
padding: 6px;
|
|
border-radius: 8px;
|
|
border: 1px solid #eeeeee;
|
|
}
|
|
|
|
.profit-item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 2px;
|
|
|
|
span {
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
|
|
.profit-value {
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
color: #2a2a2a;
|
|
}
|
|
|
|
.cancel-export-col {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 12px;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100% !important;
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
|
|
.cancelled-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
font-size: 14px;
|
|
background-color: #fff;
|
|
padding: 6px;
|
|
flex-direction: column;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.cancelled-icon {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.cancelled-label {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.cancelled-amount {
|
|
color: #e53935;
|
|
font-weight: 600;
|
|
font-size: 15px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.export-reports {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.export-btn {
|
|
background: #1976d2;
|
|
color: #fff;
|
|
border: none;
|
|
border-radius: 8px;
|
|
padding: 22px 16px;
|
|
font-weight: 500;
|
|
justify-content: center;
|
|
font-size: 14px;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
font-family: "Inter", sans-serif;
|
|
width: 100%;
|
|
transition: background 0.2s;
|
|
}
|
|
|
|
.export-btn:hover {
|
|
background: #1251a2;
|
|
}
|
|
|
|
.warehouse-branch-view {
|
|
min-width: 100%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 12px;
|
|
background-color: #fff;
|
|
padding: 12px;
|
|
border: 1px solid #eeeeee;
|
|
align-items: flex-start;
|
|
|
|
@media (max-width: 768px) {
|
|
width: 100% !important;
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
|
|
.branch-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
margin-bottom: 8px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.branch-select {
|
|
border-radius: 6px;
|
|
padding: 4px 8px;
|
|
border: 1px solid #ccc;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.warehouse-info-row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
|
|
.warehouse-orders {
|
|
color: #2a2a2a;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.warehouse-lowstock {
|
|
color: #e53935;
|
|
}
|
|
|
|
.warehouse-revenue-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
margin-top: 4px;
|
|
color: #1976d2;
|
|
}
|
|
|
|
// --- Bottom Widget Row Styles ---
|
|
.bottom-widget-row {
|
|
display: flex;
|
|
gap: 1rem;
|
|
margin-top: 1.5rem;
|
|
width: 100%;
|
|
|
|
@media (max-width: 1024px) {
|
|
flex-direction: column;
|
|
gap: 1.2rem;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
width: 95%;
|
|
}
|
|
}
|
|
|
|
.staff-user-activity {
|
|
min-width: 260px;
|
|
}
|
|
|
|
.user-activity-numbers {
|
|
display: flex;
|
|
gap: 16px;
|
|
font-size: 32px;
|
|
font-weight: 500;
|
|
margin-bottom: 8px;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
.user-logged-in {
|
|
color: #1976d2;
|
|
}
|
|
|
|
.user-active {
|
|
color: #20a720;
|
|
}
|
|
|
|
.user-inactive {
|
|
color: #888;
|
|
}
|
|
|
|
.user-activity-labels {
|
|
display: flex;
|
|
gap: 16px;
|
|
font-size: 12px;
|
|
padding-bottom: 8px;
|
|
font-weight: 400;
|
|
justify-content: space-around;
|
|
border-bottom: 1px solid #eeeeee;
|
|
}
|
|
|
|
.user-activity-table {
|
|
width: 100%;
|
|
font-size: 13px;
|
|
margin-bottom: 8px;
|
|
border-collapse: collapse;
|
|
|
|
th,
|
|
td {
|
|
padding: 4px 8px;
|
|
text-align: left;
|
|
}
|
|
|
|
th {
|
|
color: #2a2a2a;
|
|
font-weight: 400;
|
|
font-size: 13px;
|
|
}
|
|
|
|
td {
|
|
color: #2a2a2a;
|
|
font-weight: 400;
|
|
font-size: 13px;
|
|
}
|
|
}
|
|
|
|
.inventory-value-widget {
|
|
background: #f6faff00;
|
|
border-radius: 12px;
|
|
padding: 1px 8px 8px 8px;
|
|
box-shadow: none;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.inventory-value-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 8px 10px;
|
|
background: #fff;
|
|
border: 1px solid #e6eaf0;
|
|
border-radius: 10px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.inventory-icon {
|
|
font-size: 18px;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.inventory-label {
|
|
font-weight: 400;
|
|
font-size: 12px;
|
|
color: #222;
|
|
}
|
|
|
|
.inventory-value {
|
|
font-weight: 600;
|
|
color: #20a720;
|
|
font-size: 16px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.ai-title {
|
|
margin-top: 6px;
|
|
}
|
|
|
|
.ai-suggestions-box {
|
|
background: #fff;
|
|
border-radius: 10px;
|
|
border: 1px solid #e6eaf0;
|
|
padding: 12px 14px;
|
|
margin-top: 4px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
height: 100%;
|
|
}
|
|
|
|
.ai-suggestion {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 8px;
|
|
font-size: 15px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.ai-suggestion:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.ai-suggestion::before {
|
|
content: "✨";
|
|
font-size: 18px;
|
|
margin-right: 8px;
|
|
color: #f7b731;
|
|
display: inline-block;
|
|
}
|
|
|
|
.userShortName {
|
|
position: relative;
|
|
}
|
|
|
|
.userprofileDashboard {
|
|
position: absolute;
|
|
background-color: #fff;
|
|
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
|
padding: 10px 26px;
|
|
border-radius: 10px;
|
|
top: 60px;
|
|
right: 3px;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
|
|
img {
|
|
width: 4rem;
|
|
height: 4rem;
|
|
border-radius: 100px;
|
|
}
|
|
|
|
div {
|
|
color: #2a2a2a;
|
|
font-family: "Inter", sans-serif;
|
|
font-weight: 600;
|
|
font-size: 14px;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
button {
|
|
width: 100%;
|
|
padding: 6px 16px;
|
|
border: none;
|
|
outline: none;
|
|
background-color: #e53935;
|
|
color: #fff;
|
|
cursor: pointer;
|
|
font-family: "Poppins";
|
|
border-radius: 6px;
|
|
font-weight: 500;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
}
|
|
|
|
.tooltip-scrollable::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
|
|
.tooltip-scrollable::-webkit-scrollbar-thumb {
|
|
background: #aaa;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.tooltip-scrollable {
|
|
scrollbar-width: thin;
|
|
/* Firefox */
|
|
scrollbar-color: #aaa transparent;
|
|
/* Firefox */
|
|
}
|