/* biopreparados.es — feuille de style principale.
   Toutes les couleurs/polices passent par des variables CSS injectées
   depuis includes/tema.php (table tema_config) — rien n'est codé en dur ici. */

*{box-sizing:border-box;}
/* Vert clair du globe du logo (#86A120, extrait de l'illustration — même teinte que
   les feuilles du logo) pour tout le texte HORS des cadres/cartes blanches (pedido el
   31/08/2026). Le texte À L'INTÉRIEUR des cartes/cadres garde ses couleurs d'origine
   (ré-affirmées plus bas, cf. bloc ".card,.fcard,..."), pour ne pas perdre le
   contraste noir/vert foncé sur fond blanc. */
body{margin:0;font-family:var(--font-body);background:#eef2ee;color:#86A120;font-size:17px;}
a{color:inherit;}
img{max-width:100%;display:block;}

.topbar{background:var(--green-900,#1f3d2b);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:14px 24px;flex-wrap:wrap;gap:10px;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:20px;font-weight:700;text-decoration:none;color:#fff;}
.brand .leaf{width:32px;height:32px;border-radius:50%;background:var(--gold,#b8863f);display:flex;align-items:center;justify-content:center;font-size:16px;}
/* Titre (+ sous-titre optionnel, pedido el 01/09/2026 — page d'accueil uniquement
   pour l'instant) de la page, dans le cadre vert du bandeau du haut, entre le logo
   et les drapeaux de langue. flex:1 fait que le bloc occupe tout l'espace laissé
   libre entre .brand et le bloc langues/admin (qui, eux, gardent leur largeur
   naturelle) ; min-width:0 est nécessaire pour qu'un enfant flex accepte de
   rétrécir en dessous de la largeur de son contenu (sinon un titre long pousserait
   le bandeau à s'agrandir plutôt que de se réduire) ; text-overflow:ellipsis (sur
   chaque ligne séparément, pas sur le conteneur) coupe proprement les titres trop
   longs (ex. nom d'une ficha) plutôt que de casser la mise en page si vraiment ça ne
   tient pas. Tailles en clamp() : s'adaptent en continu entre mobile et ordinateur —
   agrandies le 02/09/2026 (pedido : le titre de l'accueil, plus long, doit remplir
   le cadre plutôt que rester petit) ; la hauteur du bandeau suit le logo (80px par
   défaut) et reste largement suffisante pour ces 2 lignes plus grandes. */
.topbar-title{flex:1;min-width:0;padding:0 12px;text-align:center;font-family:var(--font-heading);}
.topbar-title h1{margin:0;color:#fff;font-size:clamp(17px,4.5vw,28px);line-height:1.15;font-weight:700;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.topbar-title .topbar-subtitle{margin:2px 0 0;color:#fff;opacity:.9;font-size:clamp(12.5px,2.6vw,17px);line-height:1.2;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* Titre toujours invisible/illisible sur mobile malgré un 1er correctif le 04/09/2026
   (qui le passait sur sa propre ligne PLEINE LARGEUR sous le logo/drapeaux, DANS le
   bandeau vert) — un 2e correctif le même jour va plus loin, comme demandé ("les
   sortir du cadre vert du header ?") : le titre est maintenant DUPLIQUÉ hors du
   bandeau (cf. .page-title-mobile, includes/header.php), sur fond clair, sans avoir à
   partager la largeur avec rien ni à dépendre du comportement de wrap de .topbar. Sous
   640px, la version DANS le bandeau vert est masquée (display:none) et c'est cette
   version hors-cadre qui s'affiche à la place — au-dessus de 640px c'est l'inverse. */
.page-title-mobile{display:none;}
@media (max-width:640px){
  .topbar-title{display:none;}
  .page-title-mobile{display:block;background:#fdfbf5;padding:14px 20px 12px;text-align:center;border-bottom:2px solid var(--gold,#b8863f);}
  .page-title-mobile h1{margin:0;color:var(--green-900,#1f3d2b);font-size:clamp(19px,5.5vw,24px);line-height:1.3;font-weight:700;font-family:var(--font-heading);}
  .page-title-mobile-subtitle{margin:4px 0 0;color:var(--green-700,#2d6a45);font-size:14px;font-weight:600;}
}
.nav{display:flex;gap:16px;flex-wrap:wrap;font-size:13.5px;}
.nav a{text-decoration:none;color:#fff;opacity:.9;}
.nav a:hover{opacity:1;text-decoration:underline;}
.nav a.nav-discreto{color:#b7c2ba;opacity:1;}
.nav a.nav-discreto:hover{color:#fff;}
.lang-flags{display:flex;gap:6px;}
.lang-flags a{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;text-decoration:none;background:rgba(255,255,255,.15);color:#fff;}
.lang-flags a.actif{background:var(--gold,#b8863f);color:#3b2a0f;}
/* Accès rapide admin + déconnexion sous les drapeaux, visible seulement pour un
   admin connecté (pedido el 01/09/2026, cf. includes/header.php). */
.topbar-admin{display:flex;gap:12px;font-size:11.5px;}
.topbar-admin a{color:#fff;text-decoration:none;opacity:.88;font-weight:700;}
.topbar-admin a:hover{opacity:1;text-decoration:underline;}

.container{max-width:1100px;margin:0 auto;padding:28px 20px;}
h1,h2,h3{font-family:var(--font-heading);color:#86A120;}

/* Cartes/cadres blancs (+ l'encadré vert très pâle .home-explicativo, assimilé à un
   cadre lui aussi) : le texte à l'intérieur garde ses couleurs d'origine plutôt que le
   nouveau vert clair ci-dessus, pour rester lisible sur fond clair. */
.card,.fcard,.ficha-seccion,.annuaire-buscar,.anuario-fila,.admin-nav,
.taxonomia-checklist,dialog.modo-popup,.home-explicativo{color:var(--ink,#2a2f2b);}
.card h1,.card h2,.card h3,
.fcard h1,.fcard h2,.fcard h3,
.ficha-seccion h1,.ficha-seccion h2,.ficha-seccion h3,
.annuaire-buscar h1,.annuaire-buscar h2,.annuaire-buscar h3,
.anuario-fila h1,.anuario-fila h2,.anuario-fila h3,
.admin-nav h1,.admin-nav h2,.admin-nav h3,
dialog.modo-popup h1,dialog.modo-popup h2,dialog.modo-popup h3,
.home-explicativo h1,.home-explicativo h2,.home-explicativo h3{color:var(--green-900,#1f3d2b);}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:4px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.3px;}
.btn-info-modo{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--green-700,#2d6a45);color:#fff;font-size:12px;font-weight:700;border:none;cursor:pointer;vertical-align:middle;margin-left:2px;padding:0;line-height:1;}
.btn-info-modo:hover{background:#1f4d33;}
dialog.modo-popup{border:none;border-radius:12px;padding:22px 26px;max-width:480px;width:90%;box-shadow:0 10px 40px rgba(0,0,0,.25);}
dialog.modo-popup::backdrop{background:rgba(20,30,20,.55);}
dialog.modo-popup h3{margin-top:0;}
dialog.modo-popup h4{margin-bottom:4px;font-size:14px;text-transform:uppercase;letter-spacing:.3px;color:#6b756f;}
.badge-bio{background:var(--green-100,#e7f3ea);color:var(--green-700,#2d6a45);}
.badge-bio-doble-linea{border-radius:8px;text-align:center;line-height:1.35;padding:5px 10px;}
.badge-suelo{color:#fff;}
.badge-uso-interno{background:#e7ecfb;color:#2b3e8c;}
.badge-uso-externo{background:#fbe9e7;color:#8c3a2b;}
/* Origine de la préparation (pedido el 28/08/2026) : minérale/végétale/animale/mixte. */
.badge-origen-mineral{background:#eef1f3;color:#4a5560;}
.badge-origen-vegetal{background:#e7f5ea;color:#2d6a45;}
.badge-origen-animal{background:#fbe9e7;color:#8c3a2b;}
.badge-origen-mixto{background:#f4e7cf;color:#7a5a1e;}
.badge-origen-biologico{background:#e3f0e1;color:#3c6b2f;}
/* Rôle écologique (A2, pedido el 03/09/2026) : plaga (ravageur, rouge) / auxiliar
   (auxiliaire ou pollinisateur, vert) / neutro (gris) — sur les patologías de type
   insecto/animal/larva principalement, cf. admin/fijos.php. */
.badge-rol-plaga{background:#fbe0dc;color:#8c2b1a;}
.badge-rol-auxiliar{background:#e0f0e3;color:#1f6b3a;}
.badge-rol-neutro{background:#eceeec;color:#555;}

.card{background:#fff;border:1px solid #e2e8e3;border-radius:10px;padding:18px 22px;margin-bottom:18px;}
a.card-enlace{display:block;text-decoration:none;color:inherit;transition:box-shadow .15s,transform .15s;}
a.card-enlace:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);transform:translateY(-2px);}
a.card-enlace h3{margin-top:0;}
.grid-3{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;}
/* Exactement 2 colonnes (pas auto-fit) : avec 4 cartes, auto-fit en plaçait 3 par ligne
   sur un écran large au lieu des 2 paires voulues (bug signalé le 28/08/2026). */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
/* Les 4 cartes "publicos" de l'accueil sur une seule ligne (cf. demande 28/08/2026,
   remplace la disposition en 2 lignes de 2 cartes ci-dessus pour cette section précise).
   Repasse en 2 colonnes puis 1 colonne sur petit écran pour rester lisible. */
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
@media (max-width:900px){.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.grid-4{grid-template-columns:1fr;}}
.fcard{background:#fff;border:1px solid #e2e8e3;border-radius:10px;overflow:hidden;text-decoration:none;color:inherit;display:block;}
.fcard .thumb{height:90px;background:linear-gradient(135deg,var(--green-100,#e7f3ea),#fff);display:flex;align-items:center;justify-content:center;font-size:28px;}
.fcard .body{padding:12px 16px;}
.fcard .cat{font-size:10.5px;text-transform:uppercase;color:var(--green-700,#2d6a45);font-weight:800;}
.fcard h3{font-size:14.5px;margin:6px 0;}

form label{display:block;font-size:14px;font-weight:600;margin:10px 0 4px;}
form input[type=text],form input[type=email],form input[type=password],form input[type=number],
form select,form textarea{width:100%;padding:9px 11px;border:1px solid #cfd7d1;border-radius:7px;font-size:14px;font-family:inherit;}
form textarea{min-height:90px;}
/* Bouton afficher/masquer sur les champs mot de passe (login/registro/perfil,
   ajouté le 31/08/2026) : bouton positionné dans le champ, sans librairie d'icônes. */
.password-campo{position:relative;}
.password-campo input[type=password],.password-campo input[type=text]{padding-right:42px;}
.password-toggle{position:absolute;top:50%;right:4px;transform:translateY(-50%);background:none;border:none;
  cursor:pointer;font-size:17px;line-height:1;padding:6px;color:#6b756f;border-radius:6px;}
.password-toggle:hover{color:var(--green-700,#2d6a45);}
.password-toggle:focus-visible{outline:2px solid var(--green-700,#2d6a45);outline-offset:1px;}
.form-row{display:flex;gap:16px;flex-wrap:wrap;}
.form-row > div{flex:1;min-width:200px;}
.form-row label{margin-top:0;}
.campo-nota{font-size:13px;color:#6b756f;margin:2px 0 10px;}
/* Étiquette "(opcional)" + liste de cases à cocher pour culturas/especies dans le
   formulaire d'inscription à l'annuaire (demande 28/08/2026, remplace le <select
   multiple> peu clair d'avant). */
.campo-opcional{font-weight:400;font-size:12px;color:#6b756f;text-transform:none;letter-spacing:0;}
.taxonomia-checklist{max-height:180px;overflow-y:auto;border:1px solid #ccd6cf;border-radius:6px;
  padding:8px 10px;display:flex;flex-direction:column;gap:5px;background:#fff;margin-bottom:10px;}
.taxonomia-checklist label{display:flex;align-items:center;gap:7px;font-weight:400;font-size:13.5px;margin:0;}
.taxonomia-checklist input[type=checkbox]{width:auto;}

.card-row{display:flex;gap:18px;flex-wrap:wrap;align-items:stretch;margin-bottom:18px;}
.card-row > .card{flex:1;min-width:280px;margin-bottom:0;}

/* --- Sous-menu admin, regroupé par catégorie (cf. demande 28/08/2026) --- */
.admin-nav{background:#fff;border:1px solid #e2e8e3;border-radius:10px;padding:14px 18px;margin-bottom:18px;display:flex;flex-direction:column;gap:10px;}
.admin-nav-panel{padding-bottom:10px;border-bottom:1px solid #e2e8e3;}
/* flex-wrap:nowrap + overflow-x:auto (pedido el 03/09/2026) : le groupe "Contenido" (7
   liens) retombait à la ligne sur les écrans classiques et donnait un rendu en escalier ;
   on force désormais une seule ligne par groupe, avec un défilement horizontal discret si
   ça ne rentre vraiment pas (mobile étroit), plutôt qu'un retour à la ligne. */
.admin-nav-grupo{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;align-items:center;padding-bottom:2px;}
.admin-nav-grupo .btn{flex-shrink:0;}
.admin-nav-titulo{font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;color:#6b756f;font-weight:800;min-width:82px;}
.admin-nav .btn{padding:6px 12px;font-size:0.9em;}

.video-responsive{position:relative;width:100%;padding-bottom:56.25%;height:0;border-radius:10px;overflow:hidden;}
.video-responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.btn{display:inline-block;background:var(--green-700,#2d6a45);color:#fff;border:none;padding:11px 20px;border-radius:8px;font-weight:700;font-size:13.5px;cursor:pointer;text-decoration:none;}
.btn:hover{opacity:.92;}
.btn-gold{background:var(--gold,#b8863f);}
.btn-outline{background:transparent;border:1px solid var(--green-700,#2d6a45);color:var(--green-700,#2d6a45);}

.filters{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:16px;align-items:start;}
.filters label{font-size:10.5px;text-transform:uppercase;color:#6b756f;margin-bottom:3px;}
/* Listes "ascenseur" (pedido el 02/09/2026) : select[size] prend sa hauteur naturelle
   (nombre de lignes visibles) plutôt que d'être étiré à la hauteur de la plus grande
   cellule de la grille — align-items:start ci-dessus fait déjà l'essentiel, cette
   règle couvre les navigateurs qui appliqueraient quand même height:100% par défaut. */
.filters select[size]{height:auto;}
/* Champ mot-clé agrandi (pedido el 15/09/2026 : "agrandit de 30% la zone de recherche par
   mot-clé") — occupe 2 cellules de la grille .filtro-seccion (repeat(auto-fill,
   minmax(160px,1fr))) au lieu d'une seule, un gain largement supérieur à 30% sur grand
   écran mais qui reste raisonnable (la grille elle-même limite la largeur totale
   disponible). Repasse à 1 seule cellule sous 640px (l'écran entier de toute façon à
   cette largeur, cf. .filtro-seccion qui passe alors en 1 colonne). L'ancien intitulé
   "Rechercher par mot-clé…" est retiré (cf. fiches.php/index.php) : le champ ne porte
   plus que son texte d'origine en placeholder grisé (couleur native du navigateur). */
.campo-palabra-clave{grid-column:span 2;}
/* Réduit de 20% (pedido el 15/09/2026 : "champs recherche par mot clé à reduire de 20%") —
   la div garde ses 2 cellules de grille (pas de reflow des champs voisins), seul le champ
   visible (l'input) rétrécit de 20% par rapport à sa pleine largeur précédente. */
.campo-palabra-clave input[type="text"]{width:80%;}
@media (max-width:640px){.campo-palabra-clave{grid-column:span 1;}.campo-palabra-clave input[type="text"]{width:100%;}}
/* Anciennes règles .campo-busqueda-texto (colonne étroite pour mot-clé+domaine) et
   .campo-salto-linea (forçage de retour à la ligne) retirées le 07/09/2026 : la zone de
   recherche est désormais découpée en sections pleine largeur par tons de vert (cf.
   .filtro-seccion/.filtro-tono-a/.filtro-tono-b plus bas), qui gèrent déjà elles-mêmes
   le placement de chaque groupe de champs — ces 2 classes ne sont plus utilisées dans le
   HTML (fiches.php/index.php) mais restent sans effet néfaste si un ancien cache HTML
   les référence encore ponctuellement. */
/* "Domaine" par coches Végétal/Animal (pedido el 04/09/2026, remplace l'ancien
   <select> mundo) : les 2 coches côte à côte au lieu d'un menu déroulant, alignées
   avec le style compact des autres champs de ce bloc étroit. */
.campo-mundo-coches{display:flex;gap:14px;align-items:center;min-height:38px;}
.campo-mundo-coches .coche-inline{display:flex;align-items:center;gap:6px;font-weight:normal;font-size:14.5px;cursor:pointer;}
.campo-mundo-coches .coche-inline input{width:auto;cursor:pointer;}
/* Puces cliquables des filtres à liste courte (pedido el 07/09/2026 : "lorsque liste
   courte moins de 9 items, présenter les items dans la zone plutôt qu'un ascenseur" —
   cf. campo_filtro_unico() dans includes/functions.php) : remplace visuellement le
   <select> compact par des choix directement cliquables, sans avoir à l'ouvrir. */
.filtro-chips{display:flex;flex-wrap:wrap;gap:6px;}
.filtro-chips .chip-opcion{display:inline-flex;align-items:center;border:1px solid var(--green-700,#2d6a45);border-radius:20px;padding:5px 12px;font-size:12.5px;line-height:1.2;cursor:pointer;color:var(--green-700,#2d6a45);background:transparent;font-weight:600;}
.filtro-chips label.chip-opcion input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.filtro-chips .chip-opcion.chip-activa,.filtro-chips label.chip-opcion:has(input:checked){background:var(--gold,#b8863f);border-color:var(--gold,#b8863f);color:#fff;}
/* Variante "case à cocher" à sélection MULTIPLE (pedido el 15/09/2026) : cf.
   campo_filtro_multiple() dans includes/functions.php ("Type de pathologie"/"Type de
   traitement"/"Mode de préparation"). CORRIGÉ une 2e fois le même jour (pedido : "eleve
   le cadre des choix ca fait bouton. place juste le nom et la case à cocher.") — même la
   version corrigée avec case visible gardait le contour arrondi de puce, qui continuait
   à ressembler à un bouton une fois cochée (fond coloré). Version finale : plus AUCUN
   cadre/pastille — juste la case à cocher native du navigateur suivie du libellé, l'un à
   côté de l'autre, sans bordure ni fond, disposés en colonne (une option par ligne, plus
   lisible qu'en ligne pour une liste à cocher). */
.filtro-chips.filtro-chips-multiple{display:flex;flex-direction:column;gap:4px;}
.filtro-chips .chip-opcion-multiple{display:inline-flex;align-items:center;gap:7px;padding:2px 0;font-size:13px;line-height:1.3;cursor:pointer;color:var(--green-900,#1f3d2b);background:transparent;border:none;border-radius:0;font-weight:500;}
.filtro-chips .chip-opcion-multiple input{width:15px;height:15px;margin:0;flex:none;cursor:pointer;accent-color:var(--gold,#b8863f);}
.filtro-chips .chip-opcion-multiple:has(input:checked){font-weight:700;}
/* <select> gardé dans le DOM (pour la cascade JS tipo -> valeur) mais remplacé
   visuellement par les puces .filtro-chips ci-dessus quand la liste est courte. */
.select-oculto-chips{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
/* Sections de la zone de recherche séparées par tons de vert (pedido el 07/09/2026,
   "séparer les sections de cette zone par tons de la couleur verte du site") : chaque
   groupe de champs apparentés (fiches.php et index.php, mêmes classes) devient une
   bande pleine largeur (grid-column:1/-1) avec sa propre mini-grille interne — reprend
   la même logique de colonnes que .filters/.home-busqueda .filters ci-dessus/ci-dessous,
   juste imbriquée. 2 tons alternés (--green-50/--green-100, déjà utilisés ailleurs sur
   le site, configurables depuis Administration > Thème) suffisent à distinguer chaque
   section de ses voisines sans surcharger visuellement le formulaire. */
.filtro-seccion{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;padding:14px 16px;border-radius:10px;}
/* Pays + Provincia + Ingrédient + Outil dans la MÊME colonne de la grille (pedido el
   15/09/2026 : "Ingrédient / Outil PAYS sur la même colonne") — ces 4 champs partagent
   désormais une seule cellule .filtro-seccion (au lieu de 3-4 cellules séparées),
   empilés verticalement à l'intérieur via ce wrapper flex, cf. fiches.php/index.php. */
.filtro-columna-agrupada{display:flex;flex-direction:column;gap:10px;}
.filtro-tono-a{background:var(--green-50,#f3f9f4);}
.filtro-tono-b{background:var(--green-100,#e7f3ea);}
/* Grille fixe "1 ligne, 6 colonnes" (pedido el 15/09/2026 : "l'agencement de la zone
   de recherche [...] doit être le même que la page d'accueil. en une ligne, 6
   colonnes.") — jusqu'ici réservée à .home-busqueda (page d'accueil), qui l'emportait
   sur le repeat(auto-fill,...) par défaut de .filtro-seccion ci-dessus (nombre de
   colonnes fluide selon la largeur disponible, d'où l'agencement différent sur
   /fichas.php, qui ne portait pas cette classe). Étendue à .fichas-busqueda (nouvelle
   classe sur le <form> de fiches.php) pour un rendu identique aux 2 endroits. */
.home-busqueda .filtro-seccion,.fichas-busqueda .filtro-seccion{grid-template-columns:repeat(6,1fr);}
@media (max-width:900px){.home-busqueda .filtro-seccion,.fichas-busqueda .filtro-seccion{grid-template-columns:repeat(3,1fr);}}
@media (max-width:560px){.home-busqueda .filtro-seccion,.fichas-busqueda .filtro-seccion{grid-template-columns:1fr;}}
/* Titre de domaine sur /fichas?mundo=vegetal et /fichas?mundo=ganaderia (pedido el
   15/09/2026 : "l'afficher comme titre [...] en gras et en taille plus grande (h2 ou
   h3??)") — remplace la coche de domaine désormais retirée du formulaire sur ces 2
   pages, cf. fiches.php. */
.titulo-dominio-buscar{font-size:26px;font-weight:800;margin:4px 0 14px;color:var(--green-900,#1f3d2b);}
@media (max-width:640px){.titulo-dominio-buscar{font-size:21px;}}

.suelo-swatch{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:middle;}

/* Protection obligatoire (EPP : lunettes/gants/masque) — pedido el 08/09/2026, cf.
   bloque_epp()/icono_epp() dans includes/functions.php. Un seul état "requis" (vert),
   pas de comparaison sans/avec (simplifié sur demande le 08/09/2026). */
.epp-iconos{display:flex;gap:6px;}
.epp-icono{width:26px;height:26px;border-radius:6px;background:#fff;border:1px solid #b9dcc4;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.epp-icono svg{width:16px;height:16px;stroke:var(--green-700,#2d6a45);}
.epp-badge{display:inline-flex;align-items:center;gap:10px;background:var(--green-100,#e7f3ea);color:var(--green-700,#2d6a45);border:1px solid #b9dcc4;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:700;}
.epp-banner{background:#fff7e8;border:1px solid #e9d6a8;border-radius:10px;padding:14px 16px;margin:12px 0;}
.epp-banner-cabecera{color:#8a5a10;font-weight:700;font-size:14.5px;margin-bottom:6px;}
.epp-banner p{margin:0 0 10px;font-size:13.5px;color:#5a4318;line-height:1.5;}
.epp-banner .epp-icono{width:38px;height:38px;}
.epp-banner .epp-icono svg{width:22px;height:22px;}
@media (prefers-color-scheme:dark){
  .epp-icono{background:#20281f;border-color:#3a5240;}
  .epp-badge{background:#20281f;border-color:#3a5240;}
  .epp-banner{background:#2b2312;border-color:#5a4a20;}
  .epp-banner-cabecera{color:#e0b060;}
  .epp-banner p{color:#d9c9a0;}
}

/* Guide de création de fiche — bloc "exemple complet" (pedido el 09/09/2026 : "une
   fiche d'exemple est une bonne idée avec illustration graphique"), cf. guia_creadores
   version=2. Illustration en SVG ligne minimaliste, même convention que icono_epp()
   ci-dessus (viewBox 0 0 24 24, stroke=currentColor, stroke-width=2) et volontairement
   sans aucun texte "en dur" dans le SVG : le même markup sert tel quel dans les 6
   langues, seul le contenu du <dl> à côté est traduit. */
.guia-ejemplo{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap;background:var(--green-50,#f3f9f4);border:1px solid #b9dcc4;border-radius:10px;padding:16px;margin:14px 0;}
.guia-ejemplo-ilustracion{flex:none;width:64px;height:64px;border-radius:8px;background:#fff;border:1px solid #b9dcc4;display:inline-flex;align-items:center;justify-content:center;}
.guia-ejemplo-ilustracion svg{width:36px;height:36px;stroke:var(--green-700,#2d6a45);}
.guia-ejemplo-campos{flex:1 1 220px;min-width:220px;margin:0;display:grid;grid-template-columns:max-content 1fr;gap:5px 14px;}
.guia-ejemplo-campos dt{font-weight:700;color:var(--green-900,#1f3d2b);font-size:13.5px;}
.guia-ejemplo-campos dd{margin:0;font-size:13.5px;color:#333;}
@media (max-width:600px){
  .guia-ejemplo-campos{grid-template-columns:1fr;}
  .guia-ejemplo-campos dt{margin-top:8px;}
}
@media (prefers-color-scheme:dark){
  .guia-ejemplo{background:#20281f;border-color:#3a5240;}
  .guia-ejemplo-ilustracion{background:#20281f;border-color:#3a5240;}
  .guia-ejemplo-campos dt{color:#bfe3c8;}
  .guia-ejemplo-campos dd{color:#d9d9d9;}
}

table{width:100%;border-collapse:collapse;font-size:14.5px;}
th{text-align:left;padding:9px 12px;background:var(--green-50,#f3f9f4);color:var(--green-700,#2d6a45);font-size:11px;text-transform:uppercase;}
td{padding:9px 12px;border-top:1px solid #e2e8e3;}

.alert{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:14.5px;}
.alert-ok{background:#e7f3ea;color:#1f3d2b;}
.alert-error{background:#fbe9e7;color:#7a2e1d;}
.alert-info{background:#f4e7cf;color:#3b2a0f;}

/* Banniere CTA sur les fiches publiques indexables, pour visiteur anonyme (pedido el 28/08/2026) */
.ficha-publica-cta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.ficha-publica-cta p{margin:0;}

.footer{background:var(--green-900,#1f3d2b);color:#fff;padding:24px;font-size:12.5px;margin-top:40px;text-align:center;}
.footer a{color:#fff;text-decoration:underline;}
.footer a.btn{text-decoration:none;}
.footer-links{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:8px;justify-content:center;}
.footer-linea{margin:0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;font-size:15px;opacity:.95;}
/* Menu de navigation déplacé du bandeau du haut vers le pied de page (pedido el
   01/09/2026) — mêmes liens .nav, juste réagencés en ligne centrée avec un peu
   d'espace avant la ligne copyright/don. */
.footer-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:14px;font-size:13.5px;}
.footer-separador{opacity:.6;}
.btn-discreto{padding:6px 14px;font-size:12px;opacity:.85;text-decoration:none;}
.btn-discreto:hover{opacity:1;}
.btn-verde-claro{background:var(--green-600,#3f7d57);}

.trayectoria-item{margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid #e2e8e3;}
.trayectoria-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.trayectoria-item .anio{display:inline-block;font-family:var(--font-heading);color:var(--gold,#b8863f);font-weight:800;font-size:15px;margin-bottom:4px;}

/* --- Photo en fond sur TOUTES les pages (cf. demande 28/08/2026) --- Un peu plus
   de transparence que la version précédente (.88 / .82 → .73 / .67, cf. demande
   31/08/2026 : "un peu plus de transparence dans l'image de fond"), dégradé neutre
   gris foncé (pas vert, demande explicite "sans couleur verte dans la
   transparence" du 28/08/2026 — toujours respectée). */
body{background:linear-gradient(135deg,rgba(15,15,15,.73),rgba(45,45,45,.67)),url('/assets/img/hero-bg.jpg') center/cover no-repeat;background-attachment:fixed;}
/* background-attachment:fixed : sans ça, "cover" dimensionnerait la photo sur toute
   la hauteur scrollable de chaque page (souvent bien plus haute que l'écran),
   l'agrandissant démesurément et la rendant floue. "fixed" la cale sur la taille
   de l'écran. */

/* --- Page d'accueil : chiffres clés, blocs publics, section explicative --- */
/* La photo de fond s'applique sur TOUTES les pages du site (règle body{} plus haut),
   pas seulement l'accueil — cf. demande 01/09/2026. Le bandeau reste transparent
   pour laisser voir la photo de fond en continu. */
/* Bloc .hero (titre + tagline en pleine largeur sur la photo de fond) retiré le
   02/09/2026 : ce même texte ($page_title / $page_subtitle) est désormais affiché
   une seule fois, dans le cadre vert du bandeau du haut (cf. includes/header.php,
   V50) — .hero, .hero-titulo, .hero-tagline, .hero-intro n'étaient utilisés que
   par cette section, désormais retirée de index.php, donc supprimés ici aussi.
   .hero-cta reste : réutilisée telle quelle comme classe générique de rangée de
   boutons (ex. contacto.php). */
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.btn-outline-inverso{display:inline-block;background:transparent;border:1px solid #fff;color:#fff;padding:11px 20px;
  border-radius:8px;font-weight:700;font-size:13.5px;cursor:pointer;text-decoration:none;}
.btn-outline-inverso:hover{background:rgba(255,255,255,.12);}

.home-busqueda{margin-bottom:36px;}
.home-busqueda h2{text-align:center;}
/* Même largeur que .home-publicos-par / .home-explicativo au-dessus et en dessous
   (continuité graphique, pedido el 31/08/2026) : pas de max-width propre, le .card
   occupe toute la largeur du .container comme ses voisins. */
.home-busqueda .filters{grid-template-columns:repeat(6,1fr);}
@media (max-width:900px){.home-busqueda .filters{grid-template-columns:repeat(3,1fr);}}
@media (max-width:560px){.home-busqueda .filters{grid-template-columns:1fr;}}
/* Étiquettes de la carte "Rechercher une fiche" en marron/doré (pedido el 04/09/2026) :
   surcharge ciblée sur cette carte de la page d'accueil uniquement (.filters label reste
   gris ailleurs, ex. /fichas, armar-recetario.php — non demandé). */
.home-busqueda .filters label{color:var(--gold,#b8863f);}

.fcard-categorias .body{padding-bottom:16px;}
.lista-categorias{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;}
.lista-categorias li a{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:17px;font-weight:700;color:var(--green-700,#2d6a45);text-decoration:none;padding:6px 0;border-bottom:1px solid #eef2ee;}
.lista-categorias li:last-child a{border-bottom:none;}
.lista-categorias li a:hover{text-decoration:underline;}
.lista-categorias .categoria-conteo{font-size:12px;font-weight:800;color:#6b756f;background:var(--green-50,#f3f9f4);border-radius:20px;padding:2px 8px;white-space:nowrap;}

/* Version pleine page (categorias.php, ingredientes.php) : texte un peu plus grand
   que la mini-liste de la carte d'accueil (cf. demande 28/08/2026). */
.lista-categorias-pagina li a{font-size:17px;padding:10px 2px;}
.lista-categorias-pagina .categoria-conteo{font-size:12px;}

.home-publicos,.home-recientes{margin-bottom:36px;}
.home-recientes .fcard .body{text-align:center;}
.home-publicos h2{text-align:center;}
.home-publicos .fcard p,.home-recientes .fcard p{font-size:14px;color:#555;margin:0;}
.fcard-boton .body{padding-bottom:16px;text-align:center;}
/* home_publico_vegetal / home_publico_ganaderia en vert clair du logo (pedido el
   31/08/2026) : ce paragraphe avait sa propre couleur explicite (vert foncé), donc
   n'était pas concerné par le passage au vert clair de tout à l'heure. (Ces 2 cartes
   ont depuis retrouvé leur fond blanc — cf. demande du 01/09/2026 — mais la couleur
   du texte, elle, reste le vert clair demandé séparément.) */
.fcard-boton .body p{font-weight:700;color:#86A120;}
/* Titre <h2> retiré de ces cartes (pedido el 04/09/2026) — le texte vert (autrefois un
   simple <p>) devient le titre visuel de la carte, agrandi en <h4>. */
.fcard-boton .body h4{font-family:var(--font-heading);font-weight:700;color:#86A120;font-size:22px;line-height:1.25;margin:4px 0 8px;}
.fcard-boton .btn{margin-top:12px;display:inline-block;}

/* Pictogramme "vegetal" / "ganadería" en fond de carte, en transparence légère,
   au lieu du bloc .thumb séparé retiré du HTML (cf. demande 28/08/2026). */
.fcard-boton-vegetal,.fcard-boton-ganaderia{position:relative;}
.fcard-boton-vegetal::before,.fcard-boton-ganaderia::before{
  content:"";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:130px;line-height:1;opacity:.14;pointer-events:none;z-index:0;
}
.fcard-boton-vegetal::before{content:"🌿";}
.fcard-boton-ganaderia::before{content:"🐄";}
.fcard-boton-vegetal .body,.fcard-boton-ganaderia .body{position:relative;z-index:1;}

/* Même traitement (pictogramme en fond de carte, en transparence) pour les 2 cartes
   "Categorías" de l'accueil — remplace le bloc .thumb séparé retiré du HTML
   (cf. demande 28/08/2026). */
.fcard-categorias-vegetal,.fcard-categorias-animal{position:relative;}
.fcard-categorias-vegetal::before,.fcard-categorias-animal::before{
  content:"📚";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:130px;line-height:1;opacity:.14;pointer-events:none;z-index:0;
}
.fcard-categorias-vegetal .body,.fcard-categorias-animal .body{position:relative;z-index:1;}

/* Idem pour les cartes "Últimas fichas publicadas" de l'accueil (cf. demande 28/08/2026) :
   le pictogramme 🌿 passe en fond de carte plutôt qu'en bloc .thumb séparé. */
.fcard-reciente{position:relative;}
.fcard-reciente::before{
  content:"🌿";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:90px;line-height:1;opacity:.14;pointer-events:none;z-index:0;
}
.fcard-reciente .body{position:relative;z-index:1;}

/* Cartes de fiches individuelles (fiches.php, fiche.php "recomendaciones", armar-recetario.php)
   (pedido el 28/08/2026) : même traitement pictogramme-en-fond que ci-dessus, MAIS le
   pictogramme dépend cette fois du monde DE LA FICHE elle-même (f.mundo), via
   fcard_mundo_clase() dans includes/functions.php — corrige le bug où le bloc .thumb
   séparé affichait toujours 🌿, y compris sur les fiches du monde animal. */
.fcard-ficha-vegetal,.fcard-ficha-ganaderia,.fcard-ficha-ambos{position:relative;}
.fcard-ficha-vegetal::before,.fcard-ficha-ganaderia::before,.fcard-ficha-ambos::before{
  content:"";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  line-height:1;opacity:.14;pointer-events:none;z-index:0;
}
.fcard-ficha-vegetal::before{content:"🌿";font-size:90px;}
.fcard-ficha-ganaderia::before{content:"🐄";font-size:90px;}
.fcard-ficha-ambos::before{content:"🌿🐄";font-size:52px;}
.fcard-ficha-vegetal .body,.fcard-ficha-ganaderia .body,.fcard-ficha-ambos .body{position:relative;z-index:1;}

/* Cadre doré qui ENTOURE chaque paire de cartes de l'accueil (cf. demande 28/08/2026,
   corrige les 2 essais précédents : un ::after hors de la carte, rogné par
   overflow:hidden ; puis un simple border-right, qui n'entourait pas vraiment la
   paire). Ici .home-publicos-par est le cadre lui-même — un vrai rectangle doré autour
   des 2 cartes qu'il contient — donc 2 cadres au total : un pour vegetal, un pour
   animal. align-items:start empêche en plus la carte "recherche" (courte) de s'étirer
   à la hauteur de la carte "catégories" (plus longue à cause de la liste) : chaque
   carte garde sa propre hauteur, au lieu d'un grand vide sous le bouton. */
.home-publicos-par{
  border:2px solid var(--gold,#b8863f);border-radius:14px;padding:16px;
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px;align-items:start;
  margin-bottom:20px;
}
.home-publicos-par:last-child{margin-bottom:0;}
@media (max-width:640px){
  .home-publicos-par{grid-template-columns:1fr;}
}

/* Regroupement des 2 cadres (Végétal / Élevage) "sur la même ligne" (pedido
   15/09/2026) : jusqu'ici .home-publicos-par-vegetal et .home-publicos-par-animal
   étaient simplement 2 blocs empilés l'un sous l'autre. .home-publicos-parejas est
   le nouveau conteneur qui les met côte à côte en 2 colonnes sur écran large.
   Comme chaque cadre devient alors 2x plus étroit, sa propre grille interne (carte
   "bouton recherche" + carte "liste de catégories" déjà côte à côte via
   .home-publicos-par ci-dessus) est repassée en 1 seule colonne (empilée) pour que
   le texte des catégories (notamment les intitulés Élevage, plus longs) reste
   lisible — au lieu d'écraser 4 colonnes de contenu sur la largeur d'un cadre. Sur
   mobile, retour à l'empilement vertical simple (comportement identique à avant). */
.home-publicos-parejas{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
.home-publicos-parejas .home-publicos-par{grid-template-columns:1fr;margin-bottom:0;}
@media (max-width:640px){
  .home-publicos-parejas{grid-template-columns:1fr;gap:0;}
}

/* Police réduite pour la liste Élevage sur mobile (pedido 15/09/2026) : intitulés
   plus longs ("Antiparasitaires & répulsifs", "Suppléments minéraux &
   nutritionnels"...) que côté Végétal, donc plus sujets aux retours à la ligne sur
   petit écran. La liste Végétal garde sa taille normale (17px, cf. .lista-categorias
   li a plus haut) — seule celle d'Élevage est réduite, et seulement sous 640px. */
@media (max-width:640px){
  .fcard-categorias-animal .lista-categorias li a{font-size:14px;}
  .fcard-categorias-animal .lista-categorias .categoria-conteo{font-size:11px;padding:2px 6px;}
}

.fcard-boton-vegetal h2,.fcard-boton-ganaderia h2{font-size:19px;line-height:1.25;margin:4px 0 8px;color:var(--gold,#b8863f);}

/* Titre "Categorías vegetales/animales" + sous-titre "Explora el recetario..." sur la
   même ligne et en plus gros (pedido el 28/08/2026), au lieu de 2 lignes empilées. */
.fcard-categorias-cabecera{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:6px;}
.fcard-categorias-cabecera h3{margin:0;font-size:20px;}
.fcard-categorias-cabecera .fcard-categorias-subtitulo{font-size:16px;font-weight:600;color:#555;}

/* Titre de catégorie ("Biofertilizantes", "Bioestimulante", etc.) en doré sur les
   cartes de la section "Últimas fichas publicadas" de l'accueil (pedido le 28/08/2026). */
.home-recientes .fcard .cat{color:var(--gold,#b8863f);}

.home-explicativo{background:var(--green-50,#f3f9f4);border-radius:12px;padding:26px 28px;margin-bottom:36px;
  display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.home-explicativo-col-texto{flex:3 1 320px;}
.home-explicativo-col-texto h2{margin-top:0;}
.home-explicativo-col-texto p{max-width:760px;line-height:1.65;margin:0;}
/* Colonne bouton élargie (160px -> 300px de base, demande 28/08/2026) : la 2e ligne
   ("Infusión, decocción, maceración, fermentación...") passait mal, coincée dans une
   colonne trop étroite malgré le <br> déjà présent dans index.php. */
.home-explicativo-col-boton{flex:1 1 300px;display:flex;justify-content:flex-end;}
.home-explicativo-col-boton .btn{text-align:center;line-height:1.5;}

.home-cta-final{text-align:center;padding:8px 0 20px;}
.home-cta-final p{font-size:16px;margin-bottom:14px;}

/* admin/actualizacion.php : champ .zip puis bouton "Aplicar" juste en dessous (pedido
   el 08/09/2026 : "Placer le bouton appliquer mise à jour juste en dessous de
   parcourir") — colonne unique, plus de grille à colonnes côte à côte (l'ancien champ
   "Fichier .sql" séparé, qui justifiait la 2e colonne, a été retiré le 08/09/2026). Le
   bouton est volontairement compact (largeur au contenu, pas 100%) pour rester
   visuellement rattaché au champ juste au-dessus plutôt que de s'étirer sur toute la
   largeur de la carte. */
.admin-actualizacion-grid{display:flex;flex-direction:column;align-items:flex-start;gap:10px;}

/* Colonnes gauche (formulaire zip)/droite (astuces) de admin/actualizacion.php
   (pedido el 08/09/2026) — passe en 1 colonne empilée sur petit écran. */
.admin-actualizacion-2col{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;}
@media (max-width:640px){.admin-actualizacion-2col{grid-template-columns:1fr;}}

/* --- Fiche individuelle : sections encadrées, titres réduits (cf. demande 28/08/2026) --- */
.ficha-seccion{background:#fff;border:1px solid var(--ficha-borde,#e2e8e3);border-radius:8px;padding:10px 14px;margin-bottom:10px;}
.ficha-seccion-titulo{font-size:13px;text-transform:uppercase;letter-spacing:.3px;margin:0 0 6px;}
.ficha-seccion p,.ficha-seccion li{font-size:14.5px;line-height:1.45;margin:0 0 5px;}
.ficha-seccion p:last-child,.ficha-seccion ul:last-child{margin-bottom:0;}
.ficha-fila-doble{display:flex;gap:10px;flex-wrap:wrap;}
.ficha-fila-doble > .ficha-seccion{flex:1;min-width:220px;}
.lista-pastillas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;}
.lista-pastillas li{display:flex;align-items:center;gap:6px;margin:0;}
.lista-pastillas li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-700,#2d6a45);flex-shrink:0;}
.ficha-foto{max-width:18%;height:auto;border-radius:8px;display:block;margin:0 0 8px;}
.ficha-referente-fila{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;}
.ficha-referente-info p{margin:0;}
.ficha-referente-botones{display:flex;gap:8px;flex-wrap:wrap;}

/* --- Compactage de la page fiche vers un format proche A4 (pedido el 01/09/2026) :
   .pagina-ficha vient de $page_body_class dans fiche.php — ne touche aucune autre
   page (.container, .badge restent inchangés partout ailleurs). Conteneur plus
   étroit + marges/badges resserrés, pour que la ficha tienne visuellement sur une
   hauteur proche d'une feuille A4 imprimée. Règle .pagina-ficha h1 retirée le
   01/09/2026 : le <h1> de fiche.php est passé dans le bandeau du haut (.topbar-title,
   cf. includes/header.php) — plus de <h1> dans le contenu de la page à compacter. --- */
.pagina-ficha .container{max-width:820px;padding:16px 20px;}
.pagina-ficha .badge{margin:0 4px 6px 0;padding:3px 8px;font-size:10px;}
.pagina-ficha p.campo-nota{margin:2px 0 6px;}
.pagina-ficha .ficha-seccion{padding:8px 12px;margin-bottom:8px;}
.pagina-ficha .ficha-seccion p,.pagina-ficha .ficha-seccion li{line-height:1.35;}

/* --- Compactage du formulaire de création de fiche vers un format proche A4 (pedido
   el 02/09/2026, même principe que .pagina-ficha ci-dessus) : .pagina-creador-form
   vient de $page_body_class dans creador/fiche-form.php — ne touche aucune autre page
   (les autres formulaires du site gardent leur espacement habituel). Cartes, libellés,
   champs et textarea resserrés. --- */
body.pagina-creador-form .card{padding:12px 16px;margin-bottom:12px;}
body.pagina-creador-form .card h2{font-size:16px;margin:0 0 8px;}
body.pagina-creador-form .card-row{gap:12px;}
body.pagina-creador-form form label{margin:6px 0 3px;font-size:13px;}
body.pagina-creador-form form input[type=text],body.pagina-creador-form form input[type=email],
body.pagina-creador-form form input[type=number],body.pagina-creador-form form select,
body.pagina-creador-form form textarea{padding:6px 9px;font-size:13px;}
body.pagina-creador-form form textarea{min-height:60px;}
body.pagina-creador-form .form-row{gap:10px;}
body.pagina-creador-form .campo-nota{font-size:12px;margin:2px 0 6px;}
@media print{
  body.pagina-creador-form .card{break-inside:avoid;}
}
/* Vert WhatsApp d'origine (#25d366) jugé trop clair/fluo (demande 28/08/2026) —
   remplacé par le vert foncé du site (--green-700), déjà utilisé sur les autres
   boutons, pour rester cohérent avec la charte tout en gardant l'icône 📱 + le
   texte "WhatsApp" comme identifiants du bouton. */
.btn-whatsapp{background:var(--green-700,#2d6a45);color:#fff;}
.btn-whatsapp:hover{opacity:.9;}

/* --- Directorio (annuaire.php) : recherche horizontale + fiches contact pleine
   largeur (pedido el 28/08/2026), à la place de la grille 3 colonnes d'avant. --- */

/* Zone de recherche, en une seule ligne horizontale (champs + bouton côte à côte). */
.annuaire-buscar{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;background:#fff;
  border:1px solid #e2e8e3;border-radius:10px;padding:16px 20px;margin-bottom:16px;}
.annuaire-buscar > div{display:flex;flex-direction:column;gap:4px;min-width:200px;}
.annuaire-buscar label{font-size:11.5px;text-transform:uppercase;letter-spacing:.3px;color:#6b756f;font-weight:700;}
.annuaire-buscar select{margin:0;}
.annuaire-buscar .btn{white-space:nowrap;}
@media (max-width:640px){
  .annuaire-buscar{flex-direction:column;align-items:stretch;}
}

/* Fiche contact : une ligne pleine largeur, scindée en 4 sections horizontales (nom+lieu /
   estatus / description / coordonnées), au lieu d'une petite carte dans une grille 3
   colonnes — cf. demande 28/08/2026. */
.anuario-lista{display:flex;flex-direction:column;gap:12px;}
/* 5 colonnes réelles sans photo (nom / país / estatus / description / contacto) —
   ajustement du 28/08/2026 (3e demande) : colonne "estatus" nettement élargie
   (minmax 260px, poids 1.1fr) pour que même le plus long libellé ("Participación
   libre individual" et ses équivalents FR/EN) tienne sur une seule ligne + nowrap
   forcé sur le badge lui-même (pas seulement sur la largeur de colonne) ; colonne
   "país" réduite en conséquence (elle n'affiche plus le tiret "—" par défaut, cf.
   annuaire.php, donc une entrée sans pays reste simplement vide) ; colonne
   "description" légèrement réduite (3.2fr) pour compenser l'espace donné à estatus. */
/* Colonnes 1 (nombre) et 2 (país) réduites de 20%, colonne 3 (estatus) élargie
   d'autant (pedido el 01/09/2026) : 140px/.85fr -> 112px/.68fr, 120px/.7fr ->
   96px/.56fr, 260px/1.1fr -> 300px/1.4fr. */
/* Colonnes 1 (nombre) / 2 (país) / 3 (estatus, catégorie du contact) réajustées
   (pedido el 01/09/2026) : la colonne 1 était devenue trop étroite après le
   resserrement du 01/09/2026 précédent -> +35% ; colonne 2 encore réduite de 25% ;
   la largeur ainsi libérée sur la colonne 2 (25% de sa valeur précédente, en fr
   et en min-width) est reportée intégralement sur la colonne 3. Colonnes 4
   (description) et 5 (contact) inchangées. */
.anuario-fila{display:grid;grid-template-columns:minmax(151px,.92fr) minmax(72px,.42fr) minmax(324px,1.54fr) 3.5fr minmax(132px,.88fr);gap:22px;align-items:center;
  background:#fff;border:1px solid #e2e8e3;border-radius:10px;padding:16px 22px;}
.anuario-fila:has(.anuario-col-foto){grid-template-columns:64px minmax(151px,.92fr) minmax(72px,.42fr) minmax(324px,1.54fr) 3.5fr minmax(132px,.88fr);}
.anuario-col-foto img{width:64px;height:64px;border-radius:50%;object-fit:cover;display:block;}
/* Nom + prénom sur une seule ligne, colonne resserrée (pedido el 01/09/2026) —
   au-delà de la largeur de colonne, le nom est tronqué avec "…" plutôt que de
   passer à la ligne. */
.anuario-col-nombre h3{margin:0 0 4px;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.anuario-ubicacion{margin:0;font-size:12.5px;color:#6b756f;}
.anuario-col-pais{font-size:14px;color:#333;white-space:nowrap;}
.anuario-col-estatus .badge{white-space:nowrap;}
.anuario-col-desc p{margin:0;font-size:14px;line-height:1.5;color:#333;}
/* Contenu centré (le bouton WhatsApp notamment, demande 28/08/2026) au lieu
   d'aligné à gauche ; texte justifié conservé. */
.anuario-col-contacto{display:flex;flex-direction:column;gap:8px;align-items:center;text-align:justify;}
.anuario-tel{margin:0;font-size:14px;white-space:nowrap;}
@media (max-width:900px){
  .anuario-fila,.anuario-fila:has(.anuario-col-foto){grid-template-columns:1fr;text-align:left;}
  .anuario-col-foto img{width:56px;height:56px;}
  .anuario-col-contacto{text-align:left;}
}

/* Barre de tri générique (▲/▼), réutilisée en haut de toutes les listes triables :
   annuaire, fiches, ingredientes, categorias, culturas, especies — pedido el 28/08/2026. */
.barra-orden{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:14px 0;padding:10px 16px;
  background:#f3f6f3;border-radius:8px;}
.barra-orden .barra-orden-etiqueta{font-size:12px;color:#6b756f;text-transform:uppercase;letter-spacing:.04em;font-weight:700;}
.orden-col{color:#333;text-decoration:none;font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:4px;}
.orden-col:hover{color:var(--green-700,#2d6a45);}
.orden-icono{font-size:11px;opacity:.45;}
.orden-activo{color:var(--green-700,#2d6a45);}
.orden-activo .orden-icono{opacity:1;}

/* Anti-copie (protection partielle, cf. spec — aucun blocage 100% fiable) */
.ficha-protegida{user-select:none;-webkit-user-select:none;}
.watermark{position:relative;}
.watermark::after{content:attr(data-watermark);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:34px;color:rgba(0,0,0,.06);transform:rotate(-30deg);pointer-events:none;font-weight:800;}

/* ============================================================
   E3 — Mode sombre (pedido el 03/09/2026) : s'adapte automatiquement au
   réglage clair/sombre de l'appareil du visiteur (prefers-color-scheme),
   aucun bouton, aucun réglage à faire côté visiteur.
   La photo de fond (body{}, plus haut) et le vert clair hors-cadre
   (#86A120) sont déjà sombres/adaptés par nature et restent inchangés.
   Ce bloc cible UNIQUEMENT les surfaces "carte" blanches (.card, .fcard,
   .ficha-seccion, .annuaire-buscar, .anuario-fila, .admin-nav,
   .taxonomia-checklist, dialog.modo-popup, .home-explicativo) et leur
   contenu interne (titres, badges, tableaux, alertes, listes, formulaires).
   Important : --green-700/--green-600/--green-900 ne sont PAS redéfinis
   globalement ici, car ils servent à la fois en fond plein avec texte
   blanc dessus (.btn, .topbar, .footer — déjà lisibles, à ne pas casser)
   ET en couleur de texte sur carte blanche (.fcard .cat, th...) — les
   redéfinir en bloc casserait l'un des deux usages. Chaque sélecteur
   concerné est donc ciblé directement, avec une teinte vert clair adaptée
   au fond sombre (#7fd89c / #8fd6a8) plutôt que le vert foncé d'origine. */
@media (prefers-color-scheme: dark) {
  .card,.fcard,.ficha-seccion,.annuaire-buscar,.anuario-fila,.admin-nav,
  .taxonomia-checklist,dialog.modo-popup,.home-explicativo{
    background:#1c2420;border-color:#33413a;color:#dce6de;
  }
  .card h1,.card h2,.card h3,
  .fcard h1,.fcard h2,.fcard h3,
  .ficha-seccion h1,.ficha-seccion h2,.ficha-seccion h3,
  .annuaire-buscar h1,.annuaire-buscar h2,.annuaire-buscar h3,
  .anuario-fila h1,.anuario-fila h2,.anuario-fila h3,
  .admin-nav h1,.admin-nav h2,.admin-nav h3,
  dialog.modo-popup h1,dialog.modo-popup h2,dialog.modo-popup h3,
  .home-explicativo h1,.home-explicativo h2,.home-explicativo h3{color:#8fd6a8;}

  .badge-bio{background:#28362c;color:#7fd89c;}
  .fcard .cat,.lista-categorias li a{color:#7fd89c;}
  .home-recientes .fcard .cat{color:var(--gold,#b8863f);}
  .fcard .thumb{background:linear-gradient(135deg,#28362c,#1c2420);}

  th{background:#232f28;color:#7fd89c;}
  td{border-top-color:#33413a;}
  .lista-categorias li a{border-bottom-color:#2a352f;}
  .lista-categorias .categoria-conteo{background:#232f28;color:#9aa79f;}

  .alert-ok{background:#1e3324;color:#a9e6bc;}
  .alert-error{background:#3a2420;color:#f0b9ac;}
  .alert-info{background:#3a3020;color:#f0dcae;}

  .badge-rol-plaga{background:#3a2420;color:#f0b9ac;}
  .badge-rol-auxiliar{background:#1e3324;color:#a9e6bc;}
  .badge-rol-neutro{background:#2a332e;color:#c7d3cb;}

  .campo-nota,.filters label,.admin-nav-titulo,dialog.modo-popup h4,
  .fcard-categorias-cabecera .fcard-categorias-subtitulo,
  .home-publicos .fcard p,.home-recientes .fcard p,
  .anuario-ubicacion,.anuario-col-pais,.anuario-col-desc p,
  .barra-orden .barra-orden-etiqueta{color:#9aa79f;}

  .password-toggle{color:#9aa79f;}
  .password-toggle:hover{color:#7fd89c;}
  .password-toggle:focus-visible{color:#7fd89c;outline-color:#7fd89c;}
  .btn-outline{border-color:#7fd89c;color:#7fd89c;}
  .filtro-chips .chip-opcion{border-color:#7fd89c;color:#7fd89c;}
  .filtro-chips .chip-opcion.chip-activa,.filtro-chips label.chip-opcion:has(input:checked){background:var(--gold,#b8863f);border-color:var(--gold,#b8863f);color:#1c2420;}
  .lista-pastillas li::before{background:#7fd89c;}

  .filtro-tono-a{background:#20281f;}
  .filtro-tono-b{background:#232f28;}

  .barra-orden{background:#20281f;}
  .orden-col{color:#c7d3cb;}
  .orden-col:hover{color:#7fd89c;}
  .orden-activo{color:#7fd89c;}

  a.card-enlace:hover{box-shadow:0 4px 14px rgba(0,0,0,.5);}

  form input[type=text],form input[type=email],form input[type=password],
  form input[type=number],form select,form textarea{
    background:#222b26;border-color:#3d4a43;color:#dce6de;
  }
  form input::placeholder,form textarea::placeholder{color:#748079;}
}