:root {
  --accent: #f5a623;
  --accent-light: #ffd166;
  --accent-strong: #f59e0b;
  --accent-mid: #f0ad4e;
  --info: #4da3ff;
  --info-strong: #3b82f6;
  --info-light: #60a5fa;
  --success: #35d07f;
  --success-strong: #22c55e;
  --success-alt: #34c759;
  --success-dark: #28a745;
  --value: #5eead4;
  --value-strong: #2dd4bf;
  --danger: #ff6b6b;
  --danger-strong: #ef4444;
  --danger-dark: #c93f4d;
  --danger-light: #f87171;
  --danger-pale: #fca5a5;
  --white: #ffffff;
  --grey-50: #f9fafb;
  --grey-400: #9ca3af;
  --grey-450: #94a3b8;
  --grey-600: #4b5563;
  --grey-650: #475569;
  --grey-700: #374151;
  --grey-750: #343a44;
  --grey-800: #1f2937;
  --grey-900: #111827;

  --overlay-1: rgba(255, 255, 255, 0.06);
  --overlay-2: rgba(255, 255, 255, 0.10);
  --overlay-3: rgba(255, 255, 255, 0.18);

  --surface-01: #06213a;
  --surface-02: #062f2a;
  --surface-03: #0d1117;
  --surface-04: #0f1115;
  --surface-05: #0f766e;
  --surface-06: #111111;
  --surface-07: #146c43;
  --surface-08: #15181d;
  --surface-09: #151a21;
  --surface-10: #157347;
  --surface-11: #171b21;
  --surface-12: #171b22;
  --surface-13: #171c23;
  --surface-14: #172033;
  --surface-15: #181b21;
  --surface-16: #1b2028;
  --surface-17: #1d4ed8;
  --surface-18: #1e3a5f;
  --surface-19: #20242b;
  --surface-20: #20252d;
  --surface-21: #242931;
  --surface-22: #242a33;
  --surface-23: #243349;
  --surface-24: #30353d;
  --surface-25: #34291c;
  --surface-26: #3a0009;
  --surface-27: #3a2600;
  --surface-28: #3b414a;
  --surface-29: #3b4654;
  --surface-30: #451a03;
  --surface-31: #4a515c;
  --surface-32: #525659;
  --surface-33: #78350f;
  --surface-34: #7f1d1d;
  --surface-35: #92400e;
  --surface-36: #b51f2e;
}

:root {
  --red: var(--surface-36);
  --red-light: #d83a49;
  --bg: var(--surface-04);
  --panel: var(--surface-15);
  --panel2: var(--surface-19);
  --border: var(--surface-24);
  --text: #f5f5f6;
  --muted: #9ca2ab;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

body {
  min-height: 100vh;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  background: var(--surface-08);
  border-bottom: 1px solid var(--border);
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand h1 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
}

.brand img {
  max-height: 42px;
  width: auto;
}

main {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 22px;
}

.summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}

.summary-card {
  padding: 20px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.summary-card span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 14px;
}

.summary-card strong {
  font-size: 28px;
  color: var(--text);
}

.products {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}

.products-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid var(--border);
}

.products-header h3 {
  margin: 0;
  font-size: 18px;
}

.products-header span {
  color: var(--red-light);
  font-weight: 600;
}

.empty-state {
  padding: 60px 20px;
  text-align: center;
}

.empty-state h4 {
  margin: 0 0 10px;
  font-size: 20px;
}

.empty-state p {
  margin: 0 auto;
  max-width: 520px;
  color: var(--muted);
  line-height: 1.6;
}

footer {
  margin-top: auto;
  padding: 20px;
  text-align: center;
  color: var(--muted);
  border-top: 1px solid var(--border);
}

a {
  color: var(--red-light);
}

@media (max-width: 700px) {
  .summary {
    grid-template-columns: 1fr;
  }

  main {
    padding: 20px 14px;
  }

  .topbar {
    padding: 14px 16px;
  }
}

.product-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 20px;
  border-top: 1px solid var(--border);
}

.product-row:first-of-type {
  border-top: 0;
}

.product-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.product-ref {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.product-label {
  font-size: 17px;
  line-height: 1.3;
}

.product-qty {
  min-width: 90px;
  text-align: right;
}

.product-qty span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 2px;
}

.product-qty strong {
  font-size: 28px;
  line-height: 1;
}

.supplier-group {
  border-top: 1px solid var(--border);
}

.supplier-group:first-child {
  border-top: 0;
}

.supplier-header {
  padding: 14px 20px;
  background: var(--panel2);
  border-bottom: 1px solid var(--border);
}

.supplier-header h4 {
  margin: 0;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.supplier-group .product-row {
  padding-left: 24px;
  padding-right: 24px;
}
.supplier-group {
  margin-top: 18px;
  border-top: 1px solid var(--border);
}

.supplier-group:first-child {
  margin-top: 0;
  border-top: 0;
}

.supplier-header {
  padding: 14px 20px 10px;
}

.supplier-header h4 {
  margin: 0;
  color: var(--info);
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.product-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 14px 20px;
  border-top: 1px solid var(--border);
}

.product-info {
  flex: 1;
  min-width: 0;
}

.product-label {
  display: block;
  font-size: 16px;
  line-height: 1.3;
}

.product-qty {
  min-width: 120px;
  text-align: right;
}

.product-qty span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 3px;
}

.product-qty strong {
  display: block;
  font-size: 24px;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .product-qty {
    min-width: 80px;
  }

  .product-qty strong {
    font-size: 17px;
  }

  .product-qty span {
    font-size: 11px;
  }

  .product-row {
    gap: 12px;
    padding: 14px 16px;
  }

  .product-label {
    font-size: 14px;
  }
}

.product-label {
  font-size: 17px;
  font-weight: 800;
}

.product-clients {
  margin-top: 6px;
}

.client-line {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.4;
}

.client-line::before {
  content: '• ';
}
.product-clients {
  margin-top: 6px;
}

.client-line {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-left: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.client-line::before {
  content: '•';
}

.client-qty {
  color: var(--white);
  font-weight: 700;
  margin-left: 6px;
}

.tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--border);
}

.tab-button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
  padding: 14px 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  border-radius: 0;
}

.tab-button.active {
  color: var(--info);
  border-bottom-color: var(--info);
  background: rgba(77, 163, 255, 0.04);
}

@media (max-width: 700px) {
  .product-row {
    display: block;
    padding: 18px 16px;
  }

  .product-info {
    width: 100%;
    min-width: 0;
  }

  .product-label {
    display: block;
    width: 100%;
    word-break: normal;
    overflow-wrap: break-word;
    line-height: 1.3;
  }

  .product-clients {
    margin-top: 10px;
  }

  .client-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
  }

  .client-line span {
    min-width: 0;
  }

  .client-qty {
    flex-shrink: 0;
  }

  .product-actions {
    width: 100%;
    margin-top: 16px;
  }

  .product-qty {
    text-align: left;
    margin-bottom: 12px;
  }

.pick-controls {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 100%;
}

  .pick-controls label {
    flex: 1;
    min-width: 0;
  }

  .pick-weight {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-top: 5px;
  }

  .pick-button,
.missing-button {
  width: 100%;
  min-height: 40px;
  flex-shrink: 0;
}

.missing-button {
  background: transparent;
  color: var(--white);
  border: 1px solid var(--border);
}

#tab-active .missing-button.is-missing {
  background: var(--danger-dark) !important;
  color: var(--white) !important;
  border-color: var(--danger-dark) !important;
}
}

@media (max-width: 700px) {
  .client-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 4px 0;
  }

  .client-name {
    min-width: 0;
    text-align: left;
    overflow-wrap: break-word;
  }

  .client-qty {
    white-space: nowrap;
    font-weight: 700;
  }

  .client-weight-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  .client-weight {
    width: 72px;
    box-sizing: border-box;
    padding: 6px 8px;
  }

  .client-weight-wrap span {
    white-space: nowrap;
  }
}

@media (max-width: 700px) {
  .picked-client-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
  }

  .client-actual-weight {
    white-space: nowrap;
    font-weight: 700;
  }
}

.picked-client-header,
.picked-client-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 100px 100px;
  gap: 12px;
  align-items: center;
}

.picked-client-header {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
}

.picked-client-line {
  padding: 5px 0;
}

.picked-client-line .client-name {
  text-align: left;
}

.picked-client-line .client-qty,
.picked-client-line .client-actual-weight {
  text-align: left;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .picked-client-header,
  .picked-client-line {
    grid-template-columns: minmax(0, 1fr) 78px 72px;
    gap: 8px;
  }

  .picked-client-header {
    font-size: 11px;
  }

  .picked-client-line .client-name {
    overflow-wrap: break-word;
  }
}

@media (min-width: 701px) {
  .picked-client-header,
  .picked-client-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px 150px;
    gap: 20px;
    align-items: center;
  }

  .picked-client-header {
    padding-left: 18px;
    margin-bottom: 8px;
  }

  .picked-client-line {
    position: relative;
    padding: 6px 0 6px 18px;
  }

  .picked-client-line::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    content: '•';
  }

  .picked-client-line .client-name {
    grid-column: 1;
    text-align: left;
    min-width: 0;
  }

  .picked-client-line .client-qty {
    grid-column: 2;
    text-align: left;
    white-space: nowrap;
  }

  .picked-client-line .client-actual-weight {
    grid-column: 3;
    text-align: left;
    white-space: nowrap;
  }
}

@media (max-width: 700px) {
  .picked-client-line {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 78px 72px;
    gap: 8px;
    align-items: center;
    padding: 6px 0 6px 16px;
  }

  .picked-client-line::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    content: '•';
  }

  .picked-client-line .client-name {
    grid-column: 1;
    text-align: left;
    min-width: 0;
  }

  .picked-client-line .client-qty {
    grid-column: 2;
    text-align: left;
    white-space: nowrap;
  }

  .picked-client-line .client-actual-weight {
    grid-column: 3;
    text-align: left;
    white-space: nowrap;
  }

  .picked-client-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 78px 72px;
    gap: 8px;
    padding-left: 16px;
    margin-bottom: 6px;
  }
}

.picked-weight-edit {
  display: flex;
  align-items: center;
  gap: 6px;
}

.picked-weight-input {
  width: 80px;
  box-sizing: border-box;
  padding: 6px 8px;
}

.picked-weight-edit span {
  white-space: nowrap;
}

.save-weight-button {
  margin-top: 10px;
  margin-right: 8px;
}

@media (max-width: 700px) {
  .picked-weight-input {
    width: 64px;
  }

  .save-weight-button,
  .unpick-button {
    width: 100%;
    margin-right: 0;
  }

  .save-weight-button {
    margin-bottom: 8px;
  }
}

/* Alignement clients + quantité + poids dans À ramasser */
@media (min-width: 701px) {
  #tab-active .client-line {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px 160px;
    gap: 20px;
    align-items: center;
    padding: 6px 0 6px 18px;
  }

  #tab-active .client-line::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  #tab-active .client-name {
    grid-column: 1;
    text-align: left;
  }

  #tab-active .client-qty {
    grid-column: 2;
    text-align: left;
    white-space: nowrap;
  }

  #tab-active .client-weight-wrap {
  grid-column: 3;
  display: flex;
  align-items: center;
  gap: 5px;
  transform: translateX(-35px);
}
}

@media (max-width: 700px) {
  #tab-active .client-line {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 78px 76px;
    gap: 8px;
    align-items: center;
    padding: 7px 0 7px 16px;
  }

  #tab-active .client-line::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  #tab-active .client-name {
    grid-column: 1;
    min-width: 0;
    text-align: left;
    overflow-wrap: break-word;
  }

  #tab-active .client-qty {
    grid-column: 2;
    text-align: left;
    white-space: nowrap;
  }

 #tab-active .client-weight-wrap {
  grid-column: 3;
  display: flex;
  align-items: center;
  gap: 3px;
  }
}

@media (max-width: 700px) {
  .client-weight,
  .pick-weight,
  .picked-weight-input {
    font-size: 16px;
  }
}

.supplier-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 0;
  background: var(--surface-20);
  color: var(--info);
  padding: 14px 18px;
  cursor: pointer;
  text-align: left;
}

.supplier-name {
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
}

.supplier-arrow {
  font-size: 14px;
  margin-left: 15px;
}

.supplier-products {
  display: none;
}

/* Groupe À DÉCOUPER */

.cutting-toggle {
  background: var(--surface-25);
  color: var(--accent-mid);
}

.cutting-products {
  display: none;
}

.cutting-row {
  padding: 14px 18px;
  border-bottom: 1px solid var(--overlay-2);
}

.cutting-product-label {
  display: block;
  font-size: 16px;
  margin-bottom: 5px;
}

.cutting-variant {
  color: var(--accent-mid);
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 10px;
}

.cutting-client-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  gap: 12px;
  align-items: center;
  padding: 4px 0;
}

@media (max-width: 700px) {
  .cutting-client-line {
    grid-template-columns: minmax(0, 1fr) 85px;
    gap: 8px;
  }
}

.cutting-icon {
  margin-left: 8px;
  font-size: 20px;
  vertical-align: middle;
}

.supplier-sms-button {
  margin: 8px 18px;
  padding: 7px 12px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: transparent;
  color: var(--info);
  font-weight: 700;
  cursor: pointer;
}

.supplier-sms-box {
  padding: 0 18px 14px;
}

.supplier-sms-text {
  width: 100%;
  min-height: 180px;
  box-sizing: border-box;
  padding: 12px;
  resize: vertical;
  font-size: 15px;
  line-height: 1.5;
}

.copy-sms-button {
  margin-top: 8px;
}

/* Header compact */

.compact-topbar {
  padding: 12px 18px;
}

.compact-brand {
  gap: 12px;
}

.compact-brand .logo {
  flex-shrink: 0;
}

.brand-text h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.brand-text span {
  display: block;
  margin-top: 3px;
  color: var(--red-light);
  font-size: 13px;
  font-weight: 700;
}

.compact-refresh {
  padding: 8px 12px;
  font-size: 13px;
}

/* Compteurs compacts */

.compact-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 6px;
}

.compact-summary-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 9px;
}

.compact-summary-card span {
  margin: 0;
  font-size: 13px;
}

.compact-summary-card strong {
  font-size: 20px;
}

@media (max-width: 700px) {
  .compact-topbar {
    padding: 10px 12px;
  }

  .brand-text h1 {
    font-size: 16px;
  }

  .brand-text span {
    font-size: 12px;
  }

  .compact-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
  }

  .compact-summary-card {
    padding: 9px 10px;
  }

  .compact-summary-card strong {
    font-size: 18px;
  }
}

.compact-topbar {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 110px;
  gap: 12px;
}

.topbar-left {
  justify-self: start;
}

.topbar-center {
  justify-self: center;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.topbar-center h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.topbar-center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: max-content;
}

.topbar-right {
  justify-self: end;
}

.centered-products-header {
  justify-content: center;
  text-align: center;
}

.centered-products-header h3 {
  width: 100%;
  text-align: center;
}

@media (max-width: 700px) {
  .compact-topbar {
    grid-template-columns: auto 1fr auto;
    gap: 8px;
  }

  .topbar-center h1 {
    font-size: 16px;
  }

  .topbar-center span {
    font-size: 12px;
  }
}
/* ===== HEADER MFS FINAL ===== */

.compact-topbar {
  min-height: 92px;
  padding: 10px max(22px, calc((100vw - 1200px) / 2));
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.mfs-logo {
  display: block;
  width: 64px !important;
  height: 64px !important;
  max-width: 64px !important;
  max-height: 64px !important;
  object-fit: contain;
}

.topbar-center h1 {
  margin: 0;
  font-size: 22px;
  line-height: 1.15;
}

.topbar-center span {
  margin-top: 8px;
  font-size: 13px;
}

.compact-refresh {
  justify-self: end;
  padding: 7px 12px;
  font-size: 12px;
}

@media (max-width: 700px) {
  .compact-topbar {
    min-height: 76px;
    padding: 8px 12px;
    grid-template-columns: 72px 1fr 72px;
  }

  .mfs-logo {
    width: 56px !important;
    height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
  }

  .topbar-center h1 {
    font-size: 17px;
  }

  .topbar-center span {
    margin-top: 5px;
    font-size: 12px;
  }
}

.supplier-bar .supplier-sms-button {
  flex-shrink: 0;
  margin: 6px 10px 6px 0;
  padding: 0 16px;

  background: transparent;
  color: var(--success-dark);

  border: 1px solid var(--success-dark);
  border-radius: 7px;

  font-weight: 800;
  cursor: pointer;
}

.supplier-bar .supplier-sms-button:hover {
  background: rgba(40, 167, 69, 0.1);
  color: var(--success-alt);
  border-color: var(--success-alt);
}

.supplier-bar .supplier-sms-button:active {
  background: rgba(40, 167, 69, 0.18);
}

.supplier-bar .supplier-sms-button:hover {
  background: var(--surface-10);
}

.supplier-bar .supplier-sms-button:active {
  background: var(--surface-07);
}

.supplier-bar {
  display: flex !important;
  align-items: center;
  width: 100%;
  flex-wrap: nowrap;
}

.supplier-bar .supplier-toggle {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

.supplier-bar .supplier-sms-button {
  flex: 0 0 auto;
  width: auto;
  margin: 6px 10px 6px 8px;

  padding: 7px 14px;
  background: transparent;
  color: var(--success-dark);

  border: 1px solid var(--success-dark);
  border-radius: 7px;

  font-weight: 800;
  cursor: pointer;
}
.tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  border-bottom: 1px solid var(--border);
  background: var(--panel2);
}

.tab-button {
  position: relative;
  min-width: 0;
  min-height: 52px;

  padding: 12px 8px;

  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;

  background: transparent;
  color: var(--muted);

  font-size: 14px;
  font-weight: 800;
  text-align: center;

  cursor: pointer;
}

/* À RAMASSER */
.tab-button:nth-child(1).active {
  color: var(--info);
  border-bottom-color: var(--info);
  background: rgba(77, 163, 255, 0.08);
}

/* RAMASSÉS */
.tab-button:nth-child(2).active {
  color: var(--success-alt);
  border-bottom-color: var(--success-alt);
  background: rgba(52, 199, 89, 0.08);
}

/* À DÉCOUPER */
.tab-button:nth-child(3).active {
  color: var(--accent-mid);
  border-bottom-color: var(--accent-mid);
  background: rgba(240, 173, 78, 0.08);
}

/* Téléphone */
@media (max-width: 700px) {
  .tab-button {
    min-height: 54px;
    padding: 10px 4px;
    font-size: 12px;
    line-height: 1.15;
  }
}

/* Client dans l'onglet RAMASSÉS */
.picked-row .client-name {
  color: var(--success-alt);
  font-weight: 700;
}
#tab-active .product-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 18px;
  align-items: center;
}

#tab-active .product-info {
  min-width: 0;
}

#tab-active .product-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 10px;
  width: 180px;
}

#tab-active .product-qty {
  width: 100%;
  min-width: 0;
  margin: 0;
  text-align: center;
}

#tab-active .product-qty strong {
  font-size: 20px;
}

#tab-active .pick-controls {
  width: 100%;
}

#tab-active .pick-button,
#tab-active .missing-button {
  width: 100%;
  min-height: 42px;
  padding: 9px 10px;
  font-weight: 800;
}

/* Mobile */
@media (max-width: 700px) {
  #tab-active .product-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 6px;
    align-items: center;
    padding: 14px 10px;
  }

  #tab-active .product-info {
    min-width: 0;
    padding-right: 4px;
  }

  #tab-active .client-line {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
  }

  #tab-active .client-name {
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    font-size: 13px;
    line-height: 1.25;
  }

  #tab-active .product-actions {
    width: 92px;
    margin: 0;
    gap: 7px;
  }

  #tab-active .product-qty {
    width: 100%;
    margin: 0;
    text-align: center;
  }

  #tab-active .product-qty span {
    font-size: 10px;
  }

  #tab-active .product-qty strong {
    font-size: 15px;
    white-space: nowrap;
  }

  #tab-active .pick-controls {
    width: 100%;
    margin: 0;
  }

 #tab-active .pick-button,
