@font-face {
  font-family: 'OpenSans';
  src: url("../fonts/OpenSans/OpenSans-Regular.ttf") format("truetype");
}

body{
    margin:0;
    padding:0;
    min-height:100vh;
    background:url("../img/newlogin/fondo-login.png");
    background-size:cover;
    background-position:center;
    background-attachment:fixed;
    font-family:'OpenSans';
}

.background{
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
}

.login-container{
    width:520px;
    padding:45px;
    border-radius:28px;
    background:rgba(5,5,15,.45);
    backdrop-filter:blur(16px);
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 25px 70px rgba(0,0,0,.45);
}

.img-container{text-align:center;margin-bottom:30px;}

.dd-logo{width:280px;max-width:100%;}

.field-form{margin-bottom:22px;}

.field-form label{
    color:white;
    font-size:18px;
    display:block;
    margin-bottom:10px;
}

.field-form input{
    width:100%;
    border-radius:40px;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.08);
    color:white;
    padding:16px 22px;
    font-size:20px;
    outline:none;
}

.field-form input::placeholder{color:rgba(255,255,255,.55);}

button,.btn,input[type=submit]{
    background:linear-gradient(135deg,#ff2ea6,#7c3aed)!important;
    border:none!important;
    color:white!important;
    border-radius:50px!important;
    padding:16px 40px!important;
    font-size:22px!important;
    font-weight:bold!important;
    box-shadow:0 10px 35px rgba(255,46,166,.35)!important;
}

.form-footer,.form-footer a,.user_types,.user_types a{
    color:#ff2ea6!important;
}

@media (max-width: 900px){
    .login-container{width:90%;padding:25px;}
    .dd-logo{width:220px;}
}


/* LABELS BLANCOS LOGIN */

.field-form label,
label.upper,
.field-container label{
    color: #ffffff !important;
    font-weight: 600 !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.45);
}



/* Ajustes finos login premium */
.field-form input:focus{
    border-color:#ff2ea6 !important;
    box-shadow:0 0 0 2px rgba(255,46,166,.22), 0 0 18px rgba(255,46,166,.28) !important;
    outline:none !important;
}

.forgot-pass,
.forgot-pass a,
.login-container .forgot-pass,
.login-container .forgot-pass a{
    color:#ffffff !important;
    opacity:.9 !important;
    text-align:center !important;
    display:block !important;
}

.form-footer{
    padding-left:0 !important;
    text-align:center !important;
}

.login-container form{
    text-align:center !important;
}

.login-container .form-body,
.login-container .field-form{
    text-align:left !important;
}

button,
.btn,
input[type=submit]{
    display:block !important;
    margin:30px auto 18px auto !important;
}



/* Textos B2B Login */
.login-welcome{
    text-align:center;
    margin:-10px 0 28px 0;
    color:#ffffff;
}

.login-welcome h1{
    font-size:34px;
    margin:0 0 8px 0;
    font-weight:800;
}

.login-welcome p{
    font-size:17px;
    line-height:1.45;
    margin:0 auto;
    max-width:430px;
    color:rgba(255,255,255,.82);
}

.login-welcome span{
    color:#ff2ea6;
    font-weight:700;
}

.login-access-box{
    margin-top:28px;
    padding-top:24px;
    border-top:1px solid rgba(255,46,166,.65);
    text-align:center;
    color:#ffffff;
}

.login-access-box h2{
    margin:0 0 8px 0;
    font-size:22px;
    font-weight:800;
}

.login-access-box p{
    margin:0 0 18px 0;
    color:rgba(255,255,255,.78);
    line-height:1.45;
}

.login-contact-buttons{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:12px;
}

.login-contact-buttons a{
    display:block;
    padding:13px 10px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.06);
    color:#ffffff !important;
    text-decoration:none !important;
    font-size:13px;
    line-height:1.35;
}

.login-contact-buttons a strong{
    color:#ff2ea6;
    font-size:13px;
}

.login-contact-buttons a:hover{
    border-color:#ff2ea6;
    box-shadow:0 0 20px rgba(255,46,166,.18);
}

@media (max-width:900px){
    .login-welcome h1{font-size:26px;}
    .login-welcome p{font-size:14px;}
    .login-contact-buttons{grid-template-columns:1fr;}
    .login-access-box h2{font-size:18px;}
}


/* CONTACTO B2B FINAL */
.login-access-box{
    display:block !important;
    margin-top:38px !important;
    padding-top:24px !important;
    border-top:1px solid rgba(255,46,166,.45) !important;
    text-align:center;
}

.login-access-box h2{
    color:#ffffff;
    font-size:28px;
    font-weight:800;
    margin-bottom:10px;
}

.login-access-box p{
    color:rgba(255,255,255,.82);
    font-size:15px;
    line-height:1.55;
    margin-bottom:22px;
}

.login-contact-buttons{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin-top:12px;
}

