:root{
  --color-primario:#017cf5; /* azul claro */
  --color-secundario:#060748; /* azul OSCURO */
  --bg-dark:#050d37; /* fondo oscuro similar a la imagen */
  --accent-color:#ff6b6b;
}

body{
   background:var(--color-primario);
   font-family: 'ITCAvantGardePro-Md', Arial, sans-serif;
}
body.crear-cuenta{
   background:var(--color-secundario);
   font-family: 'ITCAvantGardePro-Md', Arial, sans-serif;
}
@font-face {
   font-family: 'ITCAvantGardePro-Md';
   src: url("/static/fonts/ITC Avant Garde Gothic Std Medium.otf") format('opentype');
   font-weight: normal;
   font-style: normal;
}


input {
  background-color: #e8f0fd !important;
  border-radius: 0px!important;
}
input::placeholder{
  font-size:14px;
}
.error{
   color: #dc3545;
}
.auth-card{
  max-width:1100px;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.6);
  max-height: 640px;
}

.left-pane{
  padding:50px 50px;
  background:#fff;
}
.left-pane2{
  padding:30px 50px;
  background:#fff;
}
.brand{
  height:48px;
  margin-bottom:18px;
}

.left-pane h2{font-weight:700; margin-bottom:2rem;}

.form-control::placeholder{opacity:.7,}


.right-pane{
  min-height:420px;
  background-size:cover;
  background-position:center;
  position:relative;
}

/* overlay azul suave para que el blanco del texto se vea bien */
.right-pane::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(6,78,255,0.18), rgba(0,200,255,0.22));
  mix-blend-mode:overlay;
}

/* en pantallas pequeñas apilar (imagen debajo) */
@media (max-width:767.98px){
  .right-pane{min-height:260px}
}

/* pequeños ajustes visuales */
.small-note{font-size:.9rem; color:#6b7280}
.logo{
   width: 250px;
   height: 100%;
}
/* Color del check en Bootstrap */
.form-check-input:checked {
  background-color: white;   /* fondo blanco */
  border-color: black;       /* borde negro */
}

.form-check-input:checked[type=checkbox] {
   
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='black' d='M16.7 5.3a1 1 0 0 1 0 1.4l-8.4 8.4a1 1 0 0 1-1.4 0l-4.2-4.2a1 1 0 0 1 1.4-1.4l3.5 3.5 7.7-7.7a1 1 0 0 1 1.4 0z'/%3e%3c/svg%3e");  
}
/*ESTILOS PLANES*/
.plan-logo-img{
  width: 50px;
}
/*BOTONES*/
.btn{
   line-height: 1;
}
/*azul normal*/
.btn-primary{
  background:var(--color-primario);
  border:none;
  color:#fff;
  font-weight:600;
  padding:12px 10px 10px 10px;
  border-radius:28px;
}
.btn-toggle{
   border: none;
   background: transparent;
   /*color: #  222;*/
   font-weight: 600;
   font-size: 1.1rem;
   border-radius: 32px;
   padding: 6px 32px;
   cursor: pointer;
   transition: background 0.2s, color 0.2s;
   width: 200px;
}
.btn-toggle.active, .btn-toggle:hover {
   background: #00e0c6;
   color: #fff;
}
.google-btn{
  border-radius:28px;
  background:#d9d9d9;
  color:#222;
}
.plan-btn:hover {
   transform: translateY(-2px);
}

.fs-14, .error{
   font-size: 14px;
}
/*azul fuerte*/
.btn-secondary{
  background:var(--color-secundario);
  border:none;
  color:#fff;
  font-weight:600;
  padding:12px 10px 10px 10px;
  border-radius:28px;
}

.btn-black{
  background:#000;
  border:none;
  color:#fff;
  font-weight:600;
  padding:12px 10px 10px 10px;
  border-radius:28px;
}

.contenedor-scroll {
  /*max-height: 500px;*/
  height: 90vh;
  overflow-y: auto;    /* scroll vertical solo si hace falta */
  overflow-x: hidden;  /* evita scroll horizontal */
}


.table > :not(caption) > * > * {
  padding: 0.2rem .5rem!important;
}