/*	auth.css  --  las pantallas de acceso.
	Mismo aire que el resto de wikiplus: serif para los titulos, sans para lo
	demas, y el azul de siempre.	*/

:root{
	--tinta:#202122; --azul:#3366cc; --azul-claro:#eaf0fb; --gris:#54595d;
	--linea:#c8cdd4; --fondo:#f6f6f6; --mal:#d9453f; --bien:#2f9159;
}
*{box-sizing:border-box;}

body{
	font-family:'Linux Libertine','Georgia','Times New Roman',serif;
	background:var(--fondo); color:var(--tinta);
	margin:0; padding:24px 16px 48px;
	display:flex; flex-direction:column; align-items:center; min-height:100vh;
}

.migas{font-family:sans-serif;font-size:12px;color:var(--gris);align-self:flex-start;margin-bottom:18px;}
.migas a{color:var(--azul);text-decoration:none;}
.migas a:hover{text-decoration:underline;}
.migas .miga-ico{vertical-align:-2px;margin-right:5px;}

h1{font-size:30px;margin:0 0 4px;text-align:center;}
.lema{font-family:sans-serif;font-size:12px;color:var(--gris);
      text-transform:uppercase;letter-spacing:3px;text-align:center;margin-bottom:22px;}

/*	----  la caja del formulario  ----	*/

.caja{
	width:min(420px,100%);
	background:#fff; border:1px solid var(--linea); border-radius:8px;
	padding:22px 24px 24px;
	box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.caja h2{font-size:19px;margin:0 0 16px;}

label{display:block;font-family:sans-serif;font-size:12px;color:var(--gris);margin:14px 0 4px;}
input[type=email],input[type=password],input[type=text]{
	width:100%; padding:9px 40px 9px 11px;
	font-family:sans-serif;font-size:14px;
	border:1px solid var(--linea);border-radius:5px;background:#fff;color:var(--tinta);
}
input:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(51,102,204,.18);}

/*	----  el ojo de ver/ocultar  ----	*/

.con-ojo{position:relative;}
.ojo{
	position:absolute; right:6px; top:50%; transform:translateY(-50%);
	width:30px; height:30px; padding:0;
	display:flex; align-items:center; justify-content:center;
	background:none; border:0; border-radius:5px; cursor:pointer; color:var(--gris);
}
.ojo:hover{background:var(--azul-claro);color:var(--azul);}
.ojo svg{width:19px;height:19px;display:block;}
.ojo .tachado{display:none;}
.ojo.abierto .tachado{display:block;}
.ojo.abierto .normal{display:none;}

button.enviar{
	width:100%; margin-top:20px; padding:11px;
	font-family:sans-serif;font-size:14px;font-weight:700;
	color:#fff;background:var(--azul);border:0;border-radius:5px;cursor:pointer;
}
button.enviar:hover{background:#2a55a8;}

.pie{font-family:sans-serif;font-size:12px;color:var(--gris);text-align:center;margin-top:18px;}
.pie a{color:var(--azul);text-decoration:none;}
.pie a:hover{text-decoration:underline;}

.recado{
	font-family:sans-serif;font-size:13px;line-height:1.45;
	padding:10px 12px;border-radius:5px;margin-bottom:4px;
	background:#fdecea;color:#7d211d;border-left:3px solid var(--mal);
}
.recado.bien{background:#e9f6ee;color:#1d5b39;border-left-color:var(--bien);}
.ayuda{font-family:sans-serif;font-size:11.5px;color:var(--gris);margin-top:6px;line-height:1.4;}

/*	----  el panel del superadmin  ----	*/

.panel{width:min(900px,100%);}
table.usuarios{
	width:100%;border-collapse:collapse;background:#fff;
	border:1px solid var(--linea);border-radius:8px;overflow:hidden;
	font-family:sans-serif;font-size:13px;
}
table.usuarios th{
	text-align:left;padding:9px 12px;font-size:11px;text-transform:uppercase;
	letter-spacing:.06em;color:var(--gris);background:#f0f2f5;border-bottom:1px solid var(--linea);
}
table.usuarios td{padding:9px 12px;border-bottom:1px solid #eaecf0;vertical-align:middle;}
table.usuarios tr:last-child td{border-bottom:0;}
.fecha{font-size:11px;color:var(--gris);}

.marca{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700;}
.marca.pendiente {background:#fff3d6;color:#8a6100;}
.marca.autorizado{background:#e9f6ee;color:#1d5b39;}
.marca.retirado  {background:#fdecea;color:#7d211d;}
.marca.super     {background:var(--azul-claro);color:var(--azul);margin-left:6px;}

.b-fila{
	padding:4px 11px;font-family:sans-serif;font-size:12px;
	border:1px solid var(--linea);border-radius:5px;background:#fff;color:var(--gris);cursor:pointer;
}
.b-fila:hover{border-color:var(--azul);color:var(--azul);}
.b-fila.si:hover{border-color:var(--bien);color:var(--bien);}
.b-fila.no:hover{border-color:var(--mal);color:var(--mal);}
.en-linea{display:inline;}

@media (max-width:620px){
	table.usuarios th:nth-child(3),table.usuarios td:nth-child(3){display:none;}
}