/* Tout est scoped pour éviter les conflits */
.sav-page .sav-hidden{ display:none !important; }

/* Background colonne droite */
.sav-page .livraisons-right.sav-bg{
  background-image:
    linear-gradient(to bottom, rgba(239, 247, 255, 0) 60%, #eff7ff 100%),
    url("https://www.stock-literie.fr/app_serta/img/fond-sav.png") !important;
  background-size: cover, contain;
  min-height: 90vh;
}

/* Messages */
.sav-page .sav-error-box{
  padding:12px;
  border:1px solid #f2c0c0;
  border-radius:8px;
  background:#fff5f5;
  color:#7a0000;
  font-weight:800;
}
.sav-page .sav-empty{
  padding:12px;
  border:1px solid #eee;
  border-radius:8px;
  background:#fff;
  color:#555;
}

/* Status */
.sav-page .sav-status-top{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.sav-page .sav-status-top-label{ color:#666; font-weight:700; }
.sav-page .sav-status{ font-weight:800; padding:8px 12px; border-radius:999px; }
.sav-page .status-ok{ color:#1f7a1f; background:#e7f6e7; }
.sav-page .status-review{ color:#7a5a00; background:#fff3d6; }
.sav-page .status-rejected{ color:#9b1c1c; background:#fde8e8; }
.sav-page .status-deposited{ color:#444; background:#f5f5f5; border:1px solid #e5e5e5; }
.sav-page .sav-status-draft-plain{ font-weight:900; color:#666; }

/* Bouton retour (detail) */
.sav-page .sav-back-btn{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  padding:14px 12px;
  border-radius:10px;
  font-weight:1000;
  background:#0b2a5b;
  border:1px solid #0b2a5b;
  color:#fff;
  transition: filter .12s ease, transform .12s ease;
}
.sav-page .sav-back-btn:hover{ filter: brightness(0.95); transform: translateY(-1px); }

/* Cards + forms (detail) */
.sav-page .sav-card{ border: 1px solid #eee; border-radius: 8px; padding: 14px 12px; margin-bottom: 14px; background: #fff; }
.sav-page .sav-card-title{ font-weight: 800; margin-bottom: 10px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 6px; padding: 10px 10px; }
.sav-page .sav-grid-3{ display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 12px; }
.sav-page .sav-grid-2{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sav-page .sav-field label{ display: block; font-size: 0.85em; color: #666; margin-bottom: 6px; }
.sav-page .sav-field select,
.sav-page .sav-field textarea,
.sav-page .sav-field input[type="file"]{
  width: 100%;
  box-sizing: border-box;
  height: 44px;
  padding: 8px 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
}
.sav-page .sav-field textarea{ height: auto; min-height: 120px; resize: vertical; }
.sav-page .sav-field select:disabled,
.sav-page .sav-field textarea:disabled,
.sav-page .sav-field input[type="file"]:disabled{
  opacity: 0.5;
  background: #f3f3f3;
  cursor: not-allowed;
}
.sav-page .sav-hint{ margin-top: 10px; font-size: 0.9em; color: #666; }
.sav-page .sav-subhint{ margin-top: 6px; font-size: 0.82em; color: #777; }
.sav-page .sav-actions{ margin-top: 10px; }

.sav-page .sav-photo-preview{ margin-top: 10px; border: 1px solid #eee; border-radius: 8px; padding: 10px; background: #fafafa; }
.sav-page .sav-photo-preview-title{ font-weight: 700; margin-bottom: 8px; }
.sav-page .sav-photo-preview img{ max-width: 100%; height: auto; border-radius: 6px; border: 1px solid #e6e6e6; }

.sav-page .sav-radio-title{ font-weight: 700; margin-bottom: 8px; }
.sav-page .sav-radio-inline{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.sav-page .sav-radio{ display:inline-flex; align-items:center; gap:10px; margin:0; font-size: 0.95em; color: #333; }
.sav-page .sav-radio input[type="radio"]{ width: 18px; height: 18px; transform: scale(1.2); }

.sav-page .sav-req{ color:#d11; font-weight:800; margin-left:4px; }
.sav-page .sav-required-legend{ margin-top:10px; font-size:0.9em; color:#666; text-align:center; }

/* Contremarque */
.sav-page .sav-contremarque{ margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e8e8e8; }
.sav-page .sav-checkbox{ display:inline-flex; align-items:center; gap:10px; font-weight: 800; color:#333; margin: 0; }
.sav-page .sav-checkbox input[type="checkbox"]{ width: 18px; height: 18px; transform: scale(1.15); }
.sav-page .sav-contremarque-select{ margin-top: 10px; }

/* Submit */
.sav-page .sav-submit{ transition: filter .12s ease, opacity .12s ease; }
.sav-page .sav-submit:disabled{ opacity: .45; filter: grayscale(1); cursor: not-allowed; }
.sav-page .sav-submit:not(:disabled){
  background: #0b2a5b !important;
  border-color: #0b2a5b !important;
  color: #fff !important;
  opacity: 1;
  filter: none;
  cursor: pointer;
}
.sav-page .sav-submit:not(:disabled):hover{ filter: brightness(0.95); }

/* Loader */
.sav-page .sav-loading{
  position: fixed;
  inset: 0;
  background: rgba(255,255,255,0.85);
  z-index: 99999;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sav-page .sav-loading-box{
  background: #fff;
  border: 1px solid #e7e7e7;
  border-radius: 14px;
  padding: 18px 16px;
  min-width: 260px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.10);
  text-align:center;
}
.sav-page .sav-loading-text{ margin-top: 10px; font-weight: 900; color:#0b2a5b; }
.sav-page .sav-spinner{
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 4px solid #d7e0ee;
  border-top-color: #0b2a5b;
  margin: 0 auto;
  animation: savspin 0.9s linear infinite;
}
@keyframes savspin{ to { transform: rotate(360deg); } }

/* Success */
.sav-page .sav-success-card{
  border: 1px solid #bfe6c9;
  background: #eaf9ef;
  color: #155b2a;
  border-radius: 12px;
  padding: 16px 14px;
  font-weight: 800;
}
.sav-page .sav-success-title{ font-weight: 1000; font-size: 1.15em; margin-bottom: 6px; }
.sav-page .sav-success-text{ line-height: 1.35; }
.sav-page .sav-success-sign{ margin-top: 10px; font-weight: 1000; }

/* Annuler (detail) */
.sav-page .sav-status-top-flex{ justify-content: space-between; align-items: center; gap: 12px; }
.sav-page .sav-status-left{ display:flex; align-items:center; gap:10px; }
.sav-page .sav-cancel-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid #f2b6b6;
  background:#ffecec;
  color:#a30000;
  font-weight:900;
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  transition: filter .12s ease, transform .12s ease;
  white-space:nowrap;
}
.sav-page .sav-cancel-btn:hover{ filter: brightness(0.97); transform: translateY(-1px); }
.sav-page .sav-trash-ico{ display:inline-flex; color:#a30000; }

/* Liste (page mes savs) */
.sav-page .sav-new-wrap{ width:100%; max-width:100%; box-sizing:border-box; margin-bottom:12px; }
.sav-page .sav-new-btn{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  padding:14px 12px;
  border-radius:10px;
  font-weight:1000;
  background:#0b2a5b;
  border:1px solid #0b2a5b;
  color:#fff;
  transition: filter .12s ease, transform .12s ease;
}
.sav-page .sav-new-btn:hover{ filter: brightness(0.95); transform: translateY(-1px); }

.sav-page .sav-list{ width:100%; }
.sav-page .sav-year{ font-weight:900; margin-top:16px; margin-bottom:8px; }
.sav-page .sav-month{
  font-weight:800;
  padding:10px;
  background:#f5f5f5;
  border:1px solid #ddd;
  border-radius:6px;
  margin:10px 0;
}

.sav-page .sav-row{
  display:grid;
  grid-template-columns:110px 1fr 260px;
  gap:12px;
  align-items:start;
  border:1px solid #eee;
  border-radius:8px;
  padding:12px;
  background:#fff;
  margin-bottom:10px;
}
.sav-page .sav-date{ font-weight:800; font-size:0.95em; }
.sav-page .sav-title{ font-weight:800; margin-bottom:4px; }
.sav-page .sav-product{ font-size:0.92em; color:#444; margin-bottom:6px; }
.sav-page .sav-excerpt{ font-size:0.92em; color:#555; }

.sav-page .sav-status{
  justify-self:end;
  font-weight:800;
  padding:8px 12px;
  border-radius:999px;
  margin-right:28px;
  text-align:right;
}

.sav-page .sav-link{
  text-decoration:none;
  color:inherit;
  cursor:pointer;
  position:relative;
  transition:.18s ease;
}
.sav-page .sav-link:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,0.06);
}
.sav-page .sav-link::after{
  content:"›";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  font-size:26px;
  color:#b5c2cf;
}
.sav-page .sav-link:hover::after{
  transform:translateY(-50%) translateX(4px);
}

.sav-page .sav-old-wrap{ margin-top:18px; padding-top:10px; border-top:1px dashed #d7d7d7; }
.sav-page .sav-old-toggle{
  width:100%;
  border:1px solid #dbe6f3;
  background:#eff7ff;
  color:#1b4b7a;
  font-weight:900;
  padding:12px;
  border-radius:10px;
  cursor:pointer;
  transition:.18s ease;
  text-align:left;
}
.sav-page .sav-old-toggle:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,0.06);
}
.sav-page .sav-old-toggle.is-open{ background:#e6f2ff; }
.sav-page .sav-old-content{ margin-top:12px; }

/* Responsive */
@media (max-width: 767px){
  .sav-page .sav-grid-3{ grid-template-columns: 1fr; }
  .sav-page .sav-grid-2{ grid-template-columns: 1fr; }
  .sav-page .sav-row{ grid-template-columns:1fr; }
  .sav-page .sav-status{ justify-self:start; margin-right:0; text-align:left; }
  .sav-page .sav-status-top-flex{ flex-direction: column; align-items: flex-start; }
  .sav-page .sav-cancel-btn{ width: 100%; justify-content: center; }
}
