body {
  background:#f7f8f5;
}

.onj-navbar {
  background:linear-gradient(90deg, #0f5b34 0%, #198754 55%, #0f5b34 100%);
  padding-top:.35rem;
  padding-bottom:.35rem;
}

.site-brand-logo {
  height:54px;
  width:auto;
  max-width:138px;
  object-fit:contain;
  display:block;
}

.site-footer {
  border-top:1px solid #e1e7dd;
  background:#fbfcfa;
}

.hero-pro {
  background:linear-gradient(135deg, #f5fbf4 0%, #ffffff 100%);
  border:1px solid #dde7da;
  border-radius:28px;
  padding:32px;
  box-shadow:0 14px 36px rgba(27, 67, 50, .08);
}

.hero-badge {
  display:inline-block;
  padding:8px 14px;
  border-radius:999px;
  background:#e7f6ec;
  color:#146c43;
  font-weight:700;
  font-size:.95rem;
}

.hero-title {
  font-size:clamp(2rem, 3.4vw, 3.2rem);
  line-height:1.1;
  font-weight:800;
  color:#123524;
}

.hero-lead {
  font-size:1.08rem;
  color:#2b4336;
}

.hero-text {
  color:#4f5e56;
}

.hero-visual {
  overflow:hidden;
  border-radius:24px;
  border:1px solid #dce5d8;
  background:#fff;
}

.hero-feature-card {
  height:100%;
  padding:16px 18px;
  background:#fff;
  border:1px solid #e1e7dd;
  border-radius:18px;
  box-shadow:0 8px 18px rgba(0,0,0,.05);
}

.hero-feature-title {
  font-weight:700;
  color:#146c43;
  margin-bottom:4px;
}

.hero-feature-text {
  font-size:.95rem;
  color:#5a665f;
}

.product-card {
  overflow:hidden;
  border:0;
}

.product-photo {
  height:220px;
  object-fit:cover;
  background:#f2f5ef;
}

.product-placeholder {
  height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#e9ecef;
  color:#6c757d;
}

.thumb {
  width:90px;
  height:70px;
  object-fit:cover;
  border-radius:8px;
  background:#f1f3ef;
}

.navbar-brand {
  letter-spacing:.3px;
}

.purchase-type-card {
  position:relative;
  display:block;
  min-height:320px;
  overflow:hidden;
  border-radius:22px;
  box-shadow:0 12px 34px rgba(0,0,0,.12);
  transition:transform .18s ease, box-shadow .18s ease;
  background:#fff;
}

.purchase-type-card:hover {
  transform:translateY(-5px);
  box-shadow:0 18px 42px rgba(0,0,0,.17);
}

.purchase-type-card img {
  width:100%;
  height:320px;
  display:block;
  object-fit:cover;
}

.purchase-type-overlay {
  position:absolute;
  inset:auto 0 0 0;
  padding:28px;
  background:linear-gradient(transparent, rgba(0,0,0,.82));
  color:#fff;
}

.purchase-type-title {
  display:block;
  font-size:2rem;
  font-weight:800;
}

.purchase-type-subtitle {
  display:block;
  opacity:.9;
}

/* V8 : familles côte à côte sur la première page */
.family-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(175px, 1fr));
  gap:18px;
  align-items:stretch;
}

.family-choice-card {
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-width:0;
  background:#fff;
  border:1px solid #dde4d9;
  border-radius:16px;
  color:#212529;
  box-shadow:0 5px 14px rgba(0,0,0,.045);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.family-choice-card:hover {
  color:#212529;
  transform:translateY(-4px);
  border-color:#198754;
  box-shadow:0 12px 28px rgba(0,0,0,.10);
}

.family-choice-image {
  height:150px;
  background:#f3f6f1;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.family-choice-image img {
  width:100%;
  height:100%;
  object-fit:contain;
  padding:8px;
}

.family-choice-body {
  padding:13px 14px 15px;
}

.family-choice-name {
  font-size:1.08rem;
  font-weight:750;
  margin-bottom:3px;
}

/* V8 : seconde page = variétés/sous-catégories */
.variant-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(175px, 1fr));
  gap:18px;
  align-items:stretch;
}

