* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background: linear-gradient(to right, #2c3e50, #3498db);
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.login-container {
  background: #fff;
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
  width: 100%;
  max-width: 400px;
}

.login-form {
  display: flex;
  flex-direction: column;
}

.logo {
  max-width: 120px;
  margin: 0 auto 1rem auto;
  display: block;
}

.login-form h2 {
  text-align: center;
  margin-bottom: 1.5rem;
  color: #2c3e50;
}

.input-group {
  position: relative;
  margin-bottom: 1rem;
}

.input-group input {
  width: 100%;
  padding: 10px 40px 10px 36px;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 1rem;
  display: block;
}

.input-group i.fa-user,
.input-group i.fa-lock {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  color: #999;
}

.toggle-password {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  cursor: pointer;
  color: #999;
}

button {
  width: 100%;
  padding: 10px;
  background-color: #2980b9;
  border: none;
  border-radius: 8px;
  color: white;
  font-size: 1rem;
  cursor: pointer;
}

button:hover {
  background-color: #2980b9;
}

.links {
  text-align: center;
  margin-top: 1rem;
}

.links a {
  color: #3498db;
  text-decoration: none;
}

.error {
  color: red;
  text-align: center;
  margin-top: 1rem;
}

/* Ligne d’actions sous la recherche existe déjà (actions-wrap) */

/* Bouton "Ajouter" – même ADN que Mon panier */
.add-cart-btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:10px;
  border:1px solid #dfe7f2; background:#f5f8fd;
  cursor:pointer; user-select:none;
}
.add-cart-btn:hover{ background:#eef4fc; }

.qty-btn:hover{ background:#eef4fc; }
.qty-input{
  width:88px; border:0; outline:none;
  text-align:right;               /* décimales à droite */
  font-size:14px;
}
.qty-unit{ font-size:12px; color:#607087; }

/* Petit footer d’actions dans la carte produit */
.card-actions{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:8px;
}

/* Contrôle quantité dans la fiche produit */
.qty-control{
  display:inline-flex; align-items:center; gap:10px;
  padding:6px 8px; border-radius:999px; background:#fff;
  box-shadow:0 2px 6px rgba(0,0,0,.08);
}
.qty-btn{
  width:34px; height:34px; border-radius:50%;
  border:2px solid #f2a900; color:#f2a900; background:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:18px; line-height:1; cursor:pointer;
}
.qty-btn:active{ transform:scale(.96); }
.qty-badge{
  min-width:26px; height:26px; padding:0 8px;
  border-radius:999px; background:#e53935; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:13px;
}

/* (Optionnel) placement en bas de la carte */
.product-card .qty-control-wrap{
  position:absolute; left:10px; bottom:10px;
}
.product-card{ position:relative; }

/* Hover "Retour panier" (bouton en haut à droite après transformation) */
.btn-back-cart:hover{
  background:#f7fbff !important;
  border-color:#bcd0e4 !important;
  color:#1f2d3d !important;
}

/* Ajustement visuel du bouton poubelle */
.btn-remove svg{ display:block; }
.btn-remove:hover{
  background:#ffecec;
  border-color:#e2aaaa;
}

/* Le panneau de la modale doit autoriser le positionnement absolu du bouton */
.product-modal .modal-panel{
  position: relative;
  padding-top: 10px; /* un peu d'air en haut */
}

/* Bouton 'Retour panier' (remplace le close) — en haut à droite */
.product-modal .btn-back-cart{
  position: absolute;
  top: 10px; 
  right: 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #d8e0ea;
  border-radius: 999px;
  background: #fff;
  color: #1f2d3d;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,.10);
  transition: background .12s ease, border-color .12s ease, transform .04s ease, box-shadow .12s ease;
}
.product-modal .btn-back-cart:hover{
  background:#f7fbff;
  border-color:#bcd0e4;
  box-shadow:0 6px 16px rgba(0,0,0,.14);
}
.product-modal .btn-back-cart:active{
  transform: translateY(1px);
}
.product-modal .btn-back-cart svg{
  width:18px; height:18px;
}

/* Quand on revient au panier, on redevient un 'X' en haut à droite */
.product-modal .modal-close{
  position:absolute;
  top:10px; right:10px;
  width:36px; height:36px;
  border:1px solid #d8e0ea;
  border-radius:999px;
  background:#fff;
  color:#1f2d3d;
  font-size:20px;
  line-height:1;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.10);
}
.product-modal .modal-close:hover{
  background:#f7fbff;
  border-color:#bcd0e4;
}

/* Option: un petit espace au titre si besoin */
#pm-title{ padding-right: 120px; } /* pour éviter que le bouton recouvre le titre */
@media (max-width: 480px){
  #pm-title{ padding-right: 88px; }
  .product-modal .btn-back-cart{ padding:6px 10px; }
}

$(document).on('click', '#show-all', function(e){
  e.preventDefault();
  clearSelectedFilter();   // ta fonction existante qui remet l’état “tout affiché”
});
