/* Shared administrative theme, based on portal alumnos. Keep business styles in custom.css. */
:root {
  color-scheme: dark;
  --mutant: #8ce600;
  --mutant-light: #a3e635;
  --mutant-dark: #73be00;
  --ink: #08090b;
  --panel: #111318;
  --panel-2: #171a20;
  --line: #2a2e36;
  --text: #f5f7fa;
  --muted: #a1a8b3;
}
html body {
  color: var(--text);
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 1rem;
  background: var(--ink);
}
body .content-wrapper, body.login-page, body.register-page {
  color: var(--text);
  background: radial-gradient(ellipse at 85% 0, #8ce60009, transparent 45%),
    linear-gradient(#8ce60006 1px, transparent 1px),
    linear-gradient(90deg, #8ce60006 1px, transparent 1px), var(--ink) !important;
  background-size: auto, 38px 38px, 38px 38px, auto !important;
}
body h1, body h2, body h3, body .card-title, body .brand-text {
  font-family: 'Teko', 'Arial Narrow', sans-serif;
  letter-spacing: .035em;
  line-height: 1.15;
}
body .content-header { padding: 30px 20px 20px; }
body .content-header h1 { font-size: clamp(2rem, 3vw, 2.8rem); }
body .content > .container-fluid { padding: 0 20px 28px; }
body .content-header .container-fluid { padding: 0; }
body .main-header.navbar {
  background: #0d0f13 !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: none !important;
}
body .main-header h5 { font-size: .875rem; }
body .main-header .nav-link { color: var(--text) !important; min-width: 42px; }
body .main-sidebar { background: #0d0f13 !important; box-shadow: none !important; border-right: 1px solid var(--line); }
body .brand-link { display: flex; align-items: center; gap: 12px; min-height: 64px; border-bottom: 1px solid var(--line) !important; }
body .brand-link .brand-image { float: none; margin: 0; max-height: 36px; box-shadow: none !important; }
body .brand-text { color: var(--text); font-size: 1.75rem; font-weight: 600; }
body .brand-text small { display: block; font: 600 .625rem 'Montserrat', sans-serif; color: var(--muted); letter-spacing: .16em; }
body .nav-sidebar .nav-link { border-radius: 0; font-size: .875rem; padding: 12px 10px; color: #c0c5ce; white-space: normal; }
body .nav-sidebar .nav-link > p { white-space: normal; }
body .nav-sidebar .nav-link.active { background: #8ce60015 !important; border-left: 3px solid var(--mutant); box-shadow: none !important; }
body .nav-sidebar .nav-link.active p, body .nav-sidebar .nav-link.active i { color: var(--mutant-light) !important; }
body .nav-sidebar .nav-link:hover { background: var(--panel-2); color: var(--text); }
body .nav-sidebar .nav-header { color: var(--muted) !important; font-size: .75rem !important; letter-spacing: .1em; }
body .main-footer { background: var(--panel); color: var(--muted); border-color: var(--line); }
html body .card, html body .info-box, html body .small-box, html body .modal-content {
  background: linear-gradient(145deg, #14161b, #0d0f13) !important;
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 0 !important;
  box-shadow: 0 12px 32px #00000020 !important;
}
html body .card-header, html body .card-footer, html body .modal-header, html body .modal-footer {
  background: #ffffff02;
  color: var(--text);
  border-color: var(--line);
}
html body .card-header { padding: 18px 20px; }
html body .card-title { font-size: 1.6rem; float: none; margin-bottom: 0; }
body .card-body { padding: 22px; }
body .text-dark, body .text-black, body .text-secondary { color: #e3e7ec !important; }
body .text-muted { color: var(--muted) !important; }
body .text-purple, body .text-primary, body .text-mutant { color: var(--mutant-light) !important; }
body .bg-white, body .bg-light { background: var(--panel) !important; color: var(--text); }
body .bg-primary, body .bg-purple { background: #243710 !important; color: var(--text) !important; }
body .border, body .border-top, body .border-bottom { border-color: var(--line) !important; }
body .btn { border-radius: 2px; font-weight: 700; font-size: .875rem; min-height: 42px; padding: 10px 16px; }
body .btn-sm { min-height: 34px; padding: 6px 10px; font-size: .8125rem; }
body .btn-primary, body .btn-purple, body .btn-warning {
  background: var(--mutant) !important; border-color: var(--mutant) !important; color: var(--ink) !important;
}
body .btn-primary:hover, body .btn-purple:hover, body .btn-warning:hover { background: var(--mutant-light) !important; }
body .btn-outline-primary, body .btn-outline-secondary, body .btn-default { background: transparent; border-color: #525a66; color: var(--text); }
body .btn-outline-primary:hover, body .btn-outline-secondary:hover, body .btn-default:hover { background: var(--panel-2); border-color: var(--mutant); color: var(--mutant-light); }
body a:focus-visible, body button:focus-visible, body input:focus-visible, body select:focus-visible, body textarea:focus-visible { outline: 2px solid var(--mutant); outline-offset: 3px; }
body .form-control, body .custom-select, body .form-select, body .input-group-text,
body .select2-container--bootstrap4 .select2-selection, body .select2-container--default .select2-selection--single {
  color: var(--text) !important; background: #0b0d11 !important; border: 1px solid #414854 !important;
  border-radius: 2px !important; font-size: .9375rem; min-height: 44px;
}
body .form-control::placeholder { color: #929ba8; opacity: 1; }
body .form-control:focus, body .form-select:focus { border-color: var(--mutant) !important; box-shadow: 0 0 0 3px #8ce60018; }
body .form-control:disabled, body .form-control[readonly] { background: #20242b !important; color: #b8bfca !important; }
body label { font-size: .875rem; font-weight: 600; color: #d6dbe3; }
body option, body optgroup { background: var(--panel); color: var(--text); }
body input[type=checkbox], body input[type=radio] { accent-color: var(--mutant); }
body .select2-dropdown, body .select2-search__field, body .dropdown-menu {
  background: var(--panel) !important; color: var(--text) !important; border-color: var(--line) !important;
}
body .select2-selection__rendered, body .dropdown-item { color: var(--text) !important; }
body .select2-results__option[aria-selected=true], body .select2-results__option--highlighted[aria-selected], body .dropdown-item:hover { background: #243710 !important; color: var(--text) !important; }
html body .table { color: var(--text); font-size: .875rem; --bs-table-bg: transparent; --bs-table-color: var(--text); --bs-table-striped-bg: #ffffff04; --bs-table-striped-color: var(--text); --bs-table-hover-color: var(--text); --bs-table-hover-bg: #8ce60008; }
html body .table th, html body .table td { border-color: var(--line) !important; padding: 13px 14px; vertical-align: middle; }
html body .table thead th { background: #191d24 !important; color: #c4cbd6 !important; font-size: .8125rem; font-weight: 700; }
html body .table-striped tbody tr:nth-of-type(odd) { background: #ffffff03; }
html body .table-hover tbody tr:hover { background: #8ce60008; color: var(--text); }
body .table-responsive { font-size: .875rem; }
body .page-link, body .dataTables_wrapper .dataTables_paginate .paginate_button { background: var(--panel) !important; color: var(--text) !important; border-color: var(--line) !important; }
body .page-item.active .page-link, body .dataTables_wrapper .dataTables_paginate .paginate_button.current { background: var(--mutant) !important; color: var(--ink) !important; }
body .dataTables_wrapper .dataTables_length, body .dataTables_wrapper .dataTables_filter, body .dataTables_wrapper .dataTables_info, body .dataTables_wrapper .dataTables_paginate { color: var(--muted); }
body .dataTables_wrapper input, body .dataTables_wrapper select { color: var(--text); background: var(--panel); border: 1px solid #414854; padding: 6px; }
body .list-group-item { color: var(--text); background: var(--panel); border-color: var(--line); }
body .nav-tabs { border-color: var(--line); }
body .nav-tabs .nav-link.active { background: var(--panel); color: var(--mutant-light); border-color: var(--line) var(--line) var(--panel); }
body .close { color: var(--text); opacity: .85; text-shadow: none; }
body .btn-close { filter: invert(1); }
html body .tile-express { text-align: left; padding: 22px 18px; border-radius: 0; border: 1px solid var(--line) !important; border-top: 2px solid #8ce60055 !important; background: linear-gradient(145deg, #14161b, #0d0f13) !important; }
html body .tile-express:hover { border-color: var(--mutant) !important; transform: translateY(-2px); box-shadow: 0 10px 30px #0004; }
html body .tile-express .tile-icon { font-size: 1.7rem; margin-bottom: 22px; color: var(--mutant-light); }
html body .tile-express .tile-title { display: block; font: 500 1.65rem 'Teko', sans-serif; letter-spacing: .04em; }
html body .tile-express .tile-desc { font-size: .8125rem; line-height: 1.55; color: var(--muted); }
body .info-box-icon { background: #8ce60012 !important; color: var(--mutant-light) !important; border-radius: 0; }
body .info-box-number, body .small-box h3 { font-family: 'Teko', sans-serif; font-size: 2.4rem; }
body .portal-eyebrow { font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--mutant-light); }
body .portal-subtitle { margin: 8px 0 0; color: var(--muted); font-size: .875rem; }
body .portal-skip { position: fixed; top: -100px; left: 16px; z-index: 99999; background: var(--mutant); color: var(--ink); padding: 12px; }
body .portal-skip:focus { top: 12px; }
/* Login: same visual language and clipped corner as the student portal. */
body.login-page { min-height: 100vh; min-height: 100dvh; height: auto; padding: 36px 20px; }
body .login-box { width: 100%; max-width: 460px; }
body .login-logo { margin: 24px 0; }
body .login-logo img { max-width: 200px; max-height: 100px; object-fit: contain; }
body .login-box .card { border-top: 3px solid var(--mutant); }
body .login-card-body { background: transparent; color: var(--text); padding: 32px; }
body .login-card-body h1 { margin: 8px 0; font-size: 3rem; text-transform: uppercase; }
body .login-card-body .login-box-msg { padding: 0; text-align: left; color: var(--muted); margin-bottom: 28px; font-size: .875rem; }
body .login-card-body .input-group { margin-bottom: 20px !important; }
body .login-card-body .input-group-text { color: var(--mutant-light) !important; }
body .portal-login-foot { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .8125rem; text-align: center; }
body .portal-login-foot a { color: #c9d0da; }
body .card-login { background: var(--panel) !important; color: var(--text); border-radius: 0 !important; border: 1px solid var(--line); border-top: 3px solid var(--mutant); }
body .login-wrapper { padding: 20px; max-width: 480px; }
body .login-wrapper .text-dark { color: var(--text) !important; }
body.portal-qr { --primary: var(--mutant); --primary-hover: var(--mutant-light); --text-main: var(--text); --text-muted: var(--muted); --border: var(--line); }
body.portal-qr input, body.portal-qr select { font-family: inherit; background: var(--ink); color: var(--text); border-radius: 2px; }
body.portal-qr button { background: var(--mutant); color: var(--ink); border-radius: 2px; }
@media (max-width: 575.98px) {
  body .content-header { padding: 24px 12px 18px; }
  body .content > .container-fluid { padding: 0 12px 24px; }
  body .card-body { padding: 16px; }
  body .login-card-body { padding: 24px; }
  body .main-header h5 { max-width: 42vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html body .tile-express { padding: 18px 14px; }
  body .modal-dialog { margin: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
  :root { color-scheme: light; }
  html body, body .content-wrapper, html body .card, html body .table { background: white !important; color: black !important; box-shadow: none !important; }
  body .main-sidebar, body .main-header, body .portal-skip { display: none !important; }
  body .content-wrapper { margin-left: 0 !important; }
  html body .table th, html body .table td, body .text-dark, body .text-muted { color: black !important; }
}