/* =====================================================================
   ANITS · Department of Mechanical Engineering — Academic Portal Theme
   Bootstrap 5.3 companion stylesheet (mobile-first, print-aware)
   Loaded AFTER bootstrap.min.css on every page.
   ===================================================================== */

:root {
  --navy-900: #081a3a;
  --navy-800: #0b2447;
  --navy-700: #14305f;
  --navy-600: #1d4281;
  --navy-500: #2b5aa8;
  --navy-100: #e6ecf7;
  --navy-50:  #f1f5fb;
  --gold-500: #c9a227;
  --gold-400: #dcb844;
  --gold-300: #e8c868;
  --gold-100: #faf1d2;
  --maroon:   #7b1e3a;
  --ink:      #1c2538;
  --muted:    #667085;
  --line:     #dfe5f1;
  --page-bg:  #f3f5fa;
  --radius:   14px;
  --shadow-sm: 0 1px 2px rgba(11,36,71,.06), 0 2px 8px rgba(11,36,71,.05);
  --shadow-md: 0 6px 24px rgba(11,36,71,.10);
  --shadow-lg: 0 18px 50px rgba(11,36,71,.18);

  --bs-primary: var(--navy-700);
  --bs-primary-rgb: 20,48,95;
  --bs-link-color: var(--navy-600);
  --bs-link-hover-color: var(--maroon);
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --bs-body-color: var(--ink);
}

/* ---------- Base ------------------------------------------------------ */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.anits-body {
  font-family: var(--bs-body-font-family);
  font-size: .94rem;
  line-height: 1.5;
  color: var(--ink);
  background-color: var(--page-bg);
  background-image: url("../img/pattern.svg");
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
}
body.anits-body > .anits-main { flex: 1 0 auto; }
h1, h2, h3, h4, h5, h6, .font-serif { font-family: 'Playfair Display', Georgia, 'Times New Roman', serif; color: var(--navy-800); letter-spacing: .1px; }
a { color: var(--navy-600); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--maroon); text-decoration: underline; }
img { max-width: 100%; height: auto; }
::selection { background: var(--gold-300); color: var(--navy-900); }

/* legacy <font>/<center>/<b> helpers keep working but align to theme */
font[color="#0000CC" i], font[color="#000099" i], font[color="blue" i] { color: var(--navy-600); }
center { text-align: center; }

