/* ==========================================================================
   MFR Gestor · estilos de las pantallas públicas (login, portal, enlace compartido)
   Bootstrap 5 independiente del panel AdminLTE.
   ========================================================================== */
:root {
  --glass-bg: rgba(15, 23, 42, .55);
  --glass-border: rgba(255, 255, 255, .16);
  --p-primary: #3b82f6;
  --p-primary-dark: #2563eb;
  --p-accent: #10b981;
  --p-text: #e2e8f0;
  --p-muted: #94a3b8;
}
html { min-height: 100%; }
body.portal {
  min-height: 100vh; margin: 0; color: var(--p-text); font-family: 'Inter', system-ui, sans-serif;
  background:
    linear-gradient(rgba(2, 6, 23, .72), rgba(2, 6, 23, .72)),
    url('https://cdn.pixabay.com/photo/2017/08/23/16/05/iocenters-2673328_1280.jpg') center / cover fixed no-repeat,
    #0f172a;
}
.portal-center { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem 1rem; }
.portal-wrap { width: 100%; max-width: 1080px; margin: 0 auto; padding: 2rem 1rem 3rem; }

.glass {
  background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: 20px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass { background: rgba(15, 23, 42, .92); }
}
.auth-card { width: 100%; max-width: 420px; padding: 2.25rem 2rem; }
.brand { text-align: center; margin-bottom: 1.5rem; }
.brand img { max-height: 84px; max-width: 100%; margin-bottom: .75rem; }
.brand h1 { font-size: 1.25rem; font-weight: 700; margin: 0; color: #fff; }
.brand p { margin: .25rem 0 0; color: var(--p-muted); font-size: .88rem; }

.portal .form-label { color: var(--p-text); font-weight: 500; font-size: .85rem; }
.portal .form-control, .portal .form-select {
  background-color: rgba(255, 255, 255, .08); border: 1px solid var(--glass-border); color: #fff;
  border-radius: 12px; padding: .65rem .9rem;
}
.portal .form-control::placeholder { color: rgba(226, 232, 240, .45); }
.portal .form-control:focus, .portal .form-select:focus {
  background-color: rgba(255, 255, 255, .14); border-color: var(--p-primary); color: #fff;
  box-shadow: 0 0 0 .22rem rgba(59, 130, 246, .3);
}
.portal .form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23e2e8f0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
.portal option { background: #0f172a; color: #fff; }
.portal .input-group-text { background: rgba(255, 255, 255, .08); border: 1px solid var(--glass-border); color: var(--p-muted); border-radius: 12px 0 0 12px; }
.portal .input-group > .form-control { border-radius: 0 12px 12px 0; }
.portal .input-group > .form-control:not(:last-child) { border-radius: 0; }
.portal .input-group > .btn-eye { border: 1px solid var(--glass-border); border-left: 0; color: var(--p-muted); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, .08); }
.portal .btn-eye:hover { color: #fff; }

.btn-brand { background: var(--p-primary); border: 0; color: #fff; font-weight: 600; border-radius: 12px; padding: .7rem 1rem; transition: background .2s, box-shadow .2s; }
.btn-brand:hover, .btn-brand:focus { background: var(--p-primary-dark); color: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, .4); }
.btn-brand:disabled { opacity: .7; }
.btn-ghost { background: rgba(16, 185, 129, .15); border: 1px solid var(--p-accent); color: #6ee7b7; border-radius: 12px; font-weight: 500; }
.btn-ghost:hover { background: var(--p-accent); color: #fff; }
.divider { display: flex; align-items: center; gap: .75rem; color: var(--p-muted); font-size: .8rem; margin: 1.1rem 0; }
.divider::before, .divider::after { content: ''; flex: 1; height: 1px; background: var(--glass-border); }
.portal-alert { border-radius: 12px; font-size: .88rem; padding: .6rem .9rem; border: 1px solid rgba(248, 113, 113, .5); background: rgba(127, 29, 29, .45); color: #fecaca; }
.copyright { text-align: center; color: var(--p-muted); font-size: .78rem; margin-top: 1.5rem; }
.portal :focus-visible { outline: 2px solid #93c5fd; outline-offset: 2px; }

/* Portal de consultas */
.portal-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.portal-top .title h1 { margin: 0; font-size: 1.5rem; font-weight: 700; color: #fff; }
.portal-top .title p { margin: .15rem 0 0; color: #7dd3fc; font-size: .9rem; }
.btn-out { border: 1px solid rgba(248, 113, 113, .6); color: #fca5a5; border-radius: 999px; padding: .35rem 1rem; font-size: .85rem; white-space: nowrap; }
.btn-out:hover { background: #ef4444; color: #fff; border-color: #ef4444; }
.filters { padding: 1.25rem; margin-bottom: 1.5rem; }
.results-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.results-head h2 { margin: 0; font-size: 1.05rem; font-weight: 600; color: #fff; }
.results-head .count { color: var(--p-muted); font-weight: 400; font-size: .9rem; }
.search-box { max-width: 280px; width: 100%; }
.doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }
.doc-card { padding: 1.15rem 1.25rem; display: flex; flex-direction: column; gap: .9rem; }
.doc-card h3 { margin: 0; font-size: 1rem; font-weight: 600; color: #fff; overflow-wrap: anywhere; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; }
.chip { font-size: .72rem; font-weight: 600; padding: .2rem .6rem; border-radius: 999px; background: rgba(59, 130, 246, .22); color: #bfdbfe; }
.chip.alt { background: rgba(255, 255, 255, .1); color: var(--p-text); }
.file-list { display: flex; flex-direction: column; gap: .5rem; }
.file-row { display: flex; align-items: center; gap: .75rem; padding: .6rem .8rem; border-radius: 12px; text-decoration: none; color: var(--p-text); background: rgba(255, 255, 255, .06); border: 1px solid var(--glass-border); transition: background .15s, transform .15s; }
.file-row:hover { background: rgba(59, 130, 246, .25); color: #fff; transform: translateY(-1px); }
.file-row .file-ico { font-size: 1.4rem; width: 1.8rem; text-align: center; flex: 0 0 auto; }
.file-row .file-info { flex: 1 1 auto; min-width: 0; }
.file-row .file-name { display: block; font-weight: 500; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-row .file-size { font-size: .75rem; color: var(--p-muted); }
.file-row .dl { color: #7dd3fc; }
.is-pdf { color: #f87171; } .is-word { color: #60a5fa; } .is-excel { color: #4ade80; }
.is-ppt { color: #fb923c; } .is-image { color: #c084fc; } .is-zip { color: #facc15; } .is-other { color: #94a3b8; }
.empty { text-align: center; padding: 2.5rem 1rem; color: var(--p-muted); }
.empty i { font-size: 2.2rem; margin-bottom: .6rem; opacity: .6; display: block; }
.share-head { padding: 1.5rem; margin-bottom: 1.25rem; }
.share-head h1 { margin: 0 0 .35rem; font-size: 1.4rem; font-weight: 700; color: #fff; overflow-wrap: anywhere; }
.share-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .75rem; margin-top: 1rem; }
.share-meta div { padding: .7rem .9rem; border-radius: 12px; background: rgba(255, 255, 255, .06); border: 1px solid var(--glass-border); }
.share-meta small { display: block; color: var(--p-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; }
.share-meta strong { color: #fff; font-weight: 600; }

@media (max-width: 575.98px) {
  .auth-card { padding: 1.75rem 1.25rem; }
  .portal-top { flex-direction: column-reverse; align-items: stretch; text-align: center; }
  .portal-top .btn-out { align-self: center; }
  .doc-grid { grid-template-columns: 1fr; }
  .search-box { max-width: none; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
