:root {
  --q: #e01f2d;
  --background: #414141;
  --header: #323232;
  --sidebar: #393939;
  --green: #16c79a;
  --red: #ef4f4f;
  --blue: #51c2d5;
  --yellow: #f7c82d;
  --lightergray: #717171;
  --lightgray: #515151;
  --midgray: #4c4c4c;
  --darkgray: #393939;
}

body {
  background-color: var(--background) !important;
  background-image: none !important;
  min-height: 100vh !important;
}

#showCode canvas{
  width:400px;
}

.swal-wide{
  width:850px !important;
}

.swal2-popup .swal2-styled.swal2-confirm {
  background-color: var(--green) !important;
}

.swal2-popup .swal2-styled.swal2-cancel {
  background-color: var(--red) !important;
}

.swal2-popup .swal2-styled:focus {
  box-shadow: none !important;
}

body.login {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.login .login-logo {
  color: white;
}
.login .login-logo-q {
  max-width: 10rem;
}

.btn-primary {
  background-color: var(--green) !important;
  border-color: var(--green) !important;
}

.admin a {
  color: white !important;
  text-decoration: none !important;
}

.swal2-html-container a {
  color: black !important;
}

.admin .flex-1 {
  flex: 1 !important;
}

.admin a:hover {
  text-decoration: none !important;
}

.admin .swal2-container {
  z-index: 999999;
}

.admin .swal2-popup.swal2-toast.swal2-show .swal2-icon {
  margin-right: 1rem;
}

.admin .theme-topbar {
  background-color: var(--header) !important;
  background-image: none !important;
}

.admin .img-profile {
  filter: invert(1) !important;
}

.admin .licence b {
  color: white;
  background: red;
  padding: 0.5rem;
  border-radius: 0.5rem;
}

.admin #wrapper #content-wrapper {
  background-color: var(--background) !important;
}

.admin .theme-sidebar {
  background-color: var(--sidebar) !important;
  background-image: none !important;
  width: 18rem !important;
}

.admin .sidebar .sidebar-brand {
  font-size: 1.6rem !important;
  background-color: var(--header) !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-transform: none !important;
  font-weight: normal !important;
}

.admin .sidebar .sidebar-brand .sidebar-brand-text {
  padding-top: 10px !important;
}

.admin .theme-sidebar.toggled {
  width: 7.5rem !important;
}

.admin .theme-sidebar.toggled .sidebar-brand {
  justify-content: center !important;
}

.admin .sidebar .navbar-nav {
  width: 100% !important;
}

.admin .sidebar .nav-item {
  margin: 0rem 0.5rem !important;
}

.admin .sidebar .nav-divider {
  color: var(--lightergray) !important;
  padding: 0rem 1rem !important;
  font-weight: bolder !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.2rem !important;
  margin-top: 1.5rem !important;
  margin-bottom: 0.5rem !important;
  padding-top: 1.5rem !important;
  border-top: solid 1px var(--midgray) !important;
  position: relative;
}

.admin .theme-side.toggled .nav-divider {
  display: none !important;
}

.admin .navbar-nav .nav-item .nav-link {
  box-sizing: border-box;
  font-size: 1rem !important;
  color: white !important;
  padding: 0 !important;
  margin: 0 !important;
  padding: 0.5rem 1rem !important;
  border-radius: 0.5rem !important;
  width: 100%;
  display: flex;
  align-items: center;
}

.admin .navbar-nav .nav-item .nav-link i {
  font-size: 1.5rem !important;
  color: white !important;
  min-width: 30px;
  display: flex;
  justify-content: center;
  margin-right: 0.5rem;
}

.admin .sidebar .nav-item:hover .nav-link,
.admin .sidebar .nav-item.active .nav-link {
  background-color: var(--background) !important;
}

.admin .sidebar .nav-item.active .nav-link i,
.admin .sidebar .nav-item:hover .nav-link i {
  color: var(--green) !important;
}

.admin .theme-sidebar.toggled .nav-item .nav-link {
  padding: 0.5rem 0rem !important;
  font-size: 0.9rem !important;
}

.admin .dropdown-menu {
  background-color: var(--midgray) !important;
  border-color: var(--darkgray) !important;
  color: white !important;
}

.admin .dropdown-menu .dropdown-item {
  color: white !important;
}

.admin .dropdown-menu .dropdown-item:hover {
  background-color: var(--lightergray) !important;
}

.admin .dropdown-menu .dropdown-divider {
  border-color: var(--lightergray) !important;
}

.admin .text-dark {
  color: var(--lightergray) !important;
}

.admin .text-primary {
  color: white !important;
}

.admin .card {
  background-color: var(--midgray) !important;
  border-color: var(--lightgray) !important;
}

.admin .card .card-header {
  background-color: var(--lightgray) !important;
  border-color: var(--lightergray) !important;
}

.admin .table {
  color: white !important;
}

.admin .table .thead-dark th {
  background-color: var(--lightgray) !important;
  border-color: var(--darkgray) !important;
  border-width: 1px !important;
}

.admin .table-bordered,
.table-bordered td,
.table-bordered th {
  border-color: var(--darkgray) !important;
}

.admin .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active,
.admin .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link:hover {
  background-color: var(--midgray) !important;
  border-color: var(--lightergray) var(--lightergray) var(--midgray) !important;
}

/* MOBIL MODE */

@media (max-width: 979px) {
  .admin .licence-md-none {
    display: none !important;
  }
}

@media (min-width: 980px) {
  .admin .licence-lg-none {
    display: none !important;
  }
}

/* NEW TABLE CSS */

.admin .newcontent .list {
  background: #515151;
  border-radius: 4px;
  overflow: hidden;
  margin: 1rem 0rem;
  padding: 0.5rem;
}