/* ---------- Masthead (header.php) ------------------------------------ */
.anits-masthead { position: sticky; top: 0; z-index: 1030; width: 100%; box-shadow: 0 4px 18px rgba(8,26,58,.22); text-align: left; }
.anits-utility { background: var(--navy-900); color: #c9d4ea; font-size: .74rem; letter-spacing: .3px; }
.anits-utility .inner { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding-top: .32rem; padding-bottom: .32rem; }
.anits-utility .accred { display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.anits-utility .accred span::before { content: "\2726"; color: var(--gold-400); margin-right: .4rem; font-size: .7rem; }
.anits-utility .who { display: inline-flex; align-items: center; gap: .45rem; white-space: nowrap; }
.anits-utility .who .role { background: rgba(232,200,104,.16); color: var(--gold-300); border: 1px solid rgba(232,200,104,.35); border-radius: 999px; padding: .02rem .55rem; font-weight: 600; text-transform: capitalize; }

.anits-brand-row {
  background:
    radial-gradient(1200px 260px at 85% -40%, rgba(232,200,104,.20), transparent 60%),
    linear-gradient(115deg, var(--navy-800) 0%, var(--navy-700) 55%, var(--navy-600) 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.anits-brand-row::after { /* gold hairline */
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold-500), var(--gold-300), var(--gold-500));
}
.anits-brand-row .inner { display: flex; align-items: center; gap: 1rem; padding-top: .85rem; padding-bottom: 1rem; }
.anits-logo { flex: 0 0 auto; width: 64px; height: 64px; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 0 0 3px var(--gold-400), 0 6px 16px rgba(0,0,0,.35); overflow: hidden; }
.anits-logo img { width: 78%; height: 78%; object-fit: contain; }
.anits-title { min-width: 0; }
.anits-title .college { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: clamp(1.02rem, 2.6vw, 1.7rem); line-height: 1.15; margin: 0; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.25); }
.anits-title .college small { font-family: 'Inter', sans-serif; font-weight: 600; font-size: .5em; color: var(--gold-300); letter-spacing: .6px; text-transform: uppercase; margin-left: .35rem; }
.anits-title .dept { margin: .15rem 0 0; font-size: clamp(.74rem, 1.8vw, .95rem); color: #d7e1f5; font-weight: 500; letter-spacing: .3px; }
.anits-title .motto { display: inline-block; margin-top: .2rem; font-size: .68rem; letter-spacing: 2px; text-transform: uppercase; color: var(--gold-300); opacity: .95; }

/* Navbar */
.anits-nav { background: #fff; border-bottom: 1px solid var(--line); padding: 0; }
.anits-nav .container-xxl { padding-top: 0; padding-bottom: 0; }
.anits-nav .navbar-brand-mini { font-weight: 700; color: var(--navy-700); font-size: .9rem; display: inline-flex; align-items: center; gap: .45rem; }
.anits-nav .navbar-toggler { border: 1px solid var(--line); padding: .35rem .6rem; margin: .4rem 0; }
.anits-nav .navbar-toggler:focus { box-shadow: 0 0 0 .2rem rgba(201,162,39,.35); }
.anits-nav .nav-link, .anits-nav .dropdown-item { font-size: .86rem; font-weight: 600; }
.anits-nav .navbar-nav > .nav-item > .nav-link { color: var(--navy-800); padding: .85rem 1rem; position: relative; display: flex; align-items: center; gap: .4rem; }
.anits-nav .navbar-nav > .nav-item > .nav-link::after { /* underline animation */
  content: ""; position: absolute; left: 1rem; right: 1rem; bottom: 0; height: 3px; background: var(--gold-500);
  transform: scaleX(0); transform-origin: left; transition: transform .22s ease; border: 0; margin: 0;
}
.anits-nav .navbar-nav > .nav-item > .nav-link:hover::after,
.anits-nav .navbar-nav > .nav-item.show > .nav-link::after { transform: scaleX(1); }
.anits-nav .navbar-nav > .nav-item > .nav-link:hover,
.anits-nav .navbar-nav > .nav-item.show > .nav-link { color: var(--navy-600); text-decoration: none; background: var(--navy-50); }
.anits-nav .nav-link.nav-logout { color: var(--maroon); }
.anits-nav .nav-link.nav-logout:hover { color: #fff; background: var(--maroon); }
.anits-nav .nav-link.nav-logout:hover::after { transform: scaleX(0); }
.anits-nav .dropdown-toggle::after { margin-left: .15rem; vertical-align: .15em; transition: transform .2s; }
.anits-nav .nav-item.show > .dropdown-toggle::after { transform: rotate(180deg); }

.anits-nav .dropdown-menu { border: 1px solid var(--line); border-top: 3px solid var(--gold-500); border-radius: 0 0 12px 12px; box-shadow: var(--shadow-lg); padding: .4rem; margin-top: 0; min-width: 250px; }
.anits-nav .dropdown-item { border-radius: 8px; padding: .5rem .75rem; color: var(--ink); white-space: normal; font-weight: 500; }
.anits-nav .dropdown-item:hover, .anits-nav .dropdown-item:focus { background: var(--navy-50); color: var(--navy-600); text-decoration: none; }
.anits-nav .dropdown-item.submenu-toggle { display: flex; align-items: center; justify-content: space-between; gap: .5rem; font-weight: 600; color: var(--navy-700); }
.anits-nav .dropdown-item.submenu-toggle::after { content: "\F285"; font-family: 'bootstrap-icons'; font-size: .72rem; transition: transform .2s; }
.dropdown-submenu { position: relative; }
.dropdown-submenu.show > .submenu-toggle { background: var(--navy-50); }
.dropdown-submenu.show > .submenu-toggle::after { transform: rotate(90deg); }
.dropdown-menu .submenu { display: none; list-style: none; margin: 0; padding: .4rem; }
.dropdown-submenu.show > .submenu { display: block; }

@media (min-width: 992px) {
  .anits-nav .dropdown-menu.mega { columns: 2; column-gap: .25rem; min-width: 600px; }
  .anits-nav .dropdown-menu.mega > li { break-inside: avoid; }
  .anits-nav .dropdown:hover > .dropdown-menu { display: block; }          /* hover open on desktop */
  .dropdown-menu .submenu { position: absolute; left: 100%; top: -.45rem; min-width: 260px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--gold-500); border-radius: 0 12px 12px 12px; box-shadow: var(--shadow-lg); z-index: 5; }
  .dropdown-submenu:hover > .submenu { display: block; }
  .dropdown-menu .submenu.flip-left { left: auto; right: 100%; border-radius: 12px 0 12px 12px; }
}
@media (max-width: 991.98px) {
  .anits-nav .navbar-collapse { max-height: calc(100vh - 150px); overflow-y: auto; padding-bottom: .6rem; }
  .anits-nav .navbar-nav > .nav-item > .nav-link { padding: .7rem .5rem; border-bottom: 1px solid var(--line); }
  .anits-nav .navbar-nav > .nav-item > .nav-link::after { display: none; }
  .anits-nav .dropdown-menu { box-shadow: none; border: 0; border-left: 3px solid var(--gold-400); border-radius: 0; margin: 0 0 .4rem .4rem; background: var(--navy-50); }
  .dropdown-menu .submenu { margin-left: .5rem; border-left: 2px solid var(--line); }
  .anits-utility .accred { display: none; }
}
@media (max-width: 575.98px) {
  .anits-logo { width: 52px; height: 52px; }
  .anits-title .college small { display: block; margin: .1rem 0 0; }
  .anits-title .motto { display: none; }
}

/* ---------- Main content shell --------------------------------------- */
.anits-main { width: 100%; padding: 1.25rem 0 2rem; text-align: left; }
.anits-main .anits-sheet {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-md);
  padding: clamp(.9rem, 2.5vw, 1.8rem); position: relative; overflow-x: auto;
}
.anits-main .anits-sheet::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--navy-700), var(--gold-500), var(--navy-700)); border-radius: var(--radius) var(--radius) 0 0; }
.anits-main .container-xxl { max-width: 1400px; }

