:root {
  --iet-primary: #1e3a8a;
  --iet-primary-dark: #14285e;
  --iet-accent: #f59e0b;
}

body {
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  background-color: #f7f8fb;
}

/* Full-screen responsive application shell */
.container {
  width: 100%;
  max-width: none;
  padding-left: clamp(1rem, 2.25vw, 2.75rem);
  padding-right: clamp(1rem, 2.25vw, 2.75rem);
}

#cardGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}

#cardGrid > [class*="col-"] {
  width: auto;
  max-width: none;
}

/* Navbar */
.iconnect-navbar {
  background: linear-gradient(90deg, var(--iet-primary-dark), var(--iet-primary));
}
.iconnect-navbar .container {
  gap: 1rem;
}
.iconnect-navbar .navbar-brand {
  font-weight: 700;
  white-space: normal;
  min-width: 0;
  max-width: calc(100% - 160px);
}
.navbar-logo {
  width: 58px;
  height: 58px;
  object-fit: cover;
  border-radius: 50%;
  background: #fff;
  padding: 0;
  flex: 0 0 auto;
}
.navbar-brand-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  min-width: 0;
}
.brand-name {
  font-size: 1.25rem;
}
.navbar-welcome {
  font-size: 1.45rem;
  font-weight: 800;
  color: #fff;
}
.navbar-subtitle {
  margin-top: 0.15rem;
  font-size: 0.95rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.9);
}
.brand-accent {
  color: var(--iet-accent);
}

/* Section title */
.section-title {
  font-weight: 700;
  color: var(--iet-primary-dark);
  border-left: 5px solid var(--iet-accent);
  padding-left: 0.75rem;
}

