/**
 * Styles pour la page proposal accessible aux utilisateurs non connectés
 * CUSTOM - 2025-12-29
 */

#wrapper .wrapper__inner {
  justify-content : center;
}

.proposal-public-notice {
  background    : #f9f9f9;
  border        : 1px solid #e0e0e0;
  padding       : 12px 18px;
  border-radius : 4px;
  text-align    : center;
}

.proposal-public-notice .info-message {
  margin      : 0;
  color       : #666;
  font-size   : 14px;
  line-height : 1.5;
}

.proposal-public-notice .auth-link {
  color           : #333;
  font-weight     : 500;
  text-decoration : underline;
  transition      : color 0.2s ease;
}

.proposal-public-notice .auth-link:hover {
  color           : #000;
  text-decoration : underline;
}

/* Styles pour la modale de connexion */
.auth-modal {
  position : fixed;
  top      : 0;
  left     : 0;
  width    : 100%;
  height   : 100%;
  z-index  : 9999;
}

.auth-modal-overlay {
  position        : absolute;
  top             : 0;
  left            : 0;
  width           : 100%;
  height          : 100%;
  background      : rgba(0, 0, 0, 0.6);
  backdrop-filter : blur(4px);
}

.auth-modal-content {
  position      : absolute;
  top           : 50%;
  left          : 50%;
  transform     : translate(-50%, -50%);
  background    : white;
  border-radius : 12px;
  padding       : 30px;
  max-width     : 550px;
  width         : 90%;
  max-height    : 90vh;
  overflow-y    : auto;
  box-shadow    : 0 10px 40px rgba(0, 0, 0, 0.3);
  animation     : modalFadeIn 0.3s ease;
}

@keyframes modalFadeIn {
  from {
    opacity   : 0;
    transform : translate(-50%, -45%);
  }
  to {
    opacity   : 1;
    transform : translate(-50%, -50%);
  }
}

.auth-modal-close {
  position    : absolute;
  top         : 15px;
  right       : 15px;
  background  : none;
  border      : none;
  font-size   : 28px;
  cursor      : pointer;
  color       : #999;
  line-height : 1;
  padding     : 0;
  width       : 30px;
  height      : 30px;
  transition  : color 0.2s;
}

.auth-modal-close:hover {
  color : #333;
}

.auth-modal-header {
  margin-bottom : 25px;
  padding-right : 30px;
}

.auth-modal-header h3 {
  margin      : 0 0 10px 0;
  font-size   : 24px;
  font-weight : 600;
  color       : #333;
}

.auth-modal-header p {
  margin    : 0;
  color     : #666;
  font-size : 14px;
}

.auth-modal-body .form-group {
  margin-bottom : 20px;
}

.auth-modal-body .form-group label {
  display       : block;
  margin-bottom : 8px;
  font-weight   : 500;
  color         : #333;
  font-size     : 14px;
}

.auth-modal-body .form-control {
  width         : 100%;
  padding       : 12px 15px;
  border        : 1px solid #ddd;
  border-radius : 6px;
  font-size     : 14px;
  transition    : border-color 0.2s;
}

.auth-modal-body .form-control:focus {
  outline      : none;
  border-color : #2196F3;
  box-shadow   : 0 0 0 3px rgba(33, 150, 243, 0.1);
}

.auth-modal-body .btn-block {
  width           : 100%;
  padding         : 12px 20px;
  border          : none;
  border-radius   : 6px;
  font-size       : 15px;
  font-weight     : 500;
  cursor          : pointer;
  transition      : all 0.2s;
  text-align      : center;
  text-decoration : none;
  display         : block;
}

.auth-modal-body .btn-primary {
  background : #2196F3;
  color      : white;
}

.auth-modal-body .btn-primary:hover {
  background : #1976D2;
  transform  : translateY(-1px);
  box-shadow : 0 4px 12px rgba(33, 150, 243, 0.3);
}

.auth-modal-body .btn-primary:disabled {
  background : #ccc;
  cursor     : not-allowed;
  transform  : none;
}

.auth-modal-body .btn-secondary {
  background : white;
  color      : #2196F3;
  border     : 2px solid #2196F3;
  margin-top : 10px;
}

.auth-modal-body .btn-secondary:hover {
  background : #f5f5f5;
  transform  : translateY(-1px);
}

.auth-modal-divider {
  position   : relative;
  text-align : center;
  margin     : 25px 0;
}

.auth-modal-divider:before {
  content    : '';
  position   : absolute;
  top        : 50%;
  left       : 0;
  right      : 0;
  height     : 1px;
  background : #ddd;
}

.auth-modal-divider span {
  position    : relative;
  background  : white;
  padding     : 0 15px;
  color       : #999;
  font-size   : 14px;
  font-weight : 500;
}

.alert {
  padding       : 12px 15px;
  border-radius : 6px;
  margin-bottom : 15px;
  font-size     : 14px;
}

.alert-danger {
  background : #ffebee;
  color      : #c62828;
  border     : 1px solid #ef9a9a;
}

/* Styles pour le formulaire PrestaShop dans la modale */
#registerFormContainer #customer-form {
  margin-bottom : 20px;
}

#registerFormContainer #customer-form .form-group {
  margin-bottom : 15px;
}

#registerFormContainer #customer-form .form-control {
  width         : 100%;
  padding       : 12px 15px;
  border        : 1px solid #ddd;
  border-radius : 6px;
  font-size     : 14px;
  transition    : border-color 0.2s;
}

#registerFormContainer #customer-form .form-control:focus {
  outline      : none;
  border-color : #2196F3;
  box-shadow   : 0 0 0 3px rgba(33, 150, 243, 0.1);
}

#registerFormContainer #customer-form label {
  font-weight   : 500;
  color         : #333;
  font-size     : 14px;
  margin-bottom : 8px;
  display       : block;
  text-align    : left;
}

#registerFormContainer #customer-form .form-footer {
  margin-top : 20px;
}

#registerFormContainer #customer-form button[type="submit"] {
  width         : 100%;
  padding       : 12px 20px;
  border        : none;
  border-radius : 6px;
  font-size     : 15px;
  font-weight   : 500;
  cursor        : pointer;
  transition    : all 0.2s;
  background    : #2196F3;
  color         : white;
}

#registerFormContainer #customer-form button[type="submit"]:hover {
  background : #1976D2;
  transform  : translateY(-1px);
  box-shadow : 0 4px 12px rgba(33, 150, 243, 0.3);
}

#registerFormContainer #customer-form button[type="submit"]:disabled {
  background : #ccc;
  cursor     : not-allowed;
  transform  : none;
}

/* Masquer le lien "Vous avez déjà un compte" du formulaire PrestaShop */
#registerFormContainer #customer-form ~ p {
  display : none;
}

/* Ajuster les checkbox et radio */
#registerFormContainer #customer-form .custom-checkbox,
#registerFormContainer #customer-form .custom-radio {
  margin-bottom : 10px;
}

#registerFormContainer #customer-form .custom-checkbox label,
#registerFormContainer #customer-form .custom-radio label {
  align-items : flex-start;
  cursor      : pointer;
  display     : inline-block;
}

#registerFormContainer #customer-form .form-control-comment {
  font-size  : 12px;
  color      : #666;
  margin-top : 5px;
}