:root {
    --bs-orrange-rgb: 255, 140, 0;
    --bd-purple: #4c0bce;
    --bd-violet: #712cf9;
    --bd-accent: #ffe484;
    --bd-violet-rgb: 112.520718,44.062154,249.437846;
    --bd-accent-rgb: 255,228,132;
    --bd-pink-rgb: 214,51,132;
    --bd-teal-rgb: 32,201,151;
    --docsearch-primary-color: var(--bd-violet);
    --docsearch-logo-color: var(--bd-violet);
     --bs-dark-rgb: 33, 37, 41;
     --bs-black-rgb: 0, 0, 0;
}
.bd-navbar {
  padding: 0.75rem 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 0.5), rgba(var(--bd-violet-rgb), 0.1));
  box-shadow: 0 0.5rem 1remrgba(0,0,0,0.15),inset 0 -1px 0rgba(0,0,0,0.15);

}

.auto-width-table th,
.auto-width-table td {
    white-space: nowrap;
}

.table>:not(:first-child) {
  border-top: 0px solid !important;
}

.watermark {
  position: absolute;
  bottom: 10px;
  right: 20px;
  opacity: 0.1;
  pointer-events: none;
}

.icon-wrapper svg {
  color: #737373; /* Normal rengi siyah yap */
  transition: color 0.3s ease; /* Renk değişimi animasyonu */
}

.icon-wrapper svg:hover {
  color: #fff; /* Üzerine gelindiğinde kırmızı yap */
}

.card .btn-actions,.accordion-header .btn-actions,.list-group-item .btn-actions,.item-drop,.item-drop span,.item-dropx>span,.item-drop.noItem,.item-dropx.noItem{display:none;}
.card:hover .btn-actions,.accordion-header:hover .btn-actions,.list-group-item:hover .btn-actions{display:block;}
.drag .item-drop,.drag .item-dropx{
  border:1px dashed #737373;
  background-color: #f5f3ef;
  display:block;
}

.over .item-drop span,.over .item-dropx>span{display:block; font-weight: bold;}

.item-drop,.item-dropx{min-height: 40px;}

.drop.over {
    border-color: #aaa !important;
    background-color: #ccc !important;
  }

.navbar-dark .navbar-nav .nav-link {
    color: hsla(0,0%,100%,1)!important;
}



.bg-light-dark{
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-dark-rgb),var(--bs-bg-opacity))!important;
}
.bg-orrange{
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-orrange-rgb),var(--bs-bg-opacity))!important;
}

.bg-purple{
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bd-purple),var(--bs-bg-opacity))!important;
}

.bd-gradient {
  
  background-color: transparent;
  background-image: linear-gradient(to bottom, rgba(var(--bs-black-rgb), 0.1), rgba(var(--bs-black-rgb), 0.3));
  box-shadow: 0 0.5rem 1remrgba(0,0,0,0.15),inset 0 -1px 0rgba(0,0,0,0.15);

  

}
.siparis-card .durum-bekliyor{
    position: absolute;
    top:10px;
    right: 10px;

    font-size: 10px;
    padding: 5px;
    border-radius: 3px;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated:hover {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.bi {
        vertical-align: -.125em;
        fill: white!important;
      }
 

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    -ms-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}


.bganimated {
  background: orange;
  animation: mymove 1s 5;
}

.rotate{
  font-size: xx-large;
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}

@keyframes mymove {
  from {background-color: black;}
  to {background-color: red;}
}

.box {
  --border-size: 1px;
  --border-angle: 10turn;
 
  background-image: conic-gradient(
      from var(--border-angle),
      #213,
      #112 50%,
      #213
    ),
    conic-gradient(from var(--border-angle), transparent 10%, #08f, #f03);
  background-size: calc(100% - (var(--border-size) * 2))
      calc(100% - (var(--border-size) * 2)),
    cover;
  background-position: center center;
  background-repeat: no-repeat;

  animation: bg-spin 3s linear infinite;
  

}
.box2 {
  --border-size: 3px;
  --border-angle: 3turn;
 
  background-image: conic-gradient(
      from var(--border-angle),
      #213,
      #112 50%,
      #213
    ),
    conic-gradient(from var(--border-angle), transparent 10%, #08f, #f03);
  background-size: calc(100% - (var(--border-size) * 2))
      calc(100% - (var(--border-size) * 2)),
    cover;
  background-position: center center;
  background-repeat: no-repeat;

  animation: bg-spin 3s linear infinite;
  

}
@keyframes bg-spin {
    to {
      --border-angle: 2turn;
    }
  }
@property --border-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0turn;
}

.form-control-dark {
  color: #fff;
  background-color: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .1);
}

.form-control-dark:focus {
  border-color: transparent;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}

.order-count {
    position: absolute;
    right: 0px;
    top: 5px;
    margin: 0 auto;
    display: inline-block;
    text-transform: uppercase;
    line-height: normal;
    font-size: 14px;
    border: none;
    background: #ec2c2c;
    color: #fff;
    padding: 0 5px;
}

.order-count::before {
    position: absolute;
    top: 0;
    content: "";
    left: -10px;
    border-top: 5px solid #ec2c2c;
    border-right: 5px solid #ec2c2c;
    border-left: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.order-count::after {
    position: absolute;
    left: -10px;
    bottom: 0;
    content: "";
    border-bottom: 5px solid #ec2c2c;
    border-right: 5px solid #ec2c2c;
    border-left: 5px solid transparent;
    border-top: 5px solid transparent;
}

.yback {
    background:#000000;
    background-image:
        linear-gradient(45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, 0.1) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 0.1) 75%);
   
    background-size: 2880px 1420px; 
    
}

.yoverlay {

    width: 100%;
    height: 100%;
    min-height: 700px;
    background-image: url('../images/eronornew.png');
    background-repeat: no-repeat;
    background-position: center center;
   
}