#tab-active .missing-button {
    width: 100%;
    min-height: 38px;
    padding: 7px 3px;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
  }
}
/* Client dans l'onglet À ramasser */
#tab-active .client-name {
  color: #b3352c !important;
  font-weight: 600;
}

:root[data-theme="light"] #tab-active .client-name {
  color: #8e2a20 !important;
}

/* Séparation des blocs dans À découper */
#tab-cutting .cutting-row {
  border-bottom: 2px solid #59616c !important;
  padding-bottom: 18px;
  margin-bottom: 18px;
}

#tab-cutting .cutting-row:last-child {
  border-bottom: none !important;
}
/* Mise à jour manuelle Dolibarr */

.dolibarr-refresh-zone {
  display: flex;
  justify-content: center;
  padding: 24px 16px 8px;
}

.dolibarr-refresh-button {
  padding: 9px 14px;

  background: transparent;
  color: var(--muted);

  border: 1px solid var(--border);
  border-radius: 7px;

  font-size: 11px;
  font-weight: 700;

  cursor: pointer;
}

.dolibarr-refresh-button:hover {
  color: var(--info);
  border-color: var(--info);
}

.dolibarr-refresh-button:disabled {
  opacity: 0.5;
  cursor: wait;
}
/* Etat de synchronisation */

.sync-status {
  margin-bottom: 4px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  text-align: right;
}

.sync-ok {
  color: #57c785;
}

.sync-offline {
  color: var(--danger);
}

.sync-pending {
  color: #f0a84b;
}

.sync-status {
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  background: transparent !important;
  border: 0 !important;
  padding: 0;
}

.sync-ok {
  color: #57c785;
}

.sync-offline {
  color: var(--danger);
}

.sync-pending {
  color: #f0a84b;
}
/* ==================================================
   HEADER - CORRECTION FINALE
   ================================================== */

.compact-topbar {
  position: relative;
  display: grid !important;
  grid-template-columns: 80px 1fr 80px !important;
  align-items: center;
  width: 100%;
}

.topbar-left {
  grid-column: 1;
  justify-self: start;
}

.topbar-center {
  grid-column: 1 / 4;
  grid-row: 1;
  justify-self: center;
  align-self: center;

  display: flex !important;
  flex-direction: column;
  align-items: center;

  visibility: visible !important;
  opacity: 1 !important;

  width: max-content;
  text-align: center;
  pointer-events: none;
}

.topbar-center h1 {
  display: block !important;
  margin: 0;
  color: var(--text);
}

.topbar-center span {
  display: block !important;
  margin-top: 5px;
  color: var(--red-light);
}

.topbar-right {
  grid-column: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-self: end;
  gap: 5px;
}

.sync-status {
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .compact-topbar {
    grid-template-columns: 64px minmax(0, 1fr) 64px !important;
    padding: 8px 12px;
  }

  .topbar-center h1 {
    font-size: 17px;
    line-height: 1.15;
    white-space: normal;
  }

  .topbar-center span {
    font-size: 12px;
  }

  .compact-refresh {
    padding: 6px 9px;
    font-size: 11px;
  }
}
.page-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;

  display: none;
  width: 0;
  height: 3px;

  background: var(--info);
  box-shadow: 0 0 8px rgba(77, 163, 255, 0.7);

  transition: width 0.25s ease;
}
.compact-summary-card {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}

.compact-summary-card span {
  margin: 0 !important;
}

.compact-summary-card strong {
  width: 100%;
  text-align: center;
  justify-self: stretch;
}
.topbar-center .sync-status {
  text-align: center;
  margin-bottom: 4px;
}

.product-supplier-choice {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}

.product-supplier-choice select {
  max-width: 180px;
  padding: 5px 7px;
  background: var(--panel2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 12px;
}

.product-supplier-choice {
  position: relative;
  margin-top: 6px;
}

.supplier-choice-button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--info);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.supplier-choice-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 50;

  min-width: 180px;
  margin-top: 4px;
  padding: 4px;

  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 7px;
}

.supplier-choice-option {
  display: block;
  width: 100%;

  padding: 8px 10px;

  border: 0;
  background: transparent;
  color: var(--text);

  text-align: left;
  font-size: 12px;
  cursor: pointer;
}

.supplier-choice-option:hover {
  background: rgba(77, 163, 255, 0.08);
}

/* ===== DECOUPE ===== */

.decoupe-new-sheet {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  align-items: end;
  gap: 16px;
  padding: 20px;
}

.decoupe-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.decoupe-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.decoupe-field input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;

  background: var(--panel2);
  color: var(--text);

  border: 1px solid var(--border);
  border-radius: 8px;

  font-size: 16px;
}

@media (max-width: 700px) {
  .decoupe-new-sheet {
    grid-template-columns: 1fr;
  }
}
/* Logo uniquement page Découpe */
.decoupe-logo {
  display: block !important;
  width: 72px !important;
  height: 72px !important;
  max-width: 72px !important;
  max-height: 72px !important;
  object-fit: contain !important;
}

@media (max-width: 700px) {
  .decoupe-logo {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;
    max-height: 60px !important;
  }
}
/* ===== FICHE DECOUPE ===== */

.decoupe-sheet {
  padding: 20px;
  border-top: 1px solid var(--border);
}

.decoupe-sheet-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;

  margin-bottom: 20px;
  padding: 14px 16px;

  background: var(--panel2);
  border-radius: 8px;
}

.decoupe-sheet-header div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.decoupe-sheet-header span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.decoupe-sheet-header strong {
  font-size: 17px;
}

.decoupe-line {
  display: grid;
  grid-template-columns:
    minmax(160px, 2fr)
    minmax(90px, 1fr)
    minmax(110px, 1fr)
    minmax(150px, 1.5fr)
    minmax(100px, 1fr)
    minmax(150px, 1.5fr);

  gap: 10px;
  margin-bottom: 12px;
  padding: 14px;

  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 9px;
}

.decoupe-line label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.decoupe-line label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.decoupe-line input {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 9px 10px;

  background: var(--panel);
  color: var(--text);

  border: 1px solid var(--border);
  border-radius: 7px;

  font-size: 16px;
}

.decoupe-add-line {
  width: 100%;
  min-height: 46px;
  margin-top: 4px;

  background: transparent;
  color: var(--info);

  border: 1px dashed var(--info);
  border-radius: 8px;

  font-weight: 800;
  cursor: pointer;
}

@media (max-width: 700px) {
  .decoupe-line {
    grid-template-columns: 1fr 1fr;
  }

  .decoupe-sheet-header {
    flex-direction: column;
  }
}

.decoupe-save-sheet {
  width: 100%;
  min-height: 46px;
  margin-top: 10px;

  background: #198754;
  color: var(--white);

  border: 0;
  border-radius: 8px;

  font-weight: 800;
  cursor: pointer;
}

.decoupe-saved-sheets {
  margin-top: 24px;
  padding: 20px;
  border-top: 1px solid var(--border);
}

.decoupe-saved-sheets h3 {
  margin: 0 0 14px;
}

.decoupe-saved-sheet {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  padding: 12px 0;

  border-bottom: 1px solid var(--border);
}

.decoupe-saved-sheet-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.decoupe-saved-sheet-info span {
  color: var(--muted);
  font-size: 12px;
}

.decoupe-open-sheet {
  flex-shrink: 0;

  padding: 7px 12px;

  background: transparent;
  color: var(--info);

  border: 1px solid var(--info);
  border-radius: 7px;

  font-weight: 800;
  cursor: pointer;
}

.decoupe-photo-preview {
  display: block;
  width: 100%;
  max-width: 180px;
  max-height: 120px;
  margin-top: 8px;

  object-fit: cover;

  border: 1px solid var(--border);
  border-radius: 7px;
}

/* ===== DECOUPE - ALIGNEMENT DES CHAMPS ===== */

.decoupe-line input {
  text-align: center;
}

.decoupe-line input::placeholder {
  text-align: center;
}

/* Taux de perte */

.decoupe-loss {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  min-height: 70px;
  padding: 8px 10px;

  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 7px;

  text-align: center;
}

.decoupe-loss span {
  display: block;
  margin-bottom: 7px;

  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.decoupe-loss-rate {
  display: block;

  font-size: 22px;
  font-weight: 800;
  line-height: 1;

  text-align: center;
}
/* ===== DECOUPE - BLOC NOUVELLE FICHE ===== */

.products-header {
  text-align: center;
}

.products-header h3 {
  width: 100%;
  text-align: center;
}

.decoupe-new-sheet {
    border: 3px solid var(--info);
  border-radius: 10px;
}

/* ===== DECOUPE - CORRECTION CHAMP DATE MOBILE ===== */

.decoupe-field {
  width: 100%;
  box-sizing: border-box;
}

.decoupe-field input {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#decoupe-date {
  display: block;
  min-width: 0;
}

#decoupe-date {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;

  appearance: none;
  -webkit-appearance: none;

  display: block;
}
.decoupe-new-sheet {
  overflow: hidden;
}

.decoupe-close-sheet {
  width: 100%;
  min-height: 46px;
  margin-top: 8px;

  background: transparent;
  color: var(--danger);

  border: 1px solid var(--danger);
  border-radius: 8px;

  font-weight: 800;
  cursor: pointer;
}

/* ===== DECOUPE - FICHES PAR DATE ===== */

.decoupe-date-group {
  margin-bottom: 10px;
}

.decoupe-date-button {
  position: relative;

  width: 100%;
  padding: 14px 38px 14px 14px;

  background: var(--panel);
  color: inherit;

  border: 2px solid var(--border);
  border-radius: 9px;

  text-align: left;
  cursor: pointer;
}

.decoupe-date-title {
  display: block;

  font-size: 15px;
  font-weight: 800;
}

.decoupe-date-summary {
  display: block;
  margin-top: 5px;

  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.decoupe-date-arrow {
  position: absolute;
  right: 14px;
  top: 50%;

  transform: translateY(-50%);

  font-size: 13px;
}

.decoupe-date-sheets {
  padding: 4px 10px 8px;
}

.decoupe-delete-sheet {
  flex-shrink: 0;
  padding: 7px 12px;

  background: transparent;
  color: var(--danger);

  border: 1px solid var(--danger);
  border-radius: 7px;

  font-weight: 800;
  cursor: pointer;
}
/* ===== DECOUPE - BOUTONS DATES ===== */

.decoupe-date-button {
  border-color: #2563eb;
}

.decoupe-date-title {
  color: var(--info-light);
}

.decoupe-date-arrow {
  color: var(--info-light);
}

/* Journées à l'intérieur des menus mensuels */

.decoupe-month-days
  > .decoupe-date-group
  > .decoupe-date-button {
  border-color: var(--info);
  background: rgba(77, 163, 255, 0.06);
}

.decoupe-month-days
  > .decoupe-date-group
  > .decoupe-date-button
  .decoupe-date-title {
  color: #8bc2ff;
}

.decoupe-month-days
  > .decoupe-date-group
  > .decoupe-date-button
  .decoupe-date-arrow {
  color: #8bc2ff;
}


.decoupe-date-count {
  color: var(--white);
}

.decoupe-date-weight {
  color: var(--danger);
}

.decoupe-sheet-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  min-width: 90px;
}

.decoupe-sheet-actions .decoupe-delete-sheet {
  grid-column: 1 / -1;
  justify-self: end;
  width: auto;
  margin-top: 8px;
  padding: 4px 8px;
  font-size: 10px;
  opacity: 0.75;
}

.decoupe-sheet-actions {
  align-items: center;
}

.decoupe-sheet-actions button {
  width: 100%;
  min-width: 0;
}

.decoupe-client-open {
  display: block;

  padding: 0;
  margin: 0 0 4px 0;

  background: transparent;
  border: 0;

  color: var(--white);

  font: inherit;
  font-weight: 800;
  text-align: left;

  cursor: pointer;
}

.decoupe-client-open:active {
  opacity: 0.65;
}
.decoupe-photo-delete {
  margin-top: 8px;
  padding: 5px 8px;

  background: transparent;
  color: var(--danger);

  border: 1px solid var(--danger);
  border-radius: 6px;

  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

/* ===== DECOUPE - LIGNES PLUS VISIBLES ===== */

.decoupe-line {
  border: 2px solid var(--surface-29);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 16px;

  box-shadow:
    0 0 0 1px var(--overlay-1),
    0 4px 14px rgba(0, 0, 0, 0.18);
}

/* ===== DECOUPE - BARRE ENREGISTREMENT ===== */

.decoupe-save-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;

  display: none;
  width: 0;
  height: 4px;

  background: var(--info);

  box-shadow: 0 0 8px rgba(77, 163, 255, 0.7);

  transition: width 0.25s ease;
}
/* ===== DECOUPE - ENTETE FICHE CENTREE ===== */

.decoupe-sheet-header {
  justify-content: center;
  text-align: center;
}

.decoupe-sheet-header > div {
  align-items: center;
  text-align: center;
  min-width: 140px;
}

#decoupe-sheet-client,
#decoupe-sheet-date {
  text-align: center;
}

/* ===== DECOUPE - IPAD / TABLETTE ===== */

@media screen and (min-width: 1200px) and (max-width: 1400px) {
  .container {
    max-width: 1320px;
    padding-left: 18px;
    padding-right: 18px;
  }

  .decoupe-new-sheet {
    grid-template-columns: 220px minmax(320px, 1fr) 220px;
    gap: 18px;
    align-items: end;
  }

  .decoupe-sheet {
    padding: 20px;
  }

  .decoupe-sheet-header {
    justify-content: center;
    gap: 90px;
    text-align: center;
  }

  .decoupe-sheet-header > div {
    min-width: 220px;
    align-items: center;
    text-align: center;
  }

  .decoupe-line {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px !important;
    padding: 20px !important;
    margin-bottom: 22px !important;

    border: 2px solid var(--surface-29) !important;
    border-radius: 12px !important;
  }

  .decoupe-line label {
    min-width: 0;
  }

  .decoupe-line input {
    min-height: 48px;
    font-size: 16px;
    text-align: center;
  }

  .decoupe-loss {
    min-height: 76px;
  }

  .decoupe-loss-rate {
    font-size: 24px;
  }

  .decoupe-photo-preview {
    max-width: 260px;
    max-height: 190px;
    margin-left: auto;
    margin-right: auto;
  }

  .decoupe-photo-field {
    align-items: center;
    text-align: center;
  }

  .decoupe-add-line,
  .decoupe-save-sheet,
  .decoupe-close-sheet {
    min-height: 50px;
  }

  .decoupe-date-button {
    padding: 16px 44px 16px 18px;
  }

  .decoupe-saved-sheet {
    padding: 16px 10px;
  }

  .decoupe-sheet-actions {
    min-width: 100px;
  }

  .decoupe-client-open {
    font-size: 16px;
  }
}

.mfs-module-nav {
  display: flex;
  justify-content: center;
  gap: 8px;

  padding: 12px 16px;

  background: var(--surface-08);
  border-bottom: 1px solid var(--border);
}

.mfs-module-link {
  min-width: 120px;
  padding: 9px 16px;

  color: var(--muted);
  background: transparent;

}

/* ===== RAMASSE - LISTE LIVRAISON ===== */

.ramasse-date {
  color: var(--accent) !important;
}

.delivery-list {
  display: block !important;
  padding: 0;
  overflow: hidden;
}

.delivery-list-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.delivery-list-summary::-webkit-details-marker {
  display: none;
}

.delivery-list-summary::before {
  content: "▶";
  color: var(--accent);
  font-size: 13px;
}

.delivery-list[open] > .delivery-list-summary::before {
  content: "▼";
}

.delivery-list-summary span {
  margin: 0 !important;
    color: var(--accent);
  font-size: 15px;
  font-weight: 800;
  text-transform: uppercase;
}

.delivery-list-summary strong {
  width: auto !important;
  justify-self: end !important;
  color: var(--text);
  font-size: 15px !important;
  text-align: right !important;
}

.delivery-clients {
  display: block;
  width: 100%;
  border-top: 1px solid var(--border);
}

.delivery-client-card {
  display: block;
  width: 100%;
  border-bottom: 1px solid var(--border);
}

.delivery-client-card:last-child {
  border-bottom: 0;
}

.delivery-client-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
  background: rgba(77, 163, 255, 0.04);
}

.delivery-client-summary::-webkit-details-marker {
  display: none;
}

.delivery-client-summary::before {
  content: "▶";
  color: var(--accent-light);
  font-size: 12px;
}

.delivery-client-card.is-delivered
  > .delivery-client-summary::before {
  color: var(--success);
}

.delivery-client-card[open]
  > .delivery-client-summary::before {
  content: "▼";
}

.delivery-client-summary strong {
  width: auto !important;
  justify-self: start !important;
  color: var(--accent-light);
  font-size: 16px !important;
  text-align: left !important;
}

.delivery-client-actions {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin: 0 !important;
}

.delivery-order-button,
.delivery-done-button {
  min-width: 34px;
  min-height: 32px;
  padding: 5px 9px;

  background: transparent;
  color: var(--muted);

  border: 1px solid var(--border);
  border-radius: 7px;

  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.delivery-order-button:hover {
  color: var(--accent-light);
  border-color: var(--accent-light);
}

.delivery-done-button {
  min-width: 70px;
}

.delivery-done-button.is-delivered {
  color: var(--success);
  border-color: var(--success);
  background: rgba(53, 208, 127, 0.08);
}

.delivery-client-name.is-delivered {
  color: var(--success) !important;
}

@media (max-width: 700px) {
  .delivery-client-summary {
    grid-template-columns:
      auto minmax(0, 1fr) auto;
    gap: 7px;
  }

  .delivery-order-button,
  .delivery-done-button {
    min-height: 30px;
    padding: 4px 7px;
  }

  .delivery-done-button {
    min-width: 60px;
    font-size: 11px;
  }
}

.delivery-products {
  display: block;
  width: 100%;
}

.delivery-product {
  display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 14px;
  align-items: center;
  padding: 11px 18px 11px 38px;
  border-top: 1px solid var(--border);
}

.delivery-product strong {
  grid-column: 2;
  width: auto !important;
  justify-self: start !important;
  color: var(--text);
  font-size: 15px !important;
  text-align: left !important;
}

.delivery-product span {
  grid-column: 1;
  grid-row: 1;
  margin: 0 !important;
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}

.delivery-product small {
  grid-column: 1 / -1;
  color: var(--red-light);
  font-size: 13px;
  font-weight: 700;
}

@media (max-width: 700px) {
  .delivery-product {
    padding-left: 26px;
  }

  .delivery-list-summary,
  .delivery-client-summary {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.mfs-module-link {
  border: 1px solid var(--border);
  border-radius: 8px;

  font-size: 12px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.mfs-module-link.active {
  color: var(--white);
  border-color: var(--info);
  background: rgba(77, 163, 255, 0.1);
}

/* ===== NAVIGATION RAMASSE / DECOUPE ===== */

.mfs-module-nav .mfs-module-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 120px;
  padding: 9px 16px;

  color: var(--muted) !important;
  background: transparent !important;

  border: 2px solid var(--border) !important;
  border-radius: 8px;

  font-size: 12px;
  font-weight: 800;
  text-align: center;
  text-decoration: none !important;
}

/* Onglet actuellement sélectionné */
.mfs-module-nav .mfs-module-link.active {
  color: var(--white) !important;
  border-color: var(--info) !important;
  background: rgba(77, 163, 255, 0.12) !important;
}

/* Commentaire ligne de commande */
.product-comment {
  margin-top: 4px;
  margin-bottom: 8px;
  color: var(--accent-mid);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}

/* Etat MANQUANT - priorité finale */
#tab-active button.missing-button.is-missing {
  background-color: var(--danger-dark) !important;
  background: var(--danger-dark) !important;
  color: var(--white) !important;
  border: 1px solid var(--danger-dark) !important;
  opacity: 1 !important;
}

#tab-cutting .product-comment.cutting-comment {
  color: var(--danger) !important;
  font-weight: 700;
}

/* ===== APERÇU PDF DÉCOUPE ===== */

.decoupe-pdf-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 20px;
  background: rgba(0, 0, 0, 0.85);
}

