
*, ::before, ::after {
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	--tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	--tw-border-opacity: 1;
	border-color: rgba(229, 231, 235, var(--tw-border-opacity));
	--tw-shadow: 0 0 #0000;
	--tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
	--tw-ring-offset-width: 0px;
	--tw-ring-offset-color: #fff;
	--tw-ring-color: rgba(59, 130, 246, 0.5);
	--tw-ring-offset-shadow: 0 0 #0000;
	--tw-ring-shadow: 0 0 #0000;
	--tw-blur: var(--tw-empty,/*!*/ /*!*/);
	--tw-brightness: var(--tw-empty,/*!*/ /*!*/);
	--tw-contrast: var(--tw-empty,/*!*/ /*!*/);
	--tw-grayscale: var(--tw-empty,/*!*/ /*!*/);
	--tw-hue-rotate: var(--tw-empty,/*!*/ /*!*/);
	--tw-invert: var(--tw-empty,/*!*/ /*!*/);
	--tw-saturate: var(--tw-empty,/*!*/ /*!*/);
	--tw-sepia: var(--tw-empty,/*!*/ /*!*/);
	--tw-drop-shadow: var(--tw-empty,/*!*/ /*!*/);
	--tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
	--tw-backdrop-blur: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-brightness: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-contrast: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-grayscale: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-hue-rotate: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-invert: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-opacity: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-saturate: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-sepia: var(--tw-empty,/*!*/ /*!*/);
	--tw-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}


.dark .dark\:translate-x-3 {
	--tw-translate-x: 0.75rem;
	transform: var(--tw-transform);
}
.dark .dark\:bg-gray-800 {
	--tw-bg-opacity: 1;
	background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-600 {
	--tw-bg-opacity: 1;
	background-color: rgba(75, 85, 99, var(--tw-bg-opacity));
}

.dark .dark\:text-pink-1 {
	--tw-bg-opacity: 1;
	color: rgb(226, 27, 120, var(--tw-bg-opacity));
}

.dark .dark\:text-pink-2 {
	--tw-bg-opacity: 1;
	color: rgb(240, 39, 116, var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-2 {
	--tw-bg-opacity: 1;
	background-color: rgb(71, 83, 104, var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-3 {
	--tw-bg-opacity: 0.7;
	background-color: rgb(31, 41, 55, var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-form {
	--tw-bg-opacity: 0.3;
	background-color: rgb(51, 65, 85, var(--tw-bg-opacity));
}
.dark .dark\:text-gray-100 {
	--tw-text-opacity: 1;
	color: rgba(243, 244, 246, var(--tw-text-opacity));
}
.dark .dark\:text-gray-500 {
	--tw-text-opacity: 1;
	color: rgba(107, 114, 128, var(--tw-text-opacity));
}
.dark .dark\:text-gray-3 {
	--tw-text-opacity: 1;
	color: rgb(153, 164, 187, var(--tw-text-opacity));
}
.dark .dark\:text-white {
	--tw-text-opacity: 1;
	color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.dark .dark\:bg-red-1 {
	--tw-bg-opacity: 1;
	background-color:rgb(40, 49, 61, var(--tw-bg-opacity));
}

.dark .dark\:bg-red-2 {
	--tw-bg-opacity: 1;
	background-color:rgb(49, 60, 75, var(--tw-bg-opacity));
}

.dark .dark\:bg-black-3 {
	--tw-bg-opacity: 1;
	background-color:rgb(58, 67, 80, var(--tw-bg-opacity));
}

.dark .dark\:bg-hover:hover{
	background-color: #313c4b;
}

.dark .dark\:bg-hover-action:hover{
	background-color: #21291c88;
}

.dark .dark\:text-hover:hover{
	color: #e5e7eb;
}

.dark .dark\:text-gray-1 {
	--tw-text-opacity: 1;
	color: rgba(108, 117, 125, var(--tw-text-opacity));
}

.dark .dark\:text-gray-2 {
	--tw-text-opacity: 1;
	color: rgba(215, 221, 226, var(--tw-text-opacity));
}

.dark .dark\:border-gray-2 {
	border:  2px solid rgb(129, 136, 146);
}

.pink-blue:hover{
	background-color: rgba(34, 209, 127, 0.118);
}

.bg-pink-blue{
	background-color: rgba(34, 209, 127, 0.118);
}

.bg-orange-2{
	background-color: #feebc86e;
}

.red-dark{
	background-color: #fd2856ce;
	color: white;
}

/* User Dashboard Dark Mode Start */
.dark .dark\:border-b-gray-2 {
	border-bottom:  1px solid rgb(129, 136, 146);
}
.dark .dark\:border-t-gray-2 {
	border-top:  1px solid rgb(75, 85, 99);
}
.dark .dark\:border-b-gray-0 {
	border-bottom: 0;
}
.dark .dark\:border-gray-0 {
	border: 0;
}
.dark .dark\:rounded {
	border-radius: 0.25rem;
}
.dark .dark\:bg-green-1 {
	--tw-bg-opacity: 0.4;
	background-color:rgb(34, 197, 94, var(--tw-bg-opacity));
}
.dark .dark\:bg-red-3 {
	--tw-bg-opacity: 0.4;
	background-color:rgb(239, 68, 68, var(--tw-bg-opacity));
}
/* User Dashboard Dark Mode End*/

/* order tracking start */

.root {
	padding: 1rem;
	border-radius: 5px;
	box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.3);
  }

  figure {
	display: flex;
  }
  figure img {
	width: 8rem;
	height: 8rem;
	border-radius: 15%;
	border: 1.5px solid #f05a00;
	margin-right: 1.5rem;
	padding:1rem;
  }
  figure figcaption {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
  }
  figure figcaption h4 {
	font-size: 1.4rem;
	font-weight: 500;
  }
  figure figcaption h6 {
	font-size: 1rem;
	font-weight: 300;
  }
  figure figcaption h2 {
	font-size: 1.6rem;
	font-weight: 500;
  }

  .order-track {
	margin-top: 2rem;
	padding: 0 1rem;
	border-top: 1px dashed #2c3e50;
	padding-top: 2.5rem;
	display: flex;
	flex-direction: column;
  }
  .order-track-step {
	display: flex;
	height: 7rem;
  }
  .order-track-step:last-child {
	overflow: hidden;
	height: 4rem;
  }
  .order-track-step:last-child .order-track-status span:last-of-type {
	display: none;
  }
  .order-track-status {
	margin-right: 1.5rem;
	position: relative;
  }
  .order-track-status-dot {
	display: block;
	width: 2.2rem;
	height: 2.2rem;
	border-radius: 50%;
	background: #f05a00;
  }
  .order-track-status-line {
	display: block;
	margin: 0 auto;
	width: 2px;
	height: 7rem;
	background: #f05a00;
  }
  .order-track-text-stat {
	font-size: 1.3rem;
	font-weight: 500;
	margin-bottom: 3px;
  }
  .order-track-text-sub {
	font-size: 1rem;
	font-weight: 300;
  }

  .order-track {
	transition: all .3s height 0.3s;
	transform-origin: top center;
  }
/* order tracking end*/
