body{
	background-color: #2b163d;
	background-image: linear-gradient(135deg, rgba(25, 12, 38, .94), rgba(142, 68, 173, .82)), url(../img/fondo.jpg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
	color: #212529;
	font-family: "Poppins", sans-serif;
}
.colornav{
	background-color: rgba(6, 6, 6, .9);
	box-shadow: 0 2px 18px rgba(0, 0, 0, .16);
}
.colornav .navbar-brand,
.colornav .nav-link {
	color: #ffffff !important;
}
.colornav .nav-link {
	font-weight: 500;
	transition: color .3s ease, background-color .3s ease;
}
.colornav .nav-link:hover,
.colornav .nav-link:focus,
.colornav .nav-link.active {
	color: #8E44AD !important;
}
.colornav .navbar-toggler {
	border-color: rgba(255, 255, 255, .55);
}
.colornav .navbar-toggler-icon {
	filter: invert(1);
}
.colornav .dropdown-menu {
	background-color: #252525;
	border-color: rgba(142, 68, 173, .5);
}
.colornav .dropdown-item {
	color: #ffffff;
}
.colornav .dropdown-item:hover,
.colornav .dropdown-item:focus {
	color: #ffffff;
	background-color: #8E44AD;
}
.dashboard-page-title,
.dashboard-page-title h1 {
	color: #ffffff;
}
.dashboard-page-title .text-muted {
	color: rgba(255, 255, 255, .82) !important;
}
.vista-titulo {
	color: #ffffff !important;
}
.vista-subtitulo {
	color: rgba(255, 255, 255, .82) !important;
}
body > .container-fluid .row.content > .col-sm-8 > .d-flex > div > h1 {
	color: #ffffff !important;
}
body > .container-fluid .row.content > .col-sm-8 > .d-flex > div > p.text-muted {
	color: rgba(255, 255, 255, .82) !important;
}
.login-page {
	max-width: 520px;
	margin: 0 auto;
	padding: 4.5rem 0 5rem;
}
.login-heading {
	color: #ffffff;
	margin-bottom: 1.5rem;
}
.login-eyebrow {
	color: #8E44AD;
	display: block;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .12em;
	margin-bottom: .7rem;
	text-transform: uppercase;
}
.login-heading h1 {
	color: #ffffff;
	font-family: "Raleway", sans-serif;
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 800;
	margin: 0;
}
.login-heading p {
	color: rgba(255, 255, 255, .84);
	margin: .65rem 0 0;
}
.login-card {
	background: rgba(255, 255, 255, .97);
	border: 1px solid rgba(255, 255, 255, .8);
	border-radius: 4px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .1);
	padding: 2rem;
}
.login-card-icon {
	align-items: center;
	background: color-mix(in srgb, #8E44AD, transparent 90%);
	border: 1px solid color-mix(in srgb, #8E44AD, transparent 55%);
	border-radius: 50%;
	color: #8E44AD;
	display: flex;
	height: 58px;
	justify-content: center;
	margin: 0 auto 1.5rem;
	width: 58px;
}
.login-card-icon i { font-size: 1.7rem; }
.login-field { margin-bottom: 1.15rem; }
.login-field label {
	color: #21413c;
	display: block;
	font-size: .88rem;
	font-weight: 600;
	margin-bottom: .45rem;
}
.login-field .form-control {
	border: 1px solid #d7dce1;
	border-radius: 6px;
	min-height: 48px;
	padding: .7rem .85rem;
}
.login-field .form-control:focus {
	border-color: #8E44AD;
	box-shadow: 0 0 0 .2rem rgba(142, 68, 173, .16);
}
.login-actions {
	align-items: center;
	display: flex;
	gap: .5rem;
	margin-top: 1.4rem;
}
.login-actions input[type="checkbox"] { accent-color: #8E44AD; }
.login-actions label { color: #5f6870; font-size: .88rem; }
.login-button {
	background: #8E44AD;
	border: 0;
	border-radius: 4px;
	color: #fff;
	font-weight: 600;
	margin-right: .35rem;
	padding: .75rem 1.2rem;
}
.login-button:hover { background: color-mix(in srgb, #8E44AD, transparent 20%); color: #fff; }
.login-forgot {
	color: #8E44AD;
	display: inline-block;
	font-size: .88rem;
	margin-top: 1.5rem;
}
.login-forgot:hover { color: color-mix(in srgb, #8E44AD, transparent 20%); }
@media (max-width: 576px) {
	.login-page { padding: 3rem 1rem 4rem; }
	.login-card { padding: 1.4rem; }
}

.calendario-citas { background: rgba(255,255,255,.96); border: 1px solid #d9e2ec; border-radius: 12px; padding: 1rem; box-shadow: 0 4px 18px rgba(0,0,0,.08); }
.calendario-cabecera { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; }
.calendario-acciones, .calendario-leyenda { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1rem 0; }
.calendario-acciones { justify-content: space-between; }
.calendario-leyenda span { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; }
.calendario-leyenda i { display: inline-block; width: .8rem; height: .8rem; border-radius: 50%; }
.calendario-semana, .calendario-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendario-semana span { padding: .55rem; background: #e9f2fb; border: 1px solid #cddbea; font-weight: 600; text-align: center; }
.calendario-dia { min-height: 125px; padding: .35rem; border: 1px solid #d9e2ec; background: #fff; overflow: hidden; }
.calendario-vacio { background: #f4f6f8; }
.calendario-hoy { box-shadow: inset 0 0 0 2px #0d6efd; }
.calendario-numero { display: block; margin-bottom: .3rem; font-weight: 700; text-align: right; }
.calendario-evento { display: block; margin-bottom: .25rem; padding: .3rem .4rem; border-radius: 5px; color: #fff; font-size: .75rem; line-height: 1.2; text-decoration: none; overflow: hidden; }
.calendario-evento span { display: block; margin-top: .12rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.calendario-evento:hover { color: #fff; filter: brightness(.9); }
.estado-pendiente { background-color: #d99100; }
.estado-confirmada { background-color: #0d6efd; }
.estado-realizada { background-color: #198754; }
.estado-cancelada { background-color: #dc3545; }
.area-veterinaria { background-color: #0d6efd; }
.area-peluqueria { background-color: #b83280; }
.evento-veterinaria { border-left: 5px solid #8ec5ff; }
.evento-peluqueria { border-left: 5px solid #ff9ad5; }
.calendario-areas { margin-top: -.5rem; }

@media (max-width: 767px) {
	.calendario-citas { overflow-x: auto; }
	.calendario-semana, .calendario-grid { min-width: 760px; }
	.calendario-dia { min-height: 105px; }
}

.foto-mascota-preview {
	width: 180px;
	height: 180px;
	object-fit: cover;
	border: 3px solid #fff;
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

.foto-mascota-listado {
	width: 58px;
	height: 58px;
	object-fit: cover;
	border-radius: 50%;
	border: 2px solid #d9e2ec;
}

.ficha-hero { display:flex; align-items:center; gap:1.5rem; padding:1.5rem; color:#fff; background:linear-gradient(135deg,#146c94,#19a7ce); border-radius:18px; box-shadow:0 8px 24px rgba(0,0,0,.15); }
.ficha-foto { width:130px; height:130px; flex:0 0 130px; object-fit:cover; border:4px solid rgba(255,255,255,.8); border-radius:50%; }
.ficha-sin-foto { display:grid; place-items:center; background:rgba(255,255,255,.2); font-size:3rem; }
.ficha-indicador { min-height:105px; display:flex; flex-direction:column; justify-content:center; padding:1rem; background:#fff; border-radius:14px; border-left:5px solid #6c757d; box-shadow:0 3px 12px rgba(0,0,0,.08); }
.ficha-indicador small,.ficha-visita small { color:#667085; text-transform:uppercase; letter-spacing:.04em; font-size:.72rem; font-weight:700; }
.ficha-indicador strong { font-size:1.3rem; }
.ficha-vet { border-color:#0d6efd; }.ficha-groom { border-color:#b83280; }
.ficha-tabs .nav-link { font-weight:700; padding:.8rem 1.2rem; }
.ficha-nueva { background:#f8fafc; border:1px solid #dbe4ee; border-radius:12px; padding:1rem; }
.ficha-nueva summary { cursor:pointer; color:#0d6efd; font-size:1.05rem; font-weight:700; }
.ficha-visita { margin-bottom:1rem; padding:1rem 1.2rem; background:#fff; border:1px solid #e3e8ef; border-left:5px solid; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.05); }
.ficha-visita-vet { border-left-color:#0d6efd; }.ficha-visita-groom { border-left-color:#b83280; }
.ficha-visita header { display:flex; justify-content:space-between; gap:1rem; margin-bottom:1rem; padding-bottom:.7rem; border-bottom:1px solid #edf0f4; }
.ficha-visita header span { display:block; color:#667085; font-size:.85rem; }.ficha-visita header b { color:#198754; font-size:1.15rem; }
.btn-groom { color:#fff; background:#b83280; }.btn-groom:hover { color:#fff; background:#962568; }
@media(max-width:576px){.ficha-hero{align-items:flex-start;flex-wrap:wrap}.ficha-foto{width:90px;height:90px;flex-basis:90px}.ficha-hero .btn{width:100%}}
.ficha-listado-card { border:0; border-radius:14px; box-shadow:0 4px 15px rgba(0,0,0,.09); transition:transform .15s ease,box-shadow .15s ease; }
.ficha-listado-card:hover { transform:translateY(-2px); box-shadow:0 7px 20px rgba(0,0,0,.13); }
.ficha-listado-foto { width:82px; height:82px; flex:0 0 82px; }
.ficha-listado-sin-foto { display:grid; place-items:center; background:#eaf3fa; font-size:2rem; }
.foto-comparativa { height:320px; object-fit:cover; border-radius:12px; background:#eef3f6; }
.foto-comparativa-vacia { height:320px; display:grid; place-items:center; border:2px dashed #cbd5dc; border-radius:12px; color:#6c757d; background:#f8fafb; }
.dashboard-kpi { min-height:115px; padding:1rem; display:flex; flex-direction:column; justify-content:center; border-radius:15px; color:#fff; box-shadow:0 5px 16px rgba(15,23,42,.12); }
.dashboard-kpi small { font-weight:700; opacity:.9; }.dashboard-kpi strong { margin-top:.2rem; font-size:1.65rem; }
.kpi-pacientes{background:linear-gradient(135deg,#475467,#667085)}.kpi-vet{background:linear-gradient(135deg,#0759c7,#0d6efd)}.kpi-groom{background:linear-gradient(135deg,#962568,#b83280)}.kpi-dinero{background:linear-gradient(135deg,#087443,#198754)}.kpi-total{background:linear-gradient(135deg,#b36b00,#e09a24)}
.dashboard-grafico { display:block; width:100%; height:320px; }