.decoupe-pdf-window {
  position: relative;

  display: flex;
  flex-direction: column;
  align-items: center;

  width: min(900px, 100%);
  height: min(92vh, 1100px);

  padding: 50px 16px 16px;

  background: var(--surface-08);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.decoupe-pdf-frame {
  display: block;

  width: 100%;
  flex: 1;

  margin: 0 auto;

  background: var(--white);
  border: 0;
  border-radius: 6px;
}

.decoupe-pdf-close {
  position: absolute;
  top: 10px;
  right: 12px;

  width: 34px;
  height: 34px;
  padding: 0;

  color: var(--white);
  background: var(--danger-dark);

  border: 0;
  border-radius: 50%;

  font-size: 18px;
  font-weight: 800;
  line-height: 34px;
  text-align: center;
  cursor: pointer;
}

.decoupe-pdf-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 44px;
  margin-top: 12px;
  padding: 10px 18px;

  color: var(--white);
  background: var(--info);

  border-radius: 8px;

  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

/* Téléphone */
@media (max-width: 700px) {
  .decoupe-pdf-modal {
    padding: 8px;
  }

  .decoupe-pdf-window {
    width: 100%;
    height: 96vh;
    padding: 48px 8px 10px;
  }

  .decoupe-pdf-download {
    width: 100%;
  }
}

.decoupe-pdf-pages {
  width: 100%;
  flex: 1;
  min-height: 0;
  overflow: auto;
  text-align: center;
  -webkit-overflow-scrolling: touch;
}

.decoupe-pdf-canvas {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 12px;
  background: var(--white);
}

/* =========================
   DASHBOARD
   ========================= */

.dashboard-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
}

.dashboard-page h1 {
  margin: 0 0 24px;
  font-size: 28px;
  text-align: center;
}

.dashboard-section {
  margin-bottom: 32px;
}

.dashboard-section h2 {
  margin: 0 0 16px;
  font-size: 20px;
}

.dashboard-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}

.dashboard-cards-centered {
  display: flex;
  justify-content: center;
  gap: 14px;
}

.dashboard-cards-centered .dashboard-card {
  width: calc((100% - 28px) / 3);
}

.dashboard-card {
  padding: 16px;
  border: 1px solid var(--overlay-3);
  border-radius: 12px;
  background: var(--overlay-1);
}

.dashboard-card span {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  opacity: 0.75;
}

.dashboard-card strong {
  display: block;
  font-size: 24px;
  line-height: 1.1;
}

.dashboard-chart-container {
  position: relative;
  width: 100%;
  height: 360px;
  max-height: 360px;
  overflow: hidden;
}

.dashboard-chart-container canvas {
  width: 100% !important;
  height: 100% !important;
}


/* iPad / tablette */
@media (max-width: 900px) {
  .dashboard-page {
    padding: 16px;
  }

  .dashboard-page h1 {
    font-size: 24px;
    margin-bottom: 18px;
  }

  .dashboard-section h2 {
    font-size: 18px;
  }

  .dashboard-card {
    padding: 12px;
  }

  .dashboard-card strong {
    font-size: 20px;
  }

  .dashboard-chart-container {
    height: 280px;
  }
}


/* Téléphone */
@media (max-width: 600px) {
  .dashboard-page {
    padding: 12px;
  }

  .dashboard-cards {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .dashboard-card {
    padding: 10px 12px;
  }

  .dashboard-card span {
    margin-bottom: 4px;
    font-size: 12px;
  }

  .dashboard-card strong {
    font-size: 18px;
  }

  .dashboard-chart-container {
    height: 240px;
  }
}

.dashboard-section h2 {
  text-align: center;
}

.dashboard-client-counts {
  display: flex;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  font-size: 13px;
  opacity: 0.8;
}

.dashboard-card {
  text-align: center;
}

@media (max-width: 900px) {
  .dashboard-card {
    text-align: center;
  }
}

@media (max-width: 600px) {
  .dashboard-cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
  }

  .dashboard-card {
    padding: 8px 4px;
    text-align: center;
  }

  .dashboard-card span {
    font-size: 10px;
  }

  .dashboard-card strong {
    font-size: 14px;
  }

  .dashboard-client-counts {
    gap: 8px;
    font-size: 11px;
  }
}.dashboard-section h2 {
  text-align: center;
}

.dashboard-client-counts {
  display: flex;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  font-size: 13px;
  opacity: 0.8;
}

.dashboard-card {
  text-align: center;
}

@media (max-width: 900px) {
  .dashboard-card {
    text-align: center;
  }
}

@media (max-width: 600px) {
  .dashboard-cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
  }

  .dashboard-card {
    padding: 8px 4px;
    text-align: center;
  }

  .dashboard-card span {
    font-size: 10px;
  }

  .dashboard-card strong {
    font-size: 14px;
  }

  .dashboard-client-counts {
    gap: 8px;
    font-size: 11px;
  }
}

.dashboard-refresh {
  display: flex;
  justify-content: center;
  margin: 0 0 16px;
}

.dashboard-refresh {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
}

.dashboard-last-updated {
  font-size: 12px;
  opacity: 0.7;
  text-align: center;
}

.dashboard-refresh-button {
  padding: 10px 18px;
  border: 1px solid var(--overlay-3);
  border-radius: 12px;
  background: var(--overlay-2);
  color: var(--white);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    background 0.15s ease;
}

.dashboard-refresh-button:hover {
  background: var(--overlay-3);
  transform: translateY(-1px);
}

.dashboard-refresh-button:active {
  transform: translateY(0);
}

/* Cartes totaux dashboard */

.marge-nette-filter {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
}

.marge-nette-filter label {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--white);
}

.marge-nette-filter select {
  min-width: 210px;
  padding: 10px 38px 10px 14px;
  border: 1px solid var(--overlay-3);
  border-radius: 12px;
  background: var(--overlay-2);
  color: var(--white);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  outline: none;
  text-align: center;
  text-align-last: center;
}

.marge-nette-filter select:focus {
  border-color: var(--overlay-3);
}

.marge-nette-filter option {
  color: var(--surface-06);
  background: var(--white);
}

@media (max-width: 600px) {
  .marge-nette-filter {
    flex-direction: column;
    gap: 8px;
  }

 .marge-nette-filter select {
  width: 100%;
  max-width: 280px;
  padding-left: 42px;
  padding-right: 42px;
  text-align: center;
  text-align-last: center;
}

}

.dashboard-total-card {
  width: min(320px, 90%);
  margin: 0 auto 16px;
  padding: 12px 18px;
  text-align: center;
  border: 1px solid var(--overlay-3);
  border-radius: 12px;
  background: var(--overlay-2);
}

.dashboard-total-card span {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
  opacity: 0.8;
}

.dashboard-total-card strong {
  display: block;
  font-size: 25px;
  line-height: 1.1;
}

@media (max-width: 900px) {
  .dashboard-total-card {
    width: min(280px, 85%);
    padding: 10px 14px;
  }

  .dashboard-total-card strong {
    font-size: 21px;
  }
}

@media (max-width: 600px) {
  .dashboard-total-card {
    width: min(240px, 80%);
    padding: 8px 12px;
    margin-bottom: 12px;
  }

  .dashboard-total-card span {
    font-size: 11px;
  }

  .dashboard-total-card strong {
    font-size: 18px;
  }
}

/* =========================
   CARROUSEL GRAPHIQUES CA
   ========================= */

.dashboard-carousel {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.dashboard-carousel::-webkit-scrollbar {
  display: none;
}

.dashboard-carousel-track {
  display: flex;
  width: 100%;
}

.dashboard-carousel-slide {
  width: 100%;
  flex: 0 0 100%;
  scroll-snap-align: start;
  padding: 0;
  box-sizing: border-box;
}

.dashboard-carousel-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

.dashboard-carousel-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--overlay-3);
  cursor: pointer;
  transition:
    transform 0.2s ease,
    background 0.2s ease;
}

.dashboard-carousel-dot.active {
  background: var(--white);
  transform: scale(1.3);
}

.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  width: min(360px, 100%);
  padding: 28px;
  text-align: center;
  border: 1px solid var(--overlay-3);
  border-radius: 18px;
  background: var(--overlay-2);
}

.login-card .mfs-logo {
  margin-bottom: 12px;
}

.login-card h1 {
  margin: 0 0 24px;
}

.login-card form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.login-card input {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border: 1px solid var(--overlay-3);
  border-radius: 12px;
  background: var(--overlay-2);
  color: var(--white);
  font-size: 18px;
  text-align: center;
  outline: none;
}

.login-card button {
  padding: 13px 18px;
  border: 0;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}

.login-error {
  margin-top: 14px;
  color: #ff8d8d;
}

.decoupe-stats-section {
  margin-bottom: 16px;
}

.decoupe-stats-details {
  border: 1px solid var(--overlay-3);
  border-radius: 14px;
  background: var(--overlay-1);
  overflow: hidden;
}

.decoupe-stats-summary {
  padding: 14px 16px;
  cursor: pointer;
  color: var(--accent);
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  list-style: none;
}

.decoupe-stats-summary::-webkit-details-marker {
  display: none;
}

.decoupe-stats-content {
  padding: 0 16px 16px;
  text-align: center;
}

.decoupe-stats-content p {
  margin: 0;
  opacity: 0.75;
  font-size: 13px;
}

.decoupe-stats-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.decoupe-stats-dot {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  min-width: 8px;
  min-height: 8px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 50%;
  background: var(--overlay-3);
  box-shadow: none;
  cursor: pointer;
}

.decoupe-stats-dot.active {
  background: var(--white);
  transform: scale(1.3);
}

.decoupe-stats-content .dashboard-carousel-track {
  width: 300%;
}

.decoupe-stats-content .dashboard-carousel-slide {
  width: 33.333333%;
  flex: 0 0 33.333333%;
}

.dashboard-stats-details {
  border: 1px solid var(--overlay-3);
  border-radius: 14px;
  background: var(--overlay-1);
  overflow: hidden;
  margin-bottom: 16px;

}

.dashboard-stats-summary {
  padding: 14px 16px;
  cursor: pointer;
  color: var(--accent);
  font-size: 15px;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  list-style: none;
}

.dashboard-stats-summary::-webkit-details-marker {
  display: none;
}

.dashboard-stats-summary::before {
  content: "▶";
  margin-right: 8px;
  color: var(--accent);
  font-size: 13px;
}

.dashboard-stats-details[open]
  > .dashboard-stats-summary::before {
  content: "▼";
}

.dashboard-stats-content {
  padding: 8px 16px 16px;
}

.dashboard-refresh-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;

  width: 0;
  height: 5px;

  background: #2196f3;
  opacity: 0;

  box-shadow:
   box-shadow:
  0 0 8px rgba(33, 150, 243, 0.8),
  0 0 16px rgba(33, 150, 243, 0.45);

  transition:
    width 0.25s ease,
    opacity 0.15s ease;
}

.dashboard-refresh-progress.active {
  opacity: 1;
  animation:
    dashboard-refresh-loading
    1.2s ease-in-out infinite;
}

@keyframes dashboard-refresh-loading {
  0% {
    width: 8%;
  }

  40% {
    width: 55%;
  }

  70% {
    width: 82%;
  }

  100% {
    width: 96%;
  }
}
.decoupe-stats-summary::before {
  content: "▶";
  margin-right: 8px;
  color: var(--accent);
  font-size: 13px;
}

.decoupe-stats-details[open]
  > .decoupe-stats-summary::before {
  content: "▼";
}
.mercuriale-catalogue {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.mercuriale-search {
  width: 100%;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--overlay-3);
  background: var(--overlay-1);
  color: var(--white);
  font-size: 16px;
}

.mercuriale-products-count {
  font-size: 13px;
  opacity: 0.7;
}

.mercuriale-product-card {
  padding: 14px;
  border: 1px solid var(--overlay-2);
  border-radius: 12px;
  background: var(--overlay-1);
}

.mercuriale-product-title {
  font-weight: 800;
  margin-bottom: 4px;
}

.mercuriale-product-section {
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.mercuriale-product-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 13px;
  opacity: 0.8;
}

.mercuriale-dolibarr-status {
  margin-top: 10px;
  font-size: 12px;
  opacity: 0.8;
}
.mercuriale-product-status {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.mercuriale-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.mercuriale-badge-fixed {
  background: rgba(76, 175, 80, 0.16);
}

.mercuriale-badge-margin {
  background: rgba(33, 150, 243, 0.16);
}

.mercuriale-badge-variable {
  background: rgba(245, 166, 35, 0.16);
}

.mercuriale-badge-incomplete {
  background: rgba(244, 67, 54, 0.16);
}
.mercuriale-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mercuriale-filter {
  padding: 7px 10px;
  border: 1px solid var(--overlay-3);
  border-radius: 999px;
  background: var(--overlay-1);
  color: var(--white);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.mercuriale-filter.active {
  border-color: var(--accent);
  background: rgba(245,166,35,0.16);
  color: var(--accent);
}

.mercuriale-product-form {
  display: grid;
  gap: 10px;
}

.mercuriale-product-form input,
.mercuriale-product-form select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--overlay-3);
  border-radius: 10px;
  background: var(--overlay-1);
  color: var(--white);
  font-size: 15px;
}

.mercuriale-dolibarr-exact {
  color: #4caf50;
  font-weight: 800;
}

.mercuriale-dolibarr-suggestion {
  color: var(--accent);
  font-weight: 800;
}

.mercuriale-dolibarr-suggestions {
  display: grid;
  gap: 6px;
  margin-top: 6px;
}

.mercuriale-dolibarr-suggestion-item {
  display: grid;
  grid-template-columns:
  auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;

  padding: 7px 9px;

  border: 1px solid var(--overlay-2);
  border-radius: 8px;

  background: var(--overlay-1);
}

.mercuriale-dolibarr-suggestion-item span {
  min-width: 0;
}

.mercuriale-dolibarr-suggestion-item small {
  opacity: 0.65;
  white-space: nowrap;
}

.mercuriale-dolibarr-manual-form {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.mercuriale-dolibarr-manual-form label {
  font-size: 12px;
  font-weight: 700;
  opacity: 0.8;
}

.mercuriale-dolibarr-manual-form input {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--overlay-3);
  border-radius: 9px;
  background: var(--overlay-1);
  color: var(--white);
  font-size: 14px;
}

.mercuriale-suggestion-associate {
  padding: 6px 9px;
  border: 1px solid var(--accent);
  border-radius: 7px;
  background: rgba(245, 166, 35, 0.14);
  color: var(--accent);
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

@media (max-width: 600px) {
  .mercuriale-dolibarr-suggestion-item {
    grid-template-columns:
      auto minmax(0, 1fr) auto;
  }

  .mercuriale-suggestion-associate {
    grid-column: 1 / -1;
    width: 100%;
  }
}

.mercuriale-dolibarr-change {
  margin-top: 10px;
}

.mercuriale-dolibarr-change summary {
  cursor: pointer;
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  list-style: none;
}

.mercuriale-dolibarr-change summary::-webkit-details-marker {
  display: none;
}

.mercuriale-dolibarr-change summary::before {
  content: "▶";
  margin-right: 6px;
}

.mercuriale-dolibarr-change[open] summary::before {
  content: "▼";
}

.mercuriale-demarne-form {
  display: grid;
  gap: 12px;
}

.mercuriale-file-field {
  display: grid;
  gap: 8px;
}

.mercuriale-file-field span {
  font-size: 13px;
  font-weight: 700;
}

.mercuriale-file-field input {
  width: 100%;
}

.mercuriale-import-info {
  margin: 10px 0 0;
  font-size: 12px;
  opacity: 0.7;
}

.mercuriale-demarne-preview {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.mercuriale-demarne-line {
  display: grid;
  grid-template-columns:
    55px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;

  padding: 8px 10px;

  border: 1px solid var(--overlay-2);
  border-radius: 8px;

  background: var(--overlay-1);

  font-size: 13px;
}

.mercuriale-demarne-price {
  font-weight: 800;
  white-space: nowrap;
}

.mercuriale-demarne-unavailable {
  font-size: 11px;
  font-weight: 800;
  opacity: 0.6;
  white-space: nowrap;
}

.mercuriale-demarne-subtitle {
  margin-top: 18px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 600px) {
  .mercuriale-demarne-line {
    grid-template-columns:
      50px minmax(0, 1fr);
  }

  .mercuriale-demarne-price,
  .mercuriale-demarne-unavailable {
    grid-column: 2;
  }
}

.mercuriale-demarne-associate-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin: 5px 0 10px 63px;
}

.mercuriale-demarne-associate-form input {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--overlay-3);
  border-radius: 8px;
  background: var(--overlay-1);
  color: var(--white);
}

.mercuriale-demarne-association-ok {
  margin: 5px 0 10px 63px;
  color: #4caf50;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 600px) {
  .mercuriale-demarne-associate-form {
    grid-template-columns: 1fr;
    margin-left: 0;
  }

  .mercuriale-demarne-association-ok {
    margin-left: 0;
  }
}

.mercuriale-product-picker {
  position: relative;
}

.mercuriale-product-results {
  display: grid;
  gap: 4px;
  margin-top: 4px;
}

.mercuriale-product-result {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--overlay-2);
  border-radius: 7px;
  background: var(--overlay-1);
  color: var(--white);
  text-align: left;
  cursor: pointer;
}

.mercuriale-product-result:hover {
  background: var(--overlay-2);
}

.mercuriale-demarne-validate-form {
  display: grid;
  gap: 10px;
  margin: 14px 0;
}

.mercuriale-demarne-validate-info {
  display: grid;
  gap: 4px;
  font-size: 12px;
}

.mercuriale-demarne-validate-info span {
  opacity: 0.7;
}

.dolibarr-api-stats {
  margin: 0 0 6px;
  border: 1px solid var(--info-strong);
  border-radius: 14px;
  background: var(--surface-09);
  overflow: hidden;
}

.dolibarr-api-stats summary {
  cursor: pointer;
  padding: 12px 14px;
  font-size: 16px;
  font-weight: 700;
  color: var(--info);
  list-style: none;
}

.dolibarr-api-stats summary::-webkit-details-marker {
  display: none;
}

.dolibarr-api-stats summary::before {
  content: '▶';
  display: inline-block;
  margin-right: 8px;
  transition: transform 0.2s ease;
}

.dolibarr-api-stats[open] summary::before {
  transform: rotate(90deg);
}

.dolibarr-api-stats-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 0 12px 12px;
}

.dolibarr-api-stats-content > div {
  padding: 10px;
  border: 1px solid var(--grey-750);
  border-radius: 10px;
  background: var(--surface-16);
  text-align: center;
}

.dolibarr-api-stats-content span {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
  color: var(--grey-400);
}

.dolibarr-api-stats-content strong {
  display: block;
  font-size: 20px;
  color: var(--white);
}

@media (min-width: 700px) {
  .dolibarr-api-stats-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

.mfs-mobile-nav {
  position: relative;
  padding: 10px 16px;
}

.mfs-menu-toggle {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--info-strong);
  border-radius: 12px;
  background: var(--surface-09);
  color: var(--white);
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.mfs-mobile-menu {
  display: none;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--grey-750);
  border-radius: 12px;
  background: var(--surface-09);
}

.mfs-mobile-menu.open {
  display: grid;
  gap: 8px;
}

.mfs-mobile-menu .mfs-module-link {
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
}

