:root{
  --azul-oscuro:#0f3460;
  --azul-medio:#1a5490;
  --azul-claro:#2680c2;
  --celeste:#00b4d8;
  --celeste-claro:#90e0ef;
  --blanco:#FFFFFF;
  --gris-claro:#f8fafc;
  --gris-medio:#e2e8f0;
  --texto:#1e293b;
  --texto-secundario:#64748b;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  color:var(--texto);
  line-height:1.6;
}

body{
  margin:0;
  background:linear-gradient(135deg, #e0f2fe 0%, #f8fafc 100%);
  min-height:100vh;
}

.header{
  background:linear-gradient(135deg, var(--azul-oscuro) 0%, var(--azul-medio) 100%);
  color:var(--blanco);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 32px;
  box-shadow:0 4px 20px rgba(15, 52, 96, 0.2);
}

.header-left{
  display:flex;
  align-items:center;
  gap:16px;
}

.header-logo{
  width:50px;
  height:50px;
  object-fit:contain;
  filter:brightness(0) invert(1);
}

.header a{
  color:#fff;
  margin-left:20px;
  text-decoration:none;
  padding:8px 16px;
  border-radius:6px;
  transition:all 0.3s ease;
}

.header a:hover{
  background:rgba(255,255,255,0.15);
  transform:translateY(-2px);
}

.brand{
  font-weight:700;
  font-size:1.25rem;
  letter-spacing:.5px;
}

.container{
  max-width:1200px;
  margin:40px auto;
  padding:0 24px;
}

.footer{
  padding:24px;
  text-align:center;
  color:var(--texto-secundario);
  background:linear-gradient(135deg, #caf0f8 0%, #e0f2fe 100%);
  border-top:3px solid var(--celeste);
  margin-top:60px;
}

h1,h2{
  color:var(--azul-oscuro);
  font-weight:700;
}

h1{
  font-size:2rem;
  margin-bottom:8px;
  text-align:center;
}

h2{
  font-size:1.5rem;
  margin-bottom:12px;
}

h3{
  color:var(--azul-medio);
  font-size:1.15rem;
  font-weight:600;
  margin-bottom:16px;
  padding-bottom:8px;
  border-bottom:2px solid var(--celeste-claro);
}

.btn{
  background:linear-gradient(135deg, var(--celeste) 0%, var(--azul-claro) 100%);
  color:#fff;
  padding:14px 28px;
  border-radius:10px;
  text-decoration:none;
  margin-right:12px;
  display:inline-block;
  font-weight:600;
  border:none;
  cursor:pointer;
  box-shadow:0 4px 14px rgba(0, 180, 216, 0.3);
  transition:all 0.3s ease;
}

.btn:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 20px rgba(0, 180, 216, 0.4);
}

.btn-sec{
  background:linear-gradient(135deg, var(--azul-medio) 0%, var(--azul-claro) 100%);
}

/* Botones de la página home con iconos */
.btn-home-registrar,
.btn-home-seguimiento{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:center;
}

.btn-icon{
  width:24px;
  height:24px;
  flex-shrink:0;
}

.cta{
  display:flex;
  gap:16px;
  margin:24px auto;
  flex-wrap:wrap;
  justify-content:center;
  max-width:600px;
}

@media (max-width:600px){
  .cta{
    flex-direction:column;
  }
  
  .cta .btn{
    width:100%;
  }
}

input,
select,
textarea{
  width:100%;
  padding:10px 14px;
  border-radius:10px;
  border:2px solid var(--gris-medio);
  margin:8px 0 16px;
  font-size:0.95rem;
  transition:all 0.3s ease;
  background:var(--blanco);
  box-sizing:border-box;
}

input:focus,
select:focus,
textarea:focus{
  outline:none;
  border-color:var(--celeste);
  box-shadow:0 0 0 4px rgba(0, 180, 216, 0.1);
}

input::placeholder,
textarea::placeholder{
  color:var(--texto-secundario);
  font-style:italic;
}

/* Estilos mejorados para input de fecha */
input[type="date"]{
  position:relative;
  padding:12px 14px;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:0.95rem;
  color:var(--texto);
  background:var(--blanco);
  cursor:pointer;
}

input[type="date"]::-webkit-calendar-picker-indicator{
  cursor:pointer;
  border-radius:4px;
  padding:4px;
  background:var(--celeste-claro);
  transition:all 0.3s ease;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover{
  background:var(--celeste);
  transform:scale(1.1);
}

input[type="date"]:focus{
  border-color:var(--celeste);
  box-shadow:0 0 0 4px rgba(0, 180, 216, 0.15);
}

/* Mejorar apariencia en Firefox */
input[type="date"]::-moz-focus-inner{
  border:0;
  padding:0;
}

label{
  font-weight:600;
  color:var(--texto);
  display:block;
  margin-bottom:4px;
}

.skip-link{
  position:absolute;
  left:-1000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}

.skip-link:focus{
  left:10px;
  top:10px;
  width:auto;
  height:auto;
  background:#000;
  color:#fff;
  padding:8px;
  border-radius:6px;
}

.form-help{
  font-size:.95rem;
  color:var(--texto-secundario);
  margin-top:4px;
  display:block;
}

.form-help-justified{
  font-size:.95rem;
  color:var(--texto-secundario);
  margin-top:12px;
  margin-bottom:0;
  display:block;
  text-align:justify;
  line-height:1.6;
  max-width:100%;
}

@media (max-width:900px){
  .form-help-justified{
    font-size:.9rem;
    text-align:justify;
    line-height:1.5;
  }
}

@media (max-width:600px){
  .form-help-justified{
    font-size:.85rem;
    text-align:justify;
    line-height:1.5;
    padding:0 4px;
  }
}

/* Estilos para checkboxes con texto justificado */
.checkbox-group{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:16px 0;
  padding:12px;
  background:linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border-radius:10px;
  border:2px solid var(--gris-medio);
  transition:all 0.3s ease;
}

.checkbox-group:hover{
  border-color:var(--celeste);
  box-shadow:0 2px 8px rgba(0, 180, 216, 0.15);
}

.checkbox-group input[type="checkbox"]{
  flex-shrink:0;
  width:24px;
  height:24px;
  margin:4px 0 0 0;
  cursor:pointer;
  accent-color:var(--celeste);
}

.checkbox-label-justified{
  flex:1;
  font-size:0.95rem;
  color:var(--texto);
  line-height:1.6;
  text-align:justify;
  margin:0;
  cursor:pointer;
  font-weight:400;
}

.checkbox-label-justified strong{
  color:var(--azul-medio);
}

@media (max-width:900px){
  .checkbox-group{
    gap:10px;
    padding:10px;
  }
  
  .checkbox-group input[type="checkbox"]{
    width:22px;
    height:22px;
  }
  
  .checkbox-label-justified{
    font-size:0.9rem;
    line-height:1.5;
  }
}

@media (max-width:600px){
  .checkbox-group{
    gap:8px;
    padding:10px;
  }
  
  .checkbox-group input[type="checkbox"]{
    width:20px;
    height:20px;
    margin-top:2px;
  }
  
  .checkbox-label-justified{
    font-size:0.85rem;
    line-height:1.5;
  }
}

/* Estilos para checkboxes de evidencias */
.evidencia-checkboxes{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:20px;
}

.evidencia-checkbox-item{
  position:relative;
}

.evidencia-checkbox-item input[type="checkbox"]{
  position:absolute;
  opacity:0;
  cursor:pointer;
}

.evidencia-checkbox-label{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border:2px solid var(--gris-medio);
  border-radius:12px;
  cursor:pointer;
  transition:all 0.3s ease;
  font-weight:500;
  color:var(--texto);
}

.evidencia-checkbox-label:hover{
  border-color:var(--celeste);
  background:linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 100%);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0, 180, 216, 0.2);
}

