:root {
  /* Use safe area insets with 0px fallback */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

body {
  /* Use safe area side insets */
  padding-left: var(--safe-left);
  padding-right: var(--safe-right);
}


/* Specific fix for sidebar menu items left margin */
.s-sidebar-menu > li > a {
    padding-left: 10px !important;
}

.s-site-logo-img {
  content: url(images/logo.png);
}


.s-TranslationGrid input.custom-text {
  width: 100%;
  height: 23px;
  padding: 0 3px;
}

.s-PermissionCheckEditor {
  min-height: 450px;
}

.s-form-title-logo {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Update .uppercase to be specific to the application form */
.s-Admissions-ApplicationsDialog .uppercase {
  text-transform: uppercase !important;
}

/* Remove project-wide uppercase logic (labels, headers, etc.) */
/* Except for the Admissions Applications dialog */
:not(.s-Admissions-ApplicationsDialog) .label,
:not(.s-Admissions-ApplicationsDialog) .slick-header-column,
:not(.s-Admissions-ApplicationsDialog) .uppercase {
  text-transform: none !important;
}

.bottom-right-toolbar {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin-top: 15px !important;
  border-top: 2px solid #eee !important;
  padding: 15px 0 5px 0 !important;
}

@media (max-width: 768px) {
  .s-sidebar-header, .navbar, .s-main-header, .s-sidebar-header-branding {
    padding-top: var(--safe-top);
    padding-left: calc(15px + var(--safe-left));
    padding-right: calc(15px + var(--safe-right));
    height: auto;
    min-height: 50px;
  }

  .s-main, .s-sidebar {
    /* Ensure a base gutter of 15px plus the safe area inset */
    padding-left: calc(15px + var(--safe-left));
    padding-right: calc(15px + var(--safe-right));
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .s-sidebar {
    position: fixed !important;
    top: calc(50px + var(--safe-top)) !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 250px !important;
    z-index: 1050 !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s ease !important;
    display: block !important;
    background: #fff !important;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1) !important;
  }

  body.s-sidebar-open .s-sidebar {
    transform: translateX(0) !important;
  }

  .s-main {
    margin-left: 0 !important;
    width: 100% !important;
  }

  .s-sidebar-header-branding {
    display: none !important;
  }

  .page-content,
  .content {
    padding: 10px !important;
  }

  .grid-container {
    overflow-x: auto !important;
  }

  table.grid,
  .slick-viewport {
    min-width: 100% !important;
  }

  #s-sidebar-toggler {
    display: block !important;
    cursor: pointer !important;
    z-index: 1100 !important;
  }
}