.hygiene-global-status {
  margin-left: auto;
  font-size: 24px;
  line-height: 1;
}

.hygiene-status-pending {
  color: var(--danger-strong);
}

.hygiene-status-complete {
  color: var(--success-strong);
}

.hygiene-details .decoupe-stats-summary {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hygiene-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "actions label"
    ". nonconformity";
  align-items: center;
  gap: 8px 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--grey-750);
}

.hygiene-check > strong {
  grid-area: label;
  min-width: 0;
  font-size: 14px;
  line-height: 1.25;
}

.hygiene-check-actions {
  grid-area: actions;
  display: flex;
  align-items: center;
  gap: 6px;
}

.hygiene-conforme-button,
.hygiene-nonconforme-button {
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 10px;
  font-size: 0;
  font-weight: 800;
  cursor: pointer;
}

.hygiene-conforme-button::after {
  content: '✓';
  font-size: 22px;
}

.hygiene-nonconforme-button::after {
  content: '✕';
  font-size: 21px;
}

.hygiene-conforme-button {
  border: 2px solid var(--success-strong);
}

.hygiene-nonconforme-button {
  border: 2px solid var(--danger-strong);
}

.hygiene-check-conforme
.hygiene-conforme-button {
  background: var(--success-strong);
  color: var(--white);
}

.hygiene-check-nonconforme
.hygiene-nonconforme-button {
  background: var(--danger-strong);
  color: var(--white);
}

.hygiene-nonconformity {
  grid-area: nonconformity;
  width: 100%;
  margin-top: 4px;
}

.hygiene-nonconformity label {
  display: grid;
  gap: 5px;
  margin-top: 8px;
  font-size: 13px;
}

.hygiene-nonconformity textarea {
  width: 100%;
  box-sizing: border-box;
}

.hygiene-check {
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "actions label"
    ". nonconformity";
}

.hygiene-nonconformity {
  grid-area: nonconformity;
  width: 100%;
  min-width: 0;
  margin-top: 8px;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 10px;
  background: var(--overlay-1);
}

.hygiene-nonconformity label {
  display: block;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.3;
}

.hygiene-nonconformity label:last-child {
  margin-bottom: 0;
}

.hygiene-nonconformity textarea {
  display: block;
  width: 100%;
  min-height: 64px;
  margin-top: 6px;
  padding: 8px 10px;
  box-sizing: border-box;
  border-radius: 8px;
  resize: vertical;
}

.hygiene-check-nonconforme {
  align-items: start;
}

.hygiene-nonconformity textarea,
.hygiene-nonconformity input,
.hygiene-nonconformity select {
  font-size: 16px;
}

.hygiene-nonconformity textarea {
  font-size: 16px;
}

.hygiene-month-content {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.hygiene-zone {
  margin: 0;
  border: 1px solid var(--surface-28);
  border-radius: 16px;
  background: var(--surface-13);
  overflow: hidden;
}

.hygiene-zone-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  padding: 16px 18px;
  cursor: pointer;

  font-weight: 700;
  line-height: 1.2;
}

.hygiene-zone-summary::-webkit-details-marker {
  display: none;
}

.hygiene-zone-summary::before {
  content: '▶';
  flex: 0 0 auto;
  font-size: 14px;
}

.hygiene-zone[open]
.hygiene-zone-summary::before {
  content: '▼';
}

.hygiene-zone-status {
  margin-left: auto;
  flex: 0 0 auto;
  font-size: 20px;
}

.hygiene-zone[open]
.hygiene-check-list {
  border-top: 1px solid var(--grey-750);
  padding: 0 14px 12px;
}

.hygiene-month > .hygiene-zone-summary {
  justify-content: center;
  position: relative;
  text-align: center;
}

.hygiene-month > .hygiene-zone-summary
.hygiene-global-status {
  position: absolute;
  right: 18px;
}

.hygiene-conforme-button,
.hygiene-nonconforme-button {
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 0;
  box-shadow: none;
}

.hygiene-conforme-button::after {
  content: '✓';
  font-size: 30px;
  color: #7d8794;
}

.hygiene-nonconforme-button::after {
  content: '✕';
  font-size: 28px;
  color: var(--danger-strong);
}

.hygiene-check-conforme
.hygiene-conforme-button::after {
  color: var(--success-strong);
}

.hygiene-check-nonconforme
.hygiene-nonconforme-button::after {
  color: var(--danger-strong);
}

.hygiene-check-conforme
.hygiene-conforme-button,
.hygiene-check-nonconforme
.hygiene-nonconforme-button {
  background: transparent;
}

.hygiene-check-actions {
  gap: 10px;
}

.hygiene-nonconformity {
  grid-column: 1 / -1;
}

.hygiene-status-warning {
  color: var(--accent-strong);
}

.decoupe-stats-section
> .decoupe-stats-details
> .decoupe-stats-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
}

.hygiene-control[open]
> .hygiene-zone-summary::before,
.hygiene-month[open]
> .hygiene-zone-summary::before {
  content: '▼';
}

.topbar-center .ramasse-date {
  margin-top: 6px;
  font-size: clamp(
    16px,
    2vw,
    20px
  ) !important;
  font-weight: 600;
}

.mercuriale-muller-form {
  display: grid;
  gap: 14px;
}

.mercuriale-muller-form label {
  display: grid;
  gap: 8px;
  font-weight: 700;
}

.mercuriale-muller-form textarea {
  display: block;
  width: 100%;
  min-height: 280px;
  padding: 12px;
  box-sizing: border-box;
  border: 1px solid #59616d;
  border-radius: 10px;
  background: var(--surface-13);
  color: #f5f7fa;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.4;
  resize: vertical;
}

.mercuriale-comparison-list {
  display: grid;
  gap: 10px;
}

.mercuriale-comparison-row {
  display: grid;
grid-template-columns:
  minmax(220px, 1.4fr)
  minmax(300px, 2fr)
  minmax(310px, 1.4fr);
  align-items: center;
  gap: 14px;
  padding: 12px;
  border: 1px solid var(--surface-31);
  border-radius: 10px;
  background: var(--surface-21);
}

.mercuriale-comparison-label {
  line-height: 1.25;
}

.mercuriale-comparison-offers {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.mercuriale-comparison-offers span {
  padding: 7px 8px;
  border-radius: 7px;
  background: var(--surface-13);
  text-align: center;
  white-space: nowrap;
}

.mercuriale-comparison-best {
  display: grid;
  gap: 2px;
  text-align: right;
}

.mercuriale-comparison-best span {
  color: #8d97a5;
  font-size: 11px;
  font-weight: 700;
}

.mercuriale-comparison-best strong {
  color: var(--success-strong);
  font-size: 18px;
}

.mercuriale-comparison-best small {
  color: var(--accent);
  font-weight: 700;
}

.mercuriale-comparison-label {
  display: block;
  text-align: center;
}

.mercuriale-comparison-results {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr);
  gap: 20px;
}

.mercuriale-comparison-sale {
  display: grid;
  gap: 2px;
  text-align: right;
}

.mercuriale-comparison-sale span {
  color: #8d97a5;
  font-size: 11px;
  font-weight: 700;
}

.mercuriale-comparison-sale strong {
  color: var(--info-light);
  font-size: 18px;
  white-space: nowrap;
}

.mercuriale-comparison-sale small {
  color: var(--accent);
  font-weight: 700;
}

@media (max-width: 800px) {
  .mercuriale-comparison-results {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr);
    width: 100%;
  }

  .mercuriale-comparison-best {
    text-align: left;
  }

  .mercuriale-comparison-sale {
    text-align: right;
  }
}

@media (max-width: 800px) {
  .mercuriale-comparison-row {
    grid-template-columns: 1fr;
  }

  .mercuriale-comparison-offers {
    grid-template-columns: 1fr;
  }

  .mercuriale-comparison-best {
    text-align: left;
  }
}
/* Mercuriale client - prévisualisation */

.mercuriale-client-heading {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  margin-bottom: 20px;
  padding: 16px;
  border: 1px solid var(--grey-600);
  border-radius: 12px;
  background: var(--surface-12);
  text-align: center;
}

.mercuriale-client-heading strong {
  color: var(--accent);
  font-size: 18px;
  text-transform: capitalize;
}

.mercuriale-client-heading span {
  color: #d1d5db;
}

.mercuriale-client-sections {
  display: grid;
  gap: 18px;
}

.mercuriale-client-section {
  overflow: hidden;
  border: 1px solid var(--grey-600);
  border-radius: 12px;
  background: var(--surface-12);
}

.mercuriale-client-section-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: #aee4e5;
  color: var(--grey-900);
  cursor: pointer;
  list-style: none;
  text-transform: uppercase;
}

.mercuriale-client-section-summary::-webkit-details-marker {
  display: none;
}

.mercuriale-client-section-summary span {
  font-size: 18px;
  font-weight: 800;
}

.mercuriale-client-section-summary small {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  white-space: nowrap;
}

.mercuriale-client-section-summary small::after {
  content: "▶";
  font-size: 14px;
  transition: transform 0.2s ease;
}

.mercuriale-client-section[open]
  > .mercuriale-client-section-summary
  small::after {
  transform: rotate(90deg);
}

.mercuriale-client-table {
  width: 100%;
}

.mercuriale-client-row {
  display: grid;
  grid-template-columns:
    minmax(260px, 1fr)
    90px
    80px
    80px
    110px;
  align-items: center;
  min-height: 46px;
  border-top: 1px solid var(--grey-700);
}

.mercuriale-client-row > * {
  padding: 10px 12px;
}

.mercuriale-client-row > * + * {
  border-left: 1px solid var(--grey-700);
}

.mercuriale-client-row-header {
  min-height: 40px;
  background: var(--surface-22);
  color: #d1d5db;
  font-size: 12px;
  font-weight: 700;
}

.mercuriale-client-price {
  color: #4ade80;
  font-size: 16px;
  text-align: right;
  white-space: nowrap;
}

.mercuriale-client-price-unit {
  display: none;
}

@media (max-width: 700px) {
  .mercuriale-client-heading {
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }

  .mercuriale-client-heading strong,
  .mercuriale-client-heading span {
    width: 100%;
    text-align: center;
  }

  .mercuriale-client-row-header {
    display: none;
  }

  .mercuriale-client-row {
    grid-template-columns:
      minmax(0, 1fr)
      72px
      92px;

    grid-template-rows:
      auto
      auto;

    align-items: center;
    min-height: 58px;
    padding: 6px 8px;
  }

  .mercuriale-client-row > * {
    padding: 3px 5px;
    border-left: 0;
    text-align: center;
  }

  .mercuriale-client-row
    > strong:first-child {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: center;
    padding: 5px;
    font-size: 15px;
    text-align: left;
  }

  .mercuriale-client-row
    > span {
    color: #cbd5e1;
    font-size: 12px;
  }

  .mercuriale-client-row
    > span:nth-of-type(1) {
    grid-column: 2;
    grid-row: 1;
  }

  .mercuriale-client-row
    > span:nth-of-type(1)::before {
    content: "Cond";
    display: block;
    margin-bottom: 2px;
    color: var(--grey-400);
    font-size: 10px;
    font-weight: 400;
  }

  .mercuriale-client-row
    > span:nth-of-type(2) {
    grid-column: 3;
    grid-row: 1;
  }

  .mercuriale-client-row
    > span:nth-of-type(2)::before {
    content: "Unité vente";
    display: block;
    margin-bottom: 2px;
    color: var(--grey-400);
    font-size: 10px;
    font-weight: 400;
    white-space: nowrap;
  }

  .mercuriale-client-row
    > span:nth-of-type(3) {
    display: none;
  }

  .mercuriale-client-price {
    grid-column: 2 / 4;
    grid-row: 2;
    padding-top: 0;
    color: #4ade80;
    font-size: 15px;
    text-align: center;
    white-space: nowrap;
  }

  .mercuriale-client-price-unit {
    display: inline;
    padding: 0;
    border: 0;
    color: inherit;
    font: inherit;
  }
}

@media (max-width: 700px) {
  .mercuriale-client-section-summary {
    padding: 16px 14px;
  }

  .mercuriale-client-section-summary span {
    font-size: 16px;
  }

  .mercuriale-client-section-summary small {
    font-size: 11px;
  }
}

.mercuriale-supplier-card {
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid var(--grey-700);
  border-radius: 16px;
  background: var(--grey-900);
}

.mercuriale-supplier-card h3 {
  margin: 0 0 14px;
  color: var(--grey-50);
}

.mercuriale-supplier-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 16px;
}

.mercuriale-supplier-tabs button {
  padding: 12px;
  border: 1px solid var(--grey-600);
  border-radius: 10px;
  background: var(--grey-800);
  color: #d1d5db;
  font-weight: 800;
  cursor: pointer;
}

.mercuriale-supplier-tabs button.active {
  border-color: var(--info-strong);
  background: var(--surface-17);
  color: white;
}

.mercuriale-supplier-panel[hidden] {
  display: none;
}

.mercuriale-supplier-summary {
  padding: 14px;
  color: var(--grey-50);
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.mercuriale-supplier-summary::-webkit-details-marker {
  display: none;
}

.mercuriale-supplier-summary::after {
  content: "▶";
  float: right;
  transition: transform 0.2s ease;
}

.mercuriale-supplier-card[open]
  > .mercuriale-supplier-summary::after {
  transform: rotate(90deg);
}

.mercuriale-supplier-card[open]
  > .mercuriale-supplier-tabs {
  margin-top: 14px;
}

.mercuriale-supplier-card
  .mercuriale-demarne-line {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.mercuriale-supplier-card
  .mercuriale-demarne-line
  > strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.mercuriale-supplier-card
  .mercuriale-demarne-price {
  justify-self: end;
  white-space: nowrap;
  text-align: right;
}

.mercuriale-supplier-card
  .mercuriale-demarne-line
  > small {
  grid-column: 1 / -1;
}

@media (max-width: 700px) {
  .mercuriale-supplier-card
    .mercuriale-demarne-line {
    grid-template-columns:
      minmax(0, 1fr) auto;
  }

  .mercuriale-supplier-card
    .mercuriale-demarne-price {
    font-size: 14px;
  }
}

.mercuriale-product-dialog {
  width: min(680px, calc(100% - 24px));
  max-height: 88vh;
  padding: 18px;
  border: 1px solid var(--grey-600);
  border-radius: 18px;
  background: var(--grey-900);
  color: var(--grey-50);
  overflow-y: auto;
}

.mercuriale-product-dialog::backdrop {
  background: rgb(0 0 0 / 75%);
}

.mercuriale-product-dialog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.mercuriale-product-dialog-header strong {
  font-size: 18px;
}

.mercuriale-dialog-close {
  width: 38px;
  height: 38px;
  border: 1px solid #6b7280;
  border-radius: 50%;
  background: var(--grey-800);
  color: white;
  font-size: 25px;
  cursor: pointer;
}

.mercuriale-product-dialog
  > details {
  margin-top: 14px;
  border: 1px solid var(--grey-700);
  border-radius: 12px;
  background: var(--grey-800);
}

.mercuriale-product-dialog
  > details
  > summary {
  padding: 14px;
  color: var(--info-light);
  font-weight: 800;
  cursor: pointer;
}

.mercuriale-dialog-form {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.mercuriale-dialog-form label {
  display: grid;
  gap: 6px;
}

.mercuriale-dialog-form input,
.mercuriale-dialog-form select {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--grey-600);
  border-radius: 9px;
  background: var(--grey-900);
  color: var(--grey-50);
  box-sizing: border-box;
}

.dashboard-stats-content
  form[action="/superadmin/import-dolibarr-reference"] {
  display: grid;
  justify-items: center;
  gap: 16px;
  width: 100%;
  text-align: center;
}

.dashboard-stats-content
  form[action="/superadmin/import-dolibarr-reference"]
  input[type="file"] {
  width: min(100%, 590px);
  margin: 0 auto;
  text-align: center;
}

.dashboard-stats-content
  form[action="/superadmin/import-dolibarr-reference"]
  .dashboard-refresh-button {
  width: min(100%, 590px);
  margin: 0 auto;
}

.dashboard-stats-content
  form[action="/superadmin/import-dolibarr-reference"]
  input[type="file"] {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  justify-self: center;
}

.dashboard-stats-content
  form[action="/superadmin/import-dolibarr-reference"]
  input[type="file"]::file-selector-button {
  margin-right: 10px;
}

.mercuriale-pdf-actions {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.mercuriale-pdf-actions
  .dashboard-refresh-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
}

.mercuriale-pdf-actions
  small {
  grid-column: 1 / -1;
  text-align: center;
}

@media (max-width: 700px) {
  .mercuriale-pdf-actions {
    grid-template-columns: 1fr;
  }

  .mercuriale-pdf-actions
    small {
    grid-column: 1;
  }
}

.mercuriale-pdf-dialog {
  width: min(960px, calc(100% - 16px));
  height: min(92vh, 1000px);
  padding: 10px;
  border: 1px solid var(--grey-600);
  border-radius: 16px;
  background: var(--grey-900);
  box-sizing: border-box;
}

.mercuriale-pdf-dialog::backdrop {
  background: rgb(0 0 0 / 85%);
}

.mercuriale-pdf-dialog-actions {
  display: grid;
  grid-template-columns:
  repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.mercuriale-pdf-dialog-actions
  .dashboard-refresh-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  text-align: center;
  text-decoration: none;
}

.mercuriale-pdf-pages {
  width: 100%;
  height: calc(100% - 66px);
  padding: 8px;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 10px;
  background: var(--surface-32);
  box-sizing: border-box;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.mercuriale-pdf-page {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 10px;
  background: white;
  box-shadow: 0 2px 8px
    rgb(0 0 0 / 35%);
}

.mercuriale-pdf-loading {
  padding: 30px 15px;
  color: white;
  text-align: center;
  font-weight: 700;
}

@media (max-width: 700px) {
   .mercuriale-pdf-pages {
  height: calc(100% - 174px);
  padding: 4px;
}

  .mercuriale-pdf-page {
    margin-bottom: 6px;
  }

  .mercuriale-pdf-dialog-actions {
    grid-template-columns: 1fr;
  }

    .mercuriale-pdf-dialog {
    overflow: hidden;
  }

  .mercuriale-pdf-dialog iframe {
    width: 160%;
    height: calc(160% - 189px);
    transform: scale(0.625);
    transform-origin: top left;
    border-radius: 16px;
  }
}

/* Fournisseur MEDELYS */

.supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar {
  background: rgba(167, 139, 250, 0.08);
}

.supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-toggle {
  background: rgba(167, 139, 250, 0.08);
  color: #c4b5fd;
}

.supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-name,
.supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-arrow {
  color: #c4b5fd;
}

/* ===== BLOCS MANUELS RAMASSE ===== */

.manual-ramasse-group {
  margin-top: 12px;
}

.manual-ramasse-gbp
  > .supplier-bar
  .supplier-toggle {
  background: rgba(248, 113, 113, 0.1);
  color: var(--danger-pale);
}

.manual-ramasse-gbp
  .supplier-name,
.manual-ramasse-gbp
  .supplier-arrow {
  color: var(--danger-light);
}

.manual-ramasse-consommable-mfs
  > .supplier-bar
  .supplier-toggle {
  background: rgba(45, 212, 191, 0.1);
  color: var(--value);
}

.manual-ramasse-consommable-mfs
  .supplier-name,
.manual-ramasse-consommable-mfs
  .supplier-arrow {
  color: var(--value-strong);
}

.manual-ramasse-items {
  padding: 8px 14px 12px;
  background: var(--panel);
}

.manual-ramasse-item {
  padding: 11px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 15px;
  font-weight: 700;
}

.manual-ramasse-item:last-child {
  border-bottom: 0;
}

.manual-ramasse-empty {
  padding: 12px;
  color: var(--muted);
  font-style: italic;
}

/* ===== FORMULAIRE SUPERADMIN RAMASSE ===== */

.manual-ramasse-date {
  margin: 0 0 14px;
}

.manual-ramasse-form {
  display: grid;
  gap: 16px;
}

.manual-ramasse-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 9px;
}

.manual-ramasse-gbp {
  background: rgba(248, 113, 113, 0.07);
}

.manual-ramasse-consommable {
  background: rgba(45, 212, 191, 0.07);
}

.manual-ramasse-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.manual-ramasse-toggle input {
  width: 20px;
  height: 20px;
}

.manual-ramasse-gbp
  .manual-ramasse-toggle input {
  accent-color: var(--danger-light);
}

.manual-ramasse-consommable
  .manual-ramasse-toggle input {
  accent-color: var(--value-strong);
}

.manual-ramasse-form textarea {
  width: 100%;
  min-height: 130px;
  padding: 12px;
  resize: vertical;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-11);
  color: var(--text);
  font: inherit;
  box-sizing: border-box;
}

.mercuriale-client-public-page {
  min-height: 100vh;
  margin: 0;
  background: var(--surface-03);
}

.mercuriale-client-public {
  width: min(1100px, 100%);
  min-height: 100vh;
  margin: 0 auto;
  padding: 18px;
  box-sizing: border-box;
}

.mercuriale-client-public-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 8px 1px;
  margin-bottom: 10px;
  border: 1px solid var(--grey-700);
  border-radius: 14px;
  background:
    linear-gradient(
      145deg,
      #f8fafc,
      #e5e7eb
    );
  color: var(--grey-900);
  text-align: center;
}