.product-family-title {
  border-left:5px solid #198754;
  padding-left:12px;
  margin-top:26px;
}

.catalog-choice-card {
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid #e0e5dd;
  border-radius:14px;
  overflow:hidden;
  color:#212529;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.catalog-choice-card:hover {
  color:#212529;
  transform:translateY(-3px);
  border-color:#198754;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
}

.catalog-choice-image {
  height:135px;
  overflow:hidden;
  background:#f3f6f1;
}

.catalog-choice-image-large {
  height:170px;
}

.catalog-choice-image img {
  width:100%;
  height:100%;
  object-fit:contain;
  padding:6px;
}

.catalog-choice-body {
  padding:12px;
  min-height:74px;
}

.product-selected-image {
  width:100%;
  height:290px;
  object-fit:contain;
  background:#f3f6f1;
  padding:10px;
}

.reference-product-preview {
  width:100%;
  max-height:320px;
  object-fit:contain;
  background:#f3f6f1;
  padding:8px;
}

/* Autocomplétion native pays */
input[list="country-options"] {
  background-color:#fff;
}

@media (max-width: 767.98px) {
  .site-brand-logo {
    height:44px;
    max-width:116px;
  }

  .hero-pro {
    padding:20px;
    border-radius:20px;
  }

  .family-grid,
  .variant-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .family-choice-image,
  .catalog-choice-image-large {
    height:125px;
  }
}

/* V8 correctif : autocomplete pays avec drapeaux */
.country-autocomplete {
  z-index:20;
}

.country-selected-flag {
  min-width:48px;
  justify-content:center;
  font-size:1.25rem;
  background:#f8faf7;
}

.country-autocomplete-results {
  position:absolute;
  top:calc(100% + 4px);
  left:0;
  right:0;
  z-index:1050;
  max-height:310px;
  overflow-y:auto;
  background:#fff;
  border:1px solid #d7ddd4;
  border-radius:10px;
  box-shadow:0 12px 30px rgba(0,0,0,.14);
  padding:6px;
}

.country-autocomplete-option {
  width:100%;
  display:grid;
  grid-template-columns:34px 1fr auto;
  align-items:center;
  gap:8px;
  padding:9px 10px;
  border:0;
  border-radius:8px;
  background:#fff;
  color:#212529;
  text-align:left;
}

.country-autocomplete-option:hover,
.country-autocomplete-option:focus {
  background:#edf7f0;
  outline:none;
}

.country-autocomplete-option .country-flag {
  font-size:1.25rem;
}

.country-autocomplete-option small {
  color:#788078;
  font-weight:600;
}

.country-autocomplete-empty {
  padding:12px;
  color:#6c757d;
  text-align:center;
}

