/* /CSS/avis-clients.css */

.avis-wrap{
  max-width: 1100px;
  margin: 18px auto 40px;
  padding: 10px;
}

.avis-card{
  background:#fff;
  border-radius:14px;
  box-shadow: 0 5px 16px rgba(0,0,0,0.12);
  overflow:hidden;
}

.avis-head{
  padding:14px 16px;
  background: linear-gradient(180deg, #ffffff, #f6f7f9);
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.avis-head h3{
  margin:0;
  font-size:1.05rem;
}

.avis-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.avis-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,0.14);
  background:#f7f7f7;
  cursor:pointer;
  text-decoration:none;
  font-weight:600;
  transition: transform .08s ease, box-shadow .12s ease, background .12s ease;
}

.avis-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(0,0,0,0.10);
  background:#fff;
}

.avis-body{
  padding:16px;
}

.avis-summary{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:10px;
  font-size:0.95rem;
}

.stars{
  display:inline-flex;
  gap:2px;
  vertical-align:middle;
}
.star{
  font-size:1.05rem;
  line-height:1;
  opacity:.35;
}
.star.on{ opacity:1; }

.avis-list{
  display:grid;
  gap:12px;
  margin-top:12px;
}

.avis-item{
  border:1px solid rgba(0,0,0,0.08);
  border-radius:12px;
  padding:12px 12px;
  background:#fff;
}

.avis-item-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.avis-who{
  font-weight:700;
  font-size:0.95rem;
}
.avis-meta{
  font-size:0.85rem;
  opacity:.8;
}

.avis-text{
  font-size:0.95rem;
  line-height:1.4;
  white-space:pre-wrap;
}

.avis-empty{
  padding:12px;
  background: rgba(0,0,0,0.03);
  border-radius:12px;
}

/* Modal */
.avis-modal{
  display:none;
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.6);
  z-index:999;
  align-items:center;
  justify-content:center;
}

.avis-modal-box{
  background:#fff;
  width:95%;
  max-width:620px;
  border-radius:14px;
  padding:14px 14px;
  position:relative;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}

.avis-close{
  position:absolute;
  right:12px;
  top:10px;
  font-size:1.6rem;
  cursor:pointer;
}

.avis-form{
  display:grid;
  gap:10px;
}

.avis-grid{
  display:grid;
  gap:10px;
  grid-template-columns: 1fr 1fr;
}

.avis-form label{
  font-size:0.9rem;
  font-weight:600;
}

.avis-form input,
.avis-form select,
.avis-form textarea{
  width:100%;
  box-sizing:border-box;
  padding:9px 10px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,0.16);
  font-size:0.95rem;
}

.avis-form textarea{
  min-height:120px;
  resize:vertical;
}

.avis-help{
  font-size:0.85rem;
  opacity:.85;
}

.avis-msg-ok{ color: green; font-size:0.9rem; display:none; }
.avis-msg-err{ color: #b10000; font-size:0.9rem; display:none; }

@media (max-width: 720px){
  .avis-grid{ grid-template-columns: 1fr; }
}
