/* =====================================================================
   SGC UNIPUTUMAYO - Tema del panel (AdminLTE) y pantalla de ingreso
   ===================================================================== */
:root {
  --azul-900: #0b2447; --azul-800: #0f3163; --azul-700: #134089; --azul-600: #1b56b3; --azul-100: #e8eef8;
  --amarillo: #f6b221; --verde: #2e7d32; --tinta: #1b2533; --tinta-3: #6b7686; --borde: #dfe5ee;
}
body, h1, h2, h3, h4, h5, h6, .main-header .logo, .btn, .form-control {
  font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, Roboto, Arial, sans-serif !important;
}

/* ---------- Encabezado ---------- */
.skin-blue .main-header .navbar { background: var(--azul-800); }
.skin-blue .main-header .logo { background: var(--azul-900); font-weight: 700; }
.skin-blue .main-header .logo:hover, .skin-blue .main-header .navbar .sidebar-toggle:hover { background: #09203f; }
.main-header .logo .logo-lg { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; white-space: nowrap; }
.main-header .logo .logo-lg small { font-weight: 600; opacity: .8; font-size: 12px; }
.main-header .logo img.logo-escudo { width: 34px; height: 34px; background: #fff; border-radius: 8px; padding: 2px; }
.skin-blue .main-header li.user-header { background: var(--azul-800); }

/* ---------- Menú lateral ---------- */
.skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side { background: var(--azul-900); }
.skin-blue .sidebar-menu > li.header { background: #081b36; color: #8fa3c2; font-weight: 700; letter-spacing: .06em; }
.skin-blue .sidebar-menu > li > a { color: #c8d4e8; }
.skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a {
  background: #0d2a52; color: #fff; border-left-color: var(--amarillo);
}
.skin-blue .sidebar a { color: #c8d4e8; }
.user-panel > .info > p { color: #fff; }

/* ---------- Contenido ---------- */
.content-wrapper { background: #f4f7fc; }
.content-header > h1 { font-weight: 800; color: var(--azul-900); }
.box { border-radius: 14px; border-top: 0; box-shadow: 0 2px 8px rgba(11,36,71,.08); }
.box.box-primary, .box.box-success { border-top: 3px solid var(--azul-600); }
.box-header .box-title { font-weight: 700; color: var(--azul-900); }
.btn { border-radius: 999px; font-weight: 600; }
.btn-xs { border-radius: 8px; }
.btn-primary { background: var(--azul-700); border-color: var(--azul-700); }
.btn-primary:hover, .btn-primary:focus { background: var(--azul-600); border-color: var(--azul-600); }
.btn-success { background: var(--verde); border-color: var(--verde); }
.form-control { border-radius: 10px; border-color: var(--borde); height: 40px; }
textarea.form-control { height: auto; }
.form-control:focus { border-color: var(--azul-600); box-shadow: 0 0 0 3px rgba(27,86,179,.15); }
.alert { border-radius: 12px; }
.small-box { border-radius: 14px; overflow: hidden; }
.small-box.bg-aqua { background: var(--azul-700) !important; }
.small-box.bg-green { background: var(--verde) !important; }
.small-box.bg-yellow { background: var(--amarillo) !important; color: var(--azul-900) !important; }
.small-box.bg-red { background: #0f3163 !important; }
.table > thead > tr > th { color: var(--azul-900); }
.btn-file { white-space: normal; text-align: left; }
.btn-my-button { background: var(--azul-100); color: var(--azul-700); border-radius: 12px; }
.main-footer { font-size: 13px; }
.table > tbody > tr > td:last-child .btn { margin: 1px 0; }
.table > tbody > tr > td { vertical-align: middle; }

/* ---------- Pantalla de ingreso ---------- */
.ingreso {
  min-height: 100vh; margin: 0; display: grid; grid-template-columns: 1.1fr 1fr;
  font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, Roboto, Arial, sans-serif; color: var(--tinta); background: #fff;
}
.ingreso-lado {
  position: relative; overflow: hidden; color: #fff; padding: 48px; display: flex; flex-direction: column; justify-content: space-between;
  background:
    linear-gradient(120deg, rgba(11,36,71,.97), rgba(19,64,137,.85)),
    url("../img/portada.jpg") center/cover no-repeat,
    var(--azul-900);
}
.ingreso-lado::after { content: ""; position: absolute; inset: 0; opacity: .08; background-image: radial-gradient(#fff 1px, transparent 1px); background-size: 22px 22px; pointer-events: none; }
.ingreso-lado > * { position: relative; z-index: 1; }
.ingreso-sello { display: flex; align-items: center; gap: 14px; }
.ingreso-sello span.logo { width: 64px; height: 64px; border-radius: 14px; background: #fff; display: grid; place-items: center; }
.ingreso-sello img { width: 52px; height: 52px; }
.ingreso-sello small { display: block; color: var(--amarillo); font-weight: 800; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.ingreso-sello strong { font-size: 17px; }
.ingreso-lado h1 { font-size: clamp(34px, 4vw, 54px); line-height: 1.05; font-weight: 800; margin: 0 0 14px; letter-spacing: -.02em; }
.ingreso-lado p { color: rgba(255,255,255,.85); font-size: 17px; max-width: 460px; margin: 0; }
.ingreso-lado a { color: rgba(255,255,255,.85); }
.ingreso-form { display: grid; place-items: center; padding: 40px 24px; background: #f4f7fc; }
.ingreso-caja { width: 100%; max-width: 400px; background: #fff; border-radius: 18px; padding: 34px 30px; box-shadow: 0 10px 30px rgba(11,36,71,.12); }
.ingreso-caja h2 { margin: 0 0 4px; font-size: 26px; font-weight: 800; color: var(--azul-900); }
.ingreso-caja p.sub { margin: 0 0 24px; color: var(--tinta-3); }
.ingreso-caja label { display: block; font-size: 13px; font-weight: 700; color: var(--tinta); margin: 0 0 6px; }
.campo-ico { position: relative; margin-bottom: 16px; }
.campo-ico i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--tinta-3); }
.campo-ico input {
  width: 100%; height: 48px; padding: 0 14px 0 40px; border: 1px solid var(--borde); border-radius: 12px; font: inherit; font-size: 15px;
}
.campo-ico input:focus { outline: 0; border-color: var(--azul-600); box-shadow: 0 0 0 3px rgba(27,86,179,.15); }
.btn-ingresar {
  width: 100%; height: 50px; border: 0; border-radius: 999px; background: var(--amarillo); color: var(--azul-900);
  font: inherit; font-weight: 800; font-size: 16px; cursor: pointer; margin-top: 6px; box-shadow: 0 6px 18px rgba(246,178,33,.35);
}
.btn-ingresar:hover { background: #ffc03a; }
.ingreso-alerta { padding: 12px 14px; border-radius: 12px; margin-bottom: 18px; font-size: 14px; }
.ingreso-alerta.danger { background: #fdecea; color: #9b1c1c; }
.ingreso-alerta.warning { background: #fff6df; color: #7a5200; }
.ingreso-volver { display: block; text-align: center; margin-top: 18px; color: var(--azul-700); font-weight: 600; text-decoration: none; }
.ingreso-volver:hover { text-decoration: underline; }
@media (max-width: 860px) {
  .ingreso { grid-template-columns: 1fr; }
  .ingreso-lado { padding: 28px 24px; gap: 24px; }
  .ingreso-lado h1 { font-size: 32px; }
  .ingreso-lado .pie-lado { display: none; }
}