.mercuriale-client-public-logo {
  display: block;
  width: 48px;
  height: 48px;
  margin: 0;
  object-fit: contain;
  flex: 0 0 auto;
}

.mercuriale-client-public-header h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.05;
}

.mercuriale-client-public-header strong {
  display: block;
  margin-top: 3px;
  color: var(--surface-05);
  font-size: 14px;
  letter-spacing: 0.03em;
}

.mercuriale-client-public-header p {
  margin: 3px 0 0;
  font-size: 13px;
  line-height: 1.15;
}

.mercuriale-client-public-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 18px;
  text-align: center;
}

.mercuriale-client-public-buttons {
  display: grid;
  gap: 8px;
}

.mercuriale-client-public-buttons
  .dashboard-refresh-button {
  width: 100%;
  margin: 0;
}

.mercuriale-copy-link-button {
  background: var(--surface-14);
  border-color: var(--grey-650);
  color: #cbd5e1;
}

.mercuriale-client-public-actions
  .dashboard-refresh-button {
  width: auto;
  margin: 0;
}

.mercuriale-client-public-link {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.mercuriale-client-public-empty {
  padding: 30px;
  border-radius: 16px;
  background: var(--grey-800);
  color: white;
  text-align: center;
}

@media (max-width: 700px) {
  .mercuriale-client-public {
    padding: 8px;
  }

 .mercuriale-client-public-header {
  gap: 2px;
  padding: 7px 8px;
}

.mercuriale-client-public-logo {
  width: 44px;
  height: 44px;
}

  .mercuriale-client-public-header h1 {
    font-size: 19px;
  }

  .mercuriale-client-public-actions {
    align-items: stretch;
    flex-direction: column;
    text-align: center;
  }

  .mercuriale-client-public-actions
    .dashboard-refresh-button {
    width: 100%;
  }
}

.mercuriale-pdf-actions {
  display: grid;
  gap: 10px;
}

.mercuriale-pdf-actions
  .mercuriale-client-public-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
}

.mercuriale-close-web-button {
  background: var(--surface-34);
  border-color: var(--danger-strong);
  color: white;
}

.mercuriale-promotion-list {
  display: grid;
  gap: 8px;
  padding: 12px;
  background: var(--surface-30);
}

.mercuriale-promotion-item {
  padding: 14px 12px;
  border: 1px solid var(--accent-strong);
  border-radius: 10px;
  background: #fef3c7;
  color: var(--surface-35);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
}

@media (max-width: 700px) {
  .mercuriale-promotion-item {
    padding: 13px 10px;
    font-size: 16px;
  }
}

.mercuriale-client-main-group {
  overflow: hidden;
  margin-bottom: 14px;
  border: 2px solid var(--grey-650);
  border-radius: 16px;
  background: var(--grey-900);
}

.mercuriale-client-main-group-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 16px;
  background: var(--surface-18);
  color: white;
  cursor: pointer;
  list-style: none;
  text-transform: uppercase;
}

.mercuriale-client-main-group-summary::-webkit-details-marker {
  display: none;
}

.mercuriale-client-main-group-summary span {
  font-size: 20px;
  font-weight: 900;
}

.mercuriale-client-main-group-summary small {
  font-size: 12px;
  white-space: nowrap;
}

.mercuriale-client-main-group-summary
  small::after {
  content: "▶";
  display: inline-block;
  margin-left: 8px;
  transition: transform 0.2s ease;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary
  small::after {
  transform: rotate(90deg);
}

.mercuriale-client-main-group-content {
  display: grid;
  gap: 10px;
  padding: 10px;
}

.mercuriale-client-main-group-content
  .mercuriale-client-section {
  margin: 0;
}

.mercuriale-client-section-promotion {
  overflow: hidden;
  margin-bottom: 14px;
  border: 2px solid var(--accent-strong);
  border-radius: 16px;
}

.mercuriale-client-section-promotion
  > .mercuriale-client-section-summary {
  background: #f6d38a;
  color: var(--surface-33);
}

.mercuriale-client-section-promotion
  > .mercuriale-client-section-summary
  small::after {
  color: var(--surface-35);
}

@media (max-width: 700px) {
  .mercuriale-client-main-group-summary {
    padding: 16px 13px;
  }

  .mercuriale-client-main-group-summary span {
    font-size: 17px;
  }

  .mercuriale-client-main-group-summary small {
    font-size: 10px;
  }

  .mercuriale-client-main-group-content {
    gap: 8px;
    padding: 8px;
  }
}

/* ===== SUPERADMIN — ORGANISATION ===== */

.superadmin-page-title {
  margin: 28px 0;
  text-align: center;
  text-transform: uppercase;
}

.superadmin-cost-calculator
  > .dashboard-stats-summary {
  text-align: right;
}

.cost-price-calculator {
  display: grid;
  gap: 14px;
}

.cost-price-calculator label {
  display: grid;
  gap: 7px;
}

.cost-price-calculator input {
  width: 100%;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-11);
  color: var(--text);
  font: inherit;
  box-sizing: border-box;
}

.cost-price-result {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    auto;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--value-strong);
  border-radius: 10px;
  background:
    rgba(45, 212, 191, 0.08);
}

.cost-price-result strong {
  text-align: right;
  color: var(--value);
}

.superadmin-page-title {
  margin: 28px 0;
  text-align: center;
  text-transform: uppercase;
}

.superadmin-imports-content {
  display: grid;
  gap: 16px;
}

.superadmin-imports-content
  > .dashboard-stats-details {
  margin: 0;
}

.superadmin-imports-content
  > .dashboard-stats-details
  > .dashboard-stats-summary {
  text-align: right;
}

/* ===== SUPERADMIN — TITRES ALIGNÉS À GAUCHE ===== */

.superadmin-page
  .dashboard-stats-summary,
.superadmin-page
  .mercuriale-supplier-summary,
.superadmin-page
  .dolibarr-api-stats
  > summary {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
}

.cost-price-product-name {
  max-width: 520px;
}

.cost-price-fields {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cost-price-fields label {
  min-width: 0;
}

.cost-price-fields label span {
  font-size: 13px;
}

.cost-price-fields input {
  padding: 8px 9px;
  min-height: 38px;
}

.cost-price-save-button {
  background:
    rgba(45, 212, 191, 0.14);
  border-color: var(--value-strong);
  color: var(--value);
}

.cost-price-saved-calculations {
  margin-top: 18px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.cost-price-saved-calculations
  > summary {
  padding: 15px;
  cursor: pointer;
  font-weight: 800;
  color: var(--value);
}

.cost-price-saved-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.cost-price-saved-item {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-11);
}

.cost-price-saved-item
  > strong {
  font-size: 17px;
}

.cost-price-saved-item
  > .cost-price-saved-content
  > .cost-price-saved-result {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.cost-price-saved-item b {
  color: var(--value);
}

.cost-price-saved-item small {
  color: var(--muted);
}

@media (max-width: 700px) {
  .cost-price-fields {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

  .cost-price-fields label span {
    font-size: 11px;
  }
}

.cost-price-fields label span {
  display: block;
  text-align: center;
}

.cost-price-fields input {
  text-align: center;
}

.cost-price-saved-item
  > strong {
  text-align: center;
}

.cost-price-delete-form {
  display: flex;
  justify-content: center;
  margin-top: 4px;
}

.cost-price-delete-button {
  min-width: 150px;
  padding: 9px 14px;
  border: 1px solid var(--danger-strong);
  border-radius: 8px;
  background:
    rgba(239, 68, 68, 0.1);
  color: var(--danger-pale);
  font-weight: 800;
  cursor: pointer;
}

.cost-price-saved-date {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  color: var(--grey-400);
  font-size: 12px;
  text-align: left;
}

.cost-price-saved-conversions {
  display: block;
  width: 100%;
  margin-top: 12px;
  color: var(--grey-400);
  font-size: 12px;
  text-align: center;
  white-space: nowrap;
}

.cost-price-saved-conversions span {
  margin: 0 5px;
}

@media (max-width: 420px) {
  .cost-price-saved-conversions {
    font-size: 10px;
  }

  .cost-price-saved-conversions span {
    margin: 0 2px;
  }
}

.cost-price-saved-item {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
}

.cost-price-saved-summary {
  display: flex;
    width: 100%;
  min-width: 0;
  box-sizing: border-box;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
}

.cost-price-saved-summary::-webkit-details-marker {
  display: none;
}

.cost-price-saved-summary::after {
  content: "▶";
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--value);
  font-size: 13px;
  transition: transform 0.2s ease;
}

.cost-price-saved-item[open]
  > .cost-price-saved-summary::after {
  transform: rotate(90deg);
}

.cost-price-saved-summary small {
  flex: 0 0 auto;
  color: var(--grey-400);
  font-size: 11px;
  font-weight: 500;
}

.cost-price-saved-summary strong {
  min-width: 0;
  color: var(--grey-50);
  font-size: 17px;
  text-align: left;
}

.cost-price-saved-content {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 8px 14px 16px;
  border-top: 1px solid var(--grey-700);
  box-sizing: border-box;
}

.cost-price-saved-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 6px 0;
}

.cost-price-saved-result b {
  color: var(--value);
  white-space: nowrap;
}

/* Correctif final des fiches de calcul enregistrées */

details.cost-price-saved-item {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
}

details.cost-price-saved-item
  > .cost-price-saved-summary {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 54px;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 10px 14px;
  box-sizing: border-box;
  cursor: pointer;
  list-style: none;
}

details.cost-price-saved-item
  > .cost-price-saved-summary::marker {
  content: "";
}

details.cost-price-saved-item
  > .cost-price-saved-summary::-webkit-details-marker {
  display: none;
}

details.cost-price-saved-item
  > .cost-price-saved-summary::after {
  content: "▶";
  flex: 0 0 auto;
  margin-left: 2px;
  color: var(--value);
  font-size: 13px;
  transition: transform 0.2s ease;
}

details.cost-price-saved-item[open]
  > .cost-price-saved-summary::after {
  transform: rotate(90deg);
}

details.cost-price-saved-item
  > .cost-price-saved-summary
  small {
  flex: 0 0 auto;
  color: var(--grey-400);
  font-size: 11px;
  font-weight: 500;
}

details.cost-price-saved-item
  > .cost-price-saved-summary
  strong {
  min-width: 0;
  color: var(--grey-50);
  font-size: 17px;
  text-align: left;
}

details.cost-price-saved-item
  > .cost-price-saved-content {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 8px 14px 16px;
  border-top: 1px solid var(--grey-700);
  box-sizing: border-box;
}

details.cost-price-saved-item
  > .cost-price-saved-content
  > .cost-price-saved-result {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  box-sizing: border-box;
}

details.cost-price-saved-item
  > .cost-price-saved-content
  > .cost-price-saved-result
  b {
  flex: 0 0 auto;
  color: var(--value);
  white-space: nowrap;
}

details.cost-price-saved-item
  .cost-price-saved-conversions {
  display: block;
  width: 100%;
  margin: 12px 0 0;
  color: var(--grey-400);
  font-size: 12px;
  text-align: center;
  white-space: nowrap;
}

details.cost-price-saved-item
  .cost-price-delete-form {
  display: flex;
  justify-content: center;
  margin-top: 14px;
}

@media (max-width: 700px) {
  .mercuriale-product-dialog input,
  .mercuriale-product-dialog select,
  .mercuriale-product-dialog textarea,
  .mercuriale-dialog-form input,
  .mercuriale-dialog-form select,
  .mercuriale-dialog-form textarea {
    font-size: 16px;
  }
}
.mercuriale-preview-product-card {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
  padding: 10px;
  border: 1px solid var(--grey-600);
  border-radius: 12px;
  background: rgba(17, 24, 39, 0.55);
  box-sizing: border-box;
}

.mercuriale-preview-product-card.is-associated {
  border-color: rgba(34, 197, 94, 0.65);
  background: rgba(34, 197, 94, 0.05);
}

.mercuriale-preview-product-card.is-unassociated {
  border-color: rgba(245, 158, 11, 0.65);
  background: rgba(245, 158, 11, 0.05);
}

.mercuriale-preview-product-card
  > .mercuriale-demarne-line {
  margin: 0;
}

.mercuriale-preview-product-card
  > .dashboard-refresh-button {
  width: 100%;
  margin: 0;
}

.mercuriale-demarne-association-ok {
  display: grid;
  gap: 4px;
}

.mercuriale-demarne-association-ok small {
  color: var(--grey-400);
  font-weight: 500;
}

.mercuriale-edit-product-button {
  border-color: var(--success-strong);
  background: rgba(34, 197, 94, 0.12);
  color: #86efac;
}

.mercuriale-import-validated-button {
  border-color: var(--success-strong);
  background: rgba(34, 197, 94, 0.2);
  color: #86efac;
}

.mercuriale-import-validated-button:hover {
  border-color: #4ade80;
  background: rgba(34, 197, 94, 0.28);
  color: #bbf7d0;
}

.mercuriale-unassociate-form {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--grey-600);
}

.mercuriale-unassociate-button {
  width: 100%;
  border-color: var(--danger-strong);
  background: rgba(239, 68, 68, 0.12);
  color: var(--danger-pale);
}

.mercuriale-unassociate-button:hover {
  border-color: var(--danger-light);
  background: rgba(239, 68, 68, 0.2);
  color: #fecaca;
}

.superadmin-product-search-field {
  position: relative;
}

.superadmin-product-results {
  display: grid;
  gap: 6px;
  max-height: 280px;
  margin-top: 8px;
  padding: 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--grey-650);
  border-radius: 10px;
  background: var(--grey-900);
}

.superadmin-product-results[hidden] {
  display: none;
}

.superadmin-product-result {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--grey-700);
  border-radius: 8px;
  background: var(--grey-800);
  color: var(--grey-50);
  text-align: left;
  cursor: pointer;
}

.superadmin-product-result:hover,
.superadmin-product-result:focus {
  border-color: var(--info-strong);
  background: var(--surface-23);
  outline: none;
}

.superadmin-product-result strong {
  font-size: 14px;
}

.superadmin-product-result small {
  color: var(--grey-450);
  font-size: 11px;
}

.superadmin-product-result-empty {
  padding: 12px;
  color: var(--grey-450);
  text-align: center;
}

@media (max-width: 700px) {
  .superadmin-product-results {
    max-height: 220px;
  }

  .superadmin-product-result {
    min-height: 52px;
  }
}
.mercuriale-client-product-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.mercuriale-client-product-cell
  > strong {
  min-width: 0;
  flex: 1;
}

.mercuriale-client-edit-button {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid var(--info-strong);
  border-radius: 6px;
  background: rgba(59, 130, 246, 0.12);
  color: #93c5fd;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.mercuriale-client-edit-button:hover {
  background: rgba(59, 130, 246, 0.25);
}

@media (max-width: 700px) {
  .mercuriale-client-row
    > .mercuriale-client-product-cell {
    grid-column: 1 / -1;
    padding-bottom: 10px;
    text-align: left;
  }

  .mercuriale-client-product-cell
    > strong {
    font-size: 15px;
  }
}

.mercuriale-client-product-identity {
  display: grid;
  flex: 1;
  gap: 3px;
  min-width: 0;
}

.mercuriale-client-product-identity
  > strong {
  min-width: 0;
}

.mercuriale-client-product-identity
  > small {
  color: var(--grey-450);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
}

.mercuriale-add-product-button {
  width: 100%;
  margin: 14px 0 18px;
  border-color: var(--success-strong);
  background:
    rgba(34, 197, 94, 0.14);
  color: #86efac;
}

.mercuriale-add-product-button:hover {
  background:
    rgba(34, 197, 94, 0.25);
}

.mercuriale-dialog-form
  input:required,
.mercuriale-dialog-form
  select:required,
.mercuriale-price-required-choice {
  border: 2px solid var(--accent-strong);
}

.mercuriale-dialog-form
  input:required:valid,
.mercuriale-dialog-form
  select:required:valid {
  border-color: var(--success-strong);
}


.mercuriale-dialog-form
  input:required,
.mercuriale-dialog-form
  select:required,
.mercuriale-price-required-choice {
  border: 2px solid var(--accent-strong);
}

.mercuriale-dialog-form
  input:required:valid,
.mercuriale-dialog-form
  select:required:valid {
  border-color: var(--success-strong);
}

.mercuriale-client-search {
  display: grid;
  gap: 8px;
  margin: 18px 0;
}

.mercuriale-client-search
  > label {
  color: var(--grey-50);
  font-size: 13px;
  font-weight: 800;
}

.mercuriale-client-search-field {
  position: relative;
}

.mercuriale-client-search-field
  input {
  width: 100%;
  min-height: 48px;
  padding: 12px 48px 12px 14px;
  box-sizing: border-box;
  border: 2px solid var(--grey-650);
  border-radius: 12px;
  background: var(--grey-900);
  color: var(--grey-50);
  font-size: 16px;
}

.mercuriale-client-search-field
  input:focus {
  border-color: var(--info-strong);
  outline: none;
}

.mercuriale-client-search-field
  button {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 34px;
  height: 34px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: 50%;
  background: var(--grey-700);
  color: var(--grey-50);
  font-size: 22px;
  cursor: pointer;
}

.mercuriale-client-search-field
  button[hidden] {
  display: none;
}

.mercuriale-client-search
  > small {
  min-height: 16px;
  color: var(--grey-450);
  font-size: 12px;
}

.mercuriale-client-main-group[hidden],
.mercuriale-client-section[hidden],
.mercuriale-client-row[hidden],
.mercuriale-promotion-item[hidden] {
  display: none !important;
}

/* ===== DÉCOUPE — JOURNÉE DE LA VEILLE ===== */

.decoupe-yesterday-section {
  margin: 0 0 14px;
}

.decoupe-yesterday-hello {
  margin: 0 0 7px;
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
}

.decoupe-yesterday-card {
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(77, 163, 255, 0.07);
  box-shadow:
    inset 3px 0 0 var(--info);
}

.decoupe-yesterday-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.decoupe-yesterday-heading small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.decoupe-yesterday-heading p {
  margin: 3px 0 0;
  font-size: 16px;
  font-weight: 700;
}

.decoupe-yesterday-heading strong {
  color: var(--info);
}

.decoupe-yesterday-card.is-incredible {
  background: rgba(167, 139, 250, 0.1);
  box-shadow:
    inset 3px 0 0 #a78bfa;
}

.decoupe-yesterday-card.is-incredible
  .decoupe-yesterday-heading strong {
  color: #c4b5fd;
}

