* {
	margin: 0;
	box-sizing: border-box;
}
/*//////////////////////////////////////////////////////////////////
[ FONT ]*/
@font-face {
    font-family:Arial Rounded MT Bold;
    src: url('fonts/Arial Rounded MT Bold.ttf'); 
  }
@font-face {
    font-family: Poppins-Regular;
    src: url('fonts/Poppins-Regular.ttf'); 
  }
  
  @font-face {
    font-family: Poppins-Medium;
    src: url('fonts/Poppins-Medium.ttf'); 
  }
  
  @font-face {
    font-family: Poppins-Bold;
    src: url('fonts/Poppins-Bold.ttf'); 
  }
  
  @font-face {
    font-family: 'Material-Design-Iconic-Font';
    src: url('fonts/Material-Design-Iconic-Font.woff?v=2.2.0') format('woff');
    font-weight: normal;
    font-style: normal;}
      
@font-face{font-family:'FontAwesome';
    src:url('fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype');
    font-weight:normal;
    font-style:normal}  

    @font-face{font-family:'fa-solid-900';
      src:url('fonts/fa-solid-900.ttf?v=772.00') format('truetype');
      font-weight:normal;
      font-style:normal}  
  /*//////////////////////////////////////////////////////////////////
  [ RESTYLE TAG ]*/

  a {
      font-family: Poppins-Regular;font-size: 16px;line-height: 1.7;color: #666666;text-decoration:none;
      background-color:transparent;-webkit-text-decoration-skip:objects;transition: all 0.4s;-webkit-transition: all 0.4s;
    -o-transition: all 0.4s;-moz-transition: all 0.4s;}
  
  a:focus {
      outline: none !important;
  }
  
  a:hover {
      text-decoration: none;
    color: black;cursor: pointer;
  }

  /*---------------------------------------------*/
  input {
      outline: none;
      border: none;
  }
  
  textarea {
    outline: none;
    border: none;
  }
  
  textarea:focus, input:focus {
    border-color: transparent !important;
  }
  
  input:focus::-webkit-input-placeholder { color:transparent; }
  input:focus:-moz-placeholder { color:transparent; }
  input:focus::-moz-placeholder { color:transparent; }
  input:focus:-ms-input-placeholder { color:transparent; }
  
  textarea:focus::-webkit-input-placeholder { color:transparent; }
  textarea:focus:-moz-placeholder { color:transparent; }
  textarea:focus::-moz-placeholder { color:transparent; }
  textarea:focus:-ms-input-placeholder { color:transparent; }
  
  input::-webkit-input-placeholder { color: #adadad;}
  input:-moz-placeholder { color: #adadad;}
  input::-moz-placeholder { color: #adadad;}
  input:-ms-input-placeholder { color: #adadad;}
  
  textarea::-webkit-input-placeholder { color: #adadad;}
  textarea:-moz-placeholder { color: #adadad;}
  textarea::-moz-placeholder { color: #adadad;}
  textarea:-ms-input-placeholder { color: #adadad;}
  
  /*---------------------------------------------*/
  button {
      outline: none !important;
      border: none;
      background: transparent;
  }
  
  button:hover {
      cursor: pointer;
  }
  
  iframe {
      border: none !important;
  }
  
  /*//////////////////////////////////////////////////////////////////
  [ Utility ]*/

  .txt2 {
    font-family: Poppins-Regular;
    font-size: 14px;
    line-height: 1.5;
    color: #333333;
    text-transform: uppercase;
  }
  
  /*//////////////////////////////////////////////////////////////////*/
  body{font-family:Poppins-Regular,inter_regular,fallback-inter_regular,Arial,sans-serif;font-size: 16px;letter-spacing: 0;line-height: 20px;}
header{position:sticky;top:0;width:100% ;z-index: 9999;background-color: white;display: flex;align-items: center;justify-content: space-between;box-sizing: border-box;padding:3px 28px;}
.fontsaman{height: 50px;}
.searchbarcont{display: flex;justify-content: center;width: 100%;margin-left: 8px;margin-right: 8px;}
.searchbar{align-self: center;padding: 8px;border-radius: 10px;display: flex;background-color: #f0eded;width:auto;align-items: center;}
.search_icon{margin-right:10px;font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:35px;}
.searchbar input{border: none;outline: none; background:transparent; color: rgb(5, 5, 5);font-size: 20px;width: 100%;}
.item_name_co{overflow: hidden;cursor: pointer;padding:8px 5px;background-color:#e3e2e1;border:2px solid transparent;border-radius: 4px;font-size:18px;color: black;margin: 3px;}
.item_name_co:hover{background-color: blue;border:2px solid transparent;border-radius: 4px;font-size:18px;color: white;}
.navbarcont{width: fit-content;display: flex;justify-content: center;gap: 20px;}
.validate-input{display: grid;}
.navbar{width:fit-content;position: relative;border-radius: 100%;display: block;cursor: pointer;padding: 2px;}
.notification{font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:35px;}
.user_profile_photo{width: 64px; height:64px;border-radius:100%;display: block; align-self: center;}
.navbar a{color: #010300;width: 180px;text-align: center;text-transform: uppercase;transition: all 0.2s ease;}
.navbar .dd_menu ul li:hover,.dd_menu ul li:active{background: #ebeaeb;}
.navbar:hover{background-color: #8a8a8a} 
.navbar:hover .dd_menu{display: block;}
.dd_menu{width: fit-content;padding: 20px; position: absolute;top: 78px;right:0;display: none; background-color: white;border-radius: 8px;}
.dd_menu ul li{position: relative;left: 0; width: 220px;border-bottom: 2px solid #dad5d5; list-style-type: none;}
.dd_menu_a{width: 100%;}
.dd_menu ul li a{ width:100%;background: transparent;text-align: left;padding:22px 10px 0px 40px;display: flex;}
.dd_menu::before{content: "";position: absolute;top: -25px;left: 88%;transform: translateX(-50%);z-index: 1;border: 15px solid;
  border-color: transparent transparent white transparent;}
.limiter {width: 100%;display: grid;justify-content: normal;}
.header2{display: flex;width: 100%;background-color:transparent;padding:2px;justify-content:center;align-items: center;overflow-x: scroll;scrollbar-width: none;}
.headerbox{width: auto;padding:8px; font-size: 16px;text-align: center;background-color: #00000082;margin: 2px;color: #fffdfd;border-radius:5px;white-space: nowrap;}
.headerbox:hover{background-color: #3d3d3e;cursor: pointer;}
#dd_menu{
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.25s ease;
}

#dd_menu.show-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}
.searchbar{
    position:relative;
}

.admin_search_box{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:#fff;
    border:1px solid #ddd;
    border-radius:8px;
    box-shadow:0 8px 20px rgba(0,0,0,.1);
    max-height:400px;
    overflow-y:auto;
    display:none;
    z-index:9999;
    scrollbar-width: thin;
}

.search-item{
    display:flex;
    gap:10px;
    padding:10px;
    cursor:pointer;
    border-bottom:1px solid #eee;
}

.search-item:hover{
    background:#f5f5f5;
}

.search-img{
    width:45px;
    height:45px;
    object-fit:cover;
    border-radius:6px;
}

.search-name{
    font-weight:600;
}

.search-price{
    font-size:13px;
    color:#1976d2;
}

.search-empty{
    padding:10px;
    text-align:center;
    color:#888;
}

.container-login100 {
  width: 100%;  
  min-height: 110vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  padding: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url('bg-01.webp');
}
.wrap-login100 {
  width:auto;
  height: fit-content;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  padding-left: 54px;
  padding-right: 54px;
  padding-top: 54px;
  padding-bottom: 54px;
}
.login100-form {width: 100%;}
.login100-form-title {display: block;font-family: Poppins-Bold;font-size: 39px;color: #333333;line-height: 1.2;text-align: center;padding-bottom: 49px;}
label{cursor: pointer;}
.wrap-input100 {width: 100%;position: relative;border-bottom: 2px solid #d9d9d9;margin-bottom: 23px;}

.label-input100 {font-family: Poppins-Regular;font-size: 14px;color: #333333;line-height: 1.5;padding-left: 5px;}

.input100 {font-family: Poppins-Medium;font-size: 16px;color: #333333;line-height: 1.2;display: block;width: 100%;height: 55px;background: transparent;padding: 0 7px 0 43px;}

.focus-input100 {position: absolute;display: block;width: 100%;height: 100%;top: 0;left: 0;pointer-events: none;}
  
.focus-input100::after {
  content: attr(data-symbol);
  font-family: Material-Design-Iconic-Font;
  color: #adadad;
  font-size: 22px;

  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  height: calc(100% - 20px);
  bottom: 0;
  left: 0;
  padding-left: 13px;
  padding-top: 3px;
}

.focus-input100::before {
  content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: #7f7f7f;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}


.input100:focus + .focus-input100::before {
  width: 100%;
}

.has-val.input100 + .focus-input100::before {
  width: 100%;
}

.input100:focus + .focus-input100::after {
  color: #a64bf4;
}

.has-val.input100 + .focus-input100::after {
  color: #a64bf4;
}
 /*------------------------------------------------------------------
  [ Button ]*/
  .container-login100-form-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .wrap-login100-form-btn {
    width: fit-content;
    display: block;
    position: relative;
    z-index: 1;
    border-radius: 25px;
    overflow: hidden;
    margin: 0 auto;
  
    box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
    -moz-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
    -webkit-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
    -o-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
    -ms-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
  }
  
  .login100-form-bgbtn {
    position: absolute;
    z-index: -1;
    width: 300%;
    height: 100%;
    background: #a64bf4;
    background: -webkit-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
    background: -o-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
    background: -moz-linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
    background: linear-gradient(right, #00dbde, #fc00ff, #00dbde, #fc00ff);
    top: 0;
    left: -100%;
  
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
  }
  
  .login100-form-btn {
    font-family: Poppins-Medium;
    font-size: 16px;
    color: #fff;
    line-height: 1.2;
    text-transform: uppercase;
  
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    width: 100%;
    height: 50px;
    cursor: pointer;
  }
  
  .wrap-login100-form-btn:hover .login100-form-bgbtn {
    left: 0;
  }

/* ===== PRODUCT GRID ===== */
.user-product-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(212px, 1fr));
  gap: 12px;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
}

/* ===== PRODUCT CARD ===== */
.user-product-card{
  width: 100%;
}

/* ===== BUTTON CARD ===== */
.product-btn{
  width: 100%;
  border: none;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  padding: 10px;
  cursor: pointer;
  text-align: center;
}

/* ===== IMAGE ===== */
.product-btn img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 5px;
}

/* ===== TEXT ===== */
.product-name{
  font-size: 14px;
  font-weight: 600;
  margin-top: 6px;
  color:#222;
}

.product-price{
  color:#1976d2;
  font-weight:700;
  margin-top:4px;
  font-size:13px;
}

/* ================= CART BUTTON ================= */
.cart-btn{
  margin-top:6px;
  width:100%;
  padding:8px;
  background:#ff9800;
  color:#fff;
  border:none;
  border-radius:8px;
  cursor:pointer;
  font-size:14px;
}
.cart-btn:hover{
  background:#f57c00;
}

/* ================= SKELETON ================= */
.skeleton{
  background:linear-gradient(90deg,#eee,#f5f5f5,#eee);
  background-size:200% 100%;
  animation:skeleton 1.3s infinite;
  border-radius:8px;
}
@keyframes skeleton{
  to{background-position:-200% 0}
}

.skeleton-img{height:160px;}
.skeleton-text{height:14px;margin:6px 0}

/* ================= BOTTOM LOADER ================= */
.bottom-loader{
  position:relative;
  bottom:10px;
  left:50%;
  transform:translateX(-50%);
  background:#fff;
  padding:10px 16px;
  border-radius:30px;
  box-shadow:0 4px 12px rgba(0,0,0,.2);
  display:flex;
  align-items:center;
  gap:10px;
  z-index:999;
  width: fit-content;
}
.spinner{
  width:18px;
  height:18px;
  border:3px solid #ccc;
  border-top-color:#1976d2;
  border-radius:50%;
  animation:spin 1s linear infinite;
}
@keyframes spin{
  to{transform:rotate(360deg)}
}
/* ===== MOBILE OPTIMIZATION ===== */
@media (max-width: 600px){

  .user-product-grid{
    grid-template-columns: repeat(2, 1fr); /* 👈 exactly 2 cards */
    gap: 8px;
    padding: 8px;
  }

}

/* ===== VERY SMALL DEVICES ===== */
@media (max-width: 360px){
  .user-product-grid{
    grid-template-columns: 1fr; /* 👈 full width */
  }
}
.rating-summary{
  font-size:18px;
  font-weight:700;
  margin-bottom:10px;
}

.review-item{
  padding:10px;
  border-bottom:1px solid #eee;
}

.review-head{
  display:flex;
  justify-content:space-between;
}

.stars{color:#ff9800}

.add-review textarea{
  width:100%;
  padding:8px;
  border-radius:6px;
  border:1px solid #ccc;
  margin-top:8px;
}

.star-select span{
  font-size:22px;
  cursor:pointer;
}
.star-select span.active{
  color:#ff9800;
}


.cart-actions{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
}

.cart-empty{
  text-align:center;
  padding:40px 10px;
  color:#777;
}
.cart-empty-icon{
  font-size:48px;
  margin-bottom:10px;
}

.remove-btn{
  background:none;
  border:none;
  font-size:20px;
  cursor:pointer;
  color:#d32f2f;
}
.remove-btn:hover{
  color:#b71c1c;
}

/* ===== EMPTY CART ===== */
.cart-empty{
  text-align:center;
  padding:40px 10px;
  font-size:18px;
  color:#555;
}
.cart-empty small{
  color:#888;
  font-size:14px;
}

/* ===== CART ITEM ===== */
.cart-item{
  display:flex;
  gap:12px;
  align-items:center;
  border-bottom:1px solid #eee;
  padding:12px 0;
}

.cart-img{
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:10px;
  cursor: pointer;
}

/* ===== INFO ===== */
.cart-info{
  flex:1;
}

.cart-title{
  font-size:14px;
  font-weight:600;
  margin-bottom:6px;
}

.cart-price{
  font-weight:700;
  margin-top:6px;
}

/* ===== QTY CONTROLS ===== */
.qty-row{
  display:flex;
  align-items:center;
  gap:8px;
}

.qty-btn{
  width:28px;
  height:28px;
  border:none;
  border-radius:6px;
  font-size:18px;
  cursor:pointer;
  line-height:1;
}

.qty-btn.minus{
  background:#fbe9e7;
  color:#d32f2f;
}

.qty-btn.plus{
  background:#e8f5e9;
  color:#2e7d32;
}

.qty-btn:hover{
  opacity:.85;
}

.qty-val{
  min-width:24px;
  text-align:center;
  font-weight:600;
}

/* ===== DELETE BUTTON ===== */
.delete-btn{
  background:none;
  border:none;
  font-size:18px;
  cursor:pointer;
  color:#e53935;
}

.delete-btn:hover{
  transform:scale(1.1);
}

.cart-footer{
  padding:12px;
  border-top:1px solid #ddd;
}

.cart-total{
  font-size:18px;
  font-weight:700;
  margin-bottom:10px;
}

.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.4);
  display:none;
  z-index:9999;
}
.close-btn{
  position:absolute;
  top:12px;
  right:12px;

  width:36px;
  height:36px;

  border:none;
  border-radius:50%;

  background:#f5f5f5;
  color:#333;

  font-size:18px;
  font-weight:bold;
  line-height:36px;
  text-align:center;

  cursor:pointer;
  transition:all .2s ease;
}

/* hover effect */
.close-btn:hover{
  background:#e53935;
  color:#fff;
  transform:rotate(90deg);
}

#cart_drawer{
  position:fixed;
  top:0;
  right:-420px;
  width: 100%;
  max-width:420px;
  height:fit-content;
  background:#fff;
  z-index:9999;
  box-shadow:-4px 0 20px rgba(0,0,0,.15);
  transition:.3s ease;
  display:flex;
  flex-direction:column;
}

#cart_drawer.open{
  right:0;
}

.cart-header{
  padding:16px;
  border-bottom:1px solid #eee;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.cart-items{
  flex:1;
  overflow-y:auto;
  padding:10px;
}

.cart-footer{
  border-top:1px solid #eee;
  padding:14px;
}

.checkout-btn{
  width:100%;
  padding:14px;
  font-size:16px;
  border:none;
  border-radius:8px;
  cursor:pointer;
  background:#1976d2;
  color:#fff;
  transition:0.3s;
}

.checkout-btn.disabled{
  background:#cfd8dc;
  cursor:not-allowed;
  opacity:0.6;
}
.cart-icon{
  position:relative;
  cursor:pointer;
  align-self: center;
}

.cart-badge{
  position:absolute;
  top:-10px;
  right:-8px;
  background:#e53935;
  color:#fff;
  font-size:12px;
  padding:2px 6px;
  border-radius:50%;
  min-width:18px;
  text-align:center;
}


.closing_bal{margin-left: 30px;}
.profile_error_message{position: relative;color: red;justify-self: center;font-size: 14px;} 
  .btn{display:inline-block;font-weight:400;text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.btn:focus,.btn:hover{text-decoration:none}.btn.focus,.btn:focus{outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}.btn.disabled,.btn:disabled{opacity:.65}.btn:not(:disabled):not(.disabled){cursor:pointer}.btn:not(:disabled):not(.disabled).active,.btn:not(:disabled):not(.disabled):active{background-image:none}a.btn.disabled,fieldset:disabled a.btn{pointer-events:none}.btn-primary{color:#fff;background-color:#007bff;border-color:#007bff}.btn-primary:hover{color:#fff;background-color:#0069d9;border-color:#0062cc}.btn-primary.focus,.btn-primary:focus{box-shadow:0 0 0 .2rem rgba(0,123,255,.5)}.btn-primary.disabled,.btn-primary:disabled{color:#fff;background-color:#007bff;border-color:#007bff}.btn-primary:not(:disabled):not(.disabled).active,.btn-primary:not(:disabled):not(.disabled):active,.show>.btn-primary.dropdown-toggle{color:#fff;background-color:#0062cc;border-color:#005cbf}.btn-primary:not(:disabled):not(.disabled).active:focus,.btn-primary:not(:disabled):not(.disabled):active:focus,.show>.btn-primary.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(0,123,255,.5)}.btn-secondary{color:#fff;background-color:#6c757d;border-color:#6c757d}.btn-secondary:hover{color:#fff;background-color:#5a6268;border-color:#545b62}.btn-secondary.focus,.btn-secondary:focus{box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}.btn-secondary.disabled,.btn-secondary:disabled{color:#fff;background-color:#6c757d;border-color:#6c757d}.btn-secondary:not(:disabled):not(.disabled).active,.btn-secondary:not(:disabled):not(.disabled):active,.show>.btn-secondary.dropdown-toggle{color:#fff;background-color:#545b62;border-color:#4e555b}.btn-secondary:not(:disabled):not(.disabled).active:focus,.btn-secondary:not(:disabled):not(.disabled):active:focus,.show>.btn-secondary.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}
.bottum_cont{display: flex;}
.fa_inr{display: flex;justify-content: center; font:normal normal normal 14px/1 FontAwesome;font-size: 14px;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left: 3px;}
.fas{display: grid;justify-content: center; font:normal normal normal 14px/1 fa-solid-900;font-size:28px;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color: #8a8a8a;}
.wallet_font{display: grid; justify-content: center; font-size: 16px;}
.fa-wallet:before{content:"\f555";}
.inr:before{content:"\F156";}
.validate-form{display: grid;}
.error_message{
	position: relative;
	top: -16px;
  justify-self: center;
    width: fit-content;
    background-color: red;
    border-radius: 4px;
    padding: 4px 6px 4px 6px;
    -webkit-transform: translateY(50%);
    -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
    -o-transform: translateY(50%);
    transform: translateY(50%);
    pointer-events: none;
    display: none;
    font-family: Poppins-Regular;
    color: white;
    font-size: 14px;
    text-align: center;
    -webkit-transition: opacity 0.4s;
    -o-transition: opacity 0.4s;
    -moz-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
.ring
{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:150px;
height:150px;
background:transparent;
border:3px solid #3c3c3c;
border-radius:50%;
text-align:center;
line-height:150px;
font-family:sans-serif;
font-size:20px;
color:#fff000;
letter-spacing:4px;
text-transform:uppercase;
text-shadow:0 0 10px #fff000;
box-shadow:0 0 20px rgba(0,0,0,.5);
}
.ring:before
{
content:'';
position:absolute;
top:-3px;
left:-3px;
width:100%;
height:100%;
border:3px solid transparent;
border-top:3px solid #fff000;
border-right:3px solid #fff000;
border-radius:50%;
animation:animateC 2s linear infinite;
}
.ring_span
{
display:block;
position:absolute;
top:calc(50% - 2px);
left:50%;
width:50%;
height:4px;
background:transparent;
transform-origin:left;
animation:animate 2s linear infinite;
}
.ring_span:before
{
content:'';
position:absolute;
width:16px;
height:16px;
border-radius:50%;
background:#fff000;
top:-6px;
right:-8px;
box-shadow:0 0 20px #fff000;
}
@keyframes animateC
{0%{transform:rotate(0deg);}
100%{transform:rotate(360deg);}}
@keyframes animate
{0%{transform:rotate(45deg);}
100%{transform:rotate(405deg);}}
.uploading_wait{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top: 74px;display: none;}
.progress{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top: 74px;display:none;justify-content: center;align-items: center;}

.main-footer {
  background-color: #1a1a1a;
  color: #ffffff;
  padding: 40px 20px 20px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.footer-social {
  display: grid;
  justify-items: center;
}
.footer-social h4 {
  color: #f3971b;
  margin-bottom: 12px;
  font-size: 18px;
}
.social-icons a {
  display: inline-block;
  margin-right: 12px;
  transition: transform 0.3s ease;
}

.social-icons a img {
  height: 48px;
  width: 48px;
  object-fit: contain;
  filter: brightness(0.9);
  transition: filter 0.3s ease, transform 0.3s ease;
}

.social-icons a:hover img {
  filter: brightness(1.2);
  transform: scale(1.1);
}

.footer-bottom {
  text-align: center;
  padding-top: 20px;
  font-size: 13px;
  color: #aaa;
  border-top: 1px solid #333;
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .social-icons {
    justify-content: center;
  }
}
/*  start user home cont */
.proceed_to_buy{margin-bottom:5px;background-color: yellow;display:flex;width:fit-content;padding: 8px 20px 8px 20px;cursor: pointer;border-radius: 5px;font-size: 16px;position: sticky;top: 80px;}
.item_container{width:100%;background-color: white;display: flex;padding:20px;justify-content: center;margin-bottom: 2px;height: fit-content;}
.item_container:hover .item_name{color: #026fe4;}
.item_container form{display: contents;width: 100%;cursor: pointer;}
.img_con{width: 25%; cursor: pointer;}
.img_con img{width: 100%;}
.item_info{width: 50%;display: grid;}
.item_info img{width: 45%;}
.price_con{width: 25%;display: grid;}
.item_name{font-size: 20px;font-weight: bold;padding: 3px;height: fit-content;line-height: initial;}
.item_p_c{display: flex;width: 100%;}
.item_p_c_1{display: flex;width: auto;font-weight: bold;margin-left: 5px;margin-right: 5px;font-size:25px;}
.cartbuy{display: grid;align-items: center;}
.addcart{display: flex;padding:10px 18px 10px 18px; border-radius:5px;background-color:gold;cursor: pointer;font-size: 18px;font-weight: bold;color: white;width: max-content;height: fit-content;justify-self: center;}
.addcart span{font-family:Material-Design-Iconic-Font;font-size:21px;margin-right: 5px;}
.baynow{display: flex;padding:10px 18px 10px 18px; border-radius:5px;background-color:rgb(255, 145, 0);cursor: pointer;font-size: 18px;font-weight: bold;color: white;width: max-content;height: fit-content;justify-self: center;}
.baynow span{font-family:Material-Design-Iconic-Font;font-size:18px;margin-right: 5px;}
.r_saymbol{font:normal normal normal 14px/1 FontAwesome;font-size: 22px;font-weight: bold;margin-top: 4px;}
#user_home_item_link{width: 23%;display: grid;background-color: white;margin: 4px;font-size:16px;font-weight: bold;padding-left: 3px;padding-right: 3px;text-align: center;flex-grow: 1;cursor: pointer;}
#user_home_item_link:hover .user_home_item_name{color: #007bff;}
.user_home_item_name{margin-bottom: 5px;}
.chats_cont{width: fit-content;height: fit-content;position: fixed;bottom: 50px;right: 10px;border-radius: 30px;border: 2px solid green;padding: 10px;background: white;opacity: .9;filter: grayscale(0%);cursor: pointer;box-shadow: rgba(0, 0, 0, 0.25) 0px 2px 15px 0px;color: black;display: none;z-index: 1;}
.chats_box{display: flex;width: 100%;padding: 10px;border-radius: 30px;border: 2px solid green;margin-top: 10px;margin-bottom: 10px;background-color: white;}
/*  end user home cont */
/* start approving repair menu */
.approving_box_con{width:revert;justify-content: center;display: flex;align-items: center;}
.approving_box{width:fit-content;justify-content: center;border:1.5px solid #b3b3b3;border-radius: 5px; display: grid;margin: 3px;padding: 5px;justify-items: center;}
.approving_box input{background-color: rgb(212, 217, 223);width: 55px;font-size: medium;text-align: right;font-weight: bold;margin-left: 2px;}
.approving_box select{font-weight: bold;font-size: medium;border: none;outline: none;}
.approving_box_hadding{width: fit-content;justify-self: center; margin-top: -18px;padding-left: 8px;padding-right: 8px; position: relative;background-color: white;color:#b3b3b3;}
.approve_error{width: fit-content;background-color: red;height: fit-content; padding: 5px;text-align: center;color: white;font-size: medium;font-weight: bold;border: 1px solid red;border-radius: 5px;overflow: hidden; visibility: hidden;}
.approving_box1{width:fit-content;justify-content: center;border:1.5px solid #b3b3b3;border-radius: 5px; display:block;margin: 3px;padding: 5px;justify-items: center;}
/* end approving repair menu */
/* start service menu */
.approve_order_list{width: fit-content;display: flex;}
.order_list{width: fit-content;height: fit-content;display: flex;background-color: white;padding: 5px;border-radius: 10px;justify-content: space-between;}
.order_list_name_con{width:fit-content;margin: 10px;align-self: center;}
.order_status_con{width: 100%;height: fit-content;display: grid;justify-items: center;padding: 10px;align-self: center;}
.repair_c_opction_back_col{width:fit-content;background-color: #f7f7f76b;padding: 8px;justify-self: center;border: 2px solid #9fc9ff;;border-radius: 10px;margin: 5px;justify-content: center;display: grid;}
#see_options li{width: inherit;}
/* end service menu */
@media screen and (min-width:481px) and (max-width:768px) {
  header{position:sticky;top:0;width:100% ;z-index: 9999;background-color: white;display: flex;align-items: center;justify-content: space-between;box-sizing: border-box;padding:3px 8px;max-width: var(--lg-max-width);}
  .header2{justify-content: flex-start;}
  .fontsaman{height: 49px;}
.searchbarcont{display: flex;justify-content: center;width: 100%;margin-left: 8px;margin-right: 8px;}
.searchbar{align-self: center;padding: 5px;border-radius: 5px;display: flex;background-color: #f0eded;width:auto;align-items: center;}
.search_icon{margin-right:2px;font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:30px;}
.searchbar input{border: none;outline: none; background:transparent; color: rgb(5, 5, 5);font-size: 16px;width: 100%;}
.navbarcont{width: fit-content;display: flex;justify-content: center;}
.validate-input{display: grid;}
.navbar{width:fit-content;position: relative;border-radius: 100%;display: block;cursor: pointer;padding: 2px;}
.notification{font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:33px;}
.user_profile_photo{width: 48px; height:48px;border-radius:100%;display: block; align-self: center;}
.navbar a{color: #010300;width: 180px;text-align: center;text-transform: uppercase;transition: all 0.2s ease;}
.navbar .dd_menu ul li:hover,.dd_menu ul li:active{background: #ebeaeb;}
.navbar:hover{background-color: #8a8a8a} 
.navbar:hover .dd_menu{display: block;}
.dd_menu{width: fit-content;padding: 20px; position: absolute;top: 62px;right:0;display: none; background-color: white;border-radius: 8px;}
.dd_menu ul li{position: relative;left: 0; width: 220px;border-bottom: 2px solid #dad5d5; list-style-type: none;}
.dd_menu_a{width: 100%;}
.dd_menu ul li a{ width:100%;background: transparent;text-align: left;padding:22px 10px 0px 40px;display: flex;}
.dd_menu::before{content: "";position: absolute;top: -25px;left: 91%;transform: translateX(-50%);z-index: 1;border: 15px solid;
  border-color: transparent transparent white transparent;}
  .uploading_wait{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top: 58px;display: none;}
.progress{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top:58px;display:none;justify-content: center;align-items: center;}
/*  start user home cont */
.proceed_to_buy{margin-bottom:5px;background-color: yellow;display:flex;width:fit-content;padding: 8px 20px 8px 20px;cursor: pointer;border-radius: 5px;font-size: 16px;position: sticky;top: 62px;}
.item_container{width:100%;background-color: white;display: grid;padding:0px 16px 16px 16px;justify-content: center;margin-bottom: 2px;height: fit-content;height: fit-content;}
.item_container:hover .item_name{color: #026fe4;}
.item_container form{display: flex;width: 100%;cursor: pointer;}
.img_con{width: 30%;}
.img_con img{width: 100%;}
.item_info{width: 70%;display: grid;}
.item_info img{width: 45%;}
.price_con{width:100%;display: flex;margin-top: 5px;justify-content: center;height: fit-content;}
.item_name{font-size: 18px;font-weight: normal;padding: 3px;}
.item_p_c{display: flex;width:fit-content;height: fit-content;}
.item_p_c_1{display: flex;width: 100%;font-weight: bold;margin-left: 0px;margin-right: 0px;font-size:20px;justify-items: center;}
.r_saymbol{font:normal normal normal 14px/1 FontAwesome;font-size: 20px;font-weight: bold;}
.cartbuy{display: flex;justify-content: center;}
.addcart{display: flex;padding:8px 12px 8px 12px; border-radius:5px;background-color:gold;cursor: pointer;font-size: 16px;font-weight: bold;color: white;width: max-content;height: fit-content;margin-right: 20px;margin-left: 20px;}
.addcart span{font-family:Material-Design-Iconic-Font;font-size:18px;margin-right: 5px;}
.baynow{display: flex;padding:8px 12px 8px 12px; border-radius:5px;background-color:rgb(255, 145, 0);cursor: pointer;font-size: 16px;font-weight: bold;color: white;width: max-content;height: fit-content;}
.baynow span{font-family:Material-Design-Iconic-Font;font-size:16px;margin-right: 5px;}
#user_home_item_link{width: 25%;display: grid;background-color: white;margin: 2px;font-size:16px;font-weight: bold;padding-left: 3px;padding-right: 3px;text-align: center;flex-grow: 1;}
/*  end user home cont */
}
@media screen and (min-width:320px) and (max-width:480px){
  a {line-height: 1.3;}
  header{position:sticky;top:0;width:100% ;z-index: 9999;background-color: white;display: flex;align-items: center;justify-content: space-between;box-sizing: border-box;padding:5px 10px;max-width: var(--lg-max-width);padding-bottom: 40px;}
  .header2{justify-content: flex-start;}
  .fontsaman{height: 39px;}
  .searchbarcont{display: flex;justify-content: center;width: 100%;margin-left: 8px;margin-right: 8px;position: absolute;top: 54px;right: -7px;}
  .searchbar{align-self: center;padding: 7px;border-radius: 5px;display: flex;background-color: #f0eded;width:100%;align-items: center;margin: inherit;}
  .search_icon{margin-right:2px;font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:30px;}
  .searchbar input{border: none;outline: none; background:transparent; color: rgb(5, 5, 5);font-size: 16px;width: 100%;}
  .navbarcont{width: fit-content;display: flex;justify-content: center;}
  .validate-input{display: grid;}
  .navbar{width:fit-content;position: relative;border-radius: 100%;display: block;cursor: pointer;padding: 2px;}
  .notification{font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:30px;display: flex;}
  .user_profile_photo{width: 45px; height:45px;border-radius:100%;display: block; align-self: center;}
  .navbar a{color: #010300;width: 180px;text-align: center;text-transform: uppercase;transition: all 0.2s ease;}
  .navbar .dd_menu ul li:hover,.dd_menu ul li:active{background: #ebeaeb;}
  .navbar:hover{background-color: #8a8a8a} 
  .navbar:hover .dd_menu{display: block;}
  .dd_menu{width: fit-content;padding: 20px; position: absolute;top: 62px;right:0;display: none; background-color: white;border-radius: 8px;}
  .dd_menu ul li{position: relative;left: 0; width: 220px;border-bottom: 2px solid #dad5d5; list-style-type: none;}
  .dd_menu_a{width: 100%;}
  .dd_menu ul li a{ width:100%;background: transparent;text-align: left;padding:22px 10px 0px 40px;display: flex;}
  .dd_menu::before{content: "";position: absolute;top: -25px;left: 91%;transform: translateX(-50%);z-index: 1;border: 15px solid;
    border-color: transparent transparent white transparent;}
    .uploading_wait{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top: 92px;display:none;}
.progress{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top:92px;display:none;justify-content: center;align-items: center;}
.wrap-login100 {padding-left: 5px;padding-right: 5px;width: 100%;}
/*  start user home cont */
.container-login100{padding: 2px;}
.proceed_to_buy{margin-bottom:5px;background-color: yellow;display:flex;width:fit-content;padding: 5px 20px 5px 20px;cursor: pointer;border-radius: 5px;font-size: 16px;position: sticky;top:96px;}
.item_container{width:100%;background-color: white;display:grid;padding: 10px;justify-content: center;margin-bottom: 1px;height: fit-content;}
.item_container:hover .item_name{color: #026fe4;}
.item_container form{display:flex;width: 100%;cursor: pointer;}
.img_con{width: 35%;align-self: center;}
.img_con img{width: 100%;}
.item_info{width: 65%;display: grid;}
.item_info img{width: 45%;}
.price_con{width:100%;display: grid;margin-top: 5px;}
#cart_item_qty{font-size: 16px;}
.item_name{font-size: 16px;font-weight: normal;padding: 3px;flex-wrap: wrap;}
.item_p_c{display: flex;width:fit-content;height: fit-content;}
.item_p_c_1{display: flex;width: 100%;font-weight: bold;margin-left: 0px;margin-right: 0px;font-size:20px;}
.cartbuy{display: flex;justify-content: center;margin-top: 8px;}
.addcart{display: flex;padding:6px 10px 6px 10px; border-radius:5px;background-color:gold;cursor: pointer;font-size: 14px;font-weight: bold;color: white;width: max-content;height: fit-content;margin-right: 14px;}
.addcart span{font-family:Material-Design-Iconic-Font;font-size:18px;margin-right: 5px;}
.baynow{display: flex;padding:6px 10px 6px 10px; border-radius:5px;background-color:rgb(255, 145, 0);cursor: pointer;font-size: 14px;font-weight: bold;color: white;width: max-content;height: fit-content;}
.baynow span{font-family:Material-Design-Iconic-Font;font-size:16px;margin-right: 5px;}
#user_home_item_link{width: 33%;display: grid;background-color: white;margin: 1px;font-size:14px;font-weight: bold;padding-left: 3px;padding-right: 3px;text-align: center;flex-grow: 1;}
/*  end user home cont */
/* start approving repair menu */
.approving_box_con{width:100%;justify-content: center;justify-items: center; display: grid;align-items: center;}
.approving_box{width:fit-content;justify-content: center;border:1.5px solid #b3b3b3;border-radius: 5px; display: grid;margin: 10px;padding: 5px;justify-items: center;}
.approving_box input{background-color: rgb(212, 217, 223);width: 55px;font-size: medium;text-align: right;font-weight: bold;margin-left: 2px;}
.approving_box select{font-weight: bold;font-size: medium;border: none;outline: none;}
.approving_box_hadding{width: fit-content;justify-self: center; margin-top: -18px;padding-left: 8px;padding-right: 8px; position: relative;background-color: white;color:#b3b3b3;}
.approve_error{width: auto;background-color: red;height: fit-content; padding: 5px;text-align: center;color: white;font-size: medium;font-weight: bold;border: 1px solid red;border-radius: 5px;overflow: hidden; visibility: hidden;}
.approving_box1{width:fit-content;justify-content: center;border:1.5px solid #b3b3b3;border-radius: 5px; display:block;margin: 3px;padding: 5px;justify-items: center;}
/* end approving repair menu */
/* start service menu */
.approve_order_list{width: fit-content;overflow: hidden;display:grid;justify-items: center;}
.order_list{width: fit-content;height: fit-content;display: grid;background-color: white;padding: 5px;border-radius: 10px;justify-items: center;}
.order_list_name_con{width:fit-content;overflow: auto;}
.order_status_con{width: auto;overflow: hidden;display: grid;align-self: center;}
.repair_c_opction_back_col{width:fit-content;background-color: #f7f7f76b;padding: 8px;justify-self: center;border: 2px solid #9fc9ff;;border-radius: 10px;margin: 5px;justify-content: center;display: grid;}
#see_options li{width: inherit;}
/* end service menu */
}
@media screen and (max-width:319px){
  header{position:sticky;top:0;width:100% ;z-index: 9999;background-color: white;display: flex;align-items: center;justify-content: space-between;box-sizing: border-box;padding:3px 8px;max-width: var(--lg-max-width);padding-bottom: 40px;}
  .header2{justify-content: flex-start;}
  .fontsaman{height: 35px;}
  .searchbarcont{display: flex;justify-content: center;width: 100%;margin:0px;position: absolute;top: 52px;right: 0px;padding-left: 5px;padding-right: 5px;}
  .searchbar{align-self: center;padding: 5px;border-radius: 10px;display: flex;background-color: #f0eded;width:auto;align-items: center;}
  .search_icon{margin-right:2px;font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:30px;}
  .searchbar input{border: none;outline: none; background:transparent; color: rgb(5, 5, 5);font-size: 16px;width: 100%;}
  .navbarcont{width: fit-content;display: flex;justify-content: center;}
  .validate-input{display: grid;}
  .navbar{width:fit-content;position: relative;border-radius: 100%;display: block;cursor: pointer;padding: 2px;}
  .notification{font-family:Material-Design-Iconic-Font;color: #8a8a8a;font-size:28px;}
  .user_profile_photo{width: 45px; height:45px;border-radius:100%;display: block; align-self: center;}
  .navbar a{color: #010300;width: 180px;text-align: center;text-transform: uppercase;transition: all 0.2s ease;}
  .navbar .dd_menu ul li:hover,.dd_menu ul li:active{background: #ebeaeb;}
  .navbar:hover{background-color: #8a8a8a} 
  .navbar:hover .dd_menu{display: block;}
  .dd_menu{width: fit-content;padding: 20px; position: absolute;top: 59px;right:0;display: none; background-color: white;border-radius: 8px;}
  .dd_menu ul li{position: relative;left: 0; width: 220px;border-bottom: 2px solid #dad5d5; list-style-type: none;}
  .dd_menu_a{width: 100%;}
  .dd_menu ul li a{ width:100%; background: transparent;text-align: left;padding:22px 10px 0px 40px;display: flex;}
  .dd_menu::before{content: "";position: absolute;top: -25px;left: 91%;transform: translateX(-50%);z-index: 1;border: 15px solid;
    border-color: transparent transparent white transparent;}
    .uploading_wait{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top: 92px;display:none;}
    .progress{width: 100%;height: 100%;background-color: #262626;z-index: 9999;position:fixed;opacity: 0.9;top:92px;display:none;justify-content: center;align-items: center;}
    .wrap-login100 {padding-left: 3px;padding-right: 3px;}
    /*  start user home cont */
    .container-login100{padding: 1px;}
    .proceed_to_buy{margin-bottom:5px;background-color: yellow;display:flex;width:fit-content;padding: 5px 20px 5px 20px;cursor: pointer;border-radius: 5px;font-size: 16px;position: sticky;top: 96px;}
.item_container{width:100%;background-color: white;display: grid;padding: 3px;justify-content: center;margin-bottom: 1px;height: fit-content;}
.item_container:hover .item_name{color: #026fe4;}
.item_container form{display:grid;width: 100%;cursor: pointer;}
.img_con{width: 100%;}
.img_con img{width: 100%;}
.item_info{width: 100%;display: grid;}
.item_info img{width: 45%;}
.price_con{width:100%;display: grid;margin-top: 10px;margin-bottom: 10px;}
#cart_item_qty{font-size: 16px;}
.item_name{font-size: 16px;font-weight: normal;padding: 3px;}
.item_p_c{display: flex;width:34%;}
.item_p_c_1{display: flex;width: 100%;font-weight: bold;margin-left: 0px;margin-right: 0px;font-size:20px;}
.r_saymbol{font:normal normal normal 14px/1 FontAwesome;font-size: 18px;font-weight: bold;align-self: center;}
.cartbuy{display: flex;justify-content: center;margin-top: 5px;}
.addcart{display: flex;padding:6px 10px 6px 10px; border-radius:5px;background-color:gold;cursor: pointer;font-size: 14px;font-weight: bold;color: white;width: max-content;height: fit-content;margin-right: 14px;}
.addcart span{font-family:Material-Design-Iconic-Font;font-size:18px;margin-right: 5px;}
.baynow{display: flex;padding:6px 10px 6px 10px; border-radius:5px;background-color:rgb(255, 145, 0);cursor: pointer;font-size: 14px;font-weight: bold;color: white;width: max-content;height: fit-content;}
.baynow span{font-family:Material-Design-Iconic-Font;font-size:16px;margin-right: 5px;}
#user_home_item_link{width: 50%;display: grid;background-color: white;margin: 1px;font-size:16px;font-weight: bold;padding-left: 3px;padding-right: 3px;text-align: center;flex-grow: 1;}
/*  end user home cont */ 
/* start service menu */
.approve_order_list{width: fit-content;overflow: hidden;display:grid;justify-items: center;}
.order_list{width: fit-content;max-height: 100px; overflow: hidden;display: flex;background-color: white;padding: 5px;border-radius: 10px;justify-content: space-between;}
.order_list_name_con{width:fit-content;margin: 10px;overflow: auto;}
.order_status_con{width: auto;overflow: hidden;display: grid;align-self: center;}
.repair_c_opction_back_col{width:fit-content;background-color: #f7f7f76b;padding: 8px;justify-self: center;border: 2px solid #9fc9ff;;border-radius: 10px;margin: 5px;justify-content: center;display: grid;}
#see_options li{width: inherit;}
/* end service menu */  
}