html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Navbar Enhancements */
.app-navbar {
  background: linear-gradient(90deg,#0d47a1,#1976d2,#2196f3);
  --bs-navbar-color: rgba(255,255,255,.75);
  --bs-navbar-hover-color: #fff;
  --bs-navbar-brand-color:#fff;
  --bs-navbar-brand-hover-color:#fff;
  font-size: .9375rem;
}
.app-navbar .navbar-brand .logo-icon {font-size:1.25rem;line-height:1;}
.navbar-logo { display:inline-block; vertical-align:middle; height:auto; max-height:36px; }
.navbar-brand .navbar-logo { object-fit:contain; }
.app-navbar .nav-link {position:relative;display:flex;align-items:center;gap:.55rem;padding:.50rem .95rem;border-radius:30px;color:var(--bs-navbar-color);transition:.2s background,.2s color;}
.app-navbar .nav-link i {font-size:1.05rem;line-height:1;}
.app-navbar .nav-link-pill:hover {background:rgba(255,255,255,.15);color:#fff;}
.app-navbar .nav-link-pill.active {background:#fff;color:#0d47a1;font-weight:600;box-shadow:0 2px 4px rgba(0,0,0,.15);} 

/* Center text & icon perfectly inside pill links */
.app-navbar .nav-link-pill {display:inline-flex;align-items:center;justify-content:center;line-height:1;font-weight:500;}
.app-navbar .nav-link-pill span {display:inline-flex;align-items:center;line-height:1;font-size:.94rem;position:relative;top:1px;}
.app-navbar .nav-link-pill i {display:inline-flex;align-items:center;justify-content:center;line-height:1;}
/* Equal visual height + subtle letter spacing */
.app-navbar .nav-link-pill {min-height:40px;letter-spacing:.2px;}
@media (min-width:992px){.app-navbar .nav-link-pill {padding:.55rem 1.05rem;}}

/* Dropdown */
.app-navbar .dropdown-menu {border-radius:.6rem;font-size:.875rem;animation:fadeSlide .18s ease;}
.app-navbar .dropdown-menu-dark {background:#10375c;color:#fff;}
.app-navbar .dropdown-menu-dark .dropdown-item {color:#e0e7ef;}
.app-navbar .dropdown-menu-dark .dropdown-item:hover {background:rgba(255,255,255,.08);color:#fff;}
.app-navbar .dropdown-header {font-weight:600;letter-spacing:.5px;color:#b3e5fc !important;opacity:1;}
/* Alternative stronger contrast on very dark screens */
@media (prefers-contrast: more) {
  .app-navbar .dropdown-header {color:#e1f5fe !important;}
}

@keyframes fadeSlide {from {opacity:0;transform:translateY(4px);} to {opacity:1;transform:translateY(0);} }

/* User avatar */
.user-avatar {width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:600;}
.bg-gradient-primary {background:linear-gradient(135deg,#1565c0,#42a5f5);}

/* Dark outline button tweak */
.btn-outline-light {--bs-btn-color:#fff;--bs-btn-border-color:rgba(255,255,255,.6);--bs-btn-hover-bg:#fff;--bs-btn-hover-color:#0d47a1;--bs-btn-hover-border-color:#fff;}

/* Improve focus visibility */
.app-navbar .nav-link:focus-visible {outline:2px solid #fff;outline-offset:2px;}

/* Compact adjustments on small screens */
@media (max-width: 991.98px) {
  .app-navbar .nav-link {padding:.65rem .9rem;}
  .user-nav .btn {margin-top:.5rem;}
  .navbar-logo { max-height:30px; }
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Page header component */
.page-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.75rem;
  margin-bottom:1rem;
}
.page-header__title {
  display:inline-block;
  margin:0;
  font-weight:700;
  margin-right:0.8rem;
  font-size:1.625rem;
}
.page-header__subtitle {
  color:var(--bs-secondary-color, #6c757d);
  font-weight:400;
  vertical-align:middle;
}
/* Focus highlight for preserved day navigation */
.focus-highlight {
    box-shadow: 0 0 0 3px rgba(13,110,253,0.12);
    transition: box-shadow 0.3s ease-in-out;
}

/* Ensure absence modal buttons are properly sized */
.modal .absence-form .btn,
.modal .absence-edit-form .btn {
    min-width: 100px !important;
    padding: 0.5rem 1rem !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
}

/* Override any small button styling in modals */
.modal .btn-sm {
    min-width: 100px !important;
    padding: 0.5rem 1rem !important;
    font-size: 1rem !important;
}

/* Consistent modal styling */
.modal-header.bg-info {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.modal-header.bg-primary {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* Consistent form styling in modals */
.modal .absence-form,
.modal .absence-edit-form {
    padding: 1rem;
}

.modal .absence-form .form-label,
.modal .absence-edit-form .form-label {
    font-weight: 600;
    color: var(--bs-secondary-color);
}

/* Make modal body content more spacious */
.modal .absence-form .row,
.modal .absence-edit-form .row {
    margin: 0;
}

.modal .absence-form .col-12,
.modal .absence-edit-form .col-12 {
    padding: 0.5rem 0;
}