/* ==========================================================
   Biblioteca Digital UMP · Estilo institucional
   Universidad Multitécnica Profesional
   ========================================================== */

:root {
  --ump-blue: #0b3d91;
  --ump-blue-dark: #072b66;
  --ump-blue-soft: #eaf1fb;
  --ump-gold: #c9a227;
  --ump-text: #111827;
  --ump-muted: #6b7280;
  --ump-border: rgba(7, 43, 102, 0.14);
  --ump-bg: #f5f7fb;
}

/* Fondo general */
body {
  background: linear-gradient(180deg, #f7f9fd 0%, #eef3fa 100%) !important;
  color: var(--ump-text) !important;
}

/* Barra superior */
.navbar,
.navbar-default,
.navbar-inverse {
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ump-border) !important;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.08) !important;
}

/* Marca / título */
.navbar-brand {
  color: var(--ump-blue-dark) !important;
  font-weight: 800 !important;
  letter-spacing: .01em;
}

.navbar-brand::before {
  content: "📚 ";
}

/* Links del menú */
.navbar a,
.navbar-nav > li > a {
  color: var(--ump-text) !important;
  font-weight: 600;
}

.navbar a:hover,
.navbar-nav > li > a:hover,
.navbar a:focus {
  color: var(--ump-blue) !important;
  background: var(--ump-blue-soft) !important;
}

/* Contenedor principal */
.container-fluid,
.container {
  max-width: 1380px;
}

/* Paneles y tarjetas */
.panel,
.well,
.book,
.cover,
.thumbnail {
  border-radius: 16px !important;
  border: 1px solid rgba(7, 43, 102, 0.10) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06) !important;
}

/* Títulos principales */
h1, h2, h3, h4 {
  color: var(--ump-blue-dark) !important;
  font-weight: 800 !important;
}

/* Botones principales */
.btn-primary,
.btn-success {
  background: var(--ump-blue) !important;
  border-color: var(--ump-blue) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  font-weight: 700;
  box-shadow: 0 6px 14px rgba(11, 61, 145, 0.22);
}

.btn-primary:hover,
.btn-success:hover {
  background: var(--ump-blue-dark) !important;
  border-color: var(--ump-blue-dark) !important;
}

/* Botones secundarios */
.btn-default,
.btn-secondary {
  border-radius: 10px !important;
  border-color: rgba(7, 43, 102, 0.18) !important;
  color: var(--ump-blue-dark) !important;
}

/* Portadas */
.cover img,
.thumbnail img,
.book img {
  border-radius: 10px !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important;
}

/* Listas laterales / categorías */
.list-group-item,
.nav-pills > li > a {
  border-radius: 10px !important;
}

.list-group-item:hover,
.nav-pills > li > a:hover {
  background: var(--ump-blue-soft) !important;
  color: var(--ump-blue-dark) !important;
}

/* Login */
.login,
.login-page,
.form-signin {
  background: #ffffff !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 40px rgba(15, 23, 42, 0.12) !important;
  border: 1px solid rgba(7, 43, 102, 0.10) !important;
}

/* Campos */
input,
select,
textarea,
.form-control {
  border-radius: 10px !important;
  border-color: rgba(7, 43, 102, 0.18) !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
  border-color: var(--ump-blue) !important;
  box-shadow: 0 0 0 3px rgba(11, 61, 145, 0.14) !important;
}

/* Etiquetas / badges */
.label,
.badge {
  border-radius: 999px !important;
  font-weight: 700;
}

/* Pie o textos discretos */
footer,
.footer,
small,
.text-muted {
  color: var(--ump-muted) !important;
}

/* Ajuste responsive */
@media (max-width: 768px) {
  .navbar-brand {
    font-size: 15px !important;
  }

  .container-fluid,
  .container {
    padding-left: 14px;
    padding-right: 14px;
  }
}

/* ==========================================================
   Biblioteca Digital UMP · Ajustes visuales finos
   ========================================================== */

/* Header más institucional y compacto */
.navbar-brand {
  font-size: 1.72rem !important;
  line-height: 1.1 !important;
  color: var(--ump-blue-dark) !important;
  text-shadow: none !important;
  padding-left: 10px !important;
}

/* Ícono del título más discreto */
.navbar-brand::before {
  font-size: 1.35rem !important;
  margin-right: 6px;
}

/* Barra superior más limpia */
.navbar {
  min-height: 62px !important;
}

.navbar .container-fluid {
  display: flex;
  align-items: center;
}

/* Buscador más elegante */
.navbar-form .form-control,
.navbar input.form-control {
  border-radius: 999px !important;
  min-height: 36px;
  border: 1px solid rgba(7, 43, 102, 0.16) !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
}

.navbar-form .btn,
.navbar button.btn {
  border-radius: 999px !important;
}

/* Menú lateral más sobrio */
.sidebar,
#sidebar,
.navigation {
  background: transparent !important;
}

.nav li a,
.sidebar li a,
#sidebar li a {
  color: #374151 !important;
  font-weight: 600 !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
}

.nav li a:hover,
.sidebar li a:hover,
#sidebar li a:hover {
  background: rgba(11, 61, 145, 0.08) !important;
  color: var(--ump-blue-dark) !important;
}

/* Títulos principales */
h1 {
  color: var(--ump-blue-dark) !important;
  font-size: 2.35rem !important;
  letter-spacing: -0.02em;
  margin-bottom: 28px !important;
}

/* Enlaces en azul institucional, no verde */
a {
  color: var(--ump-blue) !important;
}