.decoupe-yesterday-card.is-exceptional {
  background: rgba(244, 114, 182, 0.09);
  box-shadow:
    inset 3px 0 0 #f472b6;
}

.decoupe-yesterday-card.is-exceptional
  .decoupe-yesterday-heading strong {
  color: #f9a8d4;
}

.decoupe-yesterday-card.is-top {
  background: rgba(53, 208, 127, 0.09);
  box-shadow:
    inset 3px 0 0 var(--success);
}

.decoupe-yesterday-card.is-top
  .decoupe-yesterday-heading strong {
  color: var(--success);
}

.decoupe-yesterday-card.is-good {
  background: rgba(255, 209, 102, 0.08);
  box-shadow:
    inset 3px 0 0 #ffd166;
}

.decoupe-yesterday-card.is-good
  .decoupe-yesterday-heading strong {
  color: var(--accent-light);
}

.decoupe-yesterday-card.is-bad {
  background: rgba(248, 113, 113, 0.08);
  box-shadow:
    inset 3px 0 0 #f87171;
}

.decoupe-yesterday-card.is-bad
  .decoupe-yesterday-heading strong {
  color: var(--danger-light);
}

.decoupe-yesterday-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.decoupe-yesterday-metric {
  min-width: 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.14);
  text-align: center;
}

.decoupe-yesterday-metric span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.decoupe-yesterday-metric strong {
  display: block;
  font-size: 16px;
  white-space: nowrap;
}

@media (max-width: 520px) {
  .decoupe-yesterday-card {
    padding: 11px;
  }

  .decoupe-yesterday-metrics {
    gap: 5px;
  }

  .decoupe-yesterday-metric {
    padding: 7px 4px;
  }

  .decoupe-yesterday-metric strong {
    font-size: 13px;
  }
}

/* Ajustements carte de la veille */

.decoupe-yesterday-hello {
  text-align: center;
  text-transform: uppercase;
}

.decoupe-yesterday-heading {
  justify-content: center;
  text-align: center;
}

.decoupe-yesterday-card,
.decoupe-yesterday-card.is-incredible,
.decoupe-yesterday-card.is-exceptional,
.decoupe-yesterday-card.is-top,
.decoupe-yesterday-card.is-good,
.decoupe-yesterday-card.is-bad {
  box-shadow: none;
}

/* ===== DÉCOUPE — CONSIGNES ===== */

.decoupe-instructions-section {
  margin: 0 0 14px;
}

.decoupe-instructions-card {
  padding: 13px 15px;
  border-radius: 10px;
  background: rgba(255, 209, 102, 0.09);
}

.decoupe-instructions-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-bottom: 9px;
  color: var(--accent-light);
  font-size: 15px;
}

.decoupe-instructions-message {
  color: var(--text);
  font-size: 15px;
  font-weight: 650;
  line-height: 1.45;
  text-align: center;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.manual-decoupe-instructions {
  background: rgba(255, 209, 102, 0.07);
}

.manual-decoupe-instructions
  .manual-ramasse-toggle input {
  accent-color: var(--accent-light);
}

/* Ajustement présentation des consignes */

.decoupe-instructions-card {
  padding: 12px 16px 15px;
}

.decoupe-instructions-title {
  justify-content: flex-start;
  margin-bottom: 6px;
}

.decoupe-instructions-message {
  padding-left: 29px;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.35;
  text-align: left;
}

.decoupe-instructions-title {
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.decoupe-instructions-title::-webkit-details-marker {
  display: none;
}

.decoupe-instructions-arrow {
  margin-left: auto;
  color: var(--accent-light);
  transition: transform 0.18s ease;
}

.decoupe-instructions-card[open]
  .decoupe-instructions-arrow {
  transform: rotate(90deg);
}

.decoupe-instructions-card:not([open])
  .decoupe-instructions-title {
  margin-bottom: 0;
}

/* Alignement du titre des consignes */

.decoupe-instructions-title {
  position: relative;
  justify-content: center;
  padding-left: 38px;
  padding-right: 38px;
  text-align: center;
}

.decoupe-instructions-arrow {
  position: absolute;
  left: 14px;
  margin-left: 0;
}

/* Cours fournisseurs dans Ramasse */

.supplier-choice-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.supplier-choice-option small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.supplier-choice-option.is-cheapest {
  color: var(--success);
}

.supplier-choice-option.is-cheapest small {
  color: var(--success);
}

.mercuriale-main-summary {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  text-align: left;
  white-space: nowrap;
}

.mercuriale-main-summary::before {
  flex: 0 0 auto;
  margin-right: 0;
}

.mercuriale-main-summary
  > span {
  min-width: 0;
}

.mercuriale-main-summary
  > small {
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  opacity: 0.8;
}

@media (max-width: 420px) {
  .mercuriale-main-summary {
    gap: 6px;
    padding-right: 10px;
    padding-left: 10px;
  }

  .mercuriale-main-summary
    > small {
    font-size: 10px;
  }
}

main.container
  > .dashboard-stats-details {
  content-visibility: auto;
  contain-intrinsic-block-size:
    auto 72px;
}

.mercuriale-client-row {
  content-visibility: auto;
  contain-intrinsic-block-size:
    auto 48px;
}

#cost-price-calculator-card > .dashboard-stats-summary {
  text-align: left;
}

#cost-price-calculator-card > .dashboard-stats-summary {
  text-align: left;
  padding: 12px 14px;
}

#cost-price-calculator-card > .dashboard-stats-summary::before {
  margin-right: 10px;
}

@media (max-width: 700px) {
  #cost-price-calculator-card > .dashboard-stats-summary {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.comparison-search-field {
  display: block;
  width: 100%;
  min-height: 44px;
  padding: 11px 12px;
  margin: 0 0 10px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel);
  color: var(--text);
  font-size: 16px;
  font-family: inherit;
  box-sizing: border-box;
}

.comparison-search-field:focus {
  outline: none;
  border-color: var(--accent);
}

.comparison-search-info {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
}

/* ===== poids brut et net en ramasse ===== */

.picked-client-header {
  text-align: center;
}

.picked-client-line .client-qty {
  text-align: center;
}

.picked-weight-edit {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.picked-weight-edit .picked-weight-input {
  text-align: center;
}

.picked-net-input {
  border-color: var(--value);
  border-style: solid;
}

.picked-client-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.picked-loss {
  display: none;
}

.picked-loss.picked-loss-shown {
  display: block;
  color: var(--value);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.picked-loss.picked-loss-alerte {
  color: var(--red-light);
}

/* ===== menu fixe sous le bandeau ===== */

.mfs-mobile-nav {
  position: sticky;
  top: 0;
  z-index: 55;
  background: var(--bg);
}

/* ===== filtre de previsualisation des cours ===== */

.mercuriale-preview-filter {
  display: flex;
  gap: 8px;
  margin: 0 0 14px;
}

.mercuriale-filter-button {
  flex: 1;
  padding: 10px 8px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel2);
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
}

.mercuriale-filter-button.is-active {
  border-color: var(--info);
  background: rgba(77, 163, 255, 0.14);
  color: var(--info);
}

/* ===== suivi d'envoi des SMS ===== */

.supplier-sms-button.sms-a-envoyer {
  border-color: var(--red);
  color: var(--red-light);
}

.supplier-sms-button.sms-envoye {
  border-color: var(--success);
  color: var(--success);
}

/* ===== suivi d'envoi des SMS ===== */

.supplier-sms-button.sms-a-envoyer {
  border-color: var(--red);
  color: var(--red-light);
}

.supplier-sms-button.sms-envoye {
  border-color: var(--success);
  color: var(--success);
}

/* ===== carte stock ===== */

.stock-list {
  display: block !important;
  padding: 0;
  overflow: hidden;
}

.stock-lines {
  padding: 0 14px 12px;
}

.stock-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  width: 100%;
  padding: 8px 0;
  border-bottom: 1px solid var(--overlay-1);
  box-sizing: border-box;
}

.stock-label {
  min-width: 0;
  color: var(--white);
  font-size: 17px;
}

.stock-qty {
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .stock-lines {
    padding: 0 12px 12px;
  }
}

/* ===== stock : specificite ===== */

.compact-summary-card .stock-line .stock-label {
  color: var(--white);
  font-size: 17px;
}

.compact-summary-card .stock-line .stock-qty {
  color: var(--value);.
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

/* ===== regroupement des postes par fournisseur ===== */

.company-group {
  margin: 0 0 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel);
  overflow: hidden;
}

.company-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
}

.company-bar::-webkit-details-marker {
  display: none;
}

.company-bar::before {
  content: "\25B6";
  flex: none;
  color: var(--value);
  font-size: 11px;
  line-height: 1;
}

.company-group[open] > .company-bar::before {
  content: "\25BC";
}

.company-group .company-name {
  flex: 1;
  min-width: 0;
  color: var(--value);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.company-group .company-info {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.company-posts {
  padding: 0 10px 10px;
}

.company-posts .supplier-group {
  margin-bottom: 10px;
}

.company-posts .supplier-group:last-child {
  margin-bottom: 0;
}

/* ===== rattachement depuis la comparaison fournisseurs ===== */

.comparison-filter {
  display: flex;
  gap: 8px;
  margin: 0 0 10px;
}

.comparison-filter .mercuriale-filter-button {
  flex: 1;
}

.comparison-attach {
  margin: 10px 0 0;
  border-top: 1px solid var(--overlay-2);
}

.comparison-attach-summary {
  padding: 10px 0;
  color: var(--accent);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}

.comparison-attach-summary::-webkit-details-marker {
  display: none;
}

.comparison-attach-summary::before {
  content: "\25B6  ";
  font-size: 10px;
}

.comparison-attach[open] > .comparison-attach-summary::before {
  content: "\25BC  ";
}

.comparison-attach-body {
  padding: 0 0 12px;
}

.comparison-suggestions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 12px;
}

.comparison-suggestion {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel2);
  color: var(--text);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.comparison-suggestion strong {
  font-size: 14px;
}

.comparison-suggestion span {
  color: var(--info);
  font-size: 13px;
  font-weight: 700;
}

.comparison-suggestion em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.comparison-attach-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mercuriale-comparison-row.needs-ref {
  border-left: 3px solid var(--accent);
  padding-left: 10px;
}

/* ===== MFS PLANNING ===== */

:root {
  --pl-accent: var(--value);
}

.pl-page-title {
  margin: 18px 0 10px;
  color: var(--pl-accent);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-align: center;
  text-transform: uppercase;
}

.pl-monthbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 16px 0 26px;
}

.pl-monthbar-form {
  display: flex;
  flex: 1;
  max-width: 260px;
  margin: 0;
}

.pl-month-input {
  flex: 1;
  height: 48px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel2);
  color: var(--text);
  font-size: 16px;
  font-family: inherit;
  text-align: center;
  box-sizing: border-box;
}

.pl-nav-month {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel2);
  color: var(--text);
  font-size: 20px;
  text-decoration: none;
  box-sizing: border-box;
}

.pl-back-today {
  margin: 0 0 14px;
  text-align: center;
  font-size: 13px;
}

.pl-back-today a {
  color: var(--accent);
}

.pl-section {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin: 0 0 14px;
  overflow: hidden;
}

.pl-summary {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 15px 16px;
  color: var(--accent);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  list-style: none;
  cursor: pointer;
}

.pl-summary::-webkit-details-marker {
  display: none;
}

.pl-summary::before {
  content: "\25B6";
  font-size: 11px;
  line-height: 1;
}

.pl-section[open] > .pl-summary::before {
  content: "\25BC";
}

.pl-body {
  padding: 0 16px 16px;
}

.pl-label {
  display: block;
  margin: 0 0 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
}

.pl-field {
  display: block;
  width: 100%;
  min-height: 44px;
  padding: 11px 12px;
  margin: 0 0 13px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel2);
  color: var(--text);
  font-size: 16px;
  font-family: inherit;
  box-sizing: border-box;
}

.pl-field:focus {
  outline: none;
  border-color: var(--accent);
}

.pl-fields {
  display: flex;
  gap: 12px;
}

.pl-field-half {
  flex: 1;
}

.pl-btn {
  display: inline-block;
  padding: 11px 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel2);
  color: var(--text);
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  text-align: center;
  cursor: pointer;
}

.pl-btn-main {
  width: 100%;
  padding: 14px;
  border-color: var(--pl-accent);
  background: rgba(94, 234, 212, 0.12);
  color: var(--pl-accent);
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
}

.pl-btn-blue {
  border-color: var(--pl-accent);
  background: rgba(94, 234, 212, 0.12);
  color: var(--pl-accent);
  font-weight: 700;
}

.pl-btn-small {
  padding: 8px 13px;
  font-size: 13px;
}

.pl-btn-danger {
  background: transparent;
  border-color: var(--red);
  color: var(--red-light);
}

.pl-flash {
  padding: 11px 13px;
  margin: 0 0 14px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
}

.pl-flash-ok {
  background: rgba(94, 234, 212, 0.15);
  color: var(--pl-accent);
}

.pl-flash-error {
  background: rgba(181, 31, 46, 0.18);
  color: var(--red-light);
}

.pl-absence,
.pl-recap,
.pl-day {
  padding: 12px 14px;
  margin: 0 0 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel2);
}

.pl-absence-head,
.pl-recap-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.pl-absence-name {
  font-size: 15px;
  font-weight: 700;
}

.pl-absence-dates {
  color: var(--muted);
  font-size: 14px;
}

.pl-absence-delete {
  margin: 10px 0 0;
}

.pl-tag {
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
}

.pl-tag-cp {
  background: rgba(94, 234, 212, 0.15);
  color: var(--pl-accent);
}

.pl-tag-absence {
  background: rgba(245, 166, 35, 0.15);
  color: var(--accent);
}

.pl-tag-maladie {
  background: rgba(181, 31, 46, 0.18);
  color: var(--red-light);
}

.pl-day-label {
  margin-bottom: 8px;
  color: var(--accent);
  font-size: 14px;
  font-weight: 700;
}

.pl-day-person {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  font-size: 15px;
}

.pl-recap-total {
  color: var(--pl-accent);
  font-size: 15px;
  font-weight: 700;
}

.pl-recap-line {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid var(--overlay-1);
  font-size: 14px;
}

.pl-recap-text {
  min-height: 180px;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
}

.pl-employee-row {
  padding: 12px 0;
  border-bottom: 1px solid var(--overlay-1);
}

.pl-employee-new {
  padding-top: 14px;
}

.pl-empty {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 14px;
}

.pl-holidays {
  padding: 12px 14px;
  border: 1px dashed var(--border);
  border-radius: 10px;
}

.pl-holiday {
  padding: 4px 0;
  color: var(--muted);
  font-size: 14px;
}

.pl-tag-repos {
  background: rgba(77, 163, 255, 0.15);
  color: var(--info);
}

/* ===== vue mensuelle en grille ===== */

.pl-grid-wrap {
  overflow-x: auto;
  margin: 0 0 14px;
}

.pl-grid {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 13px;
}

.pl-grid th,
.pl-grid td {
  padding: 5px 4px;
  border: 1px solid var(--overlay-2);
  text-align: center;
}

.pl-grid thead th {
  background: var(--panel2);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pl-grid-day {
  width: 52px;
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

.pl-grid-letter {
  margin-right: 4px;
  opacity: 0.6;
}

.pl-grid-number {
  color: var(--text);
}

.pl-row-off td,
.pl-row-off .pl-grid-day {
  background: var(--overlay-1);
}

.pl-row-today .pl-grid-day {
  color: var(--accent);
}

.pl-cell {
  display: block;
  font-weight: 800;
}

.pl-cell-cp {
  background: rgba(94, 234, 212, 0.28);
  color: var(--surface-02);
}

.pl-cell-repos {
  background: rgba(77, 163, 255, 0.28);
  color: var(--surface-01);
}

.pl-cell-absence {
  background: rgba(245, 166, 35, 0.32);
  color: var(--surface-27);
}

.pl-cell-maladie {
  background: rgba(216, 58, 73, 0.34);
  color: var(--surface-26);
}

.pl-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.pl-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.pl-legend-item .pl-cell {
  display: inline-block;
  min-width: 22px;
  padding: 2px 0;
  border-radius: 4px;
  text-align: center;
}

/* ============================================================
   MODE CLAIR
   Chaque role garde le meme sens qu'en sombre, avec une
   teinte lisible sur fond clair.
   ============================================================ */

/* ============================================================
   CARTES PRINCIPALES
   Toutes les cartes depliables adoptent la meme presentation
   que la carte STOCK : fond de panneau, bord net, espacement.
   ============================================================ */

.summary-card,
.decoupe-stats-details,
.decoupe-instructions-card,
.cmd-section,
.pl-section,
.dashboard-stats-details,
.dolibarr-api-stats {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: 6px;
  overflow: hidden;
}

:root[data-theme="light"] .summary-card,
:root[data-theme="light"] .decoupe-stats-details,
:root[data-theme="light"] .decoupe-instructions-card,
:root[data-theme="light"] .cmd-section,
:root[data-theme="light"] .pl-section,
:root[data-theme="light"] .dashboard-stats-details,
:root[data-theme="light"] .dolibarr-api-stats {
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06);
}

/* boutons blancs sur blanc : on ne vise que ceux sans couleur propre */

:root[data-theme="light"] .decoupe-pdf-sheet,
:root[data-theme="light"] .decoupe-delete-sheet,
:root[data-theme="light"] .mercuriale-import-button,
:root[data-theme="light"] .mercuriale-preview-button,
:root[data-theme="light"] .dashboard-refresh-button,
:root[data-theme="light"] .missing-button {
  border: 1px solid var(--border);
  color: var(--text);
}

:root[data-theme="light"] {
  --bg: #eef0f4;
  --panel: #ffffff;
  --panel2: #f4f6f9;
  --border: #d5dae1;
  --text: #16191f;
  --muted: #5b6472;

  --accent: #b45309;
  --accent-light: #c2740a;
  --accent-strong: #a85f00;
  --accent-mid: #b87613;

  --info: #1f6feb;
  --info-strong: #1a5fd0;
  --info-light: #3b82f6;

  --success: #147d4a;
  --success-strong: #12703f;
  --success-alt: #157f4b;
  --success-dark: #0f6238;

  --value: #0d9488;
  --value-strong: #0b7c72;

  --danger: #c0392b;
  --danger-strong: #a93226;
  --danger-dark: #8e2a20;
  --danger-light: #c0392b;
  --danger-pale: #d95c4e;

  --red: var(--surface-36);
  --red-light: #a02030;

  --white: #ffffff;
  --grey-50: #f7f8fa;
  --grey-400: #6b7480;
  --grey-450: #6b7480;
  --grey-600: #d5dae1;
  --grey-650: #d5dae1;
  --grey-700: #e3e7ec;
  --grey-750: #e3e7ec;
  --grey-800: #eef0f4;
  --grey-900: #ffffff;

  --overlay-1: rgba(17, 24, 39, 0.08);
  --overlay-2: rgba(17, 24, 39, 0.13);
  --overlay-3: rgba(17, 24, 39, 0.22);

  --surface-01: #eaedf1;
  --surface-02: #eaf1f0;
  --surface-03: #eaedf0;
  --surface-04: #ecedef;
  --surface-05: #eaf1f0;
  --surface-06: #f5f5f5;
  --surface-07: #eaf1ed;
  --surface-08: #ecedef;
  --surface-09: #ebedef;
  --surface-10: #eaf1ed;
  --surface-11: #ebedef;
  --surface-12: #ebedef;
  --surface-13: #ebedef;
  --surface-14: #eaecf1;
  --surface-15: #ecedef;
  --surface-16: #ebedef;
  --surface-17: #eaecf1;
  --surface-18: #eaedf1;
  --surface-19: #f4f5f5;
  --surface-20: #ebedef;
  --surface-21: #ecedef;
  --surface-22: #ebedef;
  --surface-23: #eaedf0;
  --surface-24: #f4f5f5;
  --surface-25: #f0edea;
  --surface-26: #f1eaeb;
  --surface-27: #f1eeea;
  --surface-28: #f5f5f5;
  --surface-29: #ebedef;
  --surface-30: #f1ecea;
  --surface-31: #f5f5f5;
  --surface-32: #f5f5f5;
  --surface-33: #f1ecea;
  --surface-34: #f1eaea;
  --surface-35: #f1ecea;
  --surface-36: #f1eaea;
}

:root[data-theme="light"] body {
  background: var(--bg);
  color: var(--text);
}

:root[data-theme="light"] .topbar,
:root[data-theme="light"] .mfs-mobile-nav,
:root[data-theme="light"] .mfs-mobile-menu {
  background: var(--panel);
}

:root[data-theme="light"] .mfs-module-link {
  background: var(--panel2);
  color: var(--text);
}

:root[data-theme="light"] .mfs-menu-toggle {
  background: var(--panel2);
  color: var(--text);
}

/* ------------------------------------------------------------
   MODE CLAIR : reglages fins
   ------------------------------------------------------------ */

/* les titres passent en noir, la couleur reste aux reperes */

:root[data-theme="light"] .pl-page-title,
:root[data-theme="light"] .cmd-page-title,
:root[data-theme="light"] .mfs-module-link {
  color: var(--text);
}

/* textes redevenus lisibles */

:root[data-theme="light"] .decoupe-date-count,
:root[data-theme="light"] .decoupe-date-weight,
:root[data-theme="light"] .stock-label,
:root[data-theme="light"] .heures-nom {
  color: var(--text);
}

/* le fond entre les cartes reprend la couleur de la page */

:root[data-theme="light"] .decoupe-stats-section,
:root[data-theme="light"] .decoupe-instructions-section,
:root[data-theme="light"] .summary,
:root[data-theme="light"] .container > section {
  background: transparent;
}

/* champs de saisie */

:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea {
  background: var(--panel2);
  color: var(--text);
  border-color: var(--border);
}

/* ------------------------------------------------------------
   MODE CLAIR : lisibilite des textes clairs
   ------------------------------------------------------------ */

:root[data-theme="light"] .client-qty,
:root[data-theme="light"] .client-line::before,
:root[data-theme="light"] .decoupe-date-count,
:root[data-theme="light"] .decoupe-date-arrow,
:root[data-theme="light"] .stock-label,
:root[data-theme="light"] .compact-summary-card .stock-line .stock-label,
:root[data-theme="light"] .ramasse-yesterday-metrics strong,
:root[data-theme="light"] .dolibarr-api-stats-content strong,
:root[data-theme="light"] .mercuriale-product-result,
:root[data-theme="light"] .mercuriale-search,
:root[data-theme="light"] .mercuriale-filter,
:root[data-theme="light"] .marge-nette-filter label,
:root[data-theme="light"] .marge-nette-filter select,
:root[data-theme="light"] .mercuriale-product-form select,
:root[data-theme="light"] .mercuriale-demarne-associate-form input,
:root[data-theme="light"] .mercuriale-dolibarr-manual-form input,
:root[data-theme="light"] .cutting-client-line,
:root[data-theme="light"] .cutting-client-line strong,
:root[data-theme="light"] .cutting-clients {
  color: var(--text);
}

/* la carte du bilan de la veille se detache */

:root[data-theme="light"] .ramasse-yesterday,
:root[data-theme="light"] .ramasse-yesterday-card {
  border: 1px solid var(--border);
  box-shadow: 0 1px 3px rgba(17, 24, 39, 0.10);
}

/* cartes fournisseur : blanches sur fond gris */

:root[data-theme="light"] .supplier-group {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
}

:root[data-theme="light"] .supplier-list,
:root[data-theme="light"] .suppliers,
:root[data-theme="light"] .tab-content,
:root[data-theme="light"] #tab-active,
:root[data-theme="light"] #tab-picked,
:root[data-theme="light"] #tab-cutting {
  background: var(--bg);
}

