﻿/*css added for fonts*/
@font-face {
    font-family: 'open_sansbold';
    src: url('fonts/opensans-bold-webfont.woff2') format('woff2'),
         url('fonts/opensans-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansbold_italic';
    src: url('fonts/opensans-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/opensans-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansextrabold';
    src: url('fonts/opensans-extrabold-webfont.woff2') format('woff2'),
         url('fonts/opensans-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansextrabold_italic';
    src: url('fonts/opensans-extrabolditalic-webfont.woff2') format('woff2'),
         url('fonts/opensans-extrabolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansitalic';
    src: url('fonts/opensans-italic-webfont.woff2') format('woff2'),
         url('fonts/opensans-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sanslight';
    src: url('fonts/opensans-light-webfont.woff2') format('woff2'),
         url('fonts/opensans-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sanslight_italic';
    src: url('fonts/opensans-lightitalic-webfont.woff2') format('woff2'),
         url('fonts/opensans-lightitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'open sans';
    src: url('fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('fonts/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'open_sanssemibold';
    src: url('fonts/opensans-semibold-webfont.woff2') format('woff2'),
         url('fonts/opensans-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'open_sanssemibold_italic';
    src: url('fonts/opensans-semibolditalic-webfont.woff2') format('woff2'),
         url('fonts/opensans-semibolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
/*Css end for fonts*/
html{ scroll-behavior: smooth; height:100%; }
body{ background:#F5F5F5; font-family:"open sans", sans-serif; font-size:14px; font-weight:500; height:100%; }
.header{ position: fixed; z-index: 6; left: 0; right: 0; top: 0; transition: all 0.4s ease-in-out 0s; }
.logo{ width:100px; display:inline-block; }
.fa-text { font-family: var(--fa-font-family); }
.header-left{ padding:10px 15px; justify-content: space-between; align-items: center; width:230px; }
.header-left .navbar-toggler-icon img{ width:24px; }
.header-left .navbar-toggler{ background:transparent; border:0; }
.search-form input[type="text"].search-result{ background: #fff url(../images/icon-search.svg) no-repeat 2% center !important; z-index: 1; padding-left:40px; width:100% !important; }
.search-form input[type="text"] { border: 1px solid #E2E2E2; border-radius: 10px; height: 34px; width: 100%; padding: 0 15px; font-weight:400; -webkit-transition: all 0.4s ease-in-out 0s; }
.search-form input[type="text"]::placeholder { color:#8B8A8A; }
.content-boxes{ margin-left:10px; overflow:hidden; }
/*.search-form input[type="text"]:hover,
.search-form input[type="text"]:focus{ outline: none; box-shadow: 0 0 10px 0 rgba(1,41, 112, 0.15); border: 1px solid rgba(1, 41, 112, 0.3); }*/
.search-form input[type="text"]:focus{ border:1px solid transparent; box-shadow:none; }
.outer-area{ width: calc(100% - 245px); padding:8px 15px 0 25px; font-size: 13px; }
.search-bar{ width:650px; position: relative; z-index:6; }
.search-form input[type="text"]:focus{ width:calc(100% + 50px); }
.bottom-header{ width:100%; gap: 20px; align-items:center; }
.meetingCal{ height:377px; }
.iconNotification{ font-size:16px; color:#6C757D; }
.search-form{ width:100%; }
.header-nav ul{ padding:0; margin:0; list-style:none; transition: all 0.75s ease; }
.header-nav ul.dropdown-menu{ right:0; left:auto; }
ul.dropdown-menu{ min-width:210px; border:1px solid rgb(167 167 167 / 15%); box-shadow:none; }
ul.dropdownMenu{ gap:20px; }
.header-nav ul li a.nav-link{ padding:0; margin:0; }
.header-nav ul li .nav-profile{ gap:12px; padding:0; }
.header-nav ul li .nav-profile .uid{ display:block; text-align:right; color:#979595; }
.header-nav li.dropdownMenu .dropMessage{ right:-5px; left:auto; }
.header-nav li.dropdownMenu .dropMessage ul{ height:200px; width:350px; overflow:auto; border-radius:4px; }
.header-nav li.dropdownMenu .dropMessage ul li{ display: block; font-size:13px; color:#575555; padding:5px 10px; white-space:initial; border-bottom:1px solid rgba(221, 221, 221, 0.33); }
.header-nav li.dropdownMenu .dropMessage ul li a{ font-size: 13px; padding:0; display:inline; color:#ef0000; white-space:initial; }
.header-nav li.dropdownMenu .dropMessage ul li a:hover,
.header-nav li.dropdownMenu .dropMessage ul li a:focus{ background-color:transparent; }
.nav-profile img{ border-radius:10px; width:50px; }
.nav-profile .dropdown-toggle::after{ border:0; display:none; }
.u-name{ color:#414141; font-size:15px; font-weight:600; }
.nameSpace{ width:75px; }
.nameSpace .u-name{ justify-content:end; }
.topLinks{ gap:25px; padding:0; }
.topLinks a{ color:#575555; display: flex; align-items: center; font-size:12px; letter-spacing: .03rem; text-decoration:none; font-weight:500; }
.topLinks a img{ margin-right:6px; width:14px; }
.leftPanel{ font-size:12px; font-weight:600; color:#343A40; }
.weatherWidget{display:flex;gap:10px;height: 32px; background: #ffffff;border: 1px solid #A7A7A7; padding: 3px 8px;border-radius: 10px; color:#3A3A3A; min-width:200px; }
.current-conditions{ line-height: 1; font-size: 11px; }
.current-conditions .temp{ font-weight:600;; }
.owl-carousel .item,
.custom-cards-section .item{ display: flex; align-items: start; color:#464255; padding:15px 15px 10px; gap:20px; box-shadow:0 0 8px rgba(34, 48, 62, .20); }
.viewMore{ color:#7c7c7c; font-size:10px; letter-spacing:.03rem; }
.iconEditBtn{ font-size:24px; color:#d32f2f; }
.scrollBarModal{ background: #fff; border-radius: 10px; position: relative; }
.scrollBarModal .closebtn{ right:20px; top:20px; background-color: #d70404; border-radius: 50%; width: 25px; height: 25px; text-align: center; padding-top: 0; position: absolute; font-size: 12px; line-height: 26px; color: #fff; }
table.tablegrdRequiredDocuments th{ color:#222 !important; }
.pnlpopupModal{ width: 90%; background: #fff; margin: 3% auto; }
.pnlpopupModal table td{ color:#222; }
.owlCards .owl-item img{ width:40px; }
.owl-carousel .owl-stage-outer{ padding:8px 5px; }
.owlslider .itemCategory h4{ font-size:14px; font-weight:600; margin:0; }
.title{ font-size:18px; font-weight:600; margin-top: 0; }

/*Owl Attendance Slider*/
.attendance-slider .card { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); padding: 15px 10px; text-align: left; display:flex; flex-direction:column; gap: 9px; border:1px solid #efefef; }
.attendance-slider .card.present .placeholder-wave{ gap:10px; }
.attendance-slider .card h4 { font-size: 14px; font-weight:700; margin-bottom: 6px; }
.timeRecords{ gap:10px; width:100%; justify-content:space-between; }
.timeRecords span{ color:#B3B3B3; font-size:11px; font-weight:500; }
.timeRecords .time{ color:#717171; font-size:11px; font-weight:700; letter-spacing: -.03rem; }
.attendance-slider .card p { margin: 4px 0; font-size: 14px; color: #555; }
.status.present{ color: #0f9d58; font-weight: 600; font-size:12px; }
.status.absent{ color: #ff7b00; font-weight: 600; }
.owl-stage{ margin-left: auto !important; transition: all 0.8s ease !important; } 
/* Custom Nav Buttons */
.custom-nav { position: absolute; top: 50%; transform: translateY(-50%); background: #e53935; color: #fff; border: none;
width: 40px; height: 40px; border-radius: 50%; font-size: 20px; cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.2); transition: all 0.3s ease; z-index: 5; }
.custom-nav:hover{ background: #d32f2f; }
.custom-nav.prev{ left: -20px; }
.custom-nav.next{ right: -20px; }
.btn-view{ background:#EE9B16; border:1px solid #EE9B16;text-transform: uppercase;color: #fff; line-height: 1.85; text-decoration: none;padding: 0px 15px;border-radius: 5px;display: inline-flex; font-size:13px; font-weight:600; box-shadow:0 0 4px rgba(0, 0, 0, .4); }
.btn-view:hover,.btn-view:focus{ text-decoration:none; color:#fff; }
.custom-cards-section{ flex-wrap:wrap; color:#464255; gap:15px 0; display:flex; }
.custom-cards-section .item h4{ font-size:15px; font-weight:600; margin:0; }
.custom-cards-section .sliderLink{ text-decoration:none; }
.custom-cards-section .item{ height:auto; flex-direction:column; border-radius:20px; padding:15px 13px 10px; gap:12px; }
.modalAddWidget .modal-content{ border-radius:15px; }
.tab-content > .tab-pane.active{ opacity:1; }
@media screen and (min-width:1441px){
    .search-bar{ flex-grow: 1; }
}
@media (max-width: 1200px){
	.boxRow h3{ width:100%; }
	.searchBoxItem{ width:100%; }
	.boxRow{ flex-direction: column; width: 100%; gap:15px; }
	.search-ann{ width:100%; }
    .weatherWidget{ min-width:150px; }
    .widgetItem .summary{ display:none; }
    .content-boxes .owl-carousel .item, .content-boxes .custom-cards-section .item{ padding:15px 10px 10px; } 
}
@media (max-width: 768px){
  .custom-nav { width: 35px; height: 35px; font-size: 18px; }
}
/*Owl Attendance Slider*/
.commonBox{ background:#fff; border-radius:20px; padding:20px; }
.timeTableTabs{ padding-right:10px; }
.messageBoxContent{ padding:0; }
.boxRow{ gap:20px; align-items:center; }
.boxRow h3{ margin:0; }
.search-ann .search-bar-btn{ border:0; position:absolute; right: 8px; top: 3px; margin: 0; text-indent:-999rem; background:url(../images/icon-search-ann.svg) no-repeat center; width: 30px; padding: 0; }
.searchBoxItem{ margin-left:auto; gap:15px; width: calc(100% - 200px); }
.searchBoxItem .search-ann{ width:50%; }
.searchBox .inp-box{background:#F9F9F9;border:1px solid #DBDBDB;min-width: 220px;padding: 3px 10px; border-radius: 10px;height: 36px; font-size: 14px; }
.last-updated{ font-size:12px; text-align:right; }
.customSelectBox{ min-width:220px; height: 36px; color:#949494; background-color:#F9F9F9; border-radius: 10px; }
.itemList{ background:#EDF4F9; border-radius:5px; }
.announcement-thumbnail{ background:rgba( 249, 249, 249, .70); border:1px solid #E7E7E7; padding:10px; border-radius:10px; }
.commonTabs{ border-radius:0 0 20px 20px; }
.box-shadow-common{ box-shadow:0 2px 10px rgba(0, 0, 0, .10); }
.mb-35{ margin-bottom:35px; }
.mb-25{ margin-bottom:25px; }
.mb-3{ margin-bottom:12px; }
.navTabList li button.nav-link.active{ background:#404D61; color:#fff; }
.boxShadow{ box-shadow:0 0 6px rgba(0, 0, 0, .10); }
.noList{ margin:0; padding:0; list-style:none; }
div.listData{ height:220px; }
.listData ul.toDoListData{ padding:5px 10px; padding-right:5px; }
.task-card .placeholder{ min-height:14px; margin-bottom:4px; }
.radius-10{ border-radius:10px; }
.itemList{ padding:10px; }
.searchData input[type="text"]{ border:0; width:100%; font-size:14px; height: 26px; background: transparent; }
.searchData input[type="text"]:hover,.searchData input[type="text"]:focus{ outline:none; }
.searchData button{ background: #404D61; border-color: #404D61; }
.dataOptions .navTabList{ gap:7px; }
.searchData button{right:5px;text-transform: uppercase; display:flex; align-items:center; font-size: .85rem;top: 5px; padding: 5px; border-radius:20px; }
.searchData .form-control{ border-radius:20px; background-color: #F4F4F4; }
.dataOptions .navTabList button.nav-link{ border:1px solid #E5E6EB; border-radius:10px 10px 0 0; border-bottom: transparent; background: transparent; padding:6px 30px; color:#878787; font-weight:500; }
.dataOptions .navTabList .nav-item.active .nav-link{ background:#404D61; color:#fff; font-weight:500; }
.tableData{ border:1px solid #E5E6EB; border-radius:0 10px 10px; }
.tableData .tab-pane{ padding:10px; }
.event-list{ gap:10px; height:290px; }
.event-list .event-card{ margin-bottom:5.5px; }
.tabListContent{ gap:0; display:flex; }
.tabListContent li{ display:flex; width:50%; }
.tabListContent .nav-link{ width:100%; padding:8px; border-radius:10px 10px 0 0; background:rgba(255, 255, 255, .25); color:#404D61; border:1px solid #E5E6EB; border-bottom: 0; }
.tabListContent .nav-link.active{ font-weight:700; }
.boxTasks .nav-filters{ padding:0; }
.tabListContent .nav-item.active .nav-link{ font-weight:600; background:#404D61; color:#fff; }
.usefullNumbers{ padding:0; }
.usefullNumbers span{ text-transform:uppercase; font-weight:600; color:#ef0000; font-size: 11px; }
.usefullNumbers p a{ color:#6E7892; }
.text-center{ text-align:center; }
/*Theme Toggle Styles*/
:root{
    --c-text-primary: #FFFFFF;
    --c-text-secondary: #868686;
    --c-border-primary: #ccc;
    --c-bg-body: #ccc;
    --c-bg-primary: #fff;
    --c-bg-secondary: #d4d8dd;
    --c-bg-button: #fff;
    --slider-shadow: inset 0 1px 1px #ddd, 0 2px 3px #ccc;
}
:root.dark-theme {
    --c-text-primary: #eee;
    --c-text-secondary: #d3d5db;
    --c-border-primary: #454545;
    --c-bg-primary: #323339;
    --c-bg-secondary: #222128;
    --c-bg-button: #494a50;
    --slider-shadow: inset 0 1px 1px #767676;
}
.userMessage{ font-weight:500; padding-right:25px; margin-top:10px; }
.userMessage span{ font-size:20px; font-weight:600; line-height:1.25; }
.userMessage span:nth-child(2){ font-size:30px; font-weight:600; }

.userMessage span:nth-child(3){ font-size:15px; font-weight:600; padding:8px 10px 0 20px;; font-weight:600; padding:8px 10px 0 20px; color: #fff; line-height: 1.35; position: relative; background: linear-gradient(60deg, #444 0%, #b3b3b3 25%, #dbd9d9 25%, #444 30%); background-size: 200%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0 0 20px rgba(255, 255, 255, 0.3); animation: lightSweep 7s ease-in-out infinite; }
@keyframes lightSweep {
  0% {
    background-position: -100%;
  }
  28.57% {
    background-position: 100%;
  }
  100% {
    background-position: 100%;
  }
}
.userMessage span:nth-child(3):before{ content:''; position:absolute; background:url(../images/icon-quoteleft.svg) no-repeat; width:18px; height:18px; background-size:16px; padding-left: 20px; padding-top: 5px; left: 0; }
.userMessage span:nth-child(3):after{ content:''; position:absolute; background:url(../images/icon-quoteright.svg) no-repeat; width:18px; height:18px; background-size:16px; padding-left: 20px; padding-top: 5px; left: auto; right: auto; bottom: -4px; margin-left: 4px; }
.main-wrapper{ padding-top:85px; min-height: 100vh; }
.d-flex{ display:flex; }
.flex-column{ flex-direction:column !important; }
.align-items-center{ align-items:center; }
.img-fluid{ max-width:100%; height:auto; }
.mt-3{ margin-top: 16px !important; }
.mb-1{ margin-bottom: 4px !important; }
.mb-2{ margin-bottom: 8px !important; }
.d-none{ display:none; }
.panelArea{ border: 1px solid #ddd; background: #fff; box-shadow: 0 0 20px rgba(0,0,0,0.1); padding: 15px; border-radius: 10px; }
.panelAreaCurve{ border-radius:0 10px 10px; }
@media screen and (min-width: 992px) {
    .category-items .sliderLink{ width:20%; }
	.content-Area{ padding:0 15px 0 25px; }
    .content-AreaChatConv .chat-main-container{ margin:0 auto; }
    .main-wrapper { padding: 85px 0 0 245px; transition: all 0.3s ease-in-out 0s; }
	.header-left{ width:245px; }
    .d-lg-block{ display: block !important; }
    .d-lg-none{ display: none !important; }
    .d-md-block{ display:block; }
    .vertical-slider.eventsSlider{ height: 280px; }
    .containerAreaDiv{ width:450px; margin:0 auto; }
}
.me-2{ margin-right: .5rem !important; }
.mb-3{ margin-bottom: 1rem !important; }
.mb-4{ margin-bottom: 25px !important; }
.ms-auto{ margin-left: auto !important; }
.me-3{ margin-right: 1rem !important; }
.mb-0{ margin-bottom: 0 !important; }
.justify-content-between{ justify-content:space-between; }
.owl-stage{ margin-left: 0 !important; transition: all 0.4s ease; }
.itemCategory{ border-radius:20px; }
.owlslider .itemCategory.bg-blue{ background:rgba(210, 245, 253, .85); border:1px solid #ACEDF4; }
.owlslider .itemCategory.bg-brown,
.custom-cards-section .bg-brown{ background:rgba(255, 248, 206, .9); border:1px solid #F5DF97; }
.owlslider .itemCategory.light-brown,
.custom-cards-section .light-brown{ background:#e6f8e2; border:1px solid #65b1616e; }
.owlslider .itemCategory.bg-red,
.custom-cards-section .bg-red{ background:rgba(255, 91, 91, .15); border:1px solid #FFBBBB; }
.owlslider .itemCategory.light-gray,
.custom-cards-section .light-gray{ background:#ebebeb; border:1px solid #c7c7c7c4; gap:20px; align-items:center; color:#B80101; text-align: center; }
.owl-nav{ position: absolute; top: 36%; width: 100%; height:0px !important }
.owl-carousel .owl-nav button.owl-prev{ margin-left:-50px; }
.owl-carousel .owl-nav button.owl-next{ right:30px; position:absolute; }
.attendance-slider.owl-carousel .owl-nav button.owl-prev{ margin-left:-15px; }
.attendance-slider.owl-carousel .owl-nav button.owl-next{ right:-15px; }
.owl-carousel .owl-nav button.owl-prev span{ display:flex; width: 32px; height: 32px; border-radius: 20px; background:#E6E6E6 url(../images/arrow-left.svg) no-repeat center; text-indent: -999rem; }
.owl-carousel .owl-nav button.owl-next span{ display:flex; width: 32px; height: 32px; border-radius: 20px; background:#DE2222 url(../images/arrow-right.svg) no-repeat center; text-indent: -999rem; }
/* Custom checkbox */
.custom-checkbox { appearance: none; width: 18px; height: 18px; border-radius: 4px; margin-right: 12px; cursor: pointer; position: relative; }
.custom-checkbox:checked { background-color: #0d6efd; border-color: #0d6efd; }
.custom-checkbox:checked::after { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: #fff; font-size: 11px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.task-title{ font-weight: 600; font-size: 15px; margin: 0; color: #333; }
.task-priority{ font-size: 12px; color: #dc3545; }
.task-actions button{ background: none; border: none; color: #666; font-size: 14px; cursor: pointer; transition: color 0.2s ease; }
.task-actions button:hover{ color: #000; }
.task-actions .delete:hover{ color: #dc3545; }
.task-actions label{ margin-bottom:0; }
/* Responsive layout */
.dropdown-menu-arrow::before{ content: ""; width: 13px; height: 13px; background: #fff; position: absolute; top: -7px; right: 6px; transform: rotate(45deg); border-top: 1px solid #eaedf1; border-left: 1px solid #eaedf1; }
.dropdown-menu .dropdown-header, .dropdown-menu .dropdown-footer { text-align: center; font-size: 13px; padding: 10px 15px; align-items: center; }
.dropdown-menu .dropdown-footer a{ text-decoration:none; }
.dropdown-menu .dropdown-footer{ border-top:1px solid rgba(0, 0, 0, .17); }
.notifications, .messages { border: 0; box-shadow: 0 5px 30px 0 rgba(82, 63, 105, 0.2); }
.w-100{ width:100%; }
@media (max-width: 576px){
  .task-card { align-items: flex-start; gap: 8px; }
  .task-actions{ align-self: flex-end; }
}
.task-card{ position:relative; border-radius: 15px; border: none; background: #fff; padding: 12px 16px; display: flex; gap: 10px; align-items: center; justify-content: space-between; transition: 0.2s; box-shadow: 0 0 7px rgba(0, 0, 0, 0.12); }
.task-cardActive{ box-shadow: 0 0 7px rgba(0, 0, 0, 0.12); }
.task-card.placeholder-wave::before{ content:''; position:absolute; width: calc(100% - 10px); height:50px; border-radius:10px; left:5px; box-shadow: 0 0 7px rgba(0, 0, 0, 0.12); }
.task-left{ display: flex; align-items: center; gap: 12px; flex: 1; }
/* === Custom Toggle Checkbox === */
.custom-checkbox{ position: relative; width: 22px; height: 22px; cursor: pointer; }
.custom-checkbox input{ opacity: 0; position: absolute; width: 100%; height: 100%; cursor: pointer; z-index: 2; }
.checkmark{ position: absolute; top: 0; left: 0; width: 22px; height: 22px; background-color: #fff; border: 2px solid #bbb; border-radius: 6px; transition: all 0.25s ease; }
.custom-checkbox input:checked ~ .checkmark { background-color: #28a745; border-color: #28a745; }
.checkmark::after { content: ""; position: absolute; display: none; left: 6px; top: 2px; width: 6px; height: 12px;  border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.custom-checkbox input:checked ~ .checkmark::after { display: block; }
/* Task text */
.task-info{ width:100%; }
.task-info h6{margin: 0 0 2px;font-weight: 600;color: rgba(52, 58, 64, .80);font-size: 15px; }
.task-info small{ font-size: 13px; font-weight: 600; }
/* Icons */
.task-actions i{ font-size: 14px; font-weight:600; color: #888; cursor: pointer; margin-left: 3px; transition: 0.2s; }
.task-actions i:hover{ color: #e74c3c; }
.task-actions i.text-danger{ color:#DE2222; }
.listData ul{ gap:10px; }
.nav-filters{ border:0; margin:20px 0; gap:10px; padding:0 10px; display:flex; }
.nav-filters .nav-link{ background:transparent; text-transform:uppercase; border:1px solid #404D61 !important; font-size:11px; border-radius:15px; padding:.25rem 1rem; font-weight:500; color:#404D61; }
.nav-filters li.active .nav-link,
.nav-filters .nav-link.active { background-color: #404D61 !important; color: #fff !important; }
.searchData{ width: calc(100% - 20px); margin:auto; }
.jobOuterArea{ padding:10px; height:325px; }
/*.left-panel{ flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 2rem; text-align: center; background:#484848; border-radius:15px 0 0 15px; }
.right-panel{ flex: 1; background: rgba(255, 255, 255, 0.05); padding: 2.5rem; }*/
/* Responsive */
/*Login Page Styles*/
.announcement-thumbnail small{ font-weight:700; }
.bg-login{ margin: 0; height: 100%; background: url("../images/bg-login.png") center center; display: flex; justify-content: center; align-items: center; color: #fff; position: relative; }
.globe{ position: fixed; width: 600px; height: 600px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url('../images/bg-globe.png') no-repeat center/cover; opacity: 0.4; animation: rotateGlobe 60s linear infinite; z-index: -2; }
@keyframes rotateGlobe {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(180deg); }
}
.card-login{ background: rgba(255, 255, 255, 0.07); backdrop-filter: blur(12px); border: 2px solid rgba(255, 255, 255, 0.15); border-radius: 1rem; max-width: 850px; width: 800px; display: flex; box-shadow: 0 0 25px rgba(0,0,0,0.4); z-index: 1; }
.left-panel{ flex: 1; background: rgba(0, 0, 0, 0.65); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 2rem;text-align: center; border-radius:15px 0 0 15px; }
.left-panel h2{ font-weight: 300; font-size:1.5rem; }
.left-panel h2 b{ font-weight: 500; }
.right-panel{ flex: 1.2; background: rgba(255, 255, 255, 0.7); padding: 2.5rem; border-radius:0 15px 15px 0; position:relative; }
.userId .form-control[type="text"]{ width:100%; }
.versionData{ position:Relative; }
.versionData::before{position:absolute;content:'';background: url(../images/icon-grad.svg) no-repeat top right; background-size:22px; height:22px; width:22px; top:-7px; right:-8px; transform:rotate(30deg); }
.modal-header{ padding:10px; background:#404D61; }
.modalAddWidget .modal-header{ background:transparent; }
.modal-header h4{ color:#fff; }
.nav-Lib{ cursor:pointer; }
#confetti,#confetti2{
    left: 0;
    top: 0;
    width: 100%; 
    position:absolute;
}
/*Login Page Styles*/
@media screen and (min-width: 769px){
	.modal-dialog{ min-width:650px; }
}
.flag-high{ color:#EF1A1E; }
.flag-medium{ color:#F9831C; }
.flag-low{ color:#BCBCBC; }
/* Input & Add button */
.task-input{ display: flex; align-items: center; gap: 8px; }
input[type=text], select,
input[type=password], textarea{ height: 34px; width: 100%; border-radius: 5px; background-color: rgba(255, 255, 255, 0.5); border: 0; padding: 0 5px; color: #000; transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; border:1px solid #ddd; }
.right-panel input[type="text"],
.right-panel input[type="password"]{ height:40px; background-color:rgba(255, 255, 255, 0.05); padding-left: 10px; }
.right-panel input[type="text"]::Placeholder,
.right-panel input[type="password"]::Placeholder{ color:#949494; font-size:.85rem; }
.task-input input{ flex: 1; border-radius: 25px; border: none; padding: 8px 15px; font-size:.85rem; outline: none; background-color: #F4F4F4; height: 38px; border:1px solid #dee2e6; }
.task-input input:focus{ background-color:#F4F4F4; outline:none; box-shadow:none !important; border-color:#dee2e6; }
.task-input button {border-radius: 25px;padding: 4px 5px;font-size: 14px;font-weight: 500;background:#404D61;height: 28px;width: 28px;justify-content: center;border-color:#404D61;right:4px;display:flex;align-items:center; }
.task-input button:hover,.task-input button:focus,
.searchData button.btn:hover,.searchData button.btn:focus{ background:#262E3A; border-color:#262E3A; outline:none; box-shadow:none !important; }
/* Task items */
.task-item{ display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; border-radius: 12px; transition: all 0.3s ease; }
.task-item:hover{ box-shadow: 0 0 10px 0 rgba(1,41, 112, 0.15); }
.task-item span{ font-size:14px; font-weight:500; color:rgba(52, 58, 64, .8); }
.task-item.completed span{ text-decoration: line-through; color: #888; }
/* Custom Radio Button */
.custom-radio{ position:relative; width:20px; height:20px; border: 2px solid #888; border-radius:50%; cursor: pointer; display: inline-block; transition: 0.2s; }
.custom-radio::after{ content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; background-color: #dc3545; border-radius: 50%; transform: translate(-50%, -50%) scale(0); transition: 0.2s ease; }
.custom-radio.active{ border-color: #dc3545; }
.custom-radio.active::after{ transform: translate(-50%, -50%) scale(1); }
.task-item .bi-x{ cursor: pointer; color: #bbb; transition: 0.2s; }
.task-item .bi-x:hover{ color: #ff5c5c; transform: scale(1.2); }
/*code added for Team*/
.emp-avtar{ width: 50px; overflow: hidden; display: inline-block; }
.birthdayEvent .birthdayBg{ font-size:13px; padding: 0 0 0 9px; line-height: 1.75; background: #d33030; width: auto; height: 30px; bort: 30px; border-bottom: 0.5em solid #0005; border-right: 0.8em solid transparent;
clip-path: polygon(calc(100% - 0.8em) 0, 0 0, 0 calc(100% - 0.5em), 0.5em 100%, 0.5em calc(100% - 0.5em), calc(100% - 0.8em) calc(100% - 0.5em), 100% calc(50% - 0.25em));
border-radius: 10px 0 0 0; }
.birthdayBg{ position: absolute; top: 0; left: 0; }
.emp-avtar img{ width: 100%; }
.emp-data{ margin-bottom: 3px; }
.emp-data h6{ font-size: 10px; margin-bottom: 1px; color: #666; }
.emp-data h5{ font-weight: 500; font-size: 13px; color: #333; }
.user-n-mob{ border-bottom: 1px solid rgba(233, 30, 99, 0.23); padding: 7px 10px; font-weight: 700; display: none; }
.user-n-mob h5{ font-weight: 700; }
.employee-card{ display: flex; background-color: #fff; justify-content:center; border-radius: 15px; padding: 8px 10px; box-shadow: 0 0px 6px rgba(0, 0, 0, 0.10); }
.employee-card.active,.employee-card:hover{ box-shadow: 0 0px 6px rgba(0, 0, 0, 0.15); }
.birthdayEvent{ padding-top:30px; min-height:118px; }
.employee-card img{ height: 58px; border-radius: 10px; object-fit: cover; }
.employee-card .birthdayBg img{ position: relative; z-index: 99; width: 27px; margin-left:5px; height: auto; offset-rotate: reverse; top: -4px; }
.canvasFilp{ position: absolute; top: 0; }
.employeeList{ gap:10px; padding: 0 5px; height:280px; }
.employee-info{ flex-grow: 1; margin-left: 10px; gap:2px; }
.employee-info h6,
.employee-card .emp-data h6{ font-weight: 600; margin: 0; color: #212529; font-size:14px; }
.employee-info h6 span{ font-weight: 500; color: #6c757d; }
.employeeList .employee-info h6{ width: calc(100% - 60px); overflow: hidden; text-overflow: ellipsis; line-height:1.25; }
.employee-info p,
.employee-card .emp-data h5{ margin: 0; color: #6c757d; font-size: 13px; font-weight:400; }
.employee-info .email{ font-size: 13px; color: #6c757d; display: flex; align-items: center; gap: 6px; }
.employee-info .email i,
.employee-info .email a{ color: #6c757d; text-decoration:none; }
.present-text{ color: #008000; font-weight: 600; font-size: 13px; margin-right: 10px; }
.textDanger{ color:#ef0000; }
.textInfo{ color:#ffc107; }
.btn-message{ background-color: #3b4453; border: none; color: #fff; font-weight: 600; border-radius: 4px; padding: 2px 5px; font-size:9px; }
.btn-message:hover{ background-color: #2f3644; color:#fff; }
.user-img{ gap:5px; }
.present-text{ position:absolute; right:1px; top:7px; }
.emp-data .dataExt{ padding:0 !important; }
.summary-table { border-radius: 8px; overflow: hidden; }
.summary-table thead{ font-weight: 600; color: #000; font-size: 14px; text-align: center; }
.summary-table table thead th{ border-bottom:2px solid #E6E9F4 !important; text-align: center; background:transparent; padding-top:0; }
.summary-table table tbody td { font-size: 14px; font-weight: 500; color: #3a3c42; text-align: center; padding: 10px 0 0; border-bottom:0; border:0; }
/*Job Card Styles*/
.job-card{ background: #fff; border-radius: 10px; padding: 10px 12px; display: inline-block; align-items: center; display:flex; position:relative; }
.job-card.placeholder-wave{ min-height:65px; }
.job-card.placeholder-wave::before{ position:absolute; content:''; left:5px; width:calc(100% - 10px); height:60px; border-radius:10px; box-shadow:0 0px 6px rgba(0, 0, 0, 0.10); }
.job-card:hover{ box-shadow: 0 0 8px rgba(0,0,0, 0.15); }
.event-date.placeholder{ height:48px; width:60px; }
.gap-3{ column-gap:1rem !important; }
.extNo{ display:flex; column-gap:3px; justify-content: flex-end; }
/* circular logo on left */
.job-logo{ width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; position: relative; flex-shrink: 0; background: linear-gradient(135deg,#ffc37a 0%, #ffb44a 60%); box-shadow: 0 1px 2px rgba(0,0,0,0.08); font-weight: 700; color: #fff; font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
font-size: 14px; letter-spacing: 0.5px; }
.job-body{ min-width: 0; }
.job-title{ margin: 0; font-size: 15px; font-weight: 600; color: #111827; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.job-meta{ font-size: 12px; color: #6b7280; display: flex; align-items: center; gap: 6px; }
.job-meta .bi{ font-size: 14px; vertical-align: middle; color: #9ca3af; }
/*Tabular Data*/
.tableData table{ width:100%; border:0; }
.tableData table td,
.tableData table.number-table td{ text-align:center; border: 0 !important; padding: 2px 0; }
.tableData table.number-table td{ width:33.33%; }
.tableData table td a{ color:#343A40; text-decoration:none; }
.event-card { border-radius: 12px; background: #FBFCFF; display: flex; align-items: center; padding: 15px 17px;
border:1px solid transparent; }
.event-card:hover{border:1px solid #EDF1F9;	background:#F6F9FF; }
.event-date { text-align: center; margin-right:0; }
.event-date .month { color: #dc3545; font-weight: 600; font-size: 14px; text-transform: uppercase; display: block; }
.event-date .day { color: #dc3545; font-weight: 700; font-size: 28px; display: block; line-height: 1; }
.event-details{ border-left: 1px solid #dee2e6; margin-left: 15px; padding-left: 15px; width:100%; }
.event-details h5{ font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.event-details .time { font-size: 14px; color: rgba(21, 27, 50, .45); margin-bottom: 2px; font-weight:600; }
.event-details .location { font-size:13px; color: #151B32; font-weight:600; }
header.sticky { background: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1); padding: 2px 0 5px; height:75px; }
.navTitle{ font-size:16px; padding:0 15px; margin:0; }
.leftBarScroll{ gap:40px; display:flex; flex-direction:column; }
.accordion-button { padding:12px 15px; color: #6E7892; font-weight: 500; }
.accordion-button:not(.collapsed){ background-color: transparent; color: #000; }
.accordion-body a{ text-decoration: none; color: #555; display: block; padding: 4px 0; }
.accordion-body a:hover{ color: #007bff; }
/*Toggle Switch*/
.switch-toggle{ position: relative; display: inline-block; width:130px; height:32px; background:#fff; box-shadow:0 0 4px rgba(0, 0, 0, .1); border-radius:5px; }
.switch-toggle input[type=checkbox] { cursor: pointer; position: absolute; inset: 0; appearance: none; z-index: 2; }
.switch-toggle input[type=checkbox]:focus{ outline:none; outline-offset:0; box-shadow:none; }
.switch-toggle input[type=checkbox]:checked + label.switch-toggle-label:before { translate: 100% 0; background:#6C757D; color: #fff; }
.switch-toggle input[type=checkbox]:checked + label.switch-toggle-label span:nth-child(1){ color: gray; }
.switch-toggle input[type=checkbox]:checked + label.switch-toggle-label span:nth-child(2){ color: #fff; }
.switch-toggle input[type=checkbox] + label.switch-toggle-label{ position: absolute; inset: var(--offset, 0); padding: 0 5px; --offset: 3px; display: block; user-select: none; pointer-events: none; display: flex; gap: 16px; place-items: center; margin:0; }
.switch-toggle input[type=checkbox] + label.switch-toggle-label:before { content: ""; position: absolute; width: 50%; inset: 0; background: #DE2222; border-radius: calc(var(--radius) - var(--offset)); translate: 0 0; border-radius:4px; transition: translate 250ms cubic-bezier(0.93, 0.26, 0.07, 0.69); }
.switch-toggle input[type=checkbox] + label.switch-toggle-label span{ position: relative; transition: 200ms linear; padding-left: 4px; font-size: 12px; font-weight: 500; }
.switch-toggle input[type=checkbox] + label.switch-toggle-label span label{ margin:0; font-weight:400; }
.switch-toggle input[type=checkbox] + label.switch-toggle-label span:nth-child(1){ color: #fff; }
.switch-toggle input[type=checkbox] + label.switch-toggle-label span:nth-child(2){ color: #707070; padding-left: 2px; }
.switch-toggle label span i{ margin-right:4px; }
/*Toggle Switch*/
.imp-msg-listLoad{ overflow:hidden; position:relative; }
.imp-msg-list ul{ list-style:none; padding: 2px 20px; padding-right: 15px; display:flex; flex-direction:column; }
.imp-msg-list ul.bottomList{ padding:0; flex-direction:initial; margin:0; align-items: center; }
.imp-msg-list ul.bottomList li{ padding:0; }
.imp-msg-list ul.bottomList li a{ display: flex; align-items: center; gap:5px; padding:3px 5px; color:#404D61; font-family:"roboto", sans-serif; font-weight:500; text-decoration:none; }
.imp-msg-list ul.bottomList li a.active{ background:#fff; border-radius:5px; }
.imp-msg-list ul li{ padding: 6px 10px; border-radius: 10px; font-size: 12px; color:#5F6671; }
.imp-msg-list ul li.dataList-item{ box-shadow: 0 0 4px rgba(0, 0, 0, .15); }
.dataList-item .placeholder-wave{ flex-direction:column; display:flex; gap:5px; }
.imp-msg-list ul li b{ color:#404D61; }
.imp-msg-list ul li span{ font-weight:600; }
.imp-msg-list ul li p{ margin:0; font-size:10px; color:#404D61; }
.imp-msg-list ul li .staReject{ color:#B80101; }
.imp-msg-list ul li .staApprove{ color:#409F40; }
.owlslider .sliderLink{ color:#fff; text-decoration:none; }
.filters-panel{ padding:5px 15px 10px; }
.filters-panel .itemList{ gap:5px; padding:3px 5px; align-items: center; }
.dataList{ gap:7px; }
.userMenu{ border-top:1px solid #e8e8e8; padding:10px 20px; position:absolute; width:100%; align-items:center; box-shadow:0 -2px 4px rgba(0, 0, 0, .05); }
.btn-logout{ background:#ef0000; border-radius:10px; color:#fff; padding:8px 15px; font-weight:600; font-size:12px; text-decoration:none; transition: transform 0.3s ease; }
.btn-logout:hover{ color:#fff; box-shadow:0 0 4px rgba(0, 0, 0, .5); }
.nav-timetable-wrapper{ overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; position:relative; }
.nav-timetable-wrapper::-webkit-scrollbar { display: none; }
.nav-timetable{ display:inline-block; width: 100%; }
.nav-timetable .nav-item{ display:inline-block; padding: 0 0 1px; }
.nav-timetable .nav-link{ padding:.35rem 1.15rem; border-radius:10px 10px 0 0; border:0; color:#9b9b9b; }
.nav-timetable .nav-link.active,
.nav-timetable .nav-link:hover{ background:#404D61; color:#fff; padding:.35rem 1.15rem; border-radius:10px 10px 0 0; }
#menu-content { display: flex !important; }
.boxTasks{ height:auto; }
.boxTasks{ padding:20px 10px; }
.searchBoxData{ height:300px; position:relative; padding-top:0; }
div.ourTeamData{ padding-top:10px; padding-bottom:10px; }
.scroll-container.task-list{ height:213px; padding:0 10px; }
.boxTasks .listData .noList,
.scroll-container.employeeList{ padding: 5px 10px; padding-right: 5px; }
.scroll-container.listData{ height: 220px; }
.scroll-container.employeeList{ height: 276px; padding-top:0; }
.PhoneDirectory .employee-card{ margin:0 0 10px; }
.PhoneDirectorySearchPC.scroll-container{ height:290px; padding: 0 5px 0 10px; }
.custommodalData{ position:absolute; }
/*Weather icon Rotate*/
.w-icon{ /*transform: rotate(45deg);*/ transform-origin: center; }
.w-icon .sunRays{ transform-origin: center; transform-box: fill-box; }
/*Weather icon Rotate*/
.overlay{ position: absolute; inset: 0; background: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; border-radius: 8px; width: 100%; left: 0; height: 100%; }
.parent-div .overlay{ display:flex !important; }
.parent-div .overlay.show{ z-index:4; }
.overlay.show{ opacity: 1; visibility: visible; z-index:1; }
.overlay-contentDiv{ background: #fff; color: #000; width: 95%; max-height: 95%; width:calc(100% - 20px); height:calc(100% - 20px); /*overflow-y: auto;*/ padding: 20px; border-radius: 10px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); transform: scale(0.95); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; z-index:3; }
.overlay.show .overlay-contentDiv{ transform: scale(1); opacity: 1; }
.overlay-contentDiv::-webkit-scrollbar{	width: 6px; }
.overlay-contentDiv::-webkit-scrollbar-thumb { background-color: #ccc; border-radius: 3px; }
.announcement-thumbnail.placeholder-wave{ display:flex; flex-direction:column; gap:5px; }
.messageArea{ width:100%; height:65%; border:1px solid #ddd; padding:5px 5px 5px 10px; }
.messageArea:focus{ outline:none; box-shadow:none; }
.messageArea::placeholder{ color:#A1A1A1; }
.btn-send{ background:#EE9B16; color:#fff; font-weight:500; padding:.35rem 1rem; font-size:.85rem; text-transform:uppercase; border-radius: 10px; }
.btn-send:hover{ background:#ffca2c; color:#fff; }
.img-place{ width:40px; height:40px; }
.btn-message.placeholder{ width:100%; height:12px; }
/*overlay Content modal*/
.jobOuterArea h3{ padding:10px; }
.job-listing{ height:250px; gap:10px; padding: 5px; padding-right: 5px; }
.titleBg{ padding:15px; }
.menuList{ margin:0; list-style:none; padding:0; }
.menu-content li ul.collapse.show { background: #fdf1f1; }
.navbar-toggler{ padding:0; }
.navbar-toggler:focus{ box-shadow:none; padding:0; }
#sidebar { position: fixed; top: 0; left: -250px; width: 250px; height: 100%; background-color: #343a40; color: #fff; transition: left 0.3s ease; z-index: 1040;
padding-top: 60px; }
#sidebar.active{ left: 0; }
#sidebar a{ color: #fff; text-decoration: none; display: block; padding: 10px 20px; transition: background 0.2s; }
#sidebar a:hover{ background-color: #495057; }
/* Main content */
#content{ transition: margin-left 0.3s ease; padding: 20px; }
/* When sidebar is active, push content */
#sidebar.active ~ #content { margin-left: 250px; }
/* Navbar */
.navbar { z-index: 1050; }
.slick-initialized .slick-slide,
.slick-initialized .slick-slide{ display:flex; }
.slick-prev{ right:0; bottom: -22px !important; top: auto; }
.slick-next{ right: 22px; bottom: -22px; top: auto; }
.slick-dotted.slick-slider{ margin-bottom:10px; }
.menuAccordion .accordion-item{ border:0; background-color:transparent; }
.menuAccordion .accordion-item .accordion-collapse{ padding:0 10px; }
.menuAccordion .accordion-item .accordion-collapse div.accordion-body{ background:#fdf1f1; }
.menuAccordion .accordion-item .accordion-body{ background: #fbfbfb; border-radius: 5px; }
.menuAccordion .accordion-header button{ border:0; box-shadow:none; display:flex; width:100%; font-size:14px; font-weight:400; color:#6E7892; background-color:transparent; }
.menuAccordion .accordion-header .accordion-button .arrow:before { content: ''; width: 20px; height: 14px; float: right; transition: transform .2s; background:url(../images/icon-arrow-down.svg) no-repeat center / 14px; }
.menuAccordion .accordion-header .accordion-button:not(.collapsed) .arrow:before { transform: rotate(-180deg); }
.menuAccordion .accordion-header button:focus{ box-shadow:none; }
.menuAccordion .accordion-header button span{ margin-left:auto; }
.menuAccordion .accordion-header button::after{ width: .85rem; height: .85rem; background-size:12px; background-image: url(../images/icon-arrow-down.svg); }
.menuAccordion .accordion{ margin:0; }
.menu-content li ul{ padding-left:2rem; transition: all 0.3s ease-in-out 0s; }
.menu-content li ul.collapse.in{ background:#fdf1f1; }
.menu-content li ul ul{ padding-left:0; }
.nav-link .arrow { transition: transform 0.3s ease; }
.footer{ padding:20px 25px 10px; background:#fff; gap:8px; column-gap:20px; width:100%; }
.customAlert{ position:fixed; top:100px; right: 30px; z-index:99; border-radius:10px; }
.top-footer { gap: 20px; column-gap: 20px; }
.divContentlayout{ display: flex; margin-top: 10px; height: auto; width: 100%; }
.social-icons{ margin:0; padding:0; gap: 20px; column-gap:20px; align-items: center; list-style:none; }
.bottom-footer{ gap:0; column-gap:0; border-top:1px solid rgba(10, 20, 47, .07); padding-top:12px; align-items: center; }
.footer-txt{ font-size:13px; color:#4C4D50; }
.footer-txt a{ text-decoration:none; color:#4C4D50; }
.footer-txt img{ margin-right:6px; }
.txtBug{ font-size:12px; color:#DE2222; }
.txtBug:hover{ color:#DE2222; text-decoration:none; }
.text-end{ text-align:right; }
.text-end a{ color:#4C4D50; }
.lectureSection{ height:260px; padding-right:10px; }
.weeklyData{ padding:10px; }
.calendar-card{ width: 100%; border-radius: 12px; background-color: #fff; }
.calendar-header{ background-color: #404D61; color:#fff; padding: 8px 15px; border-radius:10px; font-size: 14px; text-transform: uppercase; position: relative; }
.calendar-header small{ display: block; color: #fff; font-size: 12px; margin-top: 3px; }
.calendar-header span{ font-weight:600; }
.calendar-header .nav-btn{ position: absolute; top: 50%; transform: translateY(-50%); font-size: 14px; color: #fff; cursor: pointer; }
.calendar-header .prev{ right: 30px; }
.calendar-header .next{ right: 12px; }
.calendar-body{ padding: 15px 0 0; }
.calendar-table{ width: 100%; text-align: center; font-size: 13px; color: #ccc; table-layout: fixed; }
.calendar-table th{ color: #4d4d4d; font-weight: 600; text-transform: uppercase; font-size: 12px; padding-bottom: 8px; }
.calendar-table td{ padding: 6px; color:#4d4d4d; transition: all 0.2s ease; cursor: pointer; }
.calendar-table td.today{ border-bottom:2px solid #d32f2f; }
.calendar-table td:hover{ background-color: #5d5c5c; color:#fff; }
.calendar-table .selected,
.calendar-table .selected:hover{ background-color: #d32f2f; color: #fff; }
/*Styles added for Tabs Panel*/
.RadTabStrip .rtsUL,
.RadTabStripVertical .rtsUL{ padding:0; margin:0; list-style:none; display:flex; gap:3px; }
.RadTabStrip .rtsUL li{ display:flex; }
.RadTabStrip_Default .rtsLI,
.RadTabStrip_Default .rtsLink{ font:14px/26px "poppins", Arial,sans-serif; }
.myTab ul li a{ background:rgba(255, 255, 255, .25); border:1px solid #E5E6EB; border-radius:10px 10px 0 0; padding: .5rem 1rem; font-size:14px; text-decoration:none; color: #404D61; }
.myTab ul li a.rtsLink.rtsSelected{ background:#2C2C2C; color:#fff; }
/*Styles ended for tabs*/
.section-layout{ background:#fff; border-radius:20px; box-shadow:0 0 4px rgba(0, 0, 0, .10); }
.form_header{background:#404D61; color: #fff; font-weight: 600; border-radius: 10px; font-size: 20px; padding:10px; margin-bottom:15px; text-align:center; }
.form_header label{ margin:0; font-weight:600; }
.menuData ul ul.sub-menu{ list-style:none; padding:0 0 0 10px; margin:0; }
.uims-sidebar li[aria-expanded="true"] a span.arrow::before{ transform: rotate(-180deg) !important; }
.menuData ul ul.sub-menu.collapse.in{ background:#fdf1f1; }
.content-Area{ box-shadow: 0 0 4px rgba(0, 0, 0, .10); padding: 15px; border-radius: 10px; background:#fff; margin:0 15px 0 25px; }
.content-Area.content-AreaChatConv{ padding:0 !important; border-radius:0; }
.content-Area.content-AreaChatConv .chat-main-container{ margin:0 auto; }
div#ContentPlaceHolder1_short_links{ margin-left:0; margin-right:-15px; }
legend { display: block; width: 100%; padding: 0; margin-bottom: 20px; font-size: 21px;line-height: inherit; color: #333; border: 0; border-bottom: 1px solid #e5e5e5; }
.contentInnerData{ padding:0 0 0 15px; }
.task-container{ margin: auto; height:300px; }
.mar-15{ margin-bottom:15px; }
label { display: inline-block; max-width: 100%; margin-bottom: 5px;  font-weight: 700; }
.form-control{ font-size:13px; }
input[type="submit"], input[type="button"] { background: #DE2222; border: none; border-radius: 4px; color: #fff; font-size: 12px; padding: 6px 15px; text-transform: uppercase; font-weight: 500; cursor: pointer; margin: 4px; }
input[disabled="disabled"] { background-color: #cecece; }
.usefullNumbers{ gap:40px; }
.logoFooterTxt{ padding:0; }
table td{ padding: 4px; border:1px solid #E6E9F4; font-weight:500; }
table th{ padding: 10px; background: #eee; }
.divScrollBarData table th{ background:transparent; }
textarea.form-control{ height:auto; }
a.paging{ background:#f8f8f8; padding:3px 8px; border: 1px solid #d3d3d3; border-radius:4px; text-decoration:none; margin:5px 5px 10px 0; display: inline-flex; }
a.paging:hover{ background:#404D61; color:#fff; }
a.currentpaging{ background:#404D61; color:#fff; }
.category-items{ padding-top:3px; gap:15px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #999 transparent; transition: all 0.3s ease; }
.category-items .sliderLink{ background:#fff; box-shadow:0 0 4px rgba(34, 48, 62, .10); border-radius:10px; padding:10px; text-decoration:none; }
.category-items .sliderLink{ display:flex; align-items:center; color:#343A40; transition: all 0.3s ease-in-out 0s; }
.category-items .sliderLink img{ margin-right:12px; }
.category-items .sliderLink h4{ font-size:15px; font-weight:600; margin:0; }
.category-items .sliderLink:hover{ transform: translate(0, -2px); }
.icon{ width:20px; height:20px; }
.widgetItem{ gap:3px; }
.light-sweep-text{ font-size:80px; font-weight:700; text-transform:uppercase; color:#fff; position:relative; background:linear-gradient(120deg, #444 0%, #fff 45%, #fff 55%, #444 100%); background-size:200%; -webkit-background-clip:text;-webkit-text-fill-color:transparent; text-shadow:0 0 20px rgba(255, 255, 255, 0.3); animation:lightSweep 6s ease-in-out infinite; }
@keyframes lightSweep{
  0% {
    background-position: -100%;
  }
  40% {
    background-position: 100%;
  }
  60% {
    background-position: 100%;
  }
  100% {
    background-position: -100%;
  }
}
.searchBox .inp-box{ min-width: 190px; font-size:13px; }
table thead.bg-info th{ color:#000; }
/*Login Page Styles*/
.landing-bg{ height: 100%; }
#login-page{ position: relative; }
.color-overlay{ height:100%; }
.login-bg{ background: url("../images/bg-login.png") center center; height:100%; }
.login-info{ margin-right: auto !important; margin-left: 12%; margin-left: auto; z-index: 100; }
.login-info{ max-width: 750px; width: 100%; margin: auto; position: relative; top: 50%; transform: translateY(-50%); background: rgba(255, 255, 255, 0.9); border-radius: 20px; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); border:1px solid #6a6a6a52; }
.left-panel img.login-logo{ width: 125px; margin-bottom: 15px; }
.bottom-info{ width: calc(100% - 80px); justify-content: space-between; align-items: center; padding-top:20px; border-top:1px solid #ffffff4d; }
.login-card h4{ font-weight: 700; color: #ffffff; margin-bottom: 10px; font-size: 28px; letter-spacing:.2rem; }
.login-card h5{ color: #2c2c2c; font-weight: 700; margin-bottom: 16px; font-size: 21px; text-align:left; }
.login-card p{ font-size: 0.95rem; color: #bfbfbf; margin-bottom: 5px; font-weight:500; }
.loginForm .form-control { border-radius: 8px; margin-bottom: 0; padding: 10px; font-size: 0.95rem; height:40px; }
.login-card.loaded { transform: translateY(0); opacity: 1; }
.inputData{ margin-bottom:10px; text-align: left; }
.inputData i{ margin-left:10px; font-size:16px; }
.inputData input[type="text"]{ padding-left:35px; }
.inputData input[type="password"]{ padding-left:35px; }
.btn-login{ background-color: #DE2222; color: white; font-weight: 600; border-radius: 8px; padding: 7px 20px;
border: none; transition: 0.3s; font-size: 16px; }
.btn-login:hover{ background-color: #F82626; color:#fff; box-shadow:0 1px 5px rgba(0, 0, 0, .15); }
.login-links{ margin-top: 12px; font-size: 14px; text-align: left; }
.login-links a{ color: #DE2222; text-decoration: none; margin: 0 5px; }
.login-links a:hover{ text-decoration: underline; }
.spinner-border{ width: 1.2rem; height: 1.2rem; margin-right: 8px; }
.bg-lightYellow{ background:#f8f8ec; border:1px solid #c7c29a; }
.bg-lightGray{ background:#edf1f6; border:1px solid #adc4e1; }
.bg-section{ background:#F3F3FD; border:1px solid #ca79db57; }
.bg-lightCream{ background:#f4efeb; border:1px solid #e9cbb2; }
.bg-lightGreen{ background:#efffff; border:1px solid #9eede5; }
.bg-lightPeach{ background:#fdf1f1; border:1px solid #ffcdcd; }
.bg-orange{ background-color:#fcf4f2; border:1px solid #e7634d; }
.bg-lightTeal{ background-color:#f1ebdc; border:1px solid #c7b58b; }
.bg-chatConv{ background-color:#dffffee8; border:1px solid #60c1bc; } 

/*Section Annoucements*/
.announcement-thumbnail h2{ font-size:18px; font-weight:600; line-height:1.5; }
.announcement-thumbnail p,
.announcement-thumbnail span{ color: #333; line-height: 18px; font-size: 12px; }
.announcement-thumbnail { border-bottom: 1px solid #ddd; margin-bottom:15px; }
.announcement-thumbnail .attachment a{ color: #333; }
.myVerticalSlider .swiper-wrapper .swiper-slide{ height:auto; }
/*Section Annoucements*/
/*Login Page Styles*/
.dropdown-menu.profile .dropdown-item{ font-size:13px; padding:7px 12px; }
.dropdown-menu.profile .dropdown-item i{ margin-right:6px; }
.attendance-slider .card.present .placeholder-wave i{ margin-left:1px; }
.iconSlide{ font-size:25px; }
.icon-theme{ color:#DE2222; font-size:18px; }
.movingBar{ animation: animate1 1s linear infinite; background:red; width:5px; height:2px; position:absolute; content:''; }
/*.imp-msg-list{ height:205px; }*/
#divMyMessages div#divMyMessages{ height: 205px; }
div#divMyMessages .imp-msg-listLoad{ height: 195px; }
#uims_sidebar .scroll-bar.scroll-content .leftBarScroll{ height:calc(100vh - 130px) !important; }
#uims_sidebar .scroll-container{ height: calc(100% - 136px) !important; }
.scroll-container.all-announcements-listing div#divAnnouncements{ height:600px; }
.helpDiv{ text-align:right; margin-top:15px; }
.helpDiv img{ width:48px; }
/*Help section css*/
#div_help img{ width: 100%; }
#div_help a{ display: inline-block; background: #fff; border-radius: 50%; padding: 3px; box-shadow: 0 0 10px rgba(0,0,0,0.2); }
#div_help_popup{padding-top: 30px; top:0; }
#div_help{ position: fixed; right: 5px; top: 45%; width: 50px; cursor: pointer; background: #fff; border-radius: 50%; padding: 3px; z-index: 2; }
/*help section css end*/
.theme-img { content: url("https://staff.cuchd.in/assets/uploads/login-logo-main.png"); }
.themeEmail{ content: url("../images/icon-email.svg"); }
.themePhone{ content: url("../images/icon-phone.svg"); }
.message-status.sent{ content: url("../images/icon-sent.svg"); width:20px; }
.message-status.read{ content: url("../images/icon-read.svg"); width:20px; }
.side-staff-menu{ position: fixed; width: 330px; background-color: #404D61; right: -330px; top: 0; bottom: 0; z-index: 999999; padding: 70px 15px 15px; box-shadow: 0 0 10px rgba(0,0,0,0.2); transition: all 0.3s ease-in-out 0s; background-image: url('../../imgs/search_blank.png'); background-repeat: no-repeat; background-size: 150px; background-position: center; }
.side-staff-menu.swipe{ right: 0; transition: all 0.3s ease-in-out 0s; }
.side-staff-menu .inp-box{ /*background: #fff; border: 1px solid transparent;*/ }
.close-menu-btn { position: absolute; top: 25px; left: 15px; font-size: 22px; color:#f2f2f2; opacity: 0; visibility: hidden;  cursor: pointer; }
.side-staff-menu.swipe .close-menu-btn { opacity: 1; visibility: visible; }
.search-staff-inp{ position: relative; }
.search-staff-inp input[type=text]{ background:#fff; }
.search-staff-inp input[type=text]::placeholder{ color:#545454; }
.side-staff-menu ul { overflow: auto; height: 90%; overflow-x: hidden; }
/*Css Start for Timetable Section*/
.justify-space-between{ justify-content:space-between; }
.lecPlanOuter{ gap:15px; margin:7px 0; }
.timeStamp{ font-size:10px; text-transform:uppercase; font-weight: 500; letter-spacing: .035rem; }
.infoData{ font-weight:600; text-align: center; font-size:13px; }
.subName{ margin:0; font-size:14px; font-weight:600; line-height: 1.25; }
.weeklyData{ padding:10px 0; }
.listItemLec{ width:100%; padding:10px 12px; background:rgba( 249, 249, 249, .70); border-radius:10px; border:1px solid #dddddd54; }
.scroll-pills{ display: flex; justify-content: space-between; overflow-y: auto; white-space: nowrap;  padding-bottom: 10px; }
.scroll-pills .nav-pills{ display: inline-block; }
.scroll-pills .nav-pills > li{ display: inline-block; float: none; }
.listContLec{ display:flex; flex-direction:column; gap:10px; }
.scroll-pills > li > a{ padding:3px 5px; font-size:12px; border-radius:6px; }
.scroll-pills.nav-pills>li.active>a,
.scroll-pills.nav-pills>li.active>a:focus,
.scroll-pills.nav-pills>li.active>a:hover{ background-color: #404D61; }
/*Css End for Timetable Section*/
#pnlViewStudentProfile{ display:none; }
.stickto_top{ margin-right:10px; }
.messageBoxContent .messageList ul::-webkit-scrollbar{ width: 8px; background: transparent; }
.messageBoxContent .messageList ul::-webkit-scrollbar-track{ background: transparent; }
.messageBoxContent .messageList ul::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.3); border-radius: 4px; }
.messageBoxContent .messageList ul::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.5); }
.messageBoxContent .messageList ul{ scrollbar-width: thin; }
.messageBoxContent .messageList ul{ height: 177px; overflow: auto; scrollbar-gutter: stable; transition: overflow 0.3s ease; }
.divCourseCodeChkClass table td{ text-align:left; }
.divCourseCodeChkClass table td label{ display:inline; }
.divCourseCodeChkClass table td input[type=checkbox]{ margin:2px 4px 0 0; }
.countView,
.txtNotify{ border-radius:20px; font-size:10px; background:#FF5B5B; position:absolute; content:''; color:#fff; display:flex; align-items:center; justify-content:center; width:13px; height:13px; top:-4px; right:-2px; }
.custom-cards-section .item.itemCategory{ align-items:center; }
.boxTasks .scroll-wrapper > .scroll-content{ position: initial !important; }
.hightLight-link{ position:relative; }
.hightLight-link::after,
.hightLight-link::before{ content: " "; position: absolute; z-index: -1; inset: -3px; background: conic-gradient(from var(--gradient-angle), #4a4245,#e91e63); border-radius: inherit; animation: rotate 1.5s linear infinite; }
.hightLight-link::after{ filter: blur(2px); }
@property --gradient-angle{	syntax: "<angle>";initial-value: 0deg;	inherits: false; }
.short-links a.hightLight-link{ display: flex; align-items: center;	justify-content: center; height: 100%; line-height: 45px; position: initial; }
.highlightAnimation{ padding: 4px !important; position: relative; height: 50px; }
@keyframes rotate{
	0% {
		--gradient-angle: 0deg;
	}
	30% {
		--gradient-angle: 180deg;
	}
	60% {
		--gradient-angle: 240deg;
	}
	100% {
		--gradient-angle: 360deg;
	}
}
.PhoneDirectorySearchPC{ font-size: 12px; height: 280px; padding-left:5px; padding-right:5px; }
.PhoneDirectorySearchPC .parent-div .btn-close{ top:-5px; right:0; }
.side-staff-menu .PhoneDirectorySearchPC{ height:100%; }
.total-records-find{ padding:0 0 7px; text-align: right; }
.total-records-find p{ font-size: 12px; }
.myVerticalSlider{ height:290px; }
.searchData input[type="text"].inp-box::placeholder{ font-size:14px; font-weight:500; color:#404D61; }
.swiper-pagination-bullet { background: #999; width: 10px; height: 10px; opacity: 0.4; margin: 0 4px !important; }
.swiper-pagination-bullet-active { background: #000; opacity: 1; }
.swiper-pagination-vertical.swiper-pagination-bullets{ left:0; right:0; top:0; transform: initial; display:flex; position:relative; top:10px; justify-content:center; }
.myVerticalSlider .swiper-slide{ height:auto !important; margin:0 !important; }
.staffData .searchData{ position: absolute; top: 4px; height: 34px; left: 4px; width:calc(100% - 10px); transition:all 0.80s ease-in-out 0s; }
.searchData .form-control{ height:30px; padding:.125rem .75rem; background:transparent; border:0; box-shadow: none; }
.searchData .form-control input[type="text"]{ border-radius:0; }
.tabListContent .nav-link .searchData .form-control input[type="text"]{ background:transparent; border:0; border-radius:0; padding-left: 20px; transition:all 0.80s ease-in-out 0s; }
.staffData .navTabList li.nav-item.active .nav-link.staffSearch .form-control input[type="text"]::placeholder{ color:#fff; }
.tabListContent li.nav-item.active .searchData .form-control input[type="text"]{ color:#fff; }
.tabListContent .nav-link.active .searchData .form-control input[type="text"]{ width:100%; }
.tabListContent .nav-link.active span.txt{ display:none; }
.tabListContent .nav-link.active span.searchTxt{ display:inline; }
.tabListContent .nav-link span.searchTxt{ display:none; }
.staffData .navTabList li .nav-link{ transition:all 0.80s ease-in-out 0s; text-align: center; }
.staffData .navTabList li .nav-link.active{ transition:all 0.80s ease-in-out 0s; text-align: center; background-color:#404D61; }
.navTabList li .nav-link.staffSearch.active .inp-box::placeholder{ color:#fff; }
.staffData .navTabList li .nav-link.staffSearch{ text-align: left; }
.task-info .infoText{ font-size:13px; font-weight:400; padding-left:0; margin-bottom:0; column-gap:7px; display: flex; align-items: center; }
.task-info .infoText i{ color: #888; font-size:11px;  }
.task-info .infoText i.message,
.task-info .infoText i.emailIcon{ color:#404D61; padding:0; border:0; margin:0; background:transparent; }
.infoText label{ padding:0; margin:0; }
.parent-div .btnClose{ top:10px; right:20px; z-index: 1; }
.me-1 { margin-right: 4px !important; }
.mt-0{ margin-top:0 !important; }
.mx-auto{ margin-right: auto !important; margin-left: auto !important; }
.modal-title{ font-size:20px; font-weight:600; }
.NavigationSearchPC { position: absolute; border-radius: 10px; background: #fff; left: -1px; right: -1px; top:-1px; border: 1px solid #ddd; padding-top: 35px; display: none; box-shadow: 0 4px 8px rgba(0,0,0,0.10); }
.NavigationSearchPC ol{ overflow-y: scroll; z-index: 2; max-height: 300px !important; list-style-type: decimal; }
.NavigationSearchPC li{ position: relative; }
.NavigationSearchPC li a{ padding: 5px 20px; display: block; color: #333; }
.NavigationSearchPC li a:hover{ background: #f3f3f3; }
.page-search-atb{ position: absolute; right: 15px; top: 2px; width: 14px; height: 17px; text-align: center; cursor: pointer; color: #CD0505; }
.nav-search-breadcrumb{ font-size: 10px; padding-left: 20px; color: #3F51B5; }
.position-relative{ position:relative; }
.position-absolute{ position:absolute !important; }
.search-form .total-results{ z-index:2; right: 15px; color: #717171; font-weight:500; }
/* css for placeholder loading*/
#loading-usersearch-pc1{ display: none; width: 20px; height: 20px; position: absolute; top: 7px; left: 90%; z-index: 1; }
.placeholder{ display: inline-block; min-height: 1em; vertical-align: middle; cursor: wait; background-color: currentcolor; opacity: .5; }
.placeholder-wave{ -webkit-mask-image: linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%); mask-image: linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%); -webkit-mask-size: 200% 100%; mask-size: 200% 100%; animation: placeholder-wave 2s linear infinite; }
.customTabData{ display:inline-flex; }
.view-more{ background:#3b4453; display:inline-flex; padding:2px 5px; border-radius:4px; text-decoration:none; font-size:9px; text-transform:uppercase; color:#fff; }
.view-more:hover{ color:#fff; }
.view-more.show{ display:inline-flex !important; }
.detailsData{ margin-bottom:3px; }
.moreAction{ background:rgb(153 55 55); }
.detailsData span{ font-weight:700; margin-right:4px; font-size: 12px; text-transform:uppercase; }
.detailsData{ font-size:13px; }
 .swcRequestBlock{ border-left: 1px solid gray; background: #FFF; box-shadow: -4px 1px 9px -4px; }
/*css added for Overlay Events Section*/
.overlay-box{ transition: opacity .3s ease; }
.overlay-box { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); color: #fff; padding: 40px; z-index: 9999; opacity:0; }
.overlay-box.in{ opacity: 1; }
.overlay-close{ position: absolute; top: 10px; right: 20px; cursor: pointer; font-size: 30px; }
.summary-table tbody td a{ color:#343A40; }
/*Overwrite inline styles from forms*/
body.dark-mode div.popupDataView{ background:rgba(58, 58, 58, .95) !important; }
body.dark-mode div.RadGrid_Default{ background-color: #2F2F2F; border-radius:0 0 10px 10px; color:#fff; border-color:#5f5f5f; }
body.dark-mode input[type="submit"],body.dark-mode input[type="button"]{ background-color:#df3131d6; }
body.dark-mode input[type="submit"]:hover, body.dark-mode input[type="button"]:hover{ background-color:#ef2626; }
body.dark-mode .ajax__tab_xp .ajax__tab_body{ background-color:transparent; }
body.dark-mode .task-info .infoText i.emailIcon{ color:#888; }
body.dark-mode .asptestbox{ color:#cdcdcd; background-color:#3B3B3B; border-color:#555; width:99% !important; }
body.dark-mode table.tablegrdRequiredDocuments th{ color:#cdcdcd !important; }
body.dark-mode table tr.aspGridView_HeaderStyle th{ background-color:transparent !important; color:#ACACAC !important; }
body.dark-mode table tr.aspGridView_RowStyle,
body.dark-mode table tr.aspGridView_AlternatingRowStyle{ background-color: #2c2c2c !important; }
body.dark-mode .pnlpopupModal table td{ color:#cdcdcd; }
body.dark-mode .pnlpopupModal{ background-color:#232323; }
.rgNoRecords div{ color:#DE2222; text-align:center; }
.RadGrid table .rgHeader, .RadGrid table th.rgResizeCol{ background:#2C2C2C; color:#fff; }
.RadGrid table .rgHeader a{ color:#fff; }
tr.rgNoRecords td{ padding:10px; }
.contentDivIndent{ padding-bottom: 15px; border-radius: 0 0 10px 10px; }
.headTitleIndent{ border-radius:5px 5px 0 0; }
.headPanel{ text-align: center; background-color: #448a8a; padding: 3px; color: #fff; }
.mt-2{ margin-top:15px; }
.customTabDataView{ width: 100%; text-align: left; display: inline-flex; }
.tabDataItem{ padding: 15px; border:1px solid #ddd;  border-radius: 0 10px 10px; }
.tabViewItem{ padding:10px 30px !important; }
.tabDataItem .customBtns input[type="submit"]{ margin:0 3px 0 0; padding:6px 10px; background-color:#EE9B16 !important; border-color:#EE9B16; }
/*CSS Started for the overlay staff sidebar*/
.chat-input-container {
    position: absolute;
    width: calc(100% - 30px);
    bottom: 12px;
    padding-bottom: 15px;
    left: 12px;
    column-gap: 10px;
    display: flex;
    align-items: center;
}
.chat-input-container .emoji-btn {
    border: 0;
    background: transparent;
}
.chat-input-container .chat-textbox {
    height: 38px;
    padding: 5px 5px 5px 10px;
    border-radius: 5px;
    width: 70%;
    font-size: 13px;
}
.file-label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: none;
    border: none;
    color: #7e8c9a;
    cursor: pointer;
    border-radius: 50%;
    margin-right: 0;
    transition: all 0.2s;
}
.chat-input-container .chat-button {
    background: #404D61;
    color: #fff;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    border: 0;
}
.emoji-picker {
    position: absolute;
    bottom: 60px;
    left: 0;
    width: 320px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
    padding: 15px;
    z-index: 1000;
    display: none;
    max-height: 300px;
    overflow-y: auto;
}
.PhoneDirectorySearchPCSS .total-records-find p{ color:#fff; }
.file-info {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 8px;
    font-size: 14px;
    display: none;
}
.chat-messages {
    overflow: auto;
    height: 135px;
    background-color: #fff;
}
.side-staff-menu .scroll-wrapper .leftBarScroll{ height:calc(100vh - 110px) !important; }
.side-staff-menu .parent-div .btn-close{ z-index:1; right: 0; top: -5px; }
.emoji-btn { background: none; border: none; font-size: 16px; color: #7e8c9a; cursor: pointer; padding: 10px 0; border-radius: 50%; transition: all 0.2s; } 
.emoji-btn:hover, .emoji-btn.active{ color: #3498db; }
.filePreviewMessage{ position:absolute; bottom:-8px; font-size:11px; margin-top:5px; padding-left:30px; display:flex; align-items:center; }
.chat-textbox { flex: 1; padding: 15px 20px; border: 1px solid #e1e8ed; border-radius: 30px; font-size: 13px; outline: none; transition: all 0.3s; resize: none;
    min-height: 50px; max-height: 120px; }    
.chat-textbox:focus { border-color: #3498db; box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2); }
.no-mesages{ background: #f2f2f2; border: 1px solid #ebebeb; border-radius: 5px; font-size: 13px; padding: 5px; }
.file-label{ display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; background: none; border: none; color: #7e8c9a; cursor: pointer;
border-radius: 50%; margin-right:0; transition: all 0.2s; } 
.file-label svg { width: 24px; height: 24px; fill: currentColor; }   
.chat-button{ display: flex; align-items: center; justify-content: space-between; width: 50px; height: 50px; background-color: #3498db; border: none; border-radius: 50%; color: white; cursor: pointer; transition: all 0.3s; }    
.chat-button:hover{ background-color: #2980b9; transform: scale(1.05); }
.emoji-picker{ position: absolute; bottom: 60px; left: 0; width: 320px; background: white; border-radius: 12px; box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15); padding: 15px; z-index: 1000; display: none; max-height: 300px; overflow-y: auto; }
.emoji-category{ margin-bottom: 15px; }    
.emoji-category-title { font-size: 12px; font-weight: 600; color: #7e8c9a; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }      
.emoji-list{ display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
        
.emoji {
    font-size: 22px;
    cursor: pointer;
    padding: 5px;
    border-radius: 5px;
    transition: background-color 0.2s;
}
        
.emoji:hover {
    background-color: #f0f2f5;
}
        
.file-info {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 8px;
    font-size: 14px;
    display: none;
}
        
.file-info.show {
    display: block;
}
        
.file-name {
    font-weight: 500;
    margin-right: 2px;
}
        
.remove-file {
    color: #DE2222;
    cursor: pointer;
    font-weight: 500;
    font-size:13px;
    margin-left:4px;
}
        
.notification {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #4caf50;
    color: white;
    padding: 12px 20px;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    z-index: 10000;
    font-size: 14px;
    font-weight: 500;
    max-width: 300px;
}
        
.notification.error {
    background: #f44336;
}
        
.notification.warning {
    background: #ff9800;
}
        
.notification.info {
    background: #2196f3;
}
#fileInput,#fileInputSS,#fileInputSSPC{
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}
/* Message Styles */
.message-sender { font-weight: 600; font-size: 12px; margin-bottom: 4px; color: #666; }
.message.self .message-sender{ color: #007bff; text-align: right; }
.message .message-sender{ color: #28a745; }
.message {
    margin-bottom: 7px;
    padding: 4px 10px;
    border-radius: 8px;
    max-width: 95%;
    position: relative;
}
.message-status{ float:right; }
.message-footer{ display:flex; justify-content:space-between; }
.message-sender{ position:absolute; right:10px; }
.message.self{ margin-left: auto; background-color: #edfdec; }
.loading-messages{ color:#1e1e1e; }
.message-text{ word-wrap: break-word; line-height: 1.4; margin-bottom: 0px; font-size:13px; width:calc(100% - 25px); }
.message-attachment{ word-wrap: break-word; font-size:12px; width:calc(100% - 25px); }
.no-messages{ background:#f2f2f2; padding:5px; font-size:12px; border-radius:5px; border:1px solid #e1e8ed; margin-bottom: 8px; }
.message-time{ font-size: 11px; opacity: 0.8; margin-top: 4px; text-align: right; color: #666; }
.message.self .message-time{ color: rgba(12, 11, 11, 80%); }
.message:not(.self) .message-time{ color: #666; }
.chat-messages{ /*flex: 1; padding: 5px;   */ overflow: auto; height:135px; background-color: #fff; }
.side-staff-menu .chat-messages{ height:calc(100% - 55px); }
.message-sender .message-text{ color:#212121; }
/*CSS Ended for the overlay staff sidebar*/
.no-recordsData{ flex-direction:column; gap:4px; text-align:center; padding:0 10px; }
.no-recordsData h4{ font-size:14px; font-weight:700; }
.no-recordsData p{ font-size:13px; margin:0; }
.noRecordsText{ color:#d32f2f; }
.customPanelArea{ padding:0; }
/*Styles added for custom font size*/
.customGrdStyle td{ font-size:12px; font-family:"arial", sans-serif; }
.customGrdStyle th{ font-size:14px; color:#000; font-family:"arial", sans-serif; }
.lblCancelStatus{ color:#0000FF; }
.mt-4{ margin-top:10px !important; }
.CustomBtnLink{ color:#000099; }
.birthdayEvent { position: relative; overflow: hidden; }
.birthdayEvent::before,
.birthdayEvent::after {
  content: "";
  position: absolute;
  bottom: -80px;
  width: 25px;
  height: 40px;
  border-radius: 50%;
  animation: floatUp 12s linear infinite;
  opacity: 0.8;
}

/* Balloons */
.birthdayEvent::before {
  background: #ff4d4d;
  left: 0%;
  box-shadow:
    120px -40px #4da6ff,
    240px -20px #ffd11a,
    360px -60px #5cd65c;
  animation-delay: 0s;
}

.birthdayEvent::after {
  background: #b366ff;
  left: 0%;
  box-shadow:
    100px -30px #ff944d,
    220px -10px #4dd2ff,
    340px -50px #66ff99;
  animation-delay: 6s;
}

/* 🎈 Strings */
.birthdayEvent::marker {
  display: none;
}

.birthdayEvent::before,
.birthdayEvent::after {
  background-image:
    linear-gradient(#999, #999),
    linear-gradient(#999, #999),
    linear-gradient(#999, #999),
    linear-gradient(#999, #999);
  background-size:
    2px 60px,
    2px 60px,
    2px 60px,
    2px 60px;
  background-position:
    14px 50px,
    134px 10px,
    254px 30px,
    374px -10px;
  background-repeat: no-repeat;
}


@keyframes floatUp{
  0% {
    transform: translateY(0) translateX(0);
  }
  50% {
    transform: translateY(-200px) translateX(10px);
  }
  100% {
    transform: translateY(-500px) translateX(10px);
    opacity: 0;
  }
}
/*css Ended added for Overlay Events Section*/
@media (max-width: 767px){
    #div_help{ right: 5px; top: auto; bottom: 0; }
    #div_help_popup{padding-top: 30px;top:0px;}
    #div_help_popup .closebtn{right: 15px;top: 0;}
    .help_logo {text-align:center;}
    .slideLeft::before { position: fixed; content: ''; background: rgba (41, 35, 35, .75); height: 100%; width: 100%; z-index: 4; top: 0; }
    .attendance-wrapper .owl-nav{ top: 55%; }
    .owl-carousel .owl-nav button.owl-prev span,
    .owl-carousel .owl-nav button.owl-next span{ width:24px; height:24px; }
    .header-nav li.dropdownMenu .dropMessage ul{ width:280px; }
    .NavigationSearchPC{ width:96%; left:7px; }
}
@media screen and (max-width:767px){
    .versionData::before { background-size:20px; }
    .usefullNumbers{ flex-direction:column; column-gap:0; gap: 5px; }
}
@media screen and (min-width:1367px){
	.customSelectBox{ min-width:100%; }
}
@media screen and (min-width: 992px){
	.slideLeft{ padding-left: 0; transition: all 0.3s ease-in-out 0s; }
	.slideLeft .leftSidebar{ left: -400px; }
    .inner-wrapper{ min-height: calc(100vh - 225px); }
    .outerFormContent,body{ min-height:100%; }
    .custom-cards-section .item.itemCategory{ height:85px; flex-direction:initial !important; }
}
@media screen and (max-width: 1366px){
	.searchBoxItem{ width: calc(100% - 200px); }
	.timeRecords{ gap:8px; }
}
@media screen and (max-width: 1200px){
	.nav-filters .nav-link{ padding:.25rem .65rem; }
    .title{ font-size:16px; }
}
@media screen and (max-width: 1024px){
    .sectionOurTeam{ margin-bottom:25px; }
	.staffData{ margin-top:25px; }
	.boxRow{ flex-direction:column; gap:12px; }
	.boxRow h3{ width:100%; }
	.searchBox{ margin-left:initial; }
	.searchBoxItem .search-ann{ width:100%; }
	div.search-ann select.customSelectBox{ min-width:100%; }
	.nav-profile img{ width:32px; }
	.searchBoxItem{ justify-content: space-between; width: 100%; gap: 15px; flex-direction:column; }
	.dataSm{ display:none !important; }
	.switch-toggle{ width:70px; }
	.search-form input[type="text"].search-result{ background-position:8% center; }
	ul.dropdownMenu{ gap:12px; }
	.userMessage span{ font-size:16px; }
	.userMessage span:nth-child(2){ font-size:24px; }
	.userMessage span:nth-child(3){ font-size:12px; }
    .switch-toggle input[type=checkbox] + label.switch-toggle-label span{ font-size:0; }
    .switch-toggle input[type=checkbox] + label.switch-toggle-label span i{ font-size:14px; }
}
@media screen and (min-width: 1025px) and (max-width:1240px){
	.searchBoxItem{ width: 100%; }
}
@media screen and (max-width: 1180px){
    .staffData{ margin-top:25px; }
    .sectionAnnouncements{ height:690px; }
    .vertical-slider{ height:270px; }
}
@media screen and (max-width: 991px){
    .current-user-info{ background:#404D61; }
    .left-panel h2{ font-size:1.25rem; }
    .employee-info{ column-gap:2px; }
    .emp-data{ margin-bottom:1px; }
    .modal-title{ font-size:18px; line-height:1.15; }
    .modal-dialog{ width:90%; }
    .userMessage{ margin-bottom:10px; }
	.card-login{ width:90%; flex-direction:column; }
	.left-panel{ padding:24px; border-radius:15px 15px 0 0; }
	.right-panel{ padding:24px; }
	.login-card p{ font-size:15px; margin:0; }
	.login-links{ font-size:14px; }
	.outer-area{ margin-left:auto; }
	.scroll-container.all-announcements-listing{ height:240px; }
    .search-bar{ position: absolute; top: 45px; left: 0; width: 100%; padding: 15px; background: #fff; transition: 0.3s; box-shadow: 0px 0px 15px 0px rgba(1, 41, 112, 0.1); visibility: hidden; opacity: 0; }
	.bottom-header{ justify-content:end; }
	.mobile-header{ padding:5px 20px 5px 15px; }
	.logo{ width:65px; }
	.weatherWidget{ display:none !Important; }
	.searchOuter .search-bar { visibility: visible; opacity: 1; top: 50px; }
	.search-bar .search-form input[type="text"].search-result{ background-position:12px center; height:40px; }
	.category-items{ flex-wrap:nowrap; }
	.category-items .sliderLink{ flex-shrink:0; }
    .main-wrapper{ padding:60px 0 0; }
    .header .header-left{ width:auto; gap: 20px; padding: 10px; }
    .slideLeft .header-left{ width:100%; padding:5px 10px; }
    .closeItLeft{ font-size:18px; }
    .custom-cards-section .item.itemCategory{ flex-direction:column; justify-content: center; align-items:flex-start; }
    .modal-dialog{ width:90%; }
    .btn-view{ font-size:12px; padding:0 7px; }
    .mobileclasschk{ padding:0; align-items:center; }
    .mobileclasschk label{ margin:0; font-size:13px; }
    .mobileclasschk label i{ margin-right:4px; }
    #uims_sidebar .scroll-bar.scroll-content .leftBarScroll{ height:calc(100vh - 105px) !important; }
    .sectionAnnouncements{ height:auto; }
	.scroll-container.all-announcements-listing{ height: 300px; }
	.scroll-container.all-announcements-listing div#divAnnouncements { height: 300px; }
	.owl-carousel .owl-nav button.owl-prev{ margin-left:-10px; }
	.owl-carousel .owl-nav button.owl-next{ right: -10px; }
	.header-left .navbar-toggler{ top:3px; position:relative; }
    .top-footer,.bottom-footer{ flex-direction:column; }
    .footer-txt{ width:100%; }
     .content-Area.content-AreaChatConv{ margin-left:15px; }
     .SearchBarActive{ opacity:1; visibility:visible; }
     .SearchBarActive .Navigation_Search{ padding-top:20px; }
     .myTab ul li a.rtsLink{ width:100%; }
}
@media (max-width: 767px){
	.mobile-header{ padding: 10px 20px 10px 15px; }
	header.sticky{ height:55px; }
	.messageBoxContent,
	.meetingCal{ margin-bottom:30px; }
	.main-wrapper{ padding-top:60px; }
	.taskSection{ margin-bottom:30px; }
	.switch-toggle{ width:50px; height:30px; }
	.switch-toggle input[type=checkbox] + label.switch-toggle-label{ gap:3px; }
	.switch-toggle input[type=checkbox] + label.switch-toggle-label span{ padding-left:1px; }
	.dropdownMenu{ gap:12px; }
	.category-items .sliderLink h4{ font-size:14px; }
	.category-items .sliderLink{ width:50%; }
	.mobile-header .navbar-toggler-icon i{ font-size:20px; }
    div#ContentPlaceHolder1_short_links{ margin-left:-15px; }
    .contentInnerData{ padding:0; }
    .vertical-slider{ height:280px; }
}
@media (max-width: 576px){
  .login-card img{ width: 100px; }
  .login-card h4{ font-size: 1.5rem; }
  .login-card h5{ font-size: 1rem; }
  .btn-login{ font-size: 0.95rem; }
}
@media (max-width: 480px){
	.calendar-header{ font-size: 13px; padding: 12px 35px; }
	.calendar-table td{ padding: 6px; font-size: 12px; }
	.calendar-header small{ font-size: 11px; }
}
.divScrollBarData{ height: 480px; overflow: auto; width: auto; }
.tableBg{ width: 100%; background-color: #EEEEEE; }
.modal-header .btn-close,
.parent-div .btn-close{ background:url(../images/icon-close.svg) no-repeat center; width: 24px; height: 24px; margin-left: auto; border: 0; background-size: 20px; }
.parent-div .btn-close{ position:absolute; right:15px; top:10px; cursor:pointer; background-size:20px; opacity:1; }
.employeeList .parent-div .btn-close{ top:-5px; right:10px; }
.mobilechkbox .message:not(.self){ background:transparent; border:0; padding:0; }
.mobileclasschk .mobilechkbox{ display:flex; align-items:center; }
.mobileclasschk .mobilechkbox input[type="checkbox"]{ margin:2px 0 0 4px; }
.eventsSlider .btn-close{ right:10px; top:10px; }
.frm-swcr i{ margin-right:4px; }
.swcRequestBlockHead{ background-color: #F8F8F8; border-top: 3px solid #97CB95; border-bottom: 1px solid #97CB95; }
.iconFlip{ width: 20px; height: 15px; transition: color 0.3s ease, transform 0.3s ease; }
.iconFlip path{ color: #3F3F3F; }
.CustomModal .modal-dialog{ min-width:450px;  }
.tabsDataDiv .tab-item,
.tab-itemPanel .tab-item{ padding: 10px 30px; color:#333; border: 1px solid #ddd; box-shadow: none !important; border-radius: 10px 10px 0 0; border-bottom: 0 !important; }
.tab-itemPanel{ display:flex; gap:2px; }
.centercss.panelArea,
.panelArea.tabDataBox{ border-radius:0 10px 10px; }
.tabItem{ padding: 10px 30px; color:#222; border: 1px solid #ddd; box-shadow: none !important; border-radius: 10px 10px 0 0; border-bottom: 0 !important; }
.CustomBtnLinkTxt{ color:#800000; }
.CustomBtnLinkTxt2{ color:#000099; }
/*Styles Starts for the Dark Mode*/
body.dark-mode .reContentCell,
body.dark-mode .reContentCell iframe{ background-color:#222; }
body.dark-mode .mobilechkbox .message:not(.self){ color: #ACACAC; }
body.dark-mode .task-info .infoText i.message,body.dark-mode .task-info .infoText i.emailIcon{ color:#888; }
body.dark-mode .RadCalendar_Default .rcWeek th{ background-color:transparent; }
body.dark-mode textarea{ background-color:#3B3B3B; border-color: #555; }
body.dark-mode .table-hover>tbody>tr:hover{ background-color:#2c2c2c; }
body.dark-mode .highcharts-background{ background-color:#2c2c2c; fill:#2c2c2c; }
body.dark-mode .highcharts-axis-labels text,
body.dark-mode text.highcharts-title{ color:#a3a3a3 !important; fill:#a3a3a3 !important; }
body.dark-mode .highcharts-column-series text{ color:#a3a3a3 !important; fill:#a3a3a3 !important; }
body.dark-mode .CustomBtnLink{ color:#fff; }
body.dark-mode .CustomBtnLinkTxt{ color:#939393; }
body.dark-mode .CustomBtnLinkTxt2{ color:#df8989; }
body.dark-mode .ajax__tab_xp .ajax__tab_body{ background-color:transparent; }
body.dark-mode .ajax__calendar_days table tr:nth-child(even){ background-color:transparent; }
body.dark-mode table.summary-table th{ background-color:transparent; }
body.dark-mode .sticky-wrap{ background-color:#151515 !important; }
body.dark-mode textarea.form-control{ color:#b9b9b9; } 
body.dark-mode .scrollBarModal{ background:#232323; }
body.dark-mode .boxes .boxItem{ background-color:#262626; border-color:rgba(76 79 80 / 30%); }
body.dark-mode table.tablularView th{ background-color:#282828; }
body.dark-mode .boxes .boxItem label{ background-color:#424242; }
body.dark-mode .boxes .boxItem .count a{ color:#cdcdcd; }
body.dark-mode .row-records{ border-color:#444444; }
body.dark-mode .iconFlip path{ fill:#fff; }
/*style added for for file explore pages in dark mode*/
body.dark-mode .RadFileExplorer,body.dark-mode .RadFileExplorer *{ color:#fff; }
body.dark-mode .tabsDataDiv .tab-item{ color: #2c2c2c; }
/*style added for file explore pages in dark mode*/
body.dark-mode .taskAccrodion h3.ui-accordion-header{ background-color:#232323; color:#fff; }
body.dark-mode .taskAccrodion h3.ui-accordion-header i{ color:#cdcdcd !important; }
body.dark-mode .taskAccrodion .ui-widget-content{ background-color:#232323; }
body.dark-mode div#divCrmFeedbackDetails .modal-header{ border-color:#5f5f5f; }
body.dark-mode .chat-messages{ background: transparent; border: 0; }
body.dark-mode .message-text{ color:#000; }
body.dark-mode .chat-input-container .chat-textbox{ background:#343232; color:#cdcdcd; border-color:#5d5d5d; }
body.dark-mode .chat-input-container textarea.chat-textbox::placeholder{ color:#cdcdcd; }
body.dark-mode .chat-input-container .chat-textbox:focus{ border-color:#5d5d5d; }
body.dark-mode .swcRequestBlockHead{ background-color: #5f5f5f; border-top: 3px solid #242424; border-bottom: 1px solid #2c2c2c; }
body.dark-mode .text-end a{ color:#fff; }
body.dark-mode .swcRequestBlock{ background-color:#202020; }
body.dark-mode{ background-color: #121212; color: #f1f1f1; }
body.dark-mode hr{ border-color:#5f5f5f; }
body.dark-mode .tabViewItem{ color:#5a5a5a; }
body.dark-mode textarea.form-control{ background-color: #3B3B3B; border-color: #555; }
body.dark-mode select{ background-color: #3B3B3B; border-color: #555; color: #cdcdcd; }
body.dark-mode .modalAddWidget .modal-header{ border-color:#5d5d5d; }
body.dark-mode .panelArea{ background:#2F2F2F; border-color:#3e3e3e; }
body.dark-mode .theme-img { content: url("../images/login-logo-light.png"); }
body.dark-mode .themeEmail{ content: url("../images/icon-email-light.svg"); }
body.dark-mode .themePhone{ content: url("../images/icon-phone-light.svg"); }
body.dark-mode .customTabDataView{ width: 100%; text-align: left; }
body.dark-mode .uims-sidebar{ background:#212121; }
body.dark-mode .search-ann select{ background-color:#3B3B3B; border-color:#555; color:#cdcdcd; }
body.dark-mode .imp-msg-footer{ background:rgba(255, 255, 255, .25); }
body.dark-mode .imp-msg-footer .slick-current.slick-active{ background: #2C2C2C; color: #fff; }
body.dark-mode .imp-msg-footer .slick-current.slick-active a,
body.dark-mode .imp-msg-footer .slick-track .slick-slide a{ color:#fff; }
body.dark-mode .messageList ul::-webkit-scrollbar-thumb { background: #6C6E71; }
body.dark-mode .messageList ul { scrollbar-width: thin; scrollbar-color: #6C6E71 transparent; }
body.dark-mode .imp-msg-footer .st a span{ color:#fff; }
body.dark-mode .uims-sidebar li a{ color:#A9A9A9; }
body.dark-mode .uims-sidebar li a:hover{ color:#f1f1f1; }
body.dark-mode .menu-content li ul.collapse.show{ background:#353535; }
body.dark-mode .attendance-slider .card{ background:#202020; color:#e1e1e1; border-color: #1c1c1c; box-shadow: 0 2px 8px rgb(8 8 8 / 40%); }
body.dark-mode .listItemLec{ background:#2F2F2F; border:1px solid #4a4a4a54; }
.job-body.dark-mode .searchIndent input[type="text"]{ color:#cdcdcd; }
body.dark-mode input[disabled="disabled"]:hover{ background-color: #545454 !important; }
body.dark-mode .infoData,
body.dark-mode .timeStamp{ color:#b7b7b7; }
body.dark-mode .commonBox{ background:#242424; }
body.dark-mode .header-nav ul.dropdown-menu{ background-color:#181818; }
body.dark-mode .header-nav ul.dropdown-menu>li>a{ color:#adadad; }
body.dark-mode .header-nav ul.dropdown-menu>li>a:focus,
body.dark-mode .header-nav ul.dropdown-menu>li>a:hover{ background-color:#323232; color:#ebebeb; }
body.dark-mode .header-nav ul.dropdown-menu-arrow::before{ background-color:#181818; }
body.dark-mode .header-nav li.dropdownMenu .dropMessage ul li{ color:#adadad; background-color:#181818; }
body.dark-mode .header-nav li.dropdownMenu .dropMessage ul li:hover{ background:#323232; }
body.dark-mode .tabDataItem{ border:1px solid #383838; background: #272727; }
body.dark-mode .total-records-find p{ color:#fff; }
body.dark-mode .task-card,
body.dark-mode .employee-card{ background:#2F2F2F; }
body.dark-mode .task-info h6,
body.dark-mode .employee-info h6{ color:rgb(255 255 255 / 80%); }
body.dark-mode .employee-info h6 span{ color:#787878; }
body.dark-mode .employee-info p,
body.dark-mode .event-details .time{ color:#b7b7b7; }
body.dark-mode .employee-info .email,
body.dark-mode .event-details .location{ color:#8d8d8d; }
body.dark-mode table th{ color:#ACACAC; border-bottom:2px solid #606060 !important; background-color:#3e3e3e; }
body.dark-mode .summary-table table th{ background-color:transparent; }
body.dark-mode .slick-dots li button:before{ color:#fff; }
body.dark-mode .summary-table tbody td{ background-color:transparent; color:#C8C8C8; }
body.dark-mode .summary-table tbody td a{ color:#C8C8C8; }
body.dark-mode .tableData{ border-color:#5d5d5d; }
body.dark-mode .tableData td a{ color:#C8C8C8; }
body.dark-mode .announcement-thumbnail .attachment a{ color:#a7a7a7; }
body.dark-mode .dataOptions .navTabList button.nav-link{ border-color:#5d5d5d; background:rgba(97, 97, 97, .53); }
body.dark-mode .dataOptions .navTabList .nav-item.active .nav-link{ background:#2C2C2C; }
body.dark-mode .tabListContent .nav-link{ color:#C0C0C0; border-color:#5d5d5d; }
body.dark-mode .navTabList li button.nav-link.active,
body.dark-mode .tabListContent .nav-item.active .nav-link{ background-color:#2C2C2C; }
body.dark-mode .event-card,
body.dark-mode .job-card{ background-color:#2F2F2F; color:#f1f1f1; border-color:#5d5d5d; }
body.dark-mode .event-card:hover{ border-color:#5d5d5d; }
body.dark-mode .job-title{ color:rgb(255 255 255 / 80%); }
body.dark-mode .job-meta,
body.dark-mode .job-meta .bi{ color:#8d8d8d; }
body.dark-mode .menuAccordion .accordion-item .accordion-collapse div.accordion-body{ background:#353535; }
body.dark-mode .nav-filters .nav-link{ color:#767676; border-color:#767676 !important; }
body.dark-mode .nav-filters .nav-link.active{ background-color:#767676; color:#e9e9e9; border-color:#a5a5a5 !important; }
body.dark-mode .imp-msg-list ul li{ color:#8C8C8C; position:relative; }
body.dark-mode .imp-msg-list ul li:before{ content:''; position:absolute; width:100%; background: rgb(18 18 18 / 50%); z-index:-1; border-radius:6px; height: 100%; top: 0; left: 0; }
body.dark-mode .imp-msg-list ul li b{ color:#c8c8c8; }
body.dark-mode .imp-msg-list ul li p{ color:#a1a1a1; }
body.dark-mode .searchBox .inp-box{ background-color:#3B3B3B; border-color:#555; }
body.dark-mode div.divCourseCodeChkClass{ border:0 !important; background-color:rgba(0, 0, 0, .5) !important; overflow:auto !important; }
body.dark-mode .divCourseCodeChkClass table tr{ background-color:#2c2c2c; }
body.dark-mode table.tableMentorCallingResult td{ border:0; }
body.dark-mode input[type=text],
body.dark-mode input[type=password]{ background-color:#3B3B3B; border-color:#555; color: #cdcdcd; }
body.dark-mode .searchData input[type="text"]{ background-color:transparent; color:#f1f1f1;} 
body.dark-mode .searchData input[type="text"]::placeholder{ color:#cdcdcd; }
body.dark-mode .header-nav li.dropdownMenu .dropMessage{ background:#181818; padding:0; }
body.dark-mode .header-nav li.dropdownMenu .dropMessage::before{ background:#181818; border-color:#5f5f5f; width:11px; height:11px; }
body.dark-mode .customSelectBox{ background:#3B3B3B url(../images/icon-arrow-drop.svg) no-repeat 98% center; background-size:10px; border-color: #5d5d5d; }
body.dark-mode input[type=text]::placeholder{ color:#CACACA; }
body.dark-mode .iconNotification{ color:#fff; }
body.dark-mode .u-name{ color:#B4B4B4; }
body.dark-mode .RadComboBox_Default .rcbReadOnly input[type="text"].rcbInput{ color:#cdcdcd; }
body.dark-mode .contentDivIndent{ background-color: #2F2F2F; }
body.dark-mode .header-nav ul li a.nav-profile .uid{ color:#919191; }
body.dark-mode .headTitleIndent{ background-color: beige; font-weight:600; color:#212121; }
body.dark-mode header.sticky{ background-color:#3e3e3e; }
body.dark-mode .topLinks a{ color:#919191; }
body.dark-mode .itemList{ background:#3B3B3B; }
body.dark-mode .imp-msg-list ul li i{ color:#f1f1f1; }
body.dark-mode .imp-msg-list ul.bottomList li a.active{ background:#222; }
body.dark-mode .dropdown-menu.profile.show{ background:#222; }
body.dark-mode .category-items .sliderLink{ background:#232323; color:#fff; }
body.dark-mode .item.bg-lightGray,
body.dark-mode .item.bg-section,
body.dark-mode .item.bg-lightCream,
body.dark-mode .item.bg-lightGreen,
body.dark-mode .item.bg-lightPeach,
body.dark-mode .custom-cards-section .item.bg-brown,
body.dark-mode .custom-cards-section .item.bg-cyan,
body.dark-mode .custom-cards-section .item.bg-red,
body.dark-mode .custom-cards-section .item.light-brown,
body.dark-mode .owl-carousel .item,
body.dark-mode .custom-cards-section .item{ background:#232323; border:1px solid #423f3fc4; color:#fff; }
body.dark-mode .owlslider .itemCategory.bg-red,
body.dark-mode .owlslider .itemCategory.bg-cyan{ background:#1E1E1E; border:1px solid #423f3fc4; }
body.dark-mode .owlslider .itemCategory.bg-section{ background:#232323; border:1px solid #423f3fc4; }
body.dark-mode .owlslider .itemCategory.bg-brown{ background:#252525; border:1px solid #423f3fc4; }
body.dark-mode .owlslider .itemCategory.light-brown{ background:#2C2C2C; border:1px solid #423f3fc4; }
body.dark-mode .owlslider .itemCategory.light-gray{ background:#404040; border:1px solid #686868c4; color:#B80101; }
body.dark-mode .item.bg-lightYellow{ background:#232323; border:1px solid #423f3fc4; }
body.dark-mode .itemCategory img{ opacity:.5; }
body.dark-mode .custom-cards-section .item img{ opacity:.5; }
body.dark-mode .modal-content{ background:#424242; }
body.dark-mode .modal-header .btn-close,
body.dark-mode .btn-close{ background:url(../images/icon-modal-close.svg) no-repeat center; background-size:20px; }
/*.event-details{ height:270px; }
.eventsSlider .event-details{ padding:0; margin:0; border:0; }*/
.boxContentDiv .event-details{ padding:0; margin:0; border:0; }
.dateView{ color:#DE2222; gap: 10px; }
.desc{ font-size:13px; margin:5px 0; line-height:1.45; }
.mt-15{ margin-top:15px; }
.mt-20{ margin-top:20px; }
.ui-tooltip{ font-size:11px !important; padding:5px 7px !important; background:#121212 !important; color:#fff !important; box-shadow:none !important; border:1px solid #5d5d5d !important; }
body.dark-mode .ui-tooltip{ border-color:#a3a3a3 !important; }
body.dark-mode .calendar-card{ background-color:#2c2c2c; border-radius:12px 12px 0 0; }
body.dark-mode .calendar-header{ background-color:#181818; }
body.dark-mode .calendar-card .calendar-table td{ border-color: #404040; color: #bdbdbd; }
body.dark-mode .nav-timetable .nav-link.active,
body.dark-mode .nav-timetable .nav-link:hover{ background-color: #2C2C2C; }
body.dark-mode .summary-table thead{ background-color: transparent; }
body.dark-mode .nav-timetable{ border-color: #606060; }
body.dark-mode .announcement-thumbnail{ background-color: #272727; border:1px solid #383838; }
body.dark-mode .announcement-thumbnail p,
body.dark-mode .announcement-thumbnail span{ color: #C8C8C8; }
body.dark-mode .announcement-thumbnail h2{ color: #ACACAC; }
body.dark-mode .content-boxes .catSection .sliderLink{ border:1px solid #282828; background-color:#232323; color:#f1f1f1; }
body.dark-mode .content-Area{ background-color:#1D1D1D; }
body.dark-mode .headPanel{ text-align: center; background-color: #242424; padding: 3px; color: #fff; }
body.dark-mode table.grdStyle tr{ background-color:#232323; }
body.dark-mode tr:nth-child(even){ background-color:#2c2c2c; }
body.dark-mode .pnlpopupModal tr:nth-child(even){ background-color:transparent; }
body.dark-mode .leftPanel{ color:#bbbbbb; }
body.dark-mode .w-icon svg .sunRays,
body.dark-mode .w-icon .sunRays path{ fill:#bbbbbb; }
body.dark-mode .w-icon svg path{ fill:#bbbbbb; }
.partly-cloudy-night svg path.moon,
.clear-day svg path.moon{ display:none; }
dark-mode .content-Area{ background-color:#1D1D1D; }
body.dark-mode .weatherWidget{ background-color:#3a3a3a36; color:#bbbbbb; }
body.dark-mode .leftPanel{ color:#bbbbbb; }
body.dark-mode .w-icon svg .sunRays,
body.dark-mode .w-icon .sunRays path{ fill:#bbbbbb; }
.shiftColor{ fill:yellow; color:yellow; }
body.dark-mode .userMessage span.line{ color:#cdcdcd !important; }
body.dark-mode .userMessage span.line:nth-child(2){ color:#f1f1f1 !important; }
body.dark-mode .search-form input[type="text"].search-result{ background-color: #303030d1 !important; border-color: #55555500; color:#f1f1f1; }
body.dark-mode .task-input button,
body.dark-mode .searchData button{ background-color: #242424; border-color: #242424; }
body.dark-mode .searchData .form-control{ background-color: #ffffff00; border-color: #242424; }
body.dark-mode .task-input button{ background-color:#000; border-color:#000; }
body.dark-mode .task-input button:hover,
body.dark-mode .task-input button:focus,
body.dark-mode .searchData button.btn:hover,
body.dark-mode .searchData button.btn:focus{ background-color: #242424; border-color: #242424; }
body.dark-mode .overlay-contentDiv{ background-color: #242424; border-color: #242424; color:#ACACAC; }
body.dark-mode .overlay-contentDiv h6{ color:#f1f1f1; }
body.dark-mode .overlay-contentDiv h6 .close{ right:0; top:-7px; }
body.dark-mode .overlay-contentDiv textarea.messageArea{ background-color:rgba(58 58 58 / 65%); border-color:#5d5d5d; }
body.dark-mode .overlay-contentDiv textarea.form-control,
body.dark-mode .overlay-contentDiv .form-control{ background-color:#3B3B3B; border:1px solid #555; color:#CACACA; }
body.dark-mode .overlay-contentDiv .form-control:focus{ outline:none; box-shadow:none; }
body.dark-mode .owlCards .owl-item img{ opacity:.5; }
body.dark-mode .icon-theme{ color:#A9A9A9; }
body.dark-mode .footer{ background:#242424; }
body.dark-mode .footer-txt,
body.dark-mode .footer-txt a{ color:rgba(255 255 255 / 80%); }
body.dark-mode table td{ border-color:#5d5d5d; }
body.dark-mode .m-txt a{ color:rgb(255 255 255 / 80%); }
body.dark-mode table td{ border-color:#5d5d5d; }
body.dark-mode .moreAction{ background:rgb(153 55 55); }
body.dark-mode .userMessage span:nth-child(3):before{ background-image:url(../images/icon-quoteleft-light.svg); }
body.dark-mode .userMessage span:nth-child(3):after{ background-image:url(../images/icon-quoteright-light.svg); }
body.dark-mode .menuData ul ul.sub-menu.collapse.in{ background:#2e2e2e; }
body.dark-mode .menuAccordion .accordion-header button{ color:#A9A9A9; background: transparent; }
body.dark-mode .NavigationSearchPC{ background-color:#3B3B3B; border-color: #484848; }
body.dark-mode .NavigationSearchPC li a{ color:#f1f1f1; }
body.dark-mode .NavigationSearchPC li a:hover{ background-color:#4c4c4c; }
body.dark-mode .nav-search-tags ul li a{ color:#f1f1f1; background-color:#4c4c4c; }
body.dark-mode .nav-search-breadcrumb{ color:#cdcdcd; }
body.dark-mode .search-form .total-results{ color:#b3b3b3; }
body.dark-mode .userMessage span:nth-child(3){ -webkit-text-fill-color:#8989895c; }
body.dark-mode .iconWeather path{ fill: #F0F0f0; }
/*Css added for Inner pages*/
body.dark-mode .usefullNumbers p a{ color:#fff; }
body.dark-mode .contentTabItem ul.rtsUL li a.tab{ background-color: rgba(255, 255, 255, .25); border:1px solid #E5E6EB; color:#C0C0C0; }
body.dark-mode .contentTabItem ul.rtsUL li a.tab.hoveredTab span.rtsTxt,
body.dark-mode .contentTabItem ul.rtsUL li a.tab.selectedTab span.rtsTxt{ background-color: #2C2C2C; color:#fff; }
body.dark-mode div.demo-container .contentTabItem.RadTabStrip ul.rtsUL li a.tab.hoveredTab span.rtsTxt,
body.dark-mode div.demo-container .contentTabItem.RadTabStrip ul.rtsUL li a.tab.hoveredTab span.rtsTxt,
body.dark-mode div.demo-container .contentTabItem.RadTabStrip ul.rtsUL li a.tab.selectedTab span.rtsTxt{ background-color:transparent; }
body.dark-mode .tabData{ border-top:6px solid #2C2C2C; }
body.dark-mode legend{ color:#ababab; }
body.dark-mode .riSingle .riTextBox[type="text"]{ color: #cdcdcd; background: #3B3B3B; border-color: #5f5f5f; }
body.dark-mode select.form-control[disabled],
body.dark-mode select.form-control[readonly],
body.dark-mode select.form-control[disabled]{ background-color:#545454; }
body.dark-mode ui-datepicker-calendar table td{ border:0; }
body.dark-mode .select2-container .select2-choice{ background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0, #ffffff), color-stop(0.5, #a5a5a5)); border-color: #555; }
body.dark-mode table td.form_header{ border:0; }
body.dark-mode input:-internal-autofill-selected{ background-color:#3B3B3B; }
body.dark-mode .empInfo label{ color:#dcdcdc; }
body.dark-mode .empInfo span{ color:#dcdcdc; font-weight:700; }
body.dark-mode div.dd_chk_select{ background-color: #3B3B3B; border-color: #555; color: #cdcdcd; }
body.dark-mode .contentDiv{ background: #202020; }
body.dark-mode .contentDiv .subhead{ color: #c1c1c1; }
body.dark-mode .contentDiv .description p{ color: #6f6c6c; }
body.dark-mode textarea:disabled{ background-color:#3B3B3B; border-color:#555; color:#cdcdcd; }
body.dark-mode .tableBg{ background-color: transparent; }
body.dark-mode div.ledger-container{ background:#222222; }
body.dark-mode div.customChart1{ background-color:#2e2d2d; }
body.dark-mode .loading-messages{ color:#fff; }
body.dark-mode .side-staff-menu{ background-color:#080808ed; }
.loading-messages{ text-align:center; }
/*Css for inner pages issues*/
@keyframes placeholder-wave{
    100% {
        -webkit-mask-position: -200% 0%;
        mask-position: -200% 0%
    }
}
/*Styles Ends for the Dark Mode*/
.header-nav .userInfo .nav-profile{ border:0; background:transparent; }
/*Code Start to resolve the Focus issue*/
@supports (-webkit-touch-callout: none){
  @media (max-width: 820px) and (hover: none) and (pointer: coarse) {
	html, body { overscroll-behavior: none; }
	  input, textarea, select{ -webkit-user-select: text !important; -webkit-overflow-scrolling: auto; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; appearance: none; transform: translateZ(0); position: relative; z-index: 1; }
	  *:focus {
		scroll-margin-bottom: 200px;
	  }
	}
}
/*Code End to resolve the Focus issue*/