.my-own-order-highlight {
    background: orange !important;
    color: #fff !important;
    font-weight: bold !important;
    border-radius: 4px !important;
}
.my-order-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 8px;
  vertical-align: middle;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 16px solid #ff9800;
  animation: arrow-glow 0.8s infinite alternate;
}

@keyframes arrow-glow {
  from { filter: drop-shadow(0 0 0px #ff9800); }
  to   { filter: drop-shadow(0 0 6px #ff9800); }
}

.my-order-text {
  color: #ff9800;
  font-weight: bold;
  margin-left: 8px;
  animation: blink 1s infinite;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.my-order-arrow-red {
  display: inline-block;
  width: 0; height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-right: 10px solid #ff4444;
  margin-right: 4px;
  vertical-align: middle;
  animation: blink-arrow 0.9s infinite;
}
.my-order-arrow-green {
  display: inline-block;
  width: 0; height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-right: 10px solid #009b2c;
  margin-right: 4px;
  vertical-align: middle;
  animation: blink-arrow 0.9s infinite;
}
@keyframes blink-arrow {
  0%,100% { opacity: 1; }
  60% { opacity: 0.2; }
}
.my-order-arrow-red {
  display: inline-block;
  width: 0; height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 10px solid #0f0f0f;
  margin-left: 4px;
  vertical-align: middle;
  animation: blink-arrow 0.9s infinite;
}
.my-order-arrow-green {
  display: inline-block;
  width: 0; height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 10px solid #0f0f0f;
  margin-left: 4px;
  vertical-align: middle;
  animation: blink-arrow 0.9s infinite;
}
@keyframes blink-arrow {
  0%,100% { opacity: 1; }
  60% { opacity: 0.2; }
}
.order-line .my-order-arrow-red,
.order-line .my-order-arrow-green{
  display:inline-block;
  width:0; height:0;
  vertical-align:middle;
  margin-left:6px;                /* arrow sits after the price */
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  animation: blink-arrow 0.9s infinite;
}
.order-line .my-order-arrow-red  { border-left:10px solid #0f0f0f; }
.order-line .my-order-arrow-green{ border-left:10px solid #0f0f0f; }

/* Optional variants if ever needed BEFORE the price (right-pointing) */
.order-line .my-order-arrow-red-right,
.order-line .my-order-arrow-green-right{
  display:inline-block;
  width:0; height:0;
  vertical-align:middle;
  margin-right:6px;               /* arrow sits before the price */
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  animation: blink-arrow 0.9s infinite;
}
.order-line .my-order-arrow-red-right  { border-right:10px solid #ff4444; }
.order-line .my-order-arrow-green-right{ border-right:10px solid #009b2c; }

/* --- Profile dropdown: open to the left, not fullscreen --- */
.lf-user-dropdown.dropleft .dropdown-menu,
.lf-user-dropdown.dropstart .dropdown-menu{
  width: 300px;
  max-width: 85vw;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  border-radius: 12px;
}
@media (max-width: 768px){
  .lf-user-dropdown.dropleft .dropdown-menu,
  .lf-user-dropdown.dropstart .dropdown-menu{
    width: 280px;
    max-width: 85vw;
}
@media (max-width: 768px){
  #profileDrop.dropdown-menu,
  #notificationDrop.dropdown-menu{
    right: 0 !important;
    left: auto !important;
    transform: none !important;
    max-width: 90vw;
    overflow: auto;
}

 }