/* V12 : vrais drapeaux SVG pour le champ Origine */
.country-selected-flag {
  width:52px;
  min-width:52px;
  padding:6px 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.country-flag-img {
  display:block;
  width:28px;
  height:21px;
  object-fit:cover;
  border-radius:3px;
  box-shadow:0 0 0 1px rgba(0,0,0,.12);
}

.country-autocomplete-option .country-flag {
  width:34px;
  min-width:34px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.country-autocomplete-option .country-flag-img {
  width:28px;
  height:21px;
}

.country-origin-display {
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

.country-flag-img-table {
  width:24px;
  height:18px;
}

.country-globe-fallback {
  font-size:1.15rem;
  line-height:1;
}

/* V13 : taille compacte des drapeaux dans la liste Achats / stock */
.country-origin-display {
  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:6px !important;
  white-space:nowrap;
  vertical-align:middle;
}

.country-origin-display .country-flag-img-table {
  width:24px !important;
  height:18px !important;
  min-width:24px !important;
  max-width:24px !important;
  min-height:18px !important;
  max-height:18px !important;
  flex:0 0 24px !important;
  display:inline-block !important;
  object-fit:cover !important;
  border-radius:2px;
  margin:0 !important;
  padding:0 !important;
}

/* V15 : filtres et actions de gestion des achats */
.purchase-filter-card {
  background: #f9fbf8;
  border-radius: 14px;
}

.purchase-filter-card .form-label {
  font-size: .9rem;
  margin-bottom: .35rem;
}

.purchase-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  white-space: nowrap;
}

.purchase-actions form {
  margin: 0;
}

.purchase-table th:last-child,
.purchase-table td:last-child {
  min-width: 170px;
}

@media (max-width: 991.98px) {
  .purchase-filter-card .card-body {
    padding: 1rem;
  }
}


/* V16 : correction robuste du drapeau d'origine sur les cartes publiques */
.product-photo-wrapper {
  position:relative !important;
  width:100%;
  height:220px;
  overflow:hidden !important;
  background:#f2f5ef;
}

.product-photo-wrapper > .product-photo {
  display:block;
  width:100% !important;
  height:220px !important;
  max-width:100%;
  object-fit:cover;
  margin:0;
}

.product-origin-badge {
  position:absolute !important;
  top:10px !important;
  right:10px !important;
  left:auto !important;
  bottom:auto !important;
  z-index:5;
  width:38px !important;
  height:28px !important;
  min-width:38px !important;
  max-width:38px !important;
  min-height:28px !important;
  max-height:28px !important;
  padding:3px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  overflow:hidden !important;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(0,0,0,.08);
  border-radius:9px;
  box-shadow:0 3px 10px rgba(0,0,0,.18);
}

.product-origin-badge > .product-origin-flag,
.product-origin-badge > img {
  display:block !important;
  width:30px !important;
  height:20px !important;
  min-width:30px !important;
  max-width:30px !important;
  min-height:20px !important;
  max-height:20px !important;
  object-fit:cover !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:2px;
}

/* V16 : marge et statut de publication */
.product-margin {
  font-weight:700;
  white-space:nowrap;
}

.product-margin-positive { color:#198754; }
.product-margin-negative { color:#dc3545; }

.publication-status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:50%;
  font-size:1rem;
  font-weight:800;
  line-height:1;
}

.publication-status-on {
  color:#fff;
  background:#198754;
  box-shadow:0 0 0 3px rgba(25,135,84,.12);
}

.publication-status-off {
  color:#6c757d;
  background:#e9ecef;
  border:1px solid #ced4da;
}

.product-publication-table th {
  white-space:nowrap;
}

/* V16 : résumé dynamique des filtres */
.purchase-filter-summary {
  padding:11px 14px;
  background:#edf7f0;
  border-left:4px solid #198754;
  border-radius:8px;
  color:#284638;
  font-size:.95rem;
}

/* V16 : indicateur d'ancienneté du stock */
.freshness-smiley {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:#fff;
  font-size:1.25rem;
  font-family:Arial, sans-serif;
  font-weight:700;
  line-height:1;
  cursor:help;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}

.freshness-green { background:#198754; }
.freshness-orange { background:#f0a128; }
.freshness-red { background:#dc3545; }

@media (max-width:767.98px) {
  .product-photo-wrapper,
  .product-photo-wrapper > .product-photo {
    height:190px !important;
  }

  .product-origin-badge {
    top:8px !important;
    right:8px !important;
    width:34px !important;
    height:25px !important;
    min-width:34px !important;
    max-width:34px !important;
    min-height:25px !important;
    max-height:25px !important;
  }

  .product-origin-badge > .product-origin-flag,
  .product-origin-badge > img {
    width:28px !important;
    height:18px !important;
    min-width:28px !important;
    max-width:28px !important;
    min-height:18px !important;
    max-height:18px !important;
  }
}

/* =========================================================
   V23 - Promotions produits
   ========================================================= */
.product-promo-badge {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.04em;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
    pointer-events: none;
}

.product-price-promo {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px;
}

.product-old-price {
    color: #6c757d;
    text-decoration: line-through;
    text-decoration-thickness: 2px;
    font-size: 0.95rem;
}

.product-old-price-cart {
    margin-right: 8px;
}

.product-new-price {
    color: #dc3545;
    font-size: 1.3rem;
    font-weight: 800;
}

.promo-preview-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: 0.8rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.04em;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
}
