/*
 * Copyright (C) 2022-2026  La Nation du Web  <alpha1@lanationduweb.fr>
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */

/*
 * Feuille de style statique du module NationVerifProduit.
 * Panneau des indicateurs on/off affiché sous la bannière d'identité de la
 * fiche produit et de l'onglet stock produit (voir
 * class/actions_nationverifproduit.class.php pour le détail des deux points
 * d'injection natifs utilisés depuis la version 4.2.2) :
 *   - Fiche produit ('productcard') : hook natif 'tabContentViewProduct'
 *     (product/card.php), qui s'exécute juste après dol_banner_tab() et
 *     avant le bloc natif '<div class="fichecenter">' des informations
 *     produit. Le panneau y est un bloc HTML totalement indépendant de la
 *     bannière, dans le même conteneur de page que le reste de la fiche :
 *     'width:100%' y exploite donc réellement la largeur utile de la fiche,
 *     sans dépendre ni forcer un parent natif.
 *   - Onglet stock ('stockproductcard') : ce hook n'existe pas sur cet écran
 *     (product/stock/product.php n'appelle jamais 'tabContentViewProduct') ;
 *     le panneau y reste rendu par le hook natif 'formDolBanner', donc
 *     toujours à l'intérieur du conteneur natif '.refid' de la bannière
 *     (largeur bornée par la classe native 'maxwidth750', non modifiée).
 * Dans les deux cas : 'width:100%' du conteneur réellement fourni par
 * Dolibarr à cet endroit, sans min-width artificiel destiné à forcer un
 * parent, sans float, sans position:fixed/absolute, aucun framework externe.
 */

.nationverifproduit-panel {
	box-sizing: border-box;
	display: block;
	clear: both;
	width: 100%;
	margin: 10px 0;
	padding: 12px 18px;
	background: #fff;
	border: 1px solid #dfe2e6;
	border-radius: 6px;
}

.nationverifproduit-panel-title {
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 1px solid #edeff2;
	color: #6b7280;
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* Desktop >= 1200px : disposition stable en 3 colonnes (pas d'auto-fit), pour que 5 indicateurs
   se répartissent naturellement en 3 puis 2, sans dépendre de la largeur exacte du conteneur. */
.nationverifproduit-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.nationverifproduit-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-width: 0;
	padding: 6px 10px;
	border-radius: 10px;
	background-color: wheat;
	transition: background-color 0.2s ease;
}

/* L etat d erreur garde le meme rayon que l etat normal : a 4px contre 10px
   les coins changeaient de forme selon l etat, ce qui se lit comme un defaut
   d affichage et non comme une alerte.

   La teinte passe de #fdf1f1 a #f6c9c9 : sur un fond wheat, le rose tres pale
   d origine etait PLUS CLAIR que l etat normal. L alerte paraissait alors
   moins appuyee que le repos. */
.nationverifproduit-item.has-error {
	background-color: #f6c9c9;
	border-radius: 10px;
}

.nationverifproduit-item-label {
	color: #32383e;
	font-size: 0.92em;
	line-height: 1.3;
	overflow-wrap: break-word;
}

.nationverifproduit-item.has-error .nationverifproduit-item-label {
	color: #a33a3a;
}

/* Interrupteur (bouton natif, pas de dépendance externe) */
.nationverifproduit-switch {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	padding: 2px;
	margin: 0;
	border: none;
	background: none;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.nationverifproduit-switch:disabled {
	cursor: wait;
	opacity: 0.6;
}

.nationverifproduit-switch-track {
	position: relative;
	display: inline-block;
	width: 36px;
	height: 20px;
	background-color: #ced2d8;
	border-radius: 999px;
	transition: background-color 0.18s ease;
}

.nationverifproduit-switch-thumb {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	transition: left 0.18s ease;
}

.nationverifproduit-switch.is-on .nationverifproduit-switch-track {
	background-color: #2f9e63;
}

.nationverifproduit-switch.is-on .nationverifproduit-switch-thumb {
	left: 18px;
}

.nationverifproduit-switch:hover:not(:disabled) .nationverifproduit-switch-track {
	filter: brightness(0.95);
}

.nationverifproduit-switch:focus {
	outline: none;
}

.nationverifproduit-switch:focus-visible {
	outline: 2px solid #2f6f9e;
	outline-offset: 2px;
	border-radius: 999px;
}

/* Statut en lecture seule (utilisateur sans droit de modification) */
.nationverifproduit-status {
	flex: 0 0 auto;
	padding: 2px 9px;
	border-radius: 999px;
	font-size: 0.78em;
	font-weight: 600;
	white-space: nowrap;
}

.nationverifproduit-status.is-on {
	background-color: #e6f4ec;
	color: #1f7a48;
}

.nationverifproduit-status.is-off {
	background-color: #eef0f2;
	color: #6b7280;
}

/* Tablette : repli à 2 colonnes stables (toujours pas d'auto-fit), les cellules restant assez
   larges pour éviter les retours à la ligne inutiles sur les libellés courants du module. */
@media only screen and (max-width: 1199px) and (min-width: 768px) {
	.nationverifproduit-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Écrans étroits (mobile) : une seule colonne, pleine largeur, lecture simple. */
@media only screen and (max-width: 767px) {
	.nationverifproduit-panel {
		margin: 8px 0;
	}

	.nationverifproduit-list {
		grid-template-columns: 1fr;
	}
}

/*
 * Page d'administration (admin/setup.php). Le SVG du module (img/object_nationlogo.svg)
 * est un logo horizontal sans attribut width/height (viewBox seul) : sans contrainte de
 * taille, un <img> qui le référence s'affiche à une taille disproportionnée. Aucune classe
 * utilitaire native Dolibarr ne couvre ce cas (pictofixedwidth cible une icône carrée de
 * 16px). Règle minimale, seule adaptation visuelle nécessaire de cette page.
 */
.nationverifproduit-admin-logo {
	height: 28px;
	width: auto;
}