:root[data-theme="light"] .supplier-bar,
:root[data-theme="light"] .supplier-header {
  background: var(--panel);
}

/* le nom du fournisseur ressort en bleu */

:root[data-theme="light"] .supplier-group:not(.manual-ramasse-gbp):not(.manual-ramasse-consommable-mfs):not([data-supplier="MEDELYS" i]):not([data-supplier*="MASSE" i]) .supplier-name,
:root[data-theme="light"] .supplier-group:not(.manual-ramasse-gbp):not(.manual-ramasse-consommable-mfs):not([data-supplier="MEDELYS" i]):not([data-supplier*="MASSE" i]) .supplier-toggle,
:root[data-theme="light"] .supplier-group:not(.manual-ramasse-gbp):not(.manual-ramasse-consommable-mfs):not([data-supplier="MEDELYS" i]):not([data-supplier*="MASSE" i]) .supplier-arrow {
  color: var(--info-strong);
}

/* GBP et consommables gardent leur couleur, assombrie */

:root[data-theme="light"] .manual-ramasse-gbp .supplier-name,
:root[data-theme="light"] .manual-ramasse-gbp .supplier-arrow,
:root[data-theme="light"] .manual-ramasse-gbp > .supplier-bar .supplier-toggle {
  color: #b3261e;
}

:root[data-theme="light"] .manual-ramasse-consommable-mfs .supplier-name,
:root[data-theme="light"] .manual-ramasse-consommable-mfs .supplier-arrow,
:root[data-theme="light"] .manual-ramasse-consommable-mfs > .supplier-bar .supplier-toggle {
  color: #0b7268;
}

/* calculs enregistres : libelles lisibles */

:root[data-theme="light"] .cost-price-saved-summary,
:root[data-theme="light"] .cost-price-saved-summary strong,
:root[data-theme="light"] .cost-price-saved-summary small,
:root[data-theme="light"] .cost-price-saved-item,
:root[data-theme="light"] .cost-price-saved-content,
:root[data-theme="light"] .cost-price-saved-result,
:root[data-theme="light"] .cost-price-saved-conversions,
:root[data-theme="light"] .cost-price-product-name {
  color: var(--text);
}

/* MEDELYS garde son mauve, simplement assombri pour rester lisible */

:root[data-theme="light"]
  .supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-name,
:root[data-theme="light"]
  .supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-arrow,
:root[data-theme="light"]
  .supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar
  .supplier-toggle {
  color: #6d28d9;
}

/* les trois cartes du haut se rapprochent */

.summary-card.compact-summary-card {
  margin-bottom: 6px;
}

/* la barre du fournisseur reprend le blanc de la carte,
   sauf pour les trois qui ont une teinte propre */

:root[data-theme="light"]
  .supplier-group:not(.manual-ramasse-gbp):not(.manual-ramasse-consommable-mfs):not([data-supplier="MEDELYS" i])
  .supplier-toggle {
  background: transparent;
}

:root[data-theme="light"] .supplier-group {
  margin-top: 10px;
  border-top: 0;
}

:root[data-theme="light"] .supplier-group:first-child {
  margin-top: 0;
}

.mfs-theme-toggle {
  display: block;
  width: auto;
  margin: 8px auto 2px;
  padding: 7px 14px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--panel2);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  font-family: inherit;
  letter-spacing: 0.4px;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
}

/* ===== RAMASSE — RÉSULTATS DE LA VEILLE ===== */

.ramasse-yesterday-section {
  margin-bottom: 24px;
}

.ramasse-yesterday-card {
  padding: 20px;
  border: 1px solid var(--success);
  border-radius: 14px;
  background: rgba(53, 208, 127, 0.09);
}

.ramasse-yesterday-heading {
  margin-bottom: 18px;
  text-align: center;
}

.ramasse-yesterday-heading small {
  color: var(--muted);
  font-weight: 700;
}

.ramasse-yesterday-heading p {
  margin: 7px 0 0;
  color: var(--success);
  font-size: 21px;
  font-weight: 800;
}

.ramasse-yesterday-metrics {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ramasse-yesterday-metrics > div {
  display: grid;
  gap: 7px;
  padding: 14px 8px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.16);
  text-align: center;
}

.ramasse-yesterday-metrics span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.ramasse-yesterday-metrics strong {
  color: var(--white);
  font-size: 19px;
}

.daily-history-details {
  margin-top: 14px;
  border-top: 1px solid
    var(--overlay-2);
}

.daily-history-details > summary {
  padding: 15px 4px 4px;
  color: #8bc2ff;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.daily-history-list {
  display: grid;
  gap: 5px;
  margin-top: 12px;
}

.daily-history-row {
  display: grid;
  grid-template-columns:
    minmax(90px, 1.25fr)
    repeat(3, minmax(60px, 1fr));
  gap: 7px;
  align-items: center;
  padding: 9px 7px;
  border-radius: 7px;
  background: rgba(0, 0, 0, 0.13);
  text-align: right;
}

.daily-history-row > :first-child {
  text-align: left;
}

.daily-history-header {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 600px) {
  .ramasse-yesterday-card {
    padding: 16px 12px;
  }

  .ramasse-yesterday-heading p {
    font-size: 18px;
  }

  .ramasse-yesterday-metrics {
    gap: 6px;
  }

  .ramasse-yesterday-metrics > div {
    padding: 12px 4px;
  }

  .ramasse-yesterday-metrics span {
    font-size: 10px;
  }

  .ramasse-yesterday-metrics strong {
    font-size: 16px;
  }

  .daily-history-row {
    grid-template-columns:
      minmax(77px, 1.2fr)
      repeat(3, minmax(52px, 1fr));
    gap: 4px;
    padding: 8px 4px;
    font-size: 12px;
  }
}

/* Centrage du tableau des 7 derniers jours */

.daily-history-row,
.daily-history-row > :first-child {
  text-align: center;
}

.daily-history-row {
  text-align: center;
}

.daily-history-row > :first-child {
  text-align: center;
}

.daily-history-details > summary {
  font-size: 13px;
}


/* ===== produits ramasses depliables ===== */

.picked-details {
  width: 100%;
}

.picked-summary {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 0;
  cursor: pointer;
  list-style: none;
}

.picked-summary::-webkit-details-marker {
  display: none;
}

.picked-summary::before {
  content: "\25B6";
  flex: none;
  color: var(--accent);
  font-size: 11px;
  line-height: 1;
}

.picked-details[open] > .picked-summary::before {
  content: "\25BC";
}

.picked-summary .product-label {
  min-width: 0;
}

/* ===== bandeau du bilan de la veille, plus compact ===== */

.decoupe-yesterday-card,
.ramasse-yesterday-card {
  padding: 12px 14px;
}

.decoupe-yesterday-heading,
.ramasse-yesterday-heading {
  margin-bottom: 8px;
}

.decoupe-yesterday-hello,
.ramasse-yesterday-hello {
  margin: 0 0 6px;
  font-size: 15px;
}

.decoupe-yesterday-metric,
.ramasse-yesterday-metric {
  padding: 8px 6px;
}

.decoupe-yesterday-section,
.ramasse-yesterday-section {
  margin-bottom: 10px;
}

/* ===== nouvelle fiche de decoupe ===== */

.decoupe-new-sheet .decoupe-field input {
  min-height: 50px;
  background: var(--panel);
}

:root[data-theme="light"] .decoupe-new-sheet .decoupe-field input {
  background: var(--white);
}

.decoupe-new-sheet .refresh {
  min-height: 50px;
  border: 1px solid var(--value);
  border-radius: 10px;
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
  font-weight: 700;
  letter-spacing: 0.5px;
}

:root[data-theme="light"] .decoupe-new-sheet .refresh {
  background: rgba(13, 148, 136, 0.12);
  border-color: var(--value);
  color: var(--value);
}

/* nom du client dans les fiches enregistrees */

:root[data-theme="light"] .decoupe-client-open,
:root[data-theme="light"] .decoupe-saved-sheet-info,
:root[data-theme="light"] .decoupe-saved-sheet-info span {
  color: var(--text);
}

/* ===== champs modifiables sur fond blanc en mode clair ===== */

:root[data-theme="light"] .cmd-field,
:root[data-theme="light"] .cmd-mail-body,
:root[data-theme="light"] .cmd-textarea,
:root[data-theme="light"] .cmd-body textarea,
:root[data-theme="light"] .cmd-body input,
:root[data-theme="light"] .cmd-body select,
:root[data-theme="light"] .cmd-sub-body textarea,
:root[data-theme="light"] .cmd-sub-body input,
:root[data-theme="light"] .cmd-sub-body select {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* lignes d'articles des commandes recues */

:root[data-theme="light"] .cmd-line {
  background: var(--white);
}

/* ===== planning : champs modifiables sur fond blanc ===== */

:root[data-theme="light"] .pl-body .pl-field,
:root[data-theme="light"] .pl-body input,
:root[data-theme="light"] .pl-body select,
:root[data-theme="light"] .pl-body textarea,
:root[data-theme="light"] .pl-month-input {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* planning : sous-carte grise en retrait, comme dans les commandes */

:root[data-theme="light"] .pl-section > .pl-body {
  margin: 0 12px 12px;
  padding: 12px;
  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 10px;
}

/* la vue du mois reste telle quelle */

:root[data-theme="light"] #grille > .pl-body {
  margin: 0;
  padding: 0 16px 16px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

/* ===== superadmin : meme hierarchie que les autres pages ===== */

:root[data-theme="light"] .dashboard-stats-details > .dashboard-stats-content {
  margin: 0 12px 12px;
  padding: 12px;
  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 10px;
}

/* cartes fournisseur imbriquees : blanches sur le gris */

:root[data-theme="light"] .mercuriale-supplier-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
}

:root[data-theme="light"] .mercuriale-supplier-summary {
  color: var(--accent);
}

/* onglets import et previsualisation */

:root[data-theme="light"] [data-supplier-tab] {
  background: var(--panel2);
  color: var(--text);
  border: 1px solid var(--border);
}

:root[data-theme="light"] [data-supplier-tab].active {
  background: rgba(31, 111, 235, 0.12);
  border-color: var(--info);
  color: var(--info-strong);
}

/* champs de fichier et boutons d'import */

:root[data-theme="light"] input[type="file"] {
  background: var(--white);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 8px;
}

/* superadmin : noms de fournisseurs plus discrets */

:root[data-theme="light"] .mercuriale-supplier-summary {
  color: var(--text);
  font-size: 15px;
}

/* admin mercuriale client : libelles lisibles */

:root[data-theme="light"] .mercuriale-client-heading span,
:root[data-theme="light"] .mercuriale-client-section-summary span,
:root[data-theme="light"] .mercuriale-client-section-summary small {
  color: var(--text);
}

/* carte API Dolibarr */

:root[data-theme="light"] .dolibarr-api-stats {
  background: var(--panel);
}

:root[data-theme="light"] .dolibarr-api-stats > summary {
  color: var(--info-strong);
}

:root .dolibarr-api-stats > summary,
:root[data-theme="light"] .dolibarr-api-stats > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  text-align: center;
}

:root .dolibarr-api-stats > summary::before {
  margin-right: 0;
}

/* indicateurs du bilan de la veille sur fond blanc */

:root[data-theme="light"] .ramasse-yesterday-metric,
:root[data-theme="light"] .decoupe-yesterday-metric {
  background: var(--white);
  border: 1px solid var(--border);
}

/* commandes : selecteur de date sur fond blanc */

