:root {
  --color-primary: #47b772; /* Primary */
  --color-secondary: #173b2a; /* Secondary */
  --color-third: #4f5f55; /* Third */
  --color-green1: #0a4035; /* Green */
  --color-gray1: #d7e3d8; /* Gray */
  --color-black1: #101010; /* Black */
  --color-white: #fff;
  --color-bgColor: #f6f8f5; /* Background */
}

.adminjs_App {
  background-color: var(--color-bgColor);
}
.adminjs_Icon {
  color: #47b772 !important;
}
.adminjs_Link {
  color: #3f4e41 !important;
}
.adminjs_Badge {
  color: #101010 !important;
}

.adminjs_Sidebar {
  background-color: var(--color-green1);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.adminjs_SidebarLink {
  color: var(--color-gray1);
  border-radius: 8px;
  margin: 2px 8px;
}

.adminjs_SidebarLink--active {
  background-color: rgba(71, 183, 114, 0.18);
  color: var(--color-white) !important;
}

.adminjs_Logo > img {
  width: 60px !important;
  height: 60px !important;
  max-width: none !important;
  display: block;
  margin: 20px auto 0;
}

.adminjs_Login {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: var(--color-bgColor);
}

.adminjs_Login__Logo {
  content: url('/static/assets/logo.png');
  width: 150px;
  height: auto;
  display: block;
  margin: 0 auto 20px;
}

.adminjs_H1,
.adminjs_H2,
.adminjs_H3,
.adminjs_Text {
  color: var(--color-third);
}
.adminjs_Table {
  font-size: 14px !important;
  border-radius: 8px !important;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(24, 47, 32, 0.06);
}

.adminjs_TableHead {
  background-color: #eef5ed !important;
}
.adminjs_TableRow {
  color: #243329 !important;
  text-transform: none !important;
}
.adminjs_TableHead > .adminjs_TableCell {
  color: #425348 !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}

.adminjs_DatePicker .react-datepicker {
  border-radius: 8px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.adminjs_DatePicker .react-datepicker__header {
  background-color: #3f4e41;
  color: white;
}

.adminjs_DatePicker .react-datepicker__day--keyboard-selected {
  background-color: #47b772 !important; /* Primary */
  color: white !important;
}