/* ---------- Legacy layout normalisation ------------------------------ */
table { border-collapse: collapse; max-width: 100%; }
td, th { vertical-align: middle; }
table.lg-layout, table.lg-plain { width: 100% !important; max-width: 100%; height: auto !important; border: 0 !important; background: transparent; }
table.lg-layout > tbody > tr > td,
table.lg-layout > tr > td,
table.lg-plain > tbody > tr > td { border: 0 !important; padding: .25rem .4rem; height: auto !important; }
table.lg-layout > tbody > tr > td[width], table.lg-layout > tr > td[width] { width: auto !important; }
td.lg-empty { padding: 0 !important; }
tr.lg-empty-row { display: none; }
table.lg-layout { table-layout: auto; }

/* data tables (reports, grade sheets) */
.lg-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: .6rem 0 1rem; border-radius: 12px; border: 1px solid var(--line); box-shadow: var(--shadow-sm); background: #fff; position: relative; }
.lg-scroll > table { margin: 0 !important; }
table.lg-data { width: 100%; min-width: 100%; border-collapse: separate; border-spacing: 0; font-size: .86rem; background: #fff; border: 0 !important; }
table.lg-data th, table.lg-data td { padding: .5rem .7rem; border-bottom: 1px solid var(--line); border-right: 1px solid #eef1f8 !important; border-top: 0 !important; border-left: 0 !important; vertical-align: middle; }
table.lg-data tr > *:last-child { border-right: 0 !important; }
table.lg-data tr:last-child > td { border-bottom: 0; }
table.lg-data tr.lg-headrow > td, table.lg-data tr.lg-headrow > th, table.lg-data thead th, table.lg-data thead td {
  background: linear-gradient(180deg, var(--navy-700), var(--navy-800)) !important; color: #fff !important; font-weight: 600; text-align: center;
  border-right: 1px solid rgba(255,255,255,.14) !important; border-bottom: 2px solid var(--gold-500); letter-spacing: .2px; white-space: nowrap;
}
table.lg-data tr.lg-headrow font, table.lg-data tr.lg-headrow b, table.lg-data tr.lg-headrow strong, table.lg-data tr.lg-headrow a { color: #fff !important; }
table.lg-data tbody tr:not(.lg-headrow):nth-child(even) > td:not([bgcolor]):not([style*="background"]) { background: var(--navy-50); }
table.lg-data tbody tr:not(.lg-headrow):hover > td:not([bgcolor]):not([style*="background"]) { background: var(--gold-100); }
table.lg-data td { color: var(--ink); }
table.lg-data td a { font-weight: 600; }
table.lg-data caption { caption-side: top; padding: .6rem .8rem; font-weight: 700; color: var(--navy-700); text-align: left; }

/* form tables */
table.lg-form { width: auto; max-width: 100%; margin: .5rem auto; background: var(--navy-50); border: 1px solid var(--line) !important; border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
table.lg-form td, table.lg-form th { padding: .55rem .8rem; border: 0 !important; }
table.lg-form tr + tr > td { border-top: 1px dashed var(--line) !important; }

/* ---------- Headings & rich legacy text ------------------------------ */
.anits-main h1 { font-size: clamp(1.35rem, 3.2vw, 1.9rem); }
.anits-main h2 { font-size: clamp(1.2rem, 2.8vw, 1.6rem); }
.anits-main h3 { font-size: clamp(1.05rem, 2.4vw, 1.3rem); }
.anits-main h1, .anits-main h2, .anits-main h3 { position: relative; padding-bottom: .4rem; margin: .8rem 0 .9rem; }
.anits-main h1::after, .anits-main h2::after, .anits-main h3::after { content: ""; display: block; width: 56px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--gold-500), var(--gold-300)); margin-top: .35rem; }
.anits-main center h1::after, .anits-main center h2::after, .anits-main center h3::after,
.anits-main [align="center"] > h1::after, .anits-main [align="center"] > h2::after, .anits-main [align="center"] > h3::after,
.anits-main h1[align="center"]::after, .anits-main h2[align="center"]::after, .anits-main h3[align="center"]::after { margin-left: auto; margin-right: auto; }
.anits-main hr { border: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--line), transparent); opacity: 1; margin: 1rem 0; }
.anits-main p { margin-bottom: .6rem; }

