/* Plans 2D et maquettes 3D — visionneuse des fiches de biens.
   Les couleurs viennent du thème (variables --ig-*) ; des valeurs de repli
   permettent d'utiliser l'extension avec un autre thème. */

.ig-plans { margin-top: 56px; }
.ig-plans__onglets { display: flex; flex-wrap: wrap; gap: 2px; margin-bottom: 2px; }
.ig-plan-onglet {
	display: flex; align-items: center; gap: 10px; padding: 14px 20px; cursor: pointer;
	border: 2px solid var(--ig-marine, #0D1B2A); background: transparent; color: var(--ig-marine, #0D1B2A);
	font-family: inherit; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
.ig-plan-onglet:hover { color: var(--ig-or-encre, #A8861C); }
.ig-plan-onglet.is-actif { background: var(--ig-marine, #0D1B2A); color: var(--ig-blanc, #fff); }
.ig-plan-onglet__type {
	padding: 3px 8px; background: var(--ig-or, #C9A227); color: var(--ig-marine, #0D1B2A);
	font-family: var(--ig-mono, monospace); font-size: 10px; letter-spacing: .12em;
}
.ig-plan-cadre { border: 2px solid var(--ig-marine, #0D1B2A); background: var(--ig-blanc, #fff); }
.ig-plan-cadre:fullscreen, .ig-plan-cadre.is-plein { display: flex; flex-direction: column; }
.ig-plan-cadre:fullscreen .ig-plan-vue, .ig-plan-cadre.is-plein .ig-plan-vue { flex: 1; aspect-ratio: auto; }
.ig-plan-cadre.is-plein { position: fixed; inset: 0; z-index: 150; border: 0; }

.ig-plan-vue {
	position: relative; aspect-ratio: 16 / 10; overflow: hidden; touch-action: none; background: var(--ig-blanc, #fff);
	display: grid; place-items: center;
}
.ig-plan-vue.is-glisse { cursor: grabbing; }
/* Seule la vue 3D remplit le cadre ; la page PDF garde la taille calculée. */
.ig-plan-vue > canvas { display: block; width: 100%; height: 100%; }
.ig-plan-toile { position: absolute; inset: 0; transform-origin: 0 0; display: grid; place-items: center; }
.ig-plan-pivot { display: grid; place-items: center; max-width: 100%; max-height: 100%; transform-origin: 50% 50%; transition: transform .25s ease; }
.ig-plan-pivot img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.ig-plan-toile--dxf { padding: 2%; }
.ig-plan-toile--dxf .ig-plan-pivot { width: 100%; height: 100%; }
.ig-plan-pivot > .ig-dxf { width: 100%; height: 100%; color: var(--ig-marine, #0D1B2A); }
.ig-dxf__dessin path, .ig-dxf__dessin circle, .ig-dxf__dessin use { fill: none; stroke: currentColor; stroke-width: 1; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.ig-dxf__dessin path.p { fill: currentColor; fill-opacity: .82; fill-rule: evenodd; stroke: none; }
.ig-dxf__dessin path.h { fill: currentColor; fill-opacity: .1; fill-rule: evenodd; stroke: none; }
.ig-dxf__dessin text { fill: currentColor; stroke: none; font-family: var(--ig-font, sans-serif); }
.ig-plan-toile--pdf canvas { display: block; width: auto; height: auto; max-width: none; box-shadow: 0 2px 24px rgba(13, 27, 42, .18); background: #fff; }
.ig-plan-rotation { display: inline-flex; align-items: center; height: 40px; padding: 0 12px; border: 2px solid var(--ig-marine, #0D1B2A); }
.ig-plan-rotation input { width: 96px; accent-color: var(--ig-or, #C9A227); cursor: ew-resize; }
.ig-plan-pages { display: inline-flex; align-items: center; gap: 2px; }
.ig-plan-pages__compte { padding: 0 10px; font-family: var(--ig-mono, monospace); font-size: 12px; letter-spacing: .1em; }
.ig-plan-vue:focus-visible { outline: 2px solid var(--ig-or, #C9A227); outline-offset: -4px; }

.ig-plan-message {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3;
	max-width: 80%; padding: 14px 18px; background: var(--ig-marine, #0D1B2A); color: var(--ig-blanc, #fff);
	font-size: 13px; text-align: center;
}
.ig-plan-message.is-erreur { background: #b3261e; }

.ig-plan-affiche { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; gap: 18px; padding: 24px; text-align: center; }
.ig-plan-affiche__fond { position: absolute; inset: 0; background: repeating-linear-gradient(135deg, #e4e6e9 0 16px, #eceef0 16px 32px); }
.ig-plan-affiche__fond img { width: 100%; height: 100%; object-fit: cover; }
.ig-plan-affiche > * { position: relative; }
.ig-plan-affiche__note { font-size: 13px; color: color-mix(in srgb, var(--ig-marine, #0D1B2A) 65%, transparent); }

.ig-plan-barre {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px;
	padding: 12px 16px; border-top: 2px solid var(--ig-marine, #0D1B2A);
}
.ig-plan-barre__aide { font-size: 12px; color: color-mix(in srgb, var(--ig-marine, #0D1B2A) 60%, transparent); }
.ig-plan-outils { display: flex; flex-wrap: wrap; gap: 2px; }
.ig-plan-outil {
	display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 14px; cursor: pointer;
	border: 2px solid var(--ig-marine, #0D1B2A); background: transparent; color: var(--ig-marine, #0D1B2A);
	font-family: inherit; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.ig-plan-outil:hover, .ig-plan-outil.is-actif { background: var(--ig-marine, #0D1B2A); color: var(--ig-blanc, #fff); }
.ig-plan-outil--or { background: var(--ig-or, #C9A227); border-color: var(--ig-or, #C9A227); }
.ig-plan-outil--or:hover { background: var(--ig-marine, #0D1B2A); border-color: var(--ig-marine, #0D1B2A); color: var(--ig-blanc, #fff); }

.ig-plan-source { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 16px; border-top: 2px solid color-mix(in srgb, var(--ig-marine, #0D1B2A) 15%, transparent); font-size: 14px; }
.ig-plan-source__format { font-family: var(--ig-mono, monospace); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: color-mix(in srgb, var(--ig-marine, #0D1B2A) 60%, transparent); }

@media (max-width: 700px) {
	.ig-plan-vue { aspect-ratio: 4 / 3; }
	.ig-plan-onglet { padding: 12px 14px; font-size: 11px; }
	.ig-plan-barre__aide { order: 2; width: 100%; }
}
