/*
 * Styles de la page d'accueil avec authentification
 * 
 * @details Interface de connexion responsive avec fond animé et optimisation mobile
 * @file      assets/css/style.index.css
 * @author    Bruno Trinquier enter@bt-c.net
 * @copyright 2025 bt-c enter - Tous droits réservés
 * @version   1.2.0
 * @since     19/10/2025 : version 1.2.0 - amélioration responsive mobile pour boîte de connexion
 */

    body {
      margin: 0;
      background: linear-gradient(45deg,
          #8B4513 0%,
          #A0522D 15%,
          #CD853F 30%,
          #DEB887 45%,
          #D2691E 60%,
          #8B4513 75%,
          #654321 90%,
          #8B4513 100%);
      box-shadow: inset 0 0 100px rgba(50, 30, 10, 0.3);
      background-repeat: repeat;
      background-size: cover;
      font-family: 'Montserrat', sans-serif;
      background-color: #f4f4f4;
      overflow-x: hidden;
      /* Force la restauration des comportements natifs */
      touch-action: manipulation !important;
      overscroll-behavior: auto !important;
      overscroll-behavior-y: auto !important;
      -webkit-overflow-scrolling: touch !important;
    }
    
    *, *::before, *::after {
      touch-action: manipulation !important;
    }

    .background {
      position: fixed;
      width: 100%;
      height: 100%;
      z-index: -1;
    }

    .background img {
      position: absolute;
      width: 300px;
      box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);
      transition: transform 0.3s;
    }

    /* .background img:hover {
      transform: scale(1.05) rotate(var(--angle));
      z-index: 1;
    } */

    .login-box {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: rgba(255, 255, 255, 0.95);
      padding: 30px;
      border-radius: 10px;
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
      width: 300px;
      text-align: center;
    }

    .login-box h2 {
      margin-bottom: 20px;
    }

    .login-box input {
      width: 100%;
      padding: 10px;
      margin: 10px 0;
      border: 1px solid #ccc;
      border-radius: 5px;
    }

    .login-box button {
      width: 100%;
      padding: 10px;
      background-color: #e63946;
      color: white;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }

    .login-box button:hover {
      background-color: #d62828;
    }

    /* === RESPONSIVE DESIGN - VERSION MOBILE === */
    @media (max-width: 768px) {
      .login-box {
        width: 75%;
        padding: 30px 40px;
        font-size: 20px;
        min-height: 300px;
      }
      
      .login-box h2 {
        font-size: 30px;
        margin-bottom: 40px;
        font-weight: bold;
      }
      
      .login-box input {
        padding: 12px;
        margin: 15px 0;
        font-size: 20px;
        border-radius: 10px;
        border: 2px solid #ccc;
      }
      
      .login-box button {
        padding: 25px;
        font-size: 22px;
        font-weight: 700;
        border-radius: 10px;
        margin-top: 20px;
      }
    }

    /* === FOOTER POSITIONING === */
    .footer-index {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      text-align: center;
      font-size: 10pt;
      background: rgba(255, 255, 255, 0.9);
      padding: 8px 5px;
      z-index: 1001;
      margin: 0;
      backdrop-filter: blur(3px);
      border-top: 1px solid rgba(139, 69, 19, 0.2);
    }