/* ---------- Form controls (classes added by theme JS) --------------- */
.anits-main input[type=text]:not(.form-control), .anits-main input[type=password]:not(.form-control), .anits-main input[type=number]:not(.form-control), .anits-main input[type=date]:not(.form-control),
.anits-main input[type=email]:not(.form-control), .anits-main input[type=search]:not(.form-control), .anits-main input[type=tel]:not(.form-control), .anits-main input[type=url]:not(.form-control),
.anits-main input[type=file]:not(.form-control), .anits-main input:not([type]):not(.form-control), .anits-main select:not(.form-select):not(.form-control), .anits-main textarea:not(.form-control) {
  max-width: 100%; border-radius: 10px; border: 1px solid #cbd5e6; padding: .42rem .7rem; font-size: .9rem; background-color: #fff; color: var(--ink);
  transition: border-color .15s, box-shadow .15s;
}
.anits-main select:not(.form-select) { padding-right: 2rem; }
.anits-main input:focus, .anits-main select:focus, .anits-main textarea:focus { border-color: var(--navy-500); box-shadow: 0 0 0 .22rem rgba(43,90,168,.18); outline: 0; }
.anits-main input[type=checkbox]:not(.form-check-input), .anits-main input[type=radio]:not(.form-check-input) { accent-color: var(--navy-600); width: 1.05rem; height: 1.05rem; vertical-align: middle; margin-right: .3rem; }
.anits-main label { font-weight: 600; color: var(--navy-700); }
.anits-main textarea { width: 100%; }
.lg-scroll input[type=text], .lg-scroll input[type=number], .lg-scroll select { padding: .25rem .45rem; font-size: .84rem; }