.admin .newcontent .list .listitem {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem;
  user-select: none;
}

.admin .newcontent .list .listitem:nth-child(even) {
  background: #4c4c4c;
}

.admin .newcontent .list .title {
  border-bottom: solid 1px #494949;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem;
  user-select: none;
}

.admin .newcontent .list .title i,
.admin .newcontent .list .listitem i {
  width: 2rem;
  text-align: center;
  font-size: 1.2rem;
}

.admin .newcontent .list .listitem i.fa-sort {
  cursor: move;
  color: #777;
}

.admin .newcontent .list .title i {
  color: #777;
}

.admin .newcontent .list p {
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  margin: 0 !important;
}

.admin .newcontent .list .listitem.disabled > p {
  color: #777;
}

.admin .newcontent .list .title p {
  font-family: "Montserrat", sans-serif;
  font-size: 0.8rem;
  letter-spacing: 1px;
  font-weight: 800;
  color: #777;
}

.admin .newcontent .list .title p,
.admin .newcontent .list .listitem p {
  flex-grow: 10;
  display: inline-flex;
  align-items: center;
}

.admin .newcontent .list .title p.right,
.admin .newcontent .list .listitem p.right {
  flex-grow: 0;
  justify-content: center;
}

.admin
  .newcontent
  .list
  .listitem.disabled
  a.onOff
  i.fa-clipboard-check::before {
  content: "\f328";
}

.admin .newcontent .list .listitem a {
  margin: 0rem 0.5rem;
  padding: 0.4rem 0.4rem;
  background: #444;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  position: relative;
}

.admin .newcontent .list .listitem a:hover {
  background: var(--blue);
}

.admin .newcontent .list .listitem a.itemlist.hasitem {
  background: #888;
}

.admin .newcontent .list .listitem a.itemlist::before {
  /* content : attr(data-item-count) " urun"; */
  content: "Ürün Yok";
  position: absolute;
  background: #777;
  color: #ddd;
  font-size: 0.8rem;
  font-weight: 600;
  line-break: nowrap;
  padding: 0.2rem 0.5rem;
  min-width: 5rem;
  right: 6.5rem;
  border-radius: 3px;
  text-align: center;
}

.admin .newcontent .list .listitem a.itemlist::after {
  content: "";
  position: absolute;
  background: #777;
  width: 0.7rem;
  height: 0.7rem;
  transform: rotate(45deg);
  left: -1.2rem;
}

.admin .newcontent .list .listitem a.itemlist.hasitem::before {
  content: attr(data-item-count) " Ürün";
}

.admin .newcontent .list .listitem a.onOff {
  background-color: var(--green);
}

.admin .newcontent .list .listitem.nopacket a.packet.onOff,
.admin .newcontent .list .listitem.nonote a.notes.onOff,
.admin .newcontent .list .listitem.disabled a.onOff {
  /* background-color: var(--red); */
  background-color: #444;
}

.admin .newcontent .list .listitem.nopacket a.packet.onOff i,
.admin .newcontent .list .listitem.nonote a.notes.onOff i,
.admin .newcontent .list .listitem.disabled a.onOff i {
  /* color:var(--red); */
  color: #777;
}

.admin .newcontent .list .listitem a.hhour.ison{
  background-color: var(--green);
}

.admin .newcontent .list .listitem a.hhour.none,
.admin .newcontent .list .listitem a.hhour.ison:hover
{
  background-color: var(--red);
}



.admin input.urunfiyat {
  border: solid 1px var(--lightergray) !important;
  outline: none !important;
  background: none !important;
  color: white !important;
  padding: 0rem 0.2rem !important;
  width: 4.5rem !important;
  text-align: right !important;
  --moz-appearance: textfield !important;
}

.admin .listitem .currency {
  min-width: 1.5rem;
  position: relative;
}

.admin .listitem .urunfiyat::-webkit-outer-spin-button,
.admin .listitem .urunfiyat::-webkit-inner-spin-button {
  --webkit-appearance: none;
  margin: 0;
}

.admin .listitem .currency::after {
  color: white;
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
}

.admin .listitem .currency.try::after {
  content: "₺";
}

.admin .listitem .currency.usd::after {
  content: "$";
}

.admin .listitem .currency.eur::after {
  content: "€";
}

.admin a.remove-image-btn {
  right: initial;
  left: 1rem;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.35) !important;
}

.admin a.remove-image-btn i {
  font-size: 2rem;
}

.admin #product-image {
  cursor: pointer;
  max-width: clamp(250px, 50%, 500px) !important;
}

.admin h2.licencegun {
  font-size: 15rem;
  color: #ccc;
}

.admin h2.licencegun.nomore {
  font-size: 5rem;
  font-weight: bolder;
  color: var(--q);
}

.admin .arama {
  padding: 0rem 1rem;
  border: solid 1px #666;
  border-radius: 4px;
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
}

.admin .arama i {
  margin-right: 0.5rem;
}

.admin .arama.ariyor i::before {
  content: "\f057";
  color: var(--red);
  cursor: pointer;
}

.admin .arama input {
  border: none;
  font-size: 1rem;
  padding: 0.5rem;
  outline: none;
  background: #414141;
  flex: 1;
  color: white;
}

span.notify {
  position: absolute;
  right: 2.5rem;
  background: red;
  border-radius: 1rem;
  min-width: 1.5rem;
  font-size: 0.8rem;
  text-align: center;
  color: white;
}

.sortable-background-class {
  background-color: var(--lightergray) !important;
}

.sortable-chosen p.right {
  display: none !important;
}

.sidebar.toggled .nav-item {
  margin: 1rem 0rem !important;
}