.login-contact-buttons a{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    border-radius:16px;
    padding:16px 12px;
    color:#ffffff !important;
    text-decoration:none !important;
    transition:all .25s ease;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.login-contact-buttons a:hover{
    border-color:#ff2ea6;
    box-shadow:0 0 24px rgba(255,46,166,.28);
    transform:translateY(-2px);
}

.login-contact-buttons strong{
    display:block;
    margin-top:6px;
    color:#ff2ea6;
    font-size:14px;
}

@media(max-width:900px){

    .login-access-box{
        margin-top:28px !important;
    }

    .login-contact-buttons{
        grid-template-columns:1fr;
    }

    .login-contact-buttons a{
        padding:14px;
    }
}


/* AJUSTE FINAL DESKTOP */
@media(min-width:1000px){

    .login-box{
        max-width:520px !important;
        padding:28px 40px !important;
        transform:scale(.90);
        transform-origin:center top;
    }

    .login-welcome{
        margin-bottom:18px !important;
    }

    .login-welcome h1{
        font-size:30px !important;
        margin-bottom:6px !important;
    }

    .login-welcome p{
        font-size:15px !important;
        line-height:1.45 !important;
    }

    .login-access-box{
        margin-top:18px !important;
        padding-top:18px !important;
    }

    .login-access-box h2{
        font-size:20px !important;
        margin-bottom:8px !important;
    }

    .login-access-box p{
        font-size:13px !important;
        margin-bottom:14px !important;
    }

    .login-contact-buttons a{
        padding:12px 10px !important;
        font-size:12px !important;
    }

    .login-contact-buttons strong{
        font-size:12px !important;
    }
}


/* ICONOS ROSA PREMIUM */
.contact-icon{
    color:#ff2ea6;
    font-size:18px;
    font-weight:bold;
    margin-right:6px;
    text-shadow:0 0 10px rgba(255,46,166,.55);
}

/* AJUSTE EXTRA DESKTOP */
@media(min-width:1000px){

    .login-box{
        transform:scale(.84) !important;
        margin-top:-30px !important;
    }

    .login-contact-buttons{
        gap:10px !important;
    }

    .login-contact-buttons a{
        padding:10px 8px !important;
    }

    .login-access-box{
        margin-top:14px !important;
        padding-top:14px !important;
    }
}


/* ICONOS SVG CONTACTO PREMIUM */
.contact-svg{
    width:38px;
    height:38px;
    margin:0 auto 8px auto;
    display:flex;
    align-items:center;
    justify-content:center;
}

.contact-svg svg{
    width:38px;
    height:38px;
    fill:none;
    stroke:#ff2ea6;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
    filter:drop-shadow(0 0 8px rgba(255,46,166,.75));
}

.login-contact-buttons a{
    text-align:center !important;
}

.login-contact-buttons a span:not(.contact-svg){
    display:block;
    color:#ffffff;
    font-weight:700;
    margin-bottom:4px;
}

/* compactar un poco desktop */
@media(min-width:1000px){
    .login-container{
        transform:scale(.82) !important;
        transform-origin:center top !important;
        margin-top:-42px !important;
    }
}


/* Refinamiento iconos contacto */
.contact-svg{
    width:46px !important;
    height:46px !important;
    margin:0 auto 10px auto !important;
}

.contact-svg svg{
    width:46px !important;
    height:46px !important;
    fill:none !important;
    stroke:#ff2ea6 !important;
    stroke-width:3.2 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
    filter:drop-shadow(0 0 10px rgba(255,46,166,.85)) !important;
}

.mail-svg svg{
    stroke-width:3.4 !important;
}

.phone-svg svg{
    stroke-width:3.5 !important;
}

.whatsapp-svg svg{
    stroke-width:3.1 !important;
}



/* ===== AJUSTE FINAL DE COMPOSICIÓN REAL ===== */

@media(min-width:1000px){

    .background{
        align-items:flex-start !important;
        padding-top:28px !important;
        padding-bottom:28px !important;
        box-sizing:border-box !important;
    }

    .login-container{
        margin-top:0 !important;
        margin-bottom:24px !important;
        padding-top:22px !important;
        padding-bottom:24px !important;
        transform:scale(.86) !important;
        transform-origin:center top !important;
    }

    .img-container{
        margin-bottom:12px !important;
    }

    .login-welcome{
        margin-bottom:12px !important;
    }

    .field-form{
        margin-bottom:14px !important;
    }

    button,
    .btn,
    input[type=submit]{
        margin:18px auto 12px auto !important;
    }

    .login-access-box{
        margin-top:14px !important;
        padding-top:14px !important;
    }

    .login-contact-buttons a{
        padding:10px 8px !important;
        min-height:92px !important;
    }

    .contact-svg{
        width:36px !important;
        height:36px !important;
        margin-bottom:6px !important;
    }

    .contact-svg svg{
        width:36px !important;
        height:36px !important;
    }
}



/* AJUSTE POR ALTURA DE PANTALLA */
@media (min-width:1000px) and (max-height:850px){

    .background{
        padding-top:18px !important;
        padding-bottom:18px !important;
    }

    .login-container{
        transform:scale(.76) !important;
        transform-origin:center top !important;
        margin-top:0 !important;
    }
}

@media (min-width:1000px) and (max-height:750px){

    .login-container{
        transform:scale(.68) !important;
    }
}



/* SOCIAL + TIENDA ONLINE */
.login-social-box{
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid rgba(255,46,166,.45);
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.login-social-box a{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.12);
    text-decoration:none !important;
    color:#ffffff !important;
    transition:all .25s ease;
}

.login-social-box a:hover{
    border-color:#ff2ea6;
    box-shadow:0 0 22px rgba(255,46,166,.22);
    transform:translateY(-2px);
}

.login-social-box a span:not(.social-svg){
    display:block;
    font-size:13px;
    color:#ffffff;
    font-weight:700;
}

.login-social-box a strong{
    display:block;
    color:#ff2ea6;
    font-size:13px;
    margin-top:3px;
}

.social-svg{
    width:34px;
    height:34px;
    flex:0 0 34px;
}

.social-svg svg{
    width:34px;
    height:34px;
    fill:none;
    stroke:#ff2ea6;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
    filter:drop-shadow(0 0 8px rgba(255,46,166,.75));
}

.login-footer-brand{
    margin-top:16px;
    padding-top:14px;
    border-top:1px solid rgba(255,255,255,.10);
    text-align:center;
    color:rgba(255,255,255,.45);
    font-size:12px;
}

@media(max-width:900px){
    .login-social-box{
        grid-template-columns:1fr;
    }
}

@media(min-width:1000px) and (max-height:850px){
    .login-social-box{
        margin-top:12px !important;
        padding-top:12px !important;
    }

    .login-social-box a{
        padding:9px 10px !important;
    }

    .social-svg,
    .social-svg svg{
        width:28px !important;
        height:28px !important;
    }

    .login-footer-brand{
        margin-top:10px !important;
        padding-top:10px !important;
    }
}


/* AJUSTE FINAL PARA QUE QUEPA EN LAPTOP / MONITOR */
@media (min-width:1000px) and (max-height:900px){

    .background{
        padding-top:12px !important;
        padding-bottom:12px !important;
        align-items:flex-start !important;
    }

    .login-container{
        transform:scale(.70) !important;
        transform-origin:center top !important;
        margin-top:0 !important;
    }
}

@media (min-width:1000px) and (max-height:800px){

    .login-container{
        transform:scale(.62) !important;
    }
}

@media (min-width:1000px) and (max-height:720px){

    .login-container{
        transform:scale(.56) !important;
    }
}


/* MICROAJUSTE FINAL DESKTOP */
@media (min-width:1000px) and (max-height:900px){
    .login-container{
        transform:scale(.74) !important;
    }
}

@media (min-width:1000px) and (max-height:800px){
    .login-container{
        transform:scale(.66) !important;
    }
}


/* ===== REGISTRO RESTAURANTES DRAGON 2026 ===== */
.business-register-logo .dd-logo {
  max-width: 170px !important;
  filter: drop-shadow(0 0 18px rgba(255,45,170,.48)) !important;
}

.business-register-intro {
  text-align: center;
  color: #ffffff;
  margin: 0 auto 18px auto;
  max-width: 720px;
}

.business-register-intro h2 {
  color: #ff2daa;
  font-size: 24px;
  line-height: 1.12;
  margin: 8px 0 10px 0;
  text-shadow: 0 0 16px rgba(255,45,170,.35);
}

.business-register-intro p {
  color: rgba(255,255,255,.86);
  font-size: 14px;
  line-height: 1.35;
  margin: 0 auto 12px auto;
}

.benefits-box {
  margin: 14px auto 18px auto;
  padding: 14px 16px;
  border: 1px solid rgba(255,45,170,.28);
  border-radius: 18px;
  background: rgba(255,255,255,.045);
  box-shadow: 0 0 22px rgba(138,43,226,.18);
}

.benefits-title {
  color: #ffffff;
  font-family: 'OpenSansBold', sans-serif;
  font-size: 14px;
  margin-bottom: 10px;
}

.benefits-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 14px;
  text-align: left;
}

.benefits-grid span {
  color: rgba(255,255,255,.86);
  font-size: 12px;
  line-height: 1.25;
}

.thanks-card {
  max-width: 520px;
  padding: 22px 24px;
  border: 1px solid rgba(255,45,170,.28);
  border-radius: 22px;
  background: rgba(0,0,0,.38);
  box-shadow: 0 22px 60px rgba(0,0,0,.42), 0 0 28px rgba(255,45,170,.12);
}

.thanks-card .response-time {
  color: #ff8bd3;
  font-family: 'OpenSansBold', sans-serif;
}

.thanks-card .dragon-signature {
  color: #ffffff;
  font-family: 'OpenSansBold', sans-serif;
  margin-top: 10px;
}

.thanks-btn {
  display: inline-block;
  margin-top: 10px;
  text-decoration: none !important;
}
/* ===== FIN REGISTRO RESTAURANTES DRAGON 2026 ===== */