.anits-main input[type=submit]:not(.btn), .anits-main input[type=button]:not(.btn), .anits-main input[type=reset]:not(.btn), .anits-main button:not(.btn):not(.btn-close):not(.accordion-button):not(.nav-link):not(.page-link), .btn-anits {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  background: linear-gradient(180deg, var(--navy-600), var(--navy-700)); color: #fff; border: 1px solid var(--navy-800);
  border-radius: 10px; padding: .45rem 1.1rem; font-weight: 600; font-size: .88rem; cursor: pointer; box-shadow: 0 2px 6px rgba(11,36,71,.25);
  transition: transform .12s ease, box-shadow .15s ease, filter .15s ease;
}
.anits-main input[type=submit]:not(.btn):hover, .anits-main input[type=button]:not(.btn):hover, .anits-main button:not(.btn):not(.btn-close):not(.accordion-button):not(.nav-link):not(.page-link):hover, .btn-anits:hover { filter: brightness(1.12); transform: translateY(-1px); box-shadow: 0 6px 14px rgba(11,36,71,.28); color: #fff; text-decoration: none; }
.anits-main input[type=submit]:not(.btn):active, .anits-main input[type=button]:not(.btn):active { transform: translateY(0); }
.anits-main input[type=reset]:not(.btn) { background: #fff; color: var(--navy-700); border-color: #cbd5e6; box-shadow: none; }
.anits-main input[disabled], .anits-main select[disabled], .anits-main textarea[disabled] { background: #eef1f8; cursor: not-allowed; }

/* ---------- Dashboard / hero / tiles --------------------------------- */
.hero { position: relative; border-radius: var(--radius); overflow: hidden; color: #fff; background: radial-gradient(900px 300px at 90% 0%, rgba(232,200,104,.22), transparent 60%), linear-gradient(120deg, var(--navy-900), var(--navy-700) 60%, var(--navy-600)); box-shadow: var(--shadow-md); margin-bottom: 1.5rem; }
.hero .row { align-items: center; }
.hero .hero-copy { padding: clamp(1.2rem, 3vw, 2.4rem); }
.hero .eyebrow { font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; color: var(--gold-300); font-weight: 700; }
.hero h1, .hero h2 { color: #fff; font-size: clamp(1.4rem, 3.6vw, 2.3rem); margin: .35rem 0 .6rem; padding: 0; }
.hero h1::after, .hero h2::after { display: none; }
.hero p { color: #d3def2; max-width: 56ch; }
.hero .hero-art { padding: 1rem; text-align: center; }
.hero .hero-art img { max-height: 260px; filter: drop-shadow(0 10px 24px rgba(0,0,0,.35)); }
.hero .hod { display: flex; align-items: center; gap: .8rem; margin-top: 1rem; padding: .6rem .9rem; border-radius: 12px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); width: fit-content; max-width: 100%; }
.hero .hod img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; box-shadow: 0 0 0 2px var(--gold-400); }
.hero .hod b { display: block; color: #fff; }
.hero .hod span { font-size: .8rem; color: #c3d1ec; }

.tile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; margin: 1rem 0 1.5rem; }
.tile { display: flex; gap: .9rem; align-items: center; padding: 1.05rem 1.1rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); box-shadow: var(--shadow-sm); position: relative; overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s; }
.tile::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(var(--gold-400), var(--gold-500)); }
.tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--gold-400); text-decoration: none; color: var(--ink); }
.tile .ico { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; font-size: 1.4rem; color: #fff; background: linear-gradient(135deg, var(--navy-600), var(--navy-800)); box-shadow: 0 6px 14px rgba(20,48,95,.28); }
.tile.alt .ico { background: linear-gradient(135deg, var(--maroon), #a62b4d); box-shadow: 0 6px 14px rgba(123,30,58,.28); }
.tile.gold .ico { background: linear-gradient(135deg, var(--gold-500), #a98414); box-shadow: 0 6px 14px rgba(169,132,20,.3); }
.tile .t { font-weight: 700; color: var(--navy-800); line-height: 1.2; }
.tile .d { font-size: .78rem; color: var(--muted); margin-top: .15rem; }
.tile .go { margin-left: auto; color: var(--gold-500); font-size: 1.1rem; transition: transform .18s; }
.tile:hover .go { transform: translateX(4px); }
.section-title { display: flex; align-items: center; gap: .6rem; font-family: 'Playfair Display', serif; color: var(--navy-800); font-size: 1.25rem; margin: 1.2rem 0 .2rem; }
.section-title::before { content: ""; width: 6px; height: 1.3em; border-radius: 3px; background: linear-gradient(var(--gold-400), var(--gold-500)); }

/* feedback side menu (menu_fb.php) */
.fb-panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.1rem; margin: 1rem auto; max-width: 560px; text-align: left; }
.fb-panel h5 { font-size: 1.05rem; margin-bottom: .6rem; }
.fb-panel .list-group-item { display: flex; align-items: center; gap: .6rem; border-color: var(--line); font-weight: 600; }
.fb-panel .list-group-item i { color: var(--gold-500); }
.fb-panel .list-group-item:hover { background: var(--navy-50); text-decoration: none; }
.fb-panel .sub { margin: .1rem 0 .4rem 1.4rem; padding-left: .6rem; border-left: 2px solid var(--gold-300); }

/* ---------- Footer --------------------------------------------------- */
.anits-footer { margin-top: auto; background: linear-gradient(120deg, var(--navy-900), var(--navy-800)); color: #b9c6e0; position: relative; text-align: left; flex-shrink: 0; width: 100%; }
.anits-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--gold-500), var(--gold-300), var(--gold-500)); }
.anits-footer .inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1.2rem; padding-bottom: 1.2rem; }
.anits-footer .brand { display: flex; align-items: center; gap: .8rem; }
.anits-footer .brand .anits-logo { width: 44px; height: 44px; box-shadow: 0 0 0 2px var(--gold-400); }
.anits-footer .brand b { color: #fff; font-family: 'Playfair Display', serif; display: block; }
.anits-footer .brand span { font-size: .75rem; }
.anits-footer .credit { text-align: right; font-size: .78rem; line-height: 1.5; }
.anits-footer .credit b { color: var(--gold-300); font-size: .9rem; }
.anits-footer .copy { border-top: 1px solid rgba(255,255,255,.1); text-align: center; font-size: .7rem; padding: .55rem 0; color: #8fa0c4; }
@media (max-width: 575.98px) { .anits-footer .inner, .anits-footer .credit { text-align: center; justify-content: center; } }

/* back to top */
.to-top { position: fixed; right: 1rem; bottom: 1rem; width: 44px; height: 44px; border-radius: 50%; display: none; place-items: center; background: var(--navy-700); color: #fff; border: 2px solid var(--gold-400); box-shadow: var(--shadow-md); z-index: 1040; cursor: pointer; font-size: 1.2rem; }
.to-top.show { display: grid; }
.to-top:hover { background: var(--maroon); }

/* ---------- Login page ------------------------------------------------ */
body.login-body { background: var(--navy-900); display: block; min-height: 100vh; }
.login-wrap { min-height: 100vh; display: grid; grid-template-columns: 1.1fr .9fr; }
.login-art {
  position: relative; color: #fff; padding: clamp(1.5rem, 4vw, 3.5rem); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;
  background: radial-gradient(800px 500px at 20% 10%, rgba(43,90,168,.55), transparent 60%), radial-gradient(700px 500px at 100% 100%, rgba(201,162,39,.25), transparent 55%), linear-gradient(140deg, var(--navy-900), var(--navy-800) 55%, var(--navy-700));
}
.login-art::before { content: ""; position: absolute; inset: 0; background-image: url("../img/pattern.svg"); filter: invert(1); opacity: .35; pointer-events: none; }
.login-art > * { position: relative; }
.login-art .brandline { display: flex; align-items: center; gap: .9rem; }
.login-art .brandline .anits-logo { width: 62px; height: 62px; }
.login-art .brandline b { font-family: 'Playfair Display', serif; font-size: 1.15rem; line-height: 1.15; display: block; }
.login-art .brandline span { font-size: .72rem; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gold-300); }
.login-art .art { text-align: center; margin: 1rem 0; }
.login-art .art img { width: min(100%, 520px); filter: drop-shadow(0 20px 40px rgba(0,0,0,.4)); animation: floaty 7s ease-in-out infinite; }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.login-art h2 { color: #fff; font-size: clamp(1.4rem, 3vw, 2.2rem); margin: 0 0 .5rem; }
.login-art p { color: #cbd7ee; max-width: 52ch; margin: 0; }
.login-art .stats { display: flex; gap: 1.6rem; margin-top: 1.2rem; flex-wrap: wrap; }
.login-art .stats div b { display: block; font-family: 'Playfair Display', serif; font-size: 1.5rem; color: var(--gold-300); }
.login-art .stats div span { font-size: .72rem; text-transform: uppercase; letter-spacing: 1px; color: #aebbd8; }
.login-panel { background: var(--page-bg) url("../img/pattern.svg"); display: grid; place-items: center; padding: 1.5rem; }
.login-card2 { width: 100%; max-width: 420px; background: #fff; border-radius: 20px; padding: clamp(1.4rem, 4vw, 2.2rem); box-shadow: var(--shadow-lg); border: 1px solid var(--line); position: relative; }
.login-card2::before { content: ""; position: absolute; left: 24px; right: 24px; top: 0; height: 4px; border-radius: 0 0 6px 6px; background: linear-gradient(90deg, var(--gold-500), var(--gold-300)); }
.login-card2 .lock { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 1.6rem; color: #fff; background: linear-gradient(135deg, var(--navy-600), var(--navy-800)); margin-bottom: .9rem; box-shadow: 0 8px 18px rgba(20,48,95,.3); }
.login-card2 h1 { font-size: 1.55rem; margin: 0 0 .15rem; }
.login-card2 .sub { color: var(--muted); font-size: .85rem; margin-bottom: 1.2rem; }
.login-card2 .form-floating > .form-control { border-radius: 12px; border: 1px solid #cbd5e6; height: calc(3.4rem + 2px); }
.login-card2 .form-floating > label { color: var(--muted); font-weight: 500; }
.login-card2 .form-control:focus { border-color: var(--navy-500); box-shadow: 0 0 0 .22rem rgba(43,90,168,.18); }
.login-card2 .pw-wrap { position: relative; }
.login-card2 .pw-toggle { position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); border: 0; background: transparent; color: var(--muted); font-size: 1.1rem; padding: .3rem .5rem; z-index: 5; }
.login-card2 .btn-signin { width: 100%; border: 0; border-radius: 12px; padding: .85rem; font-weight: 700; letter-spacing: .4px; color: #fff; background: linear-gradient(135deg, var(--navy-600), var(--navy-800)); box-shadow: 0 10px 22px rgba(20,48,95,.35); transition: transform .12s, box-shadow .15s, filter .15s; }
.login-card2 .btn-signin:hover { transform: translateY(-1px); filter: brightness(1.1); box-shadow: 0 14px 28px rgba(20,48,95,.4); }
.login-card2 .alert-msg { background: #fdecef; color: #8a1f3a; border: 1px solid #f5c2cc; border-radius: 12px; padding: .6rem .85rem; font-size: .84rem; display: flex; gap: .5rem; align-items: flex-start; margin-bottom: 1rem; }
.login-card2 .credit { text-align: center; margin-top: 1.2rem; font-size: .76rem; color: var(--muted); }
.login-card2 .credit strong { color: var(--navy-700); }
@media (max-width: 991.98px) {
  .login-wrap { grid-template-columns: 1fr; }
  .login-art { padding: 1.4rem 1.2rem 1.6rem; }
  .login-art .art { display: none; }
  .login-art .stats { display: none; }
  .login-art h2 { font-size: 1.3rem; }
  .login-panel { margin-top: -1.4rem; border-radius: 22px 22px 0 0; position: relative; padding-top: 1.6rem; }
}

/* ---------- Mobile stacking of legacy layout tables ------------------ */
@media (max-width: 767.98px) {
  body.anits-body { font-size: .9rem; }
  table.lg-layout, table.lg-layout > tbody, table.lg-layout > tbody > tr, table.lg-layout > tbody > tr > td,
  table.lg-layout > tr, table.lg-layout > tr > td { display: block; width: 100% !important; }
  table.lg-layout > tbody > tr > td { padding: .2rem 0; }
  td.lg-empty { display: none !important; }
  table.lg-form { width: 100% !important; }
  table.lg-form, table.lg-form > tbody, table.lg-form > tbody > tr, table.lg-form > tbody > tr > td { display: block; width: 100% !important; }
  table.lg-form td { padding: .4rem .8rem; }
  table.lg-form input[type=text], table.lg-form input[type=password], table.lg-form input[type=number], table.lg-form input[type=date],
  table.lg-form select, table.lg-form textarea, table.lg-form input[type=file] { width: 100% !important; }
  .anits-main input[type=submit], .anits-main input[type=button] { min-height: 44px; }
  .anits-main input, .anits-main select { font-size: 16px; } /* stop iOS zoom */
  .tile-grid { grid-template-columns: 1fr; }
  .hero .hero-art { display: none; }
}
.lg-scroll-hint { display: none; font-size: .72rem; color: var(--muted); text-align: right; margin: -.3rem .2rem .4rem; }
@media (max-width: 767.98px) { .lg-scroll-hint { display: block; } .lg-scroll-hint i { color: var(--gold-500); } }

/* ---------- Utilities ------------------------------------------------- */
.anits-alert { border-radius: 12px; border: 1px solid var(--line); padding: .7rem 1rem; background: var(--gold-100); color: #6b5410; }
.text-gold { color: var(--gold-500) !important; }
.bg-navy { background: var(--navy-700) !important; color: #fff; }

/* ---------- Print: strip chrome, keep reports clean ------------------- */
@media print {
  html, body.anits-body { background: #fff !important; font-size: 11pt; display: block; }
  body.anits-body { background-image: none !important; }
  .anits-masthead, .anits-footer, .to-top, .no-print, .lg-scroll-hint { display: none !important; }
  .anits-main { padding: 0 !important; }
  .anits-main .anits-sheet { box-shadow: none !important; border: 0 !important; padding: 0 !important; overflow: visible !important; }
  .anits-main .anits-sheet::before { display: none; }
  .lg-scroll { overflow: visible !important; border: 0; box-shadow: none; }
  table.lg-data { font-size: 9.5pt; }
  table.lg-data th, table.lg-data td { border: 1px solid #777 !important; padding: 3px 5px; }
  table.lg-data tr.lg-headrow > td, table.lg-data tr.lg-headrow > th { background: #e6e6e6 !important; color: #000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  table.lg-data tr.lg-headrow font, table.lg-data tr.lg-headrow b, table.lg-data tr.lg-headrow strong { color: #000 !important; }
  .anits-main h1::after, .anits-main h2::after, .anits-main h3::after { display: none; }
  a { color: #000; text-decoration: none; }
  tr, img { page-break-inside: avoid; }
}

/* ---------- Headings inside coloured Bootstrap surfaces --------------- */
.text-white :is(h1,h2,h3,h4,h5,h6), .bg-primary :is(h1,h2,h3,h4,h5,h6), .bg-dark :is(h1,h2,h3,h4,h5,h6), .bg-navy :is(h1,h2,h3,h4,h5,h6),
.bg-success :is(h1,h2,h3,h4,h5,h6), .bg-danger :is(h1,h2,h3,h4,h5,h6), .bg-secondary :is(h1,h2,h3,h4,h5,h6), .bg-info :is(h1,h2,h3,h4,h5,h6),
.card-header :is(h1,h2,h3,h4,h5,h6), .modal-header :is(h1,h2,h3,h4,h5,h6), .alert :is(h1,h2,h3,h4,h5,h6), .table-dark :is(h1,h2,h3,h4,h5,h6) { color: inherit; }
.card-header.bg-primary, .btn-primary, .bg-primary { --bs-primary-rgb: 20,48,95; }
.card-header.bg-primary, .bg-primary { background-color: var(--navy-700) !important; }
.btn-primary { --bs-btn-bg: var(--navy-700); --bs-btn-border-color: var(--navy-800); --bs-btn-hover-bg: var(--navy-600); --bs-btn-hover-border-color: var(--navy-700); --bs-btn-active-bg: var(--navy-800); }
.card { border-color: var(--line); border-radius: 12px; }
.card-header:first-child { border-radius: 11px 11px 0 0; }

/* ---------- Slim bar for pages that have no role menu ----------------- */
.anits-slimbar { position: sticky; top: 0; z-index: 1030; background: linear-gradient(115deg, var(--navy-800), var(--navy-700)); color: #fff; border-bottom: 3px solid var(--gold-500); box-shadow: 0 3px 12px rgba(8,26,58,.25); }
.anits-slimbar .row2 { display: flex; align-items: center; gap: .6rem; padding-top: .45rem; padding-bottom: .45rem; }
.anits-slimbar .brand { display: flex; align-items: center; gap: .55rem; color: #fff; font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-size: .95rem; min-width: 0; }
.anits-slimbar .brand:hover { color: #fff; text-decoration: none; }
.anits-slimbar .brand .anits-logo { width: 34px; height: 34px; box-shadow: 0 0 0 2px var(--gold-400); }
.anits-slimbar .brand span.t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.anits-slimbar .actions { margin-left: auto; display: flex; gap: .4rem; }
.anits-slimbar .actions a, .anits-slimbar .actions button { display: inline-flex; align-items: center; gap: .35rem; color: #fff; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); border-radius: 8px; padding: .28rem .7rem; font-size: .8rem; font-weight: 600; cursor: pointer; box-shadow: none; transform: none; }
.anits-slimbar .actions a:hover, .anits-slimbar .actions button:hover { background: var(--gold-500); border-color: var(--gold-500); color: var(--navy-900); text-decoration: none; filter: none; transform: none; box-shadow: none; }
@media (max-width: 575.98px) { .anits-slimbar .brand span.t { display: none; } }

/* ---------- Legacy spacer columns & title bars ------------------------ */
table.lg-layout td.lg-empty, table.lg-plain td.lg-empty { width: 1px !important; max-width: 1px; min-width: 0; padding: 0 !important; }
td[bgcolor="#CDDEF8" i], td[bgcolor="#cddef8" i], th[bgcolor="#CDDEF8" i] {
  background: linear-gradient(90deg, var(--navy-100), #fff) !important; color: var(--navy-800); font-weight: 700; letter-spacing: .3px;
  border-left: 4px solid var(--gold-500) !important; padding: .55rem .9rem !important; text-align: center;
}