/* Espace vendeur, dans l'enveloppe autonome du Shop. */
.sv-nav {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 0 0 14px;
  margin: 0 0 17px;
  border-bottom: 1px solid var(--m-line);
  scrollbar-width: thin;
}
.sv-nav a {
  flex: none;
  padding: 9px 15px;
  border-radius: 8px;
  color: var(--m-muted);
  font-size: 13px;
  font-weight: 550;
}
.sv-nav a:hover { background: var(--m-surface2); color: var(--m-text); }
.sv-nav [aria-current=page] { background: var(--m-surface2); color: var(--m-text); }
.sv-identity-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 25px; }
.sv-identity-strip strong { font-size: 14px; margin-right: auto; overflow-wrap: anywhere; }
.sv-shop-initial, .sv-shop-avatar {
  display: grid;
  place-items: center;
  border: 1px solid var(--m-line);
  border-radius: 11px;
  color: var(--m-coral);
  background: var(--m-surface2);
  font-weight: 700;
  flex: none;
}
.sv-shop-initial { width: 35px; height: 35px; font-size: 16px; }
.sv-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--m-line);
  border-radius: 6px;
  padding: 4px 8px;
  background: var(--m-surface2);
  color: var(--m-muted);
  font-size: 11px;
  line-height: 1.4;
  font-weight: 600;
}
.sv-status-approuve, .sv-status-approuvee { background: #16392d; border-color: #36765b; color: #b6e5cc; }
.sv-status-en_attente, .sv-status-soumise { background: #352d1e; border-color: #75613a; color: #ead3a4; }
.sv-status-refuse, .sv-status-refusee, .sv-status-suspendu { background: #3a2328; border-color: #79444f; color: #f2bdc7; }
.sv-notice-panel {
  display: flex;
  align-items: flex-start;
  gap: 17px;
  border: 1px solid var(--m-line);
  border-radius: 13px;
  padding: 22px;
  background: var(--m-surface);
  margin: 0 0 24px;
}
.sv-notice-mark, .sv-panel-icon { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--m-line); border-radius: 10px; background: var(--m-surface2); color: var(--m-coral); flex: none; }
.sv-notice-panel h2, .sv-panel h2 { font-size: 18px; margin: 0 0 8px; font-weight: 650; }
.sv-notice-panel p, .sv-panel p { font-size: 14px; color: var(--m-muted); line-height: 1.75; margin: 0; }
.sv-feedback { display: block; border-left: 3px solid #bc7483; padding: 10px 14px; border-radius: 3px; color: var(--m-text); background: var(--m-surface2); font-size: 13px; line-height: 1.65; margin-top: 13px; overflow-wrap: anywhere; }
.sv-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; margin: 0 0 25px; }
.sv-metrics > div { border: 1px solid var(--m-line); border-radius: 12px; padding: 21px; background: var(--m-surface); }
.sv-metrics strong { display: block; font-size: 29px; font-weight: 650; line-height: 1.2; font-variant-numeric: tabular-nums; margin-bottom: 9px; }
.sv-metrics span { color: var(--m-muted); font-size: 12px; }
.sv-dashboard-grid, .sv-payment-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin: 0 0 24px; }
.sv-panel { border: 1px solid var(--m-line); border-radius: 13px; padding: 25px; background: var(--m-surface); }
.sv-panel-icon { margin-bottom: 17px; }
.sv-panel .sh-button { margin-top: 19px; }
.sv-profile-actions { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.sv-profile-actions .sh-button { margin: 0; flex: none; }
.sv-help { font-size: 12px; line-height: 1.7; color: var(--m-muted); margin: 9px 0; }
.sv-update-application { margin-top: 28px; }
.sv-update-application > summary { cursor: pointer; font-weight: 600; padding: 16px 0; }
.sv-onboarding { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(28px,5vw,78px); align-items: start; padding-top: 6px; }
.sv-onboarding-intro { max-width: 470px; padding: 28px 0; }
.sv-onboarding-intro h2 { font-size: clamp(27px,3.2vw,38px); line-height: 1.22; letter-spacing: -.03em; margin: 13px 0 20px; }
.sv-onboarding-intro > p { color: var(--m-muted); font-size: 15px; line-height: 1.8; }
.sv-steps { padding: 0; margin: 30px 0 0; list-style: none; display: grid; gap: 25px; }
.sv-steps li { display: flex; gap: 15px; align-items: flex-start; }
.sv-steps li > span { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--m-line); border-radius: 50%; background: var(--m-surface2); color: var(--m-coral); font-size: 13px; font-weight: 650; }
.sv-steps strong { font-size: 14px; display: block; margin-bottom: 5px; }
.sv-steps small { display: block; color: var(--m-muted); font-size: 12px; line-height: 1.65; }
.sv-form-card { border: 1px solid var(--m-line); border-radius: 13px; padding: 25px; background: var(--m-surface); min-width: 0; }
.sv-form-card > h2, .sv-form-card > h3, .sv-form > h3 { font-size: 18px; font-weight: 650; margin: 0 0 22px; display: flex; align-items: center; gap: 12px; }
.sv-form-card .sv-section-heading h2, .sv-form-card .sv-section-heading h3 { font-size: 18px; }
.sv-form { margin: 0; }
.sv-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0 0 18px; }
.sv-field > span { font-size: 13px; font-weight: 550; }
.sv-field :is(input,select,textarea) { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid var(--sh-field-line); border-radius: 8px; color: var(--m-text); background: var(--m-bg); padding: 11px 12px; font: 400 14px/1.5 var(--tnf-font); }
.sv-field :is(input,select) { min-height: 43px; }
.sv-field textarea { resize: vertical; min-height: 78px; }
.sv-field input[type=file] { font-size: 13px; }
.sv-field input[type=file]::file-selector-button { background: var(--m-surface2); color: var(--m-text); border: 1px solid var(--m-line); border-radius: 5px; padding: 6px 9px; margin-right: 10px; cursor: pointer; }
.sv-field input::placeholder, .sv-field textarea::placeholder { color: var(--m-muted); }
.sv-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 17px; }
.sv-form-section { border-top: 1px solid var(--m-line); padding-top: 20px; margin-top: 22px; }
.sv-form-section h3 { font-size: 16px; margin: 0 0 10px; }
.sv-form-section > .sv-help { margin-bottom: 19px; }
.sv-consent { display: flex; align-items: flex-start; gap: 11px; font-size: 12px; line-height: 1.75; color: var(--m-muted); margin: 17px 0; }
.sv-consent input { width: 16px; height: 16px; margin: 4px 0 0; flex: none; accent-color: #bd3342; }
.sv-consent a, .sv-text-link { color: var(--m-coral); text-decoration: underline; text-underline-offset: 3px; }
.sv-form-actions { display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding-top: 13px; margin-top: 14px; }
.sv-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 15px 0 22px; }
.sv-section-heading h2 { font-size: 21px; letter-spacing: -.015em; margin: 0 0 7px; }
.sv-section-heading h3 { margin: 0 0 7px; }
.sv-section-heading p { font-size: 13px; color: var(--m-muted); line-height: 1.75; margin: 0; }
.sv-section-heading > .sh-button { flex: none; }
.sv-section-heading > span { font-size: 12px; color: var(--m-muted); }
.sv-offer-list { display: grid; gap: 12px; }
.sv-offer-row { display: grid; grid-template-columns: 110px minmax(0,1fr) auto auto; gap: 20px; align-items: center; border: 1px solid var(--m-line); background: var(--m-surface); border-radius: 12px; padding: 15px; }
.sv-offer-image { border-radius: 8px; overflow: hidden; background: var(--m-bg); height: 88px; }
.sv-offer-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-offer-image .sh-no-image { width: 100%; height: 100%; }
.sv-offer-copy { min-width: 0; }
.sv-offer-copy h3 { margin: 8px 0 5px; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.sv-offer-copy h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sv-offer-copy p { font-size: 12px; color: var(--m-muted); margin: 0; }
.sv-offer-price { text-align: right; white-space: nowrap; }
.sv-offer-price strong { display: block; font-size: 19px; font-variant-numeric: tabular-nums; }
.sv-offer-price small { display: block; margin-top: 5px; color: var(--m-muted); font-size: 12px; }
.sv-row-actions { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.sv-row-actions a { font-size: 12px; }
.sv-back { display: inline-block; margin: 0 0 12px; font-size: 13px; color: var(--m-muted); }
.sv-back:hover { color: var(--m-text); }
.sv-offer-form { display: grid; gap: 18px; max-width: 930px; margin-inline: auto; }
.sv-offer-form .sv-form-actions { margin: 0; }
.sv-step-number { display: grid; place-items: center; font-size: 12px; width: 28px; height: 28px; border-radius: 8px; background: var(--m-surface2); color: var(--m-coral); font-weight: 650; }
.sv-image-choice { display: grid; grid-template-columns: minmax(0,1fr) 180px; gap: 20px; margin: 4px 0 20px; align-items: center; }
.sv-image-choice > .sv-field { margin-bottom: 0; }
.sv-image-preview { display: grid; place-items: center; aspect-ratio: 16/9; border: 1px solid var(--m-line); border-radius: 8px; overflow: hidden; color: var(--m-muted); background: var(--m-bg); font-size: 12px; }
.sv-image-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sv-image-preview span { padding: 10px; text-align: center; }
.sv-optional > summary { cursor: pointer; font-size: 15px; font-weight: 600; }
.sv-optional[open] > summary { margin-bottom: 22px; }
.sv-publish-panel, .sv-stock-card { margin: 24px auto 0; max-width: 930px; }
.sv-publish-panel .sv-inline-actions { margin-top: 18px; }
.sv-inline-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.sv-inline-actions .sv-help { flex-basis: 100%; margin-bottom: 0; }
.sv-stock-count { font-size: 28px; color: var(--m-text); font-variant-numeric: tabular-nums; }
.sv-stock-adjust { display: flex; align-items: end; gap: 14px; }
.sv-stock-adjust .sv-field { max-width: 250px; flex: 1; margin: 0; }
.sv-stock-adjust button { min-height: 43px; }
.sv-stock-card textarea[name=codes], .sv-sale-lines textarea[name=contenu] { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; }
.sv-payment-intro { margin: 0 0 22px; }
.sv-payment-intro > .sv-status { margin-bottom: 13px; }
.sv-payment-grid { margin-bottom: 0; }
.sv-payment-grid p { font-size: 14px; color: var(--m-muted); line-height: 1.8; }
.sv-payment-grid .sv-inline-actions { margin-top: 20px; }
.sv-checklist { margin: 0; }
.sv-checklist > div { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--m-line); font-size: 13px; line-height: 1.6; }
.sv-checklist > div:last-child { border-bottom: 0; }
.sv-checklist dt { color: var(--m-muted); }
.sv-checklist dd { text-align: right; margin: 0; font-weight: 550; }
.sv-sale-total { font-size: 26px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sv-sale-lines { display: grid; gap: 18px; margin: 22px 0; }
.sv-sale-lines .sv-checklist { margin-bottom: 15px; }
.sv-success { color: #b6e5cc; font-size: 13px; }
.sv-conversation { display: grid; gap: 12px; margin: 18px 0 24px; }
.sv-conversation article { border: 1px solid var(--m-line); background: var(--m-bg); border-radius: 9px; padding: 16px; }
.sv-conversation strong { font-size: 13px; }
.sv-conversation time { display: block; font-size: 11px; color: var(--m-muted); margin-top: 3px; }
.sv-conversation p { font-size: 14px; line-height: 1.75; margin: 12px 0 0; overflow-wrap: anywhere; }
.sv-public-profile { display: flex; align-items: flex-start; gap: 25px; padding: 28px; border-radius: 14px; border: 1px solid var(--m-line); background: linear-gradient(130deg,var(--m-surface2),var(--m-surface)); margin: 19px 0 32px; }
.sv-shop-avatar { width: 80px; height: 80px; font-size: 34px; border-radius: 17px; }
.sv-public-profile h2 { font-size: 30px; letter-spacing: -.025em; margin: 11px 0 5px; overflow-wrap: anywhere; }
.sv-public-profile p { font-size: 14px; color: var(--m-muted); line-height: 1.85; max-width: 750px; margin: 13px 0 0; overflow-wrap: anywhere; }
.sv-country { font-size: 12px; color: var(--m-muted); }
.sv-approved { display: inline-flex; align-items: center; gap: 6px; color: #b6e5cc; font-size: 12px; font-weight: 550; }
.sv-approved .sh-icon { width: 16px; height: 16px; }
.sv-commission-note { margin: 14px 0 21px; padding: 12px 15px; border-radius: 8px; background: var(--m-surface2); color: var(--m-muted); font-size: 12px; line-height: 1.8; }
.sv-commission-note output { font-weight: 650; color: var(--m-text); white-space: nowrap; }
.sv-sale-breakdown { border: 1px solid var(--m-line); border-radius: 10px; margin: 10px 0 12px; padding: 12px 18px; }
.sv-sale-breakdown > div { display: flex; justify-content: space-between; gap: 18px; padding: 7px 0; font-size: 13px; }
.sv-sale-breakdown dt { color: var(--m-muted); }
.sv-sale-breakdown dd { margin: 0; font-variant-numeric: tabular-nums; }
.sv-sale-breakdown > div:last-child { border-top: 1px solid var(--m-line); font-weight: 600; margin-top: 4px; padding-top: 12px; }
.sv-form [aria-busy=true] { cursor: progress; }
.sv-form [hidden] { display: none !important; }
:root[data-theme=light] .sv-status-approuve, :root[data-theme=light] .sv-status-approuvee { color: #225940; background: #e7f3eb; border-color: #8cb99c; }
:root[data-theme=light] .sv-status-en_attente, :root[data-theme=light] .sv-status-soumise { color: #755422; background: #fbf1dd; border-color: #c9b07d; }
:root[data-theme=light] .sv-status-refuse, :root[data-theme=light] .sv-status-refusee, :root[data-theme=light] .sv-status-suspendu { color: #863d4d; background: #fbecef; border-color: #c894a0; }
:root[data-theme=light] .sv-approved, :root[data-theme=light] .sv-success { color: #225940; }
@media(max-width:900px) {
  .sv-onboarding { grid-template-columns: 1fr; gap: 22px; }
  .sv-onboarding-intro { max-width: none; padding: 0; }
  .sv-onboarding-intro h2 { max-width: 650px; }
  .sv-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 22px; }
  .sv-steps li { flex-direction: column; gap: 10px; }
  .sv-offer-row { grid-template-columns: 90px minmax(0,1fr) auto; gap: 15px; }
  .sv-offer-row .sv-row-actions { grid-column: 2/-1; flex-direction: row; justify-content: flex-end; }
  .sv-offer-image { grid-row: span 2; }
}
@media(max-width:650px) {
  .sv-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .sv-metrics > div { padding: 16px; }
  .sv-metrics strong { font-size: 25px; }
  .sv-dashboard-grid, .sv-payment-grid { grid-template-columns: 1fr; gap: 15px; }
  .sv-panel, .sv-form-card { padding: 19px; }
  .sv-notice-panel { padding: 17px; gap: 12px; }
  .sv-notice-mark { width: 32px; height: 32px; border-radius: 8px; }
  .sv-notice-panel h2 { font-size: 16px; }
  .sv-notice-panel p { font-size: 13px; }
  .sv-profile-actions { align-items: flex-start; flex-direction: column; gap: 16px; }
  .sv-section-heading { flex-wrap: wrap; gap: 14px; }
  .sv-section-heading h2 { font-size: 20px; }
  .sv-field-grid { grid-template-columns: 1fr; }
  .sv-field :is(input,select,textarea) { font-size: 16px; }
  .sv-image-choice { grid-template-columns: 1fr 130px; gap: 13px; align-items: end; }
  .sv-image-choice .sv-field select { font-size: 13px; }
  .sv-steps { grid-template-columns: 1fr; gap: 18px; }
  .sv-steps li { flex-direction: row; }
  .sv-public-profile { padding: 20px; gap: 16px; }
  .sv-shop-avatar { height: 56px; width: 56px; font-size: 25px; border-radius: 13px; }
  .sv-public-profile h2 { font-size: 24px; }
  .sv-offer-row { grid-template-columns: 70px minmax(0,1fr); gap: 12px; padding: 12px; }
  .sv-offer-image { height: 78px; grid-row: auto; }
  .sv-offer-copy h3 { font-size: 14px; }
  .sv-offer-price { grid-column: 2; text-align: left; display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
  .sv-offer-price strong { font-size: 17px; }
  .sv-offer-row .sv-row-actions { grid-column: 1/-1; justify-content: flex-end; padding-top: 10px; border-top: 1px solid var(--m-line); }
  .sv-sale-total { font-size: 23px; }
}
@media(max-width:390px) {
  .sv-image-choice { grid-template-columns: 1fr; }
  .sv-image-preview { width: 180px; }
  .sv-public-profile { flex-direction: column; }
  .sv-form-actions { flex-wrap: wrap; }
  .sv-form-actions > .sh-button { flex: 1; }
  .sv-stock-adjust { align-items: stretch; flex-direction: column; }
  .sv-checklist > div { flex-direction: column; gap: 5px; }
  .sv-checklist dd { text-align: left; }
}