/* =============================================================
   iframe-tool.css — Le Panda Enragé
   Styles génériques pour les pages qui embarquent réellement une
   iframe tierce (plein écran, consent gate). Chargé en plus de
   page-intro.css (titre/texte, partagé plus largement). Partagé par
   toutes les pages "un outil, une iframe" — actuellement
   parrainage.php uniquement, investissement.php ayant dû abandonner
   l'iframe (Finary refuse d'être embarqué, voir investissement.php).
   ============================================================= */

#integration-master-container { display: flex; flex-direction: column; width: 100%; transition: 0.3s ease; }
.controls-bar { display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 12px; }

.control-btn {
    background: var(--glass); color: var(--text); border: 1px solid var(--border);
    padding: 8px 16px; border-radius: 8px; cursor: pointer; font-size: 0.7rem; font-weight: 600;
    display: flex; align-items: center; gap: 8px; transition: 0.3s;
    text-transform: uppercase; text-decoration: none;
}
.control-btn:hover { background: var(--text); color: var(--bg); }

.iframe-wrapper {
    position: relative; width: 100%; height: 88vh; border-radius: 16px;
    overflow: hidden; border: 1px solid var(--border); background: var(--bg);
}
.iframe-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }
.iframe-wrapper iframe.hidden { display: none; }

#integration-master-container.fullscreen {
    position: fixed; top: 0; left: 0; width: 100%; height: 100vh;
    z-index: 10001; background: var(--bg); padding: 15px;
}
#integration-master-container.fullscreen .iframe-wrapper { flex: 1; height: calc(100% - 60px); border-radius: 8px; }

/* ── Iframe consent gate ── */
.iframe-consent-gate {
    position: absolute; inset: 0; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 16px;
    background: var(--glass); backdrop-filter: blur(6px);
    text-align: center; padding: 30px; border-radius: 16px;
}
.iframe-consent-gate p { font-size: 0.85rem; color: var(--sub); max-width: 460px; line-height: 1.6; }

/* Nommée .consent-load-btn (au lieu de .load-btn) pour partager le nom
   de classe avec sorare.css — même rôle, même comportement JS, seule
   la valeur exacte des rayons/tailles reste propre à chaque page
   (cohérente avec le langage visuel du reste de sa propre page). */
.consent-load-btn {
    padding: 10px 28px; background: var(--text); color: var(--bg);
    border: none; border-radius: 8px; font-size: 0.75rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 1px; cursor: pointer; transition: 0.3s;
}
.consent-load-btn:hover { opacity: 0.8; }

@media (max-width: 768px) {
    .btn-text { display: none; }
}