:root {
  /* ===== App brand (authenticated app: sidebar, buttons, top-nav) ===== */
  --theme: #2E7D22;
  --theme-active: #1E5416;

  /* ===================================================================
     LOGIN THEME  —  re-skin the login form for a new school here.
     Every colour on the login page (card + modals) reads from these
     tokens, so changing this block (and the logo at assets/img/logo.png)
     re-themes the whole login. The *-rgb triplets feed rgba() glows and
     rings — keep each one in sync with its matching hex above it.
     To match a whole new brand, also set --theme / --theme-active above.
     =================================================================== */

  /* Surigao Doctors College — green primary / blue accent (professional) */
  --theme-primary:        #2E7D22;   /* deep green — buttons */
  --theme-primary-hover:  #266B1D;
  --theme-primary-active: #1E5416;
  --theme-accent:         #0731A1;   /* their royal blue — links, focus, logo ring */
  --theme-accent-2:       #72C918;   /* brand lime — accent bar tail + glow only */
  --theme-ink:            #0C2A5E;   /* deep navy — headings, input text, modal titles */
  --theme-on-primary:     #FFFFFF;
  --theme-label:          #33425A;
  --theme-text:           #435068;
  --theme-muted:          #6A788D;
  --theme-subtle:         #4E77B4;   /* brand-blue subtitle */
  --theme-placeholder:    #97A6BB;
  --theme-surface:        #FFFFFF;
  --theme-field:          #F8FBF9;
  --theme-border:         #D6DEE2;
  --theme-soft:           #EFF5EC;   /* pale green reminder box */
  --theme-soft-border:    #DDE9D6;
  --theme-page-1:         #F0F6EE;
  --theme-page-2:         #EEF3F2;
  --theme-page-3:         #E8F0F4;
  --theme-primary-rgb:    46, 125, 34;
  --theme-accent-rgb:     7, 49, 161;
  --theme-accent-2-rgb:   114, 201, 24;
}

#preloader {
  background: var(--theme);
}
#img_viewer {
	display: none; justify-content: center; align-items: center; padding: 20px!important; position: fixed; top: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.8); z-index: 1000;
}
#img_viewer_close {
	position: absolute; 
	right: 20px; 
	top: 15px; 
	z-index: 1002; 
	cursor: pointer;
}
#img_viewer_close i {
	color: #9c9c9c; 
	font-size: 45px;
	font-weight: 100;
}
#img_viewer_close i:hover {
	color: #dbdbdb; 
}
#img_details {
	display: flex; justify-content: center; align-items: center; width: 100%; flex-direction: column;
}
#img_details img {
	width: auto; max-width: 100%; max-height: 505px;
}
#img_details #img_label {
	display: flex; justify-content: center; align-items: center; width: 100%;
}
#img_label #dLabel {
	padding-right: 10px; padding-left: 10px; padding-top: 40px; line-height: 24px; max-width: 950px; margin: 0 auto; text-align: center; color: #fff; font-size: 16px;
}
/* .left-panel .sidebar-menu li.active a, .left-panel .sidebar-menu li a:hover{
	color: #FFC107 !important;
} */


.modal .more-menu{
	height: 115px; 
	width: 130px; 
	border-radius: 10px; 
	font-size: 14px; 
	display: flex; 
	flex-direction: column; 
	justify-content: center; 
	align-items: center;
	color: #003300;
}
.modal .modal-title{
	color: var(--dark) !important;
}
.form-group-view {
    margin-top: 5px;
}
.form-group-view p {
    min-height: 20px;
}
.form-group-view p {
    border-bottom: solid #dfdfe1 1px;
    padding-bottom: 5px;
    margin-top: 5px;
}
.form-group-view label {
    color: #8a8a8a;
}
.copy-text{
	cursor: copy;
}
.swal-text{
	text-align: center;
}
.form-group i.pswd-toggle {
    position: absolute;
    top: 30px;
    right: 15px;
    color: #6c757d;
    font-size: 20px;
    cursor: pointer;
}
/* .swal-text{
	font-size: 15px;
} */

.blurred{
	filter: blur(15px) !important;
	-webkit-filter: blur(15px) !important;
}

.left-panel .sidebar-menu li a{
    color: #ffffff !important;
}
.left-panel .logo img{
    border-radius: 50%;
}
#preloader .content-loader img{
    border-radius: 50%;
}
.btn-theme {
    background: var(--theme) !important; 
    border-color: var(--theme) !important;
    color: #ffffff !important;
}
.btn-theme:hover {
    background: var(--theme-active) !important;
}
.swal-icon--custom img{
    width: 75px;
}
.white-space-nowrap{
    white-space: nowrap !important;
}


/* ========================== - Header - ========================== */
.main-layout main .navbar-top h4 {
  color: #212529!important;
}
.main-layout main .navbar-top button {
  color: var(--theme-active) !important;
}
.head-icon {
  margin-right: 10px;
  color: #212529!important;
}
@media (max-width: 1200px) {
  .head-icon {
    display: none;
  }
}
/* ========================== - Sidebar - ========================== */
.uk-offcanvas-bar {
  background: var(--theme) !important;
}
.nav-item a {
  color: #ffffffd9;
}
.sidebar-menu li:hover {
  box-shadow: none;
}
.sidebar-menu li.active a {
  background: var(--theme-active) !important;
  box-shadow: none!important;
}
.sidebar-menu li a:hover {
  background: var(--theme-active) !important;
  box-shadow: none!important;
}
.left-panel .sidebar-menu li a:before{
  background: #ffffff!important;
}
.left-panel .sidebar-menu li.active a:before{ /* Sidebar button left border */
  background: #ffffff!important;
}

.left-panel .logo { /* Image Container */
  padding: 10px 10px 10px!important;
}
.left-panel .logo img { /* Image */
  max-height: 45px!important;
  width: auto;
}