a:hover,
a:focus {
  color: var(--ump-blue-dark) !important;
}

/* Tarjetas de libros más uniformes */
.book {
  background: rgba(255, 255, 255, 0.78) !important;
  border-radius: 18px !important;
  border: 1px solid rgba(7, 43, 102, 0.10) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
  transition: transform .22s ease, box-shadow .22s ease;
  overflow: hidden;
}

.book:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.14) !important;
}

/* Portadas más limpias */
.cover img,
.thumbnail img,
.book img {
  border-radius: 12px !important;
  max-height: 260px;
  object-fit: cover;
}

/* Títulos de libros */
.book h4,
.book .title,
.book .meta {
  color: var(--ump-text) !important;
}

.book h4,
.book .title {
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

/* Autores y metadatos */
.book .author,
.book .authors,
.book small,
.book .series {
  color: var(--ump-blue) !important;
  font-weight: 600;
}

/* Botones de ordenamiento */
.btn-group .btn,
.pagination .btn,
button.btn {
  border-radius: 10px !important;
  font-weight: 700 !important;
}

/* Badges de conteo */
.badge {
  background: var(--ump-blue) !important;
  color: #ffffff !important;
}

/* Separación del contenido principal */
.main,
#main,
.container-fluid > .row {
  padding-top: 12px;
}

/* Mejor espacio entre secciones */
.discover,
.books,
.category,
.author {
  margin-bottom: 36px;
}


/* ==========================================================
   Biblioteca Digital UMP · Logo institucional en navbar
   ========================================================== */

.navbar-brand.ump-library-brand {
  display: flex !important;
  align-items: center !important;
  padding: 6px 14px 6px 8px !important;
  height: auto !important;
  max-width: 360px !important;
}

.navbar-brand.ump-library-brand::before {
  content: none !important;
  display: none !important;
}

.ump-library-logo {
  display: block !important;
  width: auto !important;
  height: 54px !important;
  max-width: 340px !important;
  object-fit: contain !important;
}

/* Ajuste para pantallas medianas */
@media (max-width: 992px) {
  .navbar-brand.ump-library-brand {
    max-width: 280px !important;
  }

  .ump-library-logo {
    height: 46px !important;
    max-width: 270px !important;
  }
}

/* Ajuste para celular */
@media (max-width: 768px) {
  .navbar-brand.ump-library-brand {
    max-width: 220px !important;
  }

  .ump-library-logo {
    height: 40px !important;
    max-width: 210px !important;
  }
}

/* ==========================================================
   Biblioteca Digital UMP · Login institucional
   ========================================================== */

.ump-login-page {
  min-height: calc(100vh - 110px);
  display: grid;
  grid-template-columns: minmax(320px, 1.15fr) minmax(300px, .85fr);
  gap: 32px;
  align-items: center;
  padding: 44px 28px 56px;
}

.ump-login-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(201, 162, 39, 0.22), transparent 32%),
    linear-gradient(135deg, rgba(7, 43, 102, 0.98) 0%, rgba(11, 61, 145, 0.94) 100%);
  color: #ffffff;
  border-radius: 28px;
  padding: 42px;
  box-shadow: 0 22px 60px rgba(7, 43, 102, 0.24);
  min-height: 460px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ump-login-hero::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -90px;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  border: 32px solid rgba(255,255,255,0.08);
}

.ump-login-brand {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 26px;
}

.ump-login-brand img {
  width: min(460px, 88%);
  height: auto;
  margin: 0 auto;
  display: block;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.22));
}

.ump-login-hero h1 {
  color: #ffffff !important;
  font-size: clamp(2.1rem, 3vw, 3.5rem) !important;
  line-height: 1.05;
  margin: 0 0 18px !important;
  letter-spacing: -0.03em;
}

.ump-login-hero p {
  font-size: 1.12rem;
  line-height: 1.65;
  max-width: 680px;
  color: rgba(255,255,255,0.90);
}

.ump-login-points {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.ump-login-points span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.18);
  color: #ffffff;
  font-weight: 700;
}

.ump-login-quote {
  margin-top: 28px;
  padding-left: 18px;
  border-left: 4px solid var(--ump-gold);
  color: rgba(255,255,255,0.86);
  font-weight: 700;
  font-style: italic;
}

.ump-login-card {
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(7, 43, 102, 0.10);
  border-radius: 26px;
  padding: 34px;
  box-shadow: 0 20px 54px rgba(15, 23, 42, 0.14);
}

.ump-login-card h2 {
  margin-top: 0 !important;
  color: var(--ump-blue-dark) !important;
  font-size: 2rem !important;
}

.ump-login-subtitle {
  color: var(--ump-muted);
  margin-bottom: 24px;
  line-height: 1.55;
}

.ump-login-card label {
  color: var(--ump-blue-dark);
  font-weight: 800;
}

.ump-login-card .form-control {
  min-height: 44px;
  font-size: 1rem;
}

.ump-login-button {
  width: 100%;
  min-height: 44px;
  margin-top: 8px;
}

.ump-login-error {
  max-width: 760px;
  margin: -24px auto 24px;
}

@media (max-width: 992px) {
  .ump-login-page {
    grid-template-columns: 1fr;
    padding: 28px 16px 42px;
  }

  .ump-login-hero {
    min-height: auto;
    padding: 32px;
  }
}

@media (max-width: 640px) {
  .ump-login-hero,
  .ump-login-card {
    border-radius: 20px;
    padding: 24px;
  }

  .ump-login-points {
    flex-direction: column;
  }
}