:root[data-theme="light"] .cmd-date-input {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* decoupe : les cartes ne sont plus emboitees dans un conteneur */

.products.decoupe-stats-section {
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
  margin-bottom: 6px;
}

/* meme taille de titre sur toutes les cartes principales */

.decoupe-stats-summary,
.dashboard-stats-summary {
  font-size: 15px;
  font-weight: 700;
}

/* ramasse : la grille gere seule l'espacement */

.compact-summary > .summary-card,
.compact-summary > .summary-card.compact-summary-card {
  margin-bottom: 0;
}

/* bilan de la veille : hauteur resserree */

.decoupe-yesterday-card,
.ramasse-yesterday-card {
  padding: 9px 12px;
}

.decoupe-yesterday-heading,
.ramasse-yesterday-heading {
  margin-bottom: 6px;
}

.decoupe-yesterday-hello,
.ramasse-yesterday-hello {
  margin: 0 0 4px;
  font-size: 14px;
}

.decoupe-yesterday-metric,
.ramasse-yesterday-metric {
  padding: 6px 5px;
}

.decoupe-yesterday-metric span,
.ramasse-yesterday-metric span {
  font-size: 10px;
}

.decoupe-yesterday-metric strong,
.ramasse-yesterday-metric strong {
  font-size: 15px;
}

.decoupe-yesterday-section,
.ramasse-yesterday-section {
  margin-bottom: 6px;
}

/* calcul du prix de revient : champs sur fond blanc */

:root[data-theme="light"] .cost-price-calculator input,
:root[data-theme="light"] .cost-price-calculator select,
:root[data-theme="light"] .cost-price-product-name,
:root[data-theme="light"] .cost-price-fields input {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* decoupe : couche grise dans les cartes, champs blancs */

:root[data-theme="light"] .decoupe-stats-details > .decoupe-stats-content {
  margin: 0 12px 12px;
  padding: 12px;
  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 10px;
}

:root[data-theme="light"] .heures-num,
:root[data-theme="light"] .heures-date-champ {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* menu : conteneur gris, liens sur fond blanc */

:root[data-theme="light"] .mfs-mobile-menu {
  background: var(--panel2);
  border: 1px solid var(--border);
  border-radius: 12px;
}

:root[data-theme="light"] .mfs-module-link {
  background: var(--white);
  border: 1px solid var(--border);
  color: var(--text);
}

:root[data-theme="light"] .mfs-module-link.active {
  background: rgba(31, 111, 235, 0.10);
  border-color: var(--info);
  color: var(--info-strong);
}

:root[data-theme="light"] .mfs-theme-toggle {
  background: var(--white);
}

/* ===== ramasse : boutons uniformises ===== */

.pick-button {
  border: 1px solid var(--value);
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
}

.picked-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.picked-actions > button {
  width: 100%;
  min-height: 44px;
  margin: 0;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

.picked-actions .save-weight-button {
  border: 1px solid var(--value);
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
}

.picked-actions .unpick-button {
  border: 1px solid var(--red);
  background: rgba(181, 31, 46, 0.12);
  color: var(--red-light);
}

/* titres des produits ramasses, plus discrets */

.picked-summary .product-label {
  font-size: 15px;
}

/* selecteur de fournisseur et nom du client */

.supplier-choice-button {
  color: var(--value);
}

/* annuler a gauche, enregistrer le poids a droite */

.picked-actions .save-weight-button {
  order: 2;
}

.picked-actions .unpick-button {
  order: 1;
}

/* ===== ramassés : cartes plus compactes et hierarchisees ===== */

.picked-row {
  padding: 0;
  margin-bottom: 6px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.picked-summary {
  padding: 8px 12px;
  background: var(--panel);
}

.picked-details[open] {
  background: var(--panel2);
}

.picked-details[open] > .picked-summary {
  border-bottom: 1px solid var(--border);
}

.picked-details .product-info,
.picked-details .product-clients {
  padding-left: 12px;
  padding-right: 12px;
}

.picked-details .picked-actions {
  padding: 0 12px 12px;
  margin-top: 8px;
}

/* ramassés : la quantite totale fait doublon avec les lignes clients */

.picked-row .product-qty {
  display: none;
}

/* cases de poids sur fond blanc */

:root[data-theme="light"] .picked-weight-input,
:root[data-theme="light"] .picked-net-input {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* taux de perte sur deux lignes */

.picked-loss-ligne {
  display: block;
  line-height: 1.35;
  white-space: nowrap;
}

/* lignes clients a la hauteur de celles de l'onglet a ramasser */

.picked-client-line {
  min-height: 46px;
  padding-top: 9px;
  padding-bottom: 9px;
}

/* fiche de decoupe : champs sur fond blanc */

:root[data-theme="light"] #decoupe-sheet input,
:root[data-theme="light"] #decoupe-sheet select,
:root[data-theme="light"] #decoupe-sheet textarea,
:root[data-theme="light"] .decoupe-line input,
:root[data-theme="light"] .decoupe-line select,
:root[data-theme="light"] .decoupe-poids-net,
:root[data-theme="light"] .decoupe-sheet-field input {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* calcul du prix de revient : bouton de validation turquoise */

.cost-price-calculator .refresh,
.cost-price-calculate-button,
#cost-price-calculate {
  border: 1px solid var(--value);
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
  font-weight: 700;
}

/* ===== admin mercuriale client : lisibilite en mode jour ===== */

:root[data-theme="light"] .mercuriale-client-row,
:root[data-theme="light"] .mercuriale-client-row span,
:root[data-theme="light"] .mercuriale-client-row small,
:root[data-theme="light"] .mercuriale-client-product-identity strong,
:root[data-theme="light"] .mercuriale-client-product-identity small {
  color: var(--text);
}

:root[data-theme="light"] .mercuriale-client-row-header span {
  color: var(--muted);
}

:root[data-theme="light"] .mercuriale-client-price {
  color: var(--success);
  font-weight: 700;
}

:root[data-theme="light"] .mercuriale-client-edit-button {
  border: 1px solid var(--info);
  background: rgba(31, 111, 235, 0.12);
  color: var(--info-strong);
  font-weight: 700;
}

/* bouton calculer du prix de revient */

#calculate-cost-price,
:root[data-theme="light"] #calculate-cost-price {
  border: 1px solid var(--value);
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
  font-weight: 700;
}

/* admin mercuriale client : lignes compactes sur mobile */

@media (max-width: 700px) {
  .mercuriale-client-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 12px;
    min-height: 0;
    padding: 8px 10px;
  }

  .mercuriale-client-row.mercuriale-client-row-header,
  .mercuriale-client-row-header {
    display: none;
  }

  .mercuriale-client-product-cell,
  .mercuriale-client-row > strong:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex: 1 1 100%;
    padding: 0;
    text-align: left;
  }

  .mercuriale-client-row > strong:first-child {
    display: block;
    font-size: 14px;
    line-height: 1.25;
  }

  .mercuriale-client-product-identity strong {
    display: block;
    font-size: 14px;
    line-height: 1.25;
  }

  .mercuriale-client-product-identity small {
    display: block;
    font-size: 11px;
  }

  .mercuriale-client-edit-button {
    flex: none;
    padding: 6px 10px;
    font-size: 11px;
  }

  .mercuriale-client-row > span {
    padding: 0;
    font-size: 12px;
    text-align: center;
  }

  .mercuriale-client-row > span::before {
    display: block;
    margin: 0 0 2px;
  }

  .mercuriale-client-price {
    margin-left: auto;
    font-size: 14px;
  }
}

/* ===== mercuriale client, version web : mode clair ===== */

:root[data-theme="light"] .mercuriale-client-public-header h1,
:root[data-theme="light"] .mercuriale-client-public-header strong,
:root[data-theme="light"] .mercuriale-client-public-header p,
:root[data-theme="light"] .mercuriale-client-public label,
:root[data-theme="light"] .mercuriale-client-public-count,
:root[data-theme="light"] .mercuriale-client-section-summary span,
:root[data-theme="light"] .mercuriale-client-section-summary small {
  color: var(--text);
}

:root[data-theme="light"] #share-client-mercuriale {
  border: 1px solid var(--info);
  background: rgba(31, 111, 235, 0.12);
  color: var(--info-strong);
}

:root[data-theme="light"] #copy-client-mercuriale {
  border: 1px solid var(--value);
  background: rgba(13, 148, 136, 0.12);
  color: var(--value);
}

:root[data-theme="light"] #close-client-mercuriale,
:root[data-theme="light"] .mercuriale-client-public-close {
  border: 1px solid var(--red);
  background: rgba(181, 31, 46, 0.10);
  color: var(--red-light);
}

/* prix centre dans sa colonne */

.mercuriale-client-price {
  text-align: center;
}

/* categories principales et bouton fermer */

:root[data-theme="light"] .mercuriale-client-main-group-summary {
  background: var(--white);
  border-bottom: 1px solid var(--border);
}

:root[data-theme="light"] .mercuriale-client-main-group-summary,
:root[data-theme="light"] .mercuriale-client-main-group-summary span,
:root[data-theme="light"] .mercuriale-client-main-group-summary small {
  color: var(--info-strong);
}

:root[data-theme="light"] .mercuriale-close-web-button {
  border: 2px solid #8e1a15;
  background: rgba(181, 31, 46, 0.10);
  color: var(--red-light);
}

/* une ligne sur deux legerement plus claire */

:root[data-theme="light"] .mercuriale-client-table .mercuriale-client-row:nth-of-type(even),
:root[data-theme="light"] .mercuriale-client-section .mercuriale-client-row:nth-of-type(even) {
  background: rgba(17, 24, 39, 0.035);
}

/* bouton fermer : cadre nettement plus sombre que le fond */

:root[data-theme="light"] button.mercuriale-close-web-button,
:root[data-theme="light"] .mercuriale-client-public-buttons .mercuriale-close-web-button,
:root[data-theme="light"] #close-client-mercuriale.mercuriale-close-web-button {
  border: 2px solid #6e1310;
  background: rgba(181, 31, 46, 0.10);
  color: #8e1a15;
}

/* le titre de categorie glisse au centre a l'ouverture */

.mercuriale-client-main-group-summary span {
  flex: 0 1 auto;
  text-align: left;
  transition: flex-grow 0.18s ease;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary span {
  flex: 1 1 auto;
  text-align: center;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary small {
  flex: none;
}

/* recherche centree */

:root[data-theme="light"] .mercuriale-client-public label,
.mercuriale-client-public label {
  display: block;
  text-align: center;
}

/* titre centre sur toute la largeur de la carte */

.mercuriale-client-main-group-summary,
.mercuriale-client-section-summary {
  position: relative;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary span {
  flex: 1 1 auto;
  text-align: center;
}

.mercuriale-client-section[open]
  > .mercuriale-client-section-summary span {
  flex: 1 1 auto;
  text-align: center;
}

/* couche grise sous les sous-categories */

:root[data-theme="light"] .mercuriale-client-main-group-content {
  background: var(--panel2);
}

/* alternance des lignes : blanc puis gris tres clair */

:root[data-theme="light"] .mercuriale-client-row {
  background: var(--white);
}

:root[data-theme="light"] .mercuriale-client-row:nth-of-type(even) {
  background: #f2f4f7;
}

/* champ de recherche sur fond blanc */

:root[data-theme="light"] .mercuriale-client-public input[type="search"],
:root[data-theme="light"] .mercuriale-client-public input[type="text"],
:root[data-theme="light"] #mercuriale-client-search {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}

/* titres longs sur deux lignes, sans chevaucher le compte */

/* trois colonnes : reserve, titre, compte */

.mercuriale-client-main-group-summary,
.mercuriale-client-section-summary {
  display: grid;
  grid-template-columns: 0 minmax(0, 1fr) 72px;
  align-items: center;
  gap: 8px;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary,
.mercuriale-client-section[open]
  > .mercuriale-client-section-summary {
  grid-template-columns: 72px minmax(0, 1fr) 72px;
}

.mercuriale-client-main-group-summary span,
.mercuriale-client-section-summary span {
  grid-column: 2;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.2;
  text-align: left;
}

.mercuriale-client-main-group[open]
  > .mercuriale-client-main-group-summary span,
.mercuriale-client-section[open]
  > .mercuriale-client-section-summary span {
  text-align: center;
}

.mercuriale-client-main-group-summary small,
.mercuriale-client-section-summary small {
  grid-column: 3;
  text-align: right;
  white-space: nowrap;
}

/* categories principales moins espacees */

.mercuriale-client-main-group {
  margin-bottom: 3px;
}

.mercuriale-client-main-group-summary {
  padding-top: 13px;
  padding-bottom: 13px;
}

/* ===== MASSE : couleur propre, comme MEDELYS ===== */

.supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-toggle {
  background: rgba(244, 114, 182, 0.09);
  color: #f9a8d4;
}

.supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-name,
.supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-arrow {
  color: #f9a8d4;
}

/* en mode clair, la meme teinte assombrie */

:root[data-theme="light"]
  .supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-name,
:root[data-theme="light"]
  .supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-arrow,
:root[data-theme="light"]
  .supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar
  .supplier-toggle {
  color: #a3175c;
}

/* champs de date : centrage du contenu sur iPad et Safari */

.cmd-date-input::-webkit-date-and-time-value,
.pl-month-input::-webkit-date-and-time-value,
input[type="date"]::-webkit-date-and-time-value,
input[type="month"]::-webkit-date-and-time-value {
  text-align: center;
  width: 100%;
  margin: 0;
}

.cmd-date-input::-webkit-datetime-edit,
.pl-month-input::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit,
input[type="month"]::-webkit-datetime-edit {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 0;
}

/* ===== commandes recues : couleur par fournisseur ===== */

.cmd-line[data-fournisseur*="GBP" i] .cmd-line-text,
.cmd-line[data-fournisseur*="GBP" i] .cmd-line-supplier {
  color: var(--danger);
}

.cmd-line[data-fournisseur*="CHARRAIRE" i] .cmd-line-text,
.cmd-line[data-fournisseur*="CHARRAIRE" i] .cmd-line-supplier {
  color: var(--success);
}

.cmd-line[data-fournisseur*="ALAZARD" i] .cmd-line-text,
.cmd-line[data-fournisseur*="ALAZARD" i] .cmd-line-supplier,
.cmd-line[data-fournisseur*="ALAZZARD" i] .cmd-line-text,
.cmd-line[data-fournisseur*="ALAZZARD" i] .cmd-line-supplier {
  color: #d9a441;
}

.cmd-line[data-fournisseur*="RAMASSE" i] .cmd-line-text,
.cmd-line[data-fournisseur*="RAMASSE" i] .cmd-line-supplier {
  color: var(--info);
}

/* teintes assombries pour le mode clair */

:root[data-theme="light"] .cmd-line[data-fournisseur*="GBP" i] .cmd-line-text,
:root[data-theme="light"] .cmd-line[data-fournisseur*="GBP" i] .cmd-line-supplier {
  color: #b3261e;
}

:root[data-theme="light"] .cmd-line[data-fournisseur*="CHARRAIRE" i] .cmd-line-text,
:root[data-theme="light"] .cmd-line[data-fournisseur*="CHARRAIRE" i] .cmd-line-supplier {
  color: #147d4a;
}

:root[data-theme="light"] .cmd-line[data-fournisseur*="ALAZARD" i] .cmd-line-text,
:root[data-theme="light"] .cmd-line[data-fournisseur*="ALAZARD" i] .cmd-line-supplier,
:root[data-theme="light"] .cmd-line[data-fournisseur*="ALAZZARD" i] .cmd-line-text,
:root[data-theme="light"] .cmd-line[data-fournisseur*="ALAZZARD" i] .cmd-line-supplier {
  color: #8a6510;
}

:root[data-theme="light"] .cmd-line[data-fournisseur*="RAMASSE" i] .cmd-line-text,
:root[data-theme="light"] .cmd-line[data-fournisseur*="RAMASSE" i] .cmd-line-supplier {
  color: #1f6feb;
}

/* ===== mode jour : barre du fournisseur distincte ===== */

:root[data-theme="light"] .supplier-bar {
  border-bottom: 1px solid var(--border);
}

/* le secteur maree en bleu tres pale, les autres dans leur teinte */

:root[data-theme="light"]
  .supplier-group:not(.manual-ramasse-gbp):not(.manual-ramasse-consommable-mfs):not([data-supplier="MEDELYS" i]):not([data-supplier*="MASSE" i])
  > .supplier-bar {
  background: rgba(31, 111, 235, 0.07);
}

:root[data-theme="light"]
  .supplier-group[data-supplier="MEDELYS" i]
  > .supplier-bar {
  background: rgba(109, 40, 217, 0.07);
}

:root[data-theme="light"]
  .supplier-group[data-supplier*="MASSE" i]
  > .supplier-bar {
  background: rgba(163, 23, 92, 0.07);
}

:root[data-theme="light"]
  .manual-ramasse-gbp
  > .supplier-bar {
  background: rgba(179, 38, 30, 0.07);
}

:root[data-theme="light"]
  .manual-ramasse-consommable-mfs
  > .supplier-bar {
  background: rgba(11, 114, 104, 0.07);
}

/* les produits gardent le fond de la carte */

:root[data-theme="light"] .supplier-products {
  background: var(--panel);
}

/* sept derniers jours : lignes de resultat sur fond blanc */

:root[data-theme="light"] .daily-history-row {
  background: var(--white);
  border: 1px solid var(--border);
}

:root[data-theme="light"] .daily-history-row.daily-history-header {
  background: var(--panel2);
}

/* ===== ecrans larges : boutons et champs de la ramasse ===== */

@media (min-width: 701px) {
  .pick-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }

  .pick-controls > button {
    min-height: 44px;
    padding: 0 20px;
    border-radius: 9px;
    font-size: 13px;
    letter-spacing: 0.3px;
  }

  .pick-weight,
  .client-weight,
  .picked-weight-input,
  .picked-net-input {
    width: 110px;
    height: 40px;
    padding: 6px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel2);
    color: var(--text);
    font-size: 15px;
    text-align: center;
    box-sizing: border-box;
  }

  :root[data-theme="light"] .pick-weight,
  :root[data-theme="light"] .client-weight,
  :root[data-theme="light"] .picked-weight-input,
  :root[data-theme="light"] .picked-net-input {
    background: var(--white);
  }

  .client-weight-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
  }
}

/* ecrans larges : les deux selecteurs de fichier a la meme taille */

@media (min-width: 701px) {
  .decoupe-photo-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .decoupe-photo-field > span {
    white-space: nowrap;
    font-size: 10px;
    letter-spacing: 0.2px;
  }

  .decoupe-photo-field {
    grid-column: span 2;
    min-width: 0;
  }

  .decoupe-photo-field input[type="file"] {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel2);
    color: var(--text);
    font-size: 13px;
    box-sizing: border-box;
  }

  :root[data-theme="light"] .decoupe-photo-field input[type="file"] {
    background: var(--white);
  }
}

/* ===== superadmin : fournisseurs favoris ===== */

.favorite-supplier-options button {
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid var(--value);
  border-radius: 9px;
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
  font-size: 13px;
  font-weight: 700;
}

:root[data-theme="light"] .favorite-supplier-options button {
  border-color: var(--value);
  background: rgba(13, 148, 136, 0.12);
  color: var(--value);
}

/* ===== comparaison fournisseurs : offres empilees ===== */

.mercuriale-comparison-offers {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-align: center;
}

.mercuriale-comparison-offers > span {
  white-space: nowrap;
}

/* ===== commandes : lignes ignorees a completer ===== */

.cmd-ignored-list {
  margin: 8px 0 4px;
}

.cmd-ignored-form {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}

.cmd-ignored-name {
  flex: 1 1 160px;
  min-width: 0;
  font-size: 13px;
}

.cmd-ignored-qty {
  width: 74px;
  min-height: 36px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel2);
  color: var(--text);
  text-align: center;
  box-sizing: border-box;
}

.cmd-ignored-unit {
  width: 66px;
  min-height: 36px;
  padding: 5px 6px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel2);
  color: var(--text);
  box-sizing: border-box;
}

:root[data-theme="light"] .cmd-ignored-qty,
:root[data-theme="light"] .cmd-ignored-unit {
  background: var(--white);
}

/* ===== superadmin : validation d'import ===== */

.mercuriale-supplier-card .dashboard-refresh-button:not(.mercuriale-import-validated-button),
#mercuriale-fournisseurs .dashboard-refresh-button:not(.mercuriale-import-validated-button) {
  border: 1px solid var(--value);
  background: rgba(94, 234, 212, 0.14);
  color: var(--value);
  font-weight: 700;
}

:root[data-theme="light"] .mercuriale-supplier-card .dashboard-refresh-button:not(.mercuriale-import-validated-button),
:root[data-theme="light"] #mercuriale-fournisseurs .dashboard-refresh-button:not(.mercuriale-import-validated-button) {
  background: rgba(13, 148, 136, 0.12);
}

.mercuriale-import-validated-button,
:root[data-theme="light"] .mercuriale-import-validated-button {
  border: 1px solid var(--border);
  background: var(--panel2);
  color: var(--muted);
  font-weight: 700;
}

/* ===== mercuriale web sur ecran large : colonnes centrees ===== */

@media (min-width: 701px) {
  .mercuriale-client-table .mercuriale-client-row > span,
  .mercuriale-client-table .mercuriale-client-row > strong,
  .mercuriale-client-table .mercuriale-client-row > .mercuriale-client-price,
  .mercuriale-client-table .mercuriale-client-row-header > span {
    text-align: center;
  }

  .mercuriale-client-table .mercuriale-client-row > strong:first-child,
  .mercuriale-client-table .mercuriale-client-row > .mercuriale-client-product-cell,
  .mercuriale-client-table .mercuriale-client-row-header > span:first-child {
    text-align: left;
  }
}

/* rayon annonce dans la mercuriale web */

.mercuriale-client-soon {
  margin: 0;
  padding: 14px 16px;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}

/* rayon Epicerie : ocre fonce */

.mercuriale-client-main-group.est-epicerie
  > .mercuriale-client-main-group-summary,
.mercuriale-client-main-group.est-epicerie
  > .mercuriale-client-main-group-summary span,
.mercuriale-client-main-group.est-epicerie
  > .mercuriale-client-main-group-summary small {
  color: #8a6510;
}

/* pastille de validation sur la carte fournisseur */

.mercuriale-supplier-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: 9px;
  border-radius: 50%;
  background: var(--success);
  vertical-align: middle;
}

/* formulaire d'association : textes lisibles en mode jour */

:root[data-theme="light"] .mercuriale-product-dialog,
:root[data-theme="light"] .mercuriale-product-dialog p,
:root[data-theme="light"] .mercuriale-product-dialog strong,
:root[data-theme="light"] .mercuriale-product-dialog summary,
:root[data-theme="light"] .mercuriale-product-dialog-header strong,
:root[data-theme="light"] .mercuriale-suggestions,
:root[data-theme="light"] .mercuriale-suggestion-form,
:root[data-theme="light"] .mercuriale-suggestion-form span,
:root[data-theme="light"] .mercuriale-suggestion-form strong,
:root[data-theme="light"] .mercuriale-suggestion-form small {
  color: var(--text);
}

:root[data-theme="light"] .mercuriale-product-dialog {
  background: var(--panel);
}

/* selecteur de date : la date lisible recouvre le champ natif */

.cmd-date-picker {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  height: 48px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel2);
  cursor: pointer;
}

:root[data-theme="light"] .cmd-date-picker {
  background: var(--white);
}

.cmd-date-affiche {
  color: var(--text);
  font-size: 16px;
  pointer-events: none;
}

/* le champ natif reste actif mais invisible */

.cmd-date-native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: transparent;
  opacity: 0;
  cursor: pointer;
}

/* la pastille de validation se place a droite */

.mercuriale-supplier-summary {
  display: flex;
  align-items: center;
}

.mercuriale-supplier-dot {
  margin-left: auto;
}

/* fleche verte quand l'import du jour est valide */

.mercuriale-supplier-card:has(.mercuriale-supplier-dot)
  > .mercuriale-supplier-summary::after {
  color: var(--success);
}

/* comparaison fournisseurs : recherche sur fond blanc */

:root[data-theme="light"] .comparison-search-field,
:root[data-theme="light"] #comparison-search {
  background: var(--white);
  color: var(--text);
  border-color: var(--border);
}