.evidencia-checkbox-item input[type="checkbox"]:checked + .evidencia-checkbox-label{
  background:linear-gradient(135deg, var(--celeste) 0%, var(--azul-claro) 100%);
  border-color:var(--azul-medio);
  color:#fff;
  box-shadow:0 4px 16px rgba(0, 180, 216, 0.3);
}

.evidencia-checkbox-item input[type="checkbox"]:checked + .evidencia-checkbox-label .evidencia-icon{
  color:#fff;
}

.evidencia-icon{
  width:24px;
  height:24px;
  flex-shrink:0;
  color:var(--azul-medio);
  transition:color 0.3s ease;
}

@media (max-width:900px){
  .evidencia-checkboxes{
    grid-template-columns:1fr;
    gap:10px;
  }
  
  .evidencia-checkbox-label{
    padding:12px 14px;
  }
}

@media (max-width:600px){
  .evidencia-checkbox-label{
    padding:10px 12px;
    font-size:0.9rem;
  }
  
  .evidencia-icon{
    width:20px;
    height:20px;
  }
}

.alert{
  padding:12px 18px;
  border-left:4px solid var(--celeste);
  background:linear-gradient(135deg, #e0f2fe 0%, #caf0f8 100%);
  border-radius:10px;
  box-shadow:0 2px 8px rgba(0, 180, 216, 0.1);
}

/* Form card and grid */
.form-card{
  background:#fff;
  padding:32px;
  border-radius:16px;
  box-shadow:0 10px 40px rgba(15, 52, 96, 0.08);
  border:1px solid rgba(0, 180, 216, 0.1);
  text-align:left;
}

/* Header horizontal con logo y título */
.form-header-row{
  display:flex;
  align-items:flex-start;
  gap:24px;
  margin-bottom:24px;
  padding-bottom:20px;
  border-bottom:2px solid var(--gris-medio);
}

.form-header-content{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.form-header-content h2{
  color:var(--azul-oscuro);
  margin:0 0 12px 0;
  font-size:1.75rem;
  font-weight:700;
  line-height:1.2;
}

/* LOGO RESPONSIVE */
.form-logo{
  width:140px;
  height:140px;
  flex-shrink:0;
  object-fit:contain;
  filter:drop-shadow(0 4px 12px rgba(0, 0, 0, 0.1));
}
  object-fit:contain;
  flex-shrink:0;
  filter:drop-shadow(0 4px 12px rgba(0, 0, 0, 0.1));
}

.admin-links{
  display:flex;
  gap:12px;
  align-items:center;
}

/* Dashboard icons */
.admin-icons{
  display:flex;
  gap:24px;
}

.icon-card{
  transition:transform .3s ease, box-shadow .3s ease;
  padding:24px;
  background:linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border-radius:12px;
  border:2px solid var(--gris-medio);
}

.icon-card:hover{
  transform:translateY(-8px);
  box-shadow:0 16px 32px rgba(15, 52, 96, 0.15);
  border-color:var(--celeste);
}

.icon-card h3{
  color:var(--azul-medio);
  margin-top:12px;
}

.icon-card p{
  color:var(--texto-secundario);
  font-size:14px;
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.form-grid .col{
  background:linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
  padding:24px;
  border-radius:12px;
  border:1px solid var(--gris-medio);
}

.form-grid .col h3{
  margin-top:0;
  color:var(--azul-medio);
}

.two-cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

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

  .form-header-row{
    flex-direction:column;
    gap:16px;
    padding-bottom:16px;
  }

  .container{
    padding:0 16px;
    margin:20px auto;
  }

  /* Logo más pequeño en móviles */
  .form-logo{
    width:100px;
    height:100px;
  }
  
  .form-header-content h2{
    font-size:1.5rem;
  }

  .form-card{
    padding:20px;
  }
  
  .form-grid .col{
    padding:16px;
  }
  
  .two-cols{
    grid-template-columns:1fr;
  }
  
  .admin-icons{
    flex-direction:column;
    gap:16px;
  }
  
  .icon-card{
    width:100%;
  }
  
  .header{
    padding:12px 16px;
    flex-direction:column;
    gap:12px;
    text-align:center;
  }
  
  .header-left{
    flex-direction:column;
    gap:8px;
  }
  
  .header-logo{
    width:40px;
    height:40px;
  }
  
  .header nav{
    display:flex;
    flex-direction:column;
    gap:8px;
    width:100%;
  }
  
  .header a{
    margin:0;
    width:100%;
    text-align:center;
  }
  
  h1{
    font-size:1.5rem;
  }
  
  h2{
    font-size:1.25rem;
  }
  
  h3{
    font-size:1.1rem;
  }
  
  .btn{
    width:100%;
    text-align:center;
    padding:12px 20px;
  }
  
  input,
  select,
  textarea{
    font-size:16px; /* Evita zoom automático en iOS */
  }
}

@media (max-width:600px){
  .container{
    padding:0 12px;
  }
  
  .form-card{
    padding:16px;
    border-radius:12px;
  }
  
  .form-grid .col{
    padding:12px;
  }
  
  .form-header-content h2{
    font-size:1.25rem;
  }
  
  .form-help{
    font-size:0.85rem;
  }
  
  .alerts-table th,
  .alerts-table td{
    padding:10px 8px;
    font-size:0.85rem;
  }
  
  .footer{
    padding:16px;
    font-size:0.9rem;
  }
}

@media (max-width:400px){
  .form-logo{
    width:80px;
    height:80px;
  }
  
  .form-header-content h2{
    font-size:1.1rem;
  }
  
  input,
  select,
  textarea{
    padding:8px 12px;
  }
  
  .btn{
    padding:10px 16px;
    font-size:0.9rem;
  }
}

/* Tabla de denuncias */
.table-responsive{
  overflow-x:auto;
  margin:20px 0;
  border-radius:12px;
  box-shadow:0 4px 16px rgba(15, 52, 96, 0.08);
}

.alerts-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
}

.alerts-table thead{
  background:linear-gradient(135deg, var(--azul-medio) 0%, var(--azul-claro) 100%);
  color:#fff;
  font-weight:600;
}

.alerts-table th{
  padding:16px 12px;
  text-align:left;
  border-bottom:2px solid var(--celeste);
  font-size:0.95rem;
  letter-spacing:0.5px;
}

.alerts-table td{
  padding:14px 12px;
  border-bottom:1px solid var(--gris-medio);
  color:var(--texto);
}

.alerts-table tbody tr{
  transition:all 0.3s ease;
}

.alerts-table tbody tr:hover{
  background:linear-gradient(135deg, #e0f2fe 0%, #f8fafc 100%);
}

/* Badges de estado */
.badge{
  display:inline-block;
  padding:6px 12px;
  border-radius:6px;
  font-size:0.875rem;
  font-weight:600;
  text-align:center;
  white-space:nowrap;
  box-shadow:0 1px 3px rgba(0,0,0,0.12);
  transition:transform 0.2s,box-shadow 0.2s;
}

.badge:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(0,0,0,0.18);
}

/* Estados administrables con colores diferenciados y accesibles */
.badge-recibida{
  background:linear-gradient(135deg,#10b981,#059669);
  color:#fff;
}

.badge-en_revision_preliminar{
  background:linear-gradient(135deg,#f59e0b,#d97706);
  color:#fff;
}

.badge-admitida{
  background:linear-gradient(135deg,#22c55e,#16a34a);
  color:#fff;
}

.badge-no_admitida{
  background:linear-gradient(135deg,#ef4444,#dc2626);
  color:#fff;
}

.badge-en_analisis{
  background:linear-gradient(135deg,#3b82f6,#2563eb);
  color:#fff;
}

.badge-en_investigacion{
  background:linear-gradient(135deg,#6366f1,#4f46e5);
  color:#fff;
}

.badge-en_verificacion{
  background:linear-gradient(135deg,#8b5cf6,#7c3aed);
  color:#fff;
}

.badge-en_tramite_medidas{
  background:linear-gradient(135deg,#f97316,#ea580c);
  color:#fff;
}

.badge-derivada{
  background:linear-gradient(135deg,#a855f7,#9333ea);
  color:#fff;
}

.badge-en_resolucion{
  background:linear-gradient(135deg,#06b6d4,#0891b2);
  color:#fff;
}

.badge-archivo{
  background:linear-gradient(135deg,#71717a,#52525b);
  color:#fff;
}

.badge-confirmada_responsabilidad{
  background:linear-gradient(135deg,#dc2626,#b91c1c);
  color:#fff;
}

.badge-sancionada{
  background:linear-gradient(135deg,#b91c1c,#991b1b);
  color:#fff;
}

.badge-cerrada{
  background:linear-gradient(135deg,#475569,#334155);
  color:#fff;
}

/* Nueva nomenclatura de badges para estados: evita colisiones con posibles frameworks (.badge) */
.estado-badge{
  display:inline-block;
  padding:6px 12px;
  border-radius:6px;
  font-size:0.875rem;
  font-weight:600;
  text-align:center;
  white-space:nowrap;
  box-shadow:0 1px 3px rgba(0,0,0,0.12);
  transition:transform 0.2s,box-shadow 0.2s;
}
.estado-badge:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,0.18)}
.estado-badge-recibida{background:linear-gradient(135deg,#10b981,#059669);color:#fff;}
.estado-badge-en_revision_preliminar{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;}
.estado-badge-admitida{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;}
.estado-badge-no_admitida{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;}
.estado-badge-en_analisis{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;}
.estado-badge-en_investigacion{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;}
.estado-badge-en_verificacion{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;}
.estado-badge-en_tramite_medidas{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;}
.estado-badge-derivada{background:linear-gradient(135deg,#a855f7,#9333ea);color:#fff;}
.estado-badge-en_resolucion{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;}
.estado-badge-archivo{background:linear-gradient(135deg,#71717a,#52525b);color:#fff;}
.estado-badge-confirmada_responsabilidad{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;}
.estado-badge-sancionada{background:linear-gradient(135deg,#b91c1c,#991b1b);color:#fff;}
.estado-badge-cerrada{background:linear-gradient(135deg,#475569,#334155);color:#fff;}

/* Refuerzo en tabla */
.alerts-table td .estado-badge{font-size:0.75rem;padding:4px 10px;}

/* Refuerzo de especificidad dentro de celdas de tabla (por si otro CSS sobreescribe .badge-*) */
.alerts-table td .badge-recibida{background:linear-gradient(135deg,#10b981,#059669);color:#fff;}
.alerts-table td .badge-en_revision_preliminar{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;}
.alerts-table td .badge-admitida{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;}
.alerts-table td .badge-no_admitida{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;}
.alerts-table td .badge-en_analisis{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;}
.alerts-table td .badge-en_investigacion{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;}
.alerts-table td .badge-en_verificacion{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;}
.alerts-table td .badge-en_tramite_medidas{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;}
.alerts-table td .badge-derivada{background:linear-gradient(135deg,#a855f7,#9333ea);color:#fff;}
.alerts-table td .badge-en_resolucion{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff;}
.alerts-table td .badge-archivo{background:linear-gradient(135deg,#71717a,#52525b);color:#fff;}
.alerts-table td .badge-confirmada_responsabilidad{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;}
.alerts-table td .badge-sancionada{background:linear-gradient(135deg,#b91c1c,#991b1b);color:#fff;}
.alerts-table td .badge-cerrada{background:linear-gradient(135deg,#475569,#334155);color:#fff;}

/* Estados antiguos (deprecados pero por compatibilidad) */
.badge-nuevo{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;}
.badge-evaluacion{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;}
.badge-admitido{background:linear-gradient(135deg,#10b981,#059669);color:#fff;}
.badge-subsanacion{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;}
.badge-derivado{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;}
.badge-investigacion{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;}
.badge-archivado{background:linear-gradient(135deg,#6b7280,#52525b);color:#fff;}
.badge-cierre{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;}
.badge-cerrado{background:linear-gradient(135deg,#059669,#047857);color:#fff;}

.search-box{
  background:#fff;
  padding:16px;
  border-radius:8px;
  margin:16px 0;
}

@media (max-width:768px){
  .alerts-table{
    font-size:0.9rem;
  }
  
  .alerts-table th,
  .alerts-table td{
    padding:8px;
  }
  
  /* Mejorar evidencias en móviles */
  #evidencia-documento,
  #evidencia-fotos,
  #evidencia-video,
  #evidencia-audio{
    padding:12px;
  }
  
  #generar-campos-fotos{
    width:100%;
    font-size:0.9rem;
  }
  
  .table-responsive{
    border-radius:8px;
  }
  
  /* Stack de checkboxes verticalmente */
  .form-grid label[style*="margin-bottom:8px"]{
    margin-bottom:10px !important;
  }
}

/* Login administrativo */
.login-card{
  max-width:450px;
  margin:60px auto;
  background:#fff;
  padding:40px;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,51,102,0.15);
}

.login-header{
  text-align:center;
  margin-bottom:30px;
}

.login-header h2{
  color:#003366;
  margin-bottom:8px;
  font-size:28px;
  font-weight:700;
}

.login-header p{
  color:#666;
  font-size:14px;
}

.login-form{
  margin:20px 0;
}

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

.form-group label{
  display:block;
  margin-bottom:8px;
  color:#003366;
  font-weight:600;
  font-size:14px;
}

.form-group input{
  width:100%;
  padding:12px;
  border:1px solid #cbd5e1;
  border-radius:6px;
  font-size:14px;
  transition:border-color 0.3s;
}

.form-group input:focus{
  outline:none;
  border-color:#0066cc;
  box-shadow:0 0 0 3px rgba(0,102,204,0.15);
}

.btn-login{
  width:100%;
  padding:12px;
  background:linear-gradient(135deg, #003366, #0066cc);
  color:#ffffff !important;
  border:none;
  border-radius:6px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:transform 0.2s,box-shadow 0.2s;
  text-shadow:1px 1px 2px rgba(0,0,0,0.2);
}

.btn-login:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,51,102,0.3);
  background:linear-gradient(135deg, #0066cc, #003366);
}

.login-footer{
  text-align:center;
  margin-top:20px;
  padding-top:20px;
  border-top:1px solid #e2e8f0;
  font-size:13px;
  color:#666;
}

.alert-success{
  background:#d1fae5;
  color:#065f46;
  padding:12px;
  border-radius:6px;
  margin-bottom:15px;
  border-left:4px solid #10b981;
}

.alert-error{
  background:#fee2e2;
  color:#991b1b;
  padding:12px;
  border-radius:6px;
  margin-bottom:15px;
  border-left:4px solid #dc2626;
}

.info-message{
  background:#f0f8ff;
  border:1px solid #e0eef7;
  padding:20px;
  border-radius:8px;
  text-align:center;
  color:#666;
}

.info-message p{
  margin:0;
  font-size:15px;
}

/* Mejoras de accesibilidad táctil */
@media (hover: none) and (pointer: coarse) {
  /* Dispositivos táctiles */
  .btn,
  button,
  input[type="submit"],
  input[type="button"]{
    min-height:44px;
    min-width:44px;
  }
  
  input[type="checkbox"],
  input[type="radio"]{
    min-width:24px;
    min-height:24px;
    transform:scale(1.3);
    margin-right:8px;
  }
  
  select{
    min-height:44px;
  }
  
  .header a{
    padding:12px 16px;
    min-height:44px;
  }
}

/* Orientación landscape en móviles */
@media (max-height: 500px) and (orientation: landscape) {
  .form-logo{
    width:80px;
    height:80px;
  }
  
  .brand-box h2{
    font-size:1.2rem;
  }
  
  .form-help{
    font-size:0.8rem;
  }
  
  .container{
    margin:10px auto;
  }
}

/* Impresión */
@media print {
  .header,
  .footer,
  .btn,
  button{
    display:none !important;
  }
  
  .form-card{
    box-shadow:none;
    border:1px solid #ddd;
  }
  
  .container{
    max-width:100%;
  }
}