/* Outil · Prises du monde (Plugs & voltage), id prises : seulement ce qui lui est propre (le reste vient de app/kit.css).
   Préfixe des classes : pw- (pr- est celui du Prompteur)
   À gauche, une seule carte : le drapeau, le nom et la région ; la tension et la fréquence en deux tuiles ; les prises
   dessinées de face, en relief, centrées (chacune d'un quart de large) ; une ligne par prise qui décrit ses broches
   (4 lignes fixes). Dessous : l'info et le lien vers Consommation. À droite : le pays (recherche, liste avec drapeaux,
   hauteur fixe). */
.pw .outil-fixe { align-items: stretch; }
.pw-carte { display: flex; flex-direction: column; gap: 18px; padding: 22px; border-radius: 22px;
  background: linear-gradient(165deg, rgba(242, 240, 235, .065), rgba(242, 240, 235, .015) 60%); box-shadow: inset 0 0 0 1px var(--filet-doux), 0 24px 60px rgba(0, 0, 0, .25); }

/* En-tête : le drapeau, le nom, la région */
.pw-tete { display: flex; align-items: center; gap: 16px; min-width: 0; }
.pw-drapeau { flex: none; width: 66px; aspect-ratio: 3 / 2; border-radius: 8px; overflow: hidden; box-shadow: 0 0 0 1px rgba(242, 240, 235, .14), 0 8px 20px rgba(0, 0, 0, .35); }
.pw-drapeau svg, .pw-mini svg { display: block; width: 100%; height: 100%; }
.pw-titre { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pw-pays { margin: 0; font: 700 26px/1.1 var(--display); letter-spacing: -.03em; height: 1.1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pw-sous { font: 500 11px/1.2 var(--mono); letter-spacing: .08em; color: var(--texte2); height: 1.2em; white-space: nowrap; }

/* Tension et fréquence : deux tuiles */
.pw-chiffres { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pw-chiffre { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 14px; background: rgba(0, 0, 0, .22); box-shadow: inset 0 0 0 1px var(--filet-doux); }
.pw-chiffre span { font: var(--repere); letter-spacing: .1em; color: var(--texte2); }
.pw-chiffre b { font: 700 32px/1 var(--display); letter-spacing: -.03em; color: var(--peche); white-space: nowrap; }
.pw-chiffre b i { font-style: normal; font-size: .55em; margin-left: .25em; letter-spacing: 0; color: var(--papier); opacity: .75; }

/* Les prises, centrées, en relief */
.pw-dessins { display: flex; justify-content: center; gap: 10px; }   /* centrées (demande du propriétaire) */
.pw-dessin { flex: 0 0 calc((100% - 30px) / 4); display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; text-align: center; }
.pw-socle { width: 100%; max-width: 104px; aspect-ratio: 1; padding: 10%; margin-bottom: 6px; border-radius: 18px; background: rgba(242, 240, 235, .04); box-shadow: inset 0 0 0 1px var(--filet-doux); }
.pw-socle svg { display: block; width: 100%; height: 100%; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .45)); }
.pw-dessin b { font: 700 14px/1.2 var(--display); letter-spacing: -.01em; }
.pw-dessin span { font: 500 10.5px/1.3 var(--mono); letter-spacing: .04em; color: var(--texte2); white-space: nowrap; }
.pw-plaque { fill: url(#pw-relief); stroke: rgba(242, 240, 235, .16); stroke-width: 1.2; }
.pw-creux { fill: rgba(0, 0, 0, .18); stroke: rgba(0, 0, 0, .35); stroke-width: 1; }
.pw-trou { fill: #0b0a09; stroke: rgba(242, 240, 235, .22); stroke-width: 1; }
.pw-broche { fill: #d9d4cc; }

/* Une ligne par prise : ses broches (4 lignes fixes) */
.pw-types { display: flex; flex-direction: column; gap: 6px; padding-top: 14px; border-top: 1px solid var(--filet-doux); }
.pw-type { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: center; height: 20px; }
.pw-type b { display: grid; place-items: center; width: 22px; height: 20px; border-radius: 6px; background: rgba(242, 240, 235, .08); font: 700 11px/1 var(--mono); color: var(--papier); }
.pw-type span { font: 500 11.5px/1.2 var(--mono); letter-spacing: .03em; color: var(--texte2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pw-type.vide { visibility: hidden; }
.pw-info { flex: none; height: 2lh; margin: 0; overflow: hidden; }
.pw-actions { display: flex; justify-content: center; }

/* Le choix du pays : recherche, liste avec un petit drapeau par pays */
.pw-champ { display: flex; flex-direction: column; gap: var(--libelle); }
.pw-etiquette { font: var(--repere); letter-spacing: .1em; color: var(--texte2); }   /* comme l'étiquette d'un .champ (le kit) */
.pw-liste { height: 360px; overflow-y: auto; overscroll-behavior: contain; }
.pw-ligne { cursor: pointer; align-items: center; }
.pw-ligne .val { font-variant-numeric: tabular-nums; }
.pw-mini { flex: none; width: 24px; aspect-ratio: 3 / 2; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 1px rgba(242, 240, 235, .12); }
.pw-vide { margin: 30px 0; text-align: center; font: var(--valeur); letter-spacing: .06em; color: var(--texte2); }
@media (max-width: 559px) { .pw-carte { padding: 18px 16px; } .pw-drapeau { width: 54px; } .pw-pays { font-size: 22px; } .pw-chiffre b { font-size: 26px; } .pw-socle { border-radius: 14px; } }