/* Public notices */
.public-notices { background: linear-gradient(180deg, #f8fafc, #edf3f8); border-bottom: 1px solid #dbe4ee; font-family:'Source Serif 4',Georgia,'Times New Roman',serif; }
.notices-heading { display:flex; align-items:end; justify-content:space-between; gap:1.5rem; margin-bottom:1.25rem; }
.notices-kicker { color:#0f766e; font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:.75rem; }
.notice-filters { display:flex; gap:.75rem; }
.notice-filters label { color:#44546a; font-size:.75rem; font-weight:700; text-transform:uppercase; }
.notice-filters select { min-width:130px; margin-top:.25rem; }
.notice-loading { padding:3rem; text-align:center; color:#65708d; }
.notice-layout { display:grid; grid-template-columns:minmax(270px,360px) minmax(0,1fr); gap:18px; align-items:start; }
.notice-sidebar { display:grid; gap:.8rem; }
.notice-board { overflow:hidden; border:1px solid #dbe4ee; border-radius:14px; background:#fff; box-shadow:0 5px 18px rgba(16,42,67,.08); }
.notice-board-header { display:flex; align-items:center; gap:.75rem; padding:1rem 1.1rem; color:#fff; background:linear-gradient(135deg,#12324a,#0f766e); }
.notice-board-header h2 { margin:0; font:700 1rem 'Libre Baskerville',Georgia,serif; }
.notice-board-header p { margin:.15rem 0 0; color:#bae6fd; font-size:.75rem; }
.notice-board-icon { display:grid; place-items:center; width:38px; height:38px; flex:none; border-radius:9px; background:rgba(255,255,255,.12); }
.notice-board-header .notice-count { margin-left:auto; }
.notice-home-button { margin-left:auto; padding:.42rem .7rem; border:1px solid rgba(255,255,255,.65); border-radius:8px; background:rgba(255,255,255,.1); color:#fff; font-size:.75rem; font-weight:700; white-space:nowrap; }
.notice-home-button:hover { background:#fff; color:#0f766e; }
.notice-home-button + .notice-count { margin-left:0; }
.notice-count { display:inline-grid; place-items:center; min-width:24px; height:24px; padding:0 .4rem; border-radius:999px; background:#e0f2fe; color:#164e63; font-size:.72rem; font-weight:800; }
.notice-section-list { display:grid; }
.notice-section-list button { display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.7rem .9rem; border:0; border-bottom:1px solid #edf2f7; background:#fff; color:#243b53; text-align:left; }
.notice-section-list button:hover { background:#f0fdfa; color:#0f766e; }
.compact-board summary { display:flex; justify-content:space-between; padding:.9rem 1rem; cursor:pointer; font-weight:700; color:#183b56; list-style:none; }
.notice-empty-small { margin:0; padding:1rem; color:#74849a; font-size:.85rem; }
.main-notice-board { min-height:370px; }
.notice-list { min-height:275px; }
.public-notice-item { display:grid; grid-template-columns:36px 1fr; gap:.75rem; padding:.85rem 1rem; border-bottom:1px solid #edf2f7; }
.public-notice-item:hover { background:#f8fbff; }
.public-notice-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:8px; background:#eaf1f6; }
.public-notice-item a { color:#102a43; font-weight:700; text-decoration:none; }
.public-notice-item a:hover { color:#0f766e; text-decoration:underline; }
.latest-badge { display:inline-block; margin-left:.45rem; padding:.1rem .42rem; border-radius:999px; background:#dc2626; color:#fff; box-shadow:0 0 0 rgba(220,38,38,.65); font-size:.62rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; vertical-align:middle; animation:latestNoticeBlink 1s ease-in-out infinite; }
@keyframes latestNoticeBlink { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(220,38,38,.65)} 50%{opacity:.35;box-shadow:0 0 0 5px rgba(220,38,38,0)} }
@media (prefers-reduced-motion: reduce) { .latest-badge { animation:none; } }
.public-notice-meta { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin-top:.3rem; color:#74849a; font-size:.7rem; }
.notice-tag { padding:.08rem .4rem; border-radius:999px; background:#e0f2fe; color:#075985; font-weight:700; }
.notice-tag.semester { background:#fef3c7; color:#92400e; }
.notice-empty { display:grid; place-items:center; align-content:center; min-height:275px; color:#74849a; }
.notice-empty span { font-size:2rem; }
.notice-board-footer { padding:.55rem; text-align:center; background:#f6f8fb; color:#74849a; font-size:.7rem; font-weight:700; text-transform:uppercase; }
.shortcut-buttons { display:flex; flex-direction:column; gap:9px; padding-top:2px; }
.public-notices .btn-timetable { display:inline-flex; align-items:center; justify-content:center; gap:5px; width:100%; margin-left:0; padding:10px 18px; border:0; border-radius:14px; background:linear-gradient(135deg,#0f766e,#2563eb); color:#fff; box-shadow:0 5px 16px rgba(37,99,235,.18); font-family:'Source Serif 4',Georgia,'Times New Roman',serif; font-size:13px; font-weight:600; line-height:1; text-decoration:none; white-space:nowrap; cursor:pointer; transition:.2s ease; animation:timetableFlash 1.2s ease-in-out infinite; }
.public-notices .btn-timetable:hover { color:#fff; transform:translateY(-1px); box-shadow:0 8px 22px rgba(37,99,235,.24); }
.public-notices .btn-tenders { background:linear-gradient(135deg,#fb7185,#ef4444); box-shadow:0 5px 16px rgba(239,68,68,.20); }
.public-notices .btn-tenders:hover { box-shadow:0 8px 22px rgba(239,68,68,.30); }
@keyframes timetableFlash { 0%,100%{filter:brightness(1);box-shadow:0 5px 16px rgba(37,99,235,.18)} 50%{filter:brightness(1.35);box-shadow:0 8px 24px rgba(37,99,235,.35)} }
@media (prefers-reduced-motion: reduce) { .public-notices .btn-timetable { animation:none; } }

/* Dashboard cards */
.module-card {
  border: none;
  border-radius: 14px;
  overflow: hidden;
  height: 100%;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  text-decoration: none;
  color: inherit;
  display: block;
}
.module-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
  color: inherit;
}
.module-card .card-icon {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 1rem;
}
.module-card .card-title {
  font-weight: 700;
  color: #1f2937;
}
.module-card .card-text {
  color: #6b7280;
  font-size: 0.9rem;
}
.module-card .card-cta {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--iet-primary);
}

/* Login role selector */
.login-modal-content {
  border: 0;
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(20, 40, 94, 0.22);
  overflow: hidden;
  font-family: Georgia, "Times New Roman", serif;
}
.login-copy-header { position:relative; padding:28px 30px 22px; background:linear-gradient(135deg,#12324d 0%,#167f72 100%); color:#fff; }
.login-copy-header .modal-title { color:#fff; font-size:24px; font-weight:700; line-height:1.2; }
.login-copy-header .btn-close { position:absolute; top:18px; right:18px; filter:invert(1) grayscale(1); }
.php-login-icon { position:relative; display:grid; place-items:center; width:56px; height:56px; margin:0 auto 14px; border-radius:50%; background:#51c8cf; }
.php-login-icon::before { content:""; width:18px; height:15px; border-radius:3px; background:#f3a33b; box-shadow:inset 0 -5px 0 rgba(255,255,255,.18); }
.php-login-icon::after { content:""; position:absolute; width:15px; height:13px; margin-top:-14px; border:3px solid #46607d; border-bottom:0; border-radius:10px 10px 0 0; }
.login-welcome-strip { margin:0; padding:10px 18px; background:#dff0fb; color:#004c76; font-size:14px; font-weight:700; text-align:center; }
.login-copy-body { padding:28px 34px 30px; }
.login-portal-prompt { margin:0 0 18px; color:#243b5b; font-size:14px; font-weight:700; text-align:center; }
.copied-login-field { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; }
.copied-login-field label { color:#243b5b; font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.copied-login-field input { width:100%; min-height:42px; border:1px solid #158985; border-radius:12px; color:#1b2f49; font:15px Georgia,"Times New Roman",serif; padding:10px 14px; }
.copied-login-field input:focus { border-color:#0b7874; box-shadow:0 0 0 3px rgba(22,125,124,.16); outline:none; }
.copied-sign-in { width:100%; min-height:43px; margin-top:18px; border:0; border-radius:9px; background:linear-gradient(90deg,#167d7c 0%,#2e63d3 100%); color:#fff; cursor:pointer; font:700 16px Georgia,"Times New Roman",serif; padding:11px 16px; }
.copied-sign-in:hover { background:linear-gradient(90deg,#126f6f 0%,#2359c9 100%); }
.change-login-type { margin:0 0 14px; padding:0; border:0; background:transparent; color:#12324d; font:600 13px Georgia,"Times New Roman",serif; }
.change-login-type:hover { color:#167d7c; text-decoration:underline; }
.google-login-button { display:flex; align-items:center; justify-content:center; gap:.7rem; width:100%; min-height:44px; border:1px solid #cfddea; border-radius:9px; background:#fff; color:#243b5b; font:700 15px Georgia,"Times New Roman",serif; text-decoration:none; box-shadow:0 2px 7px rgba(27,47,73,.06); }
.google-login-button i { color:#2563eb; font-size:1.05rem; }
.google-login-button:hover { border-color:#158985; background:#f8fbff; color:#12324d; }
.google-login-help { margin:14px 0 0; color:#60748a; font-size:13px; text-align:center; }
.google-login-divider { display:flex; align-items:center; gap:.7rem; margin:18px 0; color:#7a879b; font-size:11px; text-transform:uppercase; }
.google-login-divider::before,.google-login-divider::after { content:""; height:1px; flex:1; background:#d8e3ee; }
.role-options {
  display: grid;
  gap: 0.75rem;
}
.role-option {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
  padding: 0.85rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  color: #1f2937;
  font-weight: 650;
  text-align: left;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}
.role-option > i:first-child {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #eef2ff;
  color: var(--iet-primary);
  font-size: 1.15rem;
}
.role-option > i:last-child {
  color: #94a3b8;
}
.role-option:hover,
.role-option:focus-visible {
  border-color: var(--iet-primary);
  background: #f8faff;
  transform: translateY(-2px);
  outline: none;
}
.settings-button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid #dbe2ea;
  border-radius: 50%;
  background: #fff;
  color: var(--iet-primary);
  box-shadow: 0 2px 8px rgba(20, 40, 94, 0.08);
}
.settings-button:hover,
.settings-button:focus {
  border-color: var(--iet-primary);
  background: #eef2ff;
  color: var(--iet-primary-dark);
}
#profileModal .form-label {
  font-weight: 600;
  color: #374151;
}

/* Skeleton */
.skeleton-card .card {
  border-radius: 14px;
  border: none;
}

/* Footer */
.iconnect-footer {
  background-color: var(--iet-primary-dark);
  color: #cbd5e1;
}

@media (max-width: 991.98px) {
  .notice-layout { grid-template-columns:1fr; }
  .iconnect-navbar .navbar-brand {
    max-width: calc(100% - 70px);
  }
  .navbar-logo {
    width: 50px;
    height: 50px;
  }
  .brand-name {
    font-size: 1.05rem;
  }
  .navbar-welcome {
    font-size: 1.1rem;
  }
  .navbar-subtitle {
    font-size: 0.8rem;
  }
}

@media (max-width: 575.98px) {
  .container {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }
  .notices-heading { align-items:stretch; flex-direction:column; }
  .notice-filters { width:100%; }
  .notice-filters label { flex:1; }
  .notice-filters select { min-width:0; }
  .iconnect-navbar .navbar-brand {
    gap: 0.5rem !important;
  }
  .navbar-logo {
    width: 43px;
    height: 43px;
  }
  .navbar-welcome {
    font-size: 0.95rem;
  }
  .navbar-subtitle {
    display: none;
  }
}