.blink_text
{
    animation:1s blinker linear infinite;
    -webkit-animation:1s blinker linear infinite;
    -moz-animation:1s blinker linear infinite;
    color: red;
}

@-moz-keyframes blinker{  0% { opacity: 1.0; } 50% { opacity: 0.0; } 100% { opacity: 1.0; }}
@-webkit-keyframes blinker {  0% { opacity: 1.0; } 50% { opacity: 0.0; } 100% { opacity: 1.0; }}
@keyframes blinker {  0% { opacity: 1.0; } 50% { opacity: 0.0; } 100% { opacity: 1.0; }}

.onboarding-checklist-widget {
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.onboarding-checklist-widget .widget-header {
    cursor: pointer; /* Indicate header is clickable for toggle */
}

.onboarding-checklist-widget .step-list {
    max-height: 200px; /* Or adjust */
    overflow-y: auto;
}

.onboarding-checklist-widget .step-item .step-check {
    flex-shrink: 0; /* Prevent icon from shrinking */
}
.onboarding-checklist-widget .step-item .step-text a {
    color: #4e73df; /* Bootstrap primary or your theme color */
    text-decoration: none;
}
.onboarding-checklist-widget .step-item .step-text a:hover {
    text-decoration: underline;
}

/* Style for completed step text when line-through is applied */
.onboarding-checklist-widget .step-item .step-text a[style*="line-through"] {
    color: #6c757d !important; /* Bootstrap muted color */
}

.session-card {
    /* Ensures the card itself doesn't shrink unnecessarily if content is small */
    min-height: 280px; /* Adjust as needed based on content */
    display: flex; /* Enable flexbox for card body alignment */
    flex-direction: column; /* Stack card header and body vertically */
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; /* Smooth hover effect */
}

.session-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.10)!important; /* Slightly more prominent shadow on hover */
}

.session-card .card-header {
    /* background-color: #f8f9fc; */ /* Light background for header if needed */
    /* border-bottom: 1px solid #e3e6f0; */ /* Standard border */
    padding: 0.75rem 1.25rem; /* Standard Bootstrap card header padding */
}

.session-card .card-body {
    padding: 1.25rem; /* Standard Bootstrap card body padding */
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Make card body take available space */
}

.manual-upload-drop-area {
    border: 2px dashed #adb5bd; /* Dashed border - Bootstrap's gray-500 */
    border-radius: 0.3rem;     /* Slightly rounded corners */
    padding: 2rem 1rem;        /* Ample padding */
    text-align: center;
    cursor: pointer;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    background-color: #f8f9fa; /* Light background - Bootstrap's gray-100 */
    color: #6c757d;            /* Muted text color - Bootstrap's gray-600 */
    display: flex;             /* For centering content */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-grow: 1; /* Allow drop area to take remaining space in card body */
    min-height: 150px; /* Ensure a minimum tappable area */
}

.manual-upload-drop-area:hover {
    background-color: #e9ecef; /* Slightly darker on hover - Bootstrap's gray-200 */
    border-color: #007bff;     /* Primary color border on hover */
}

.manual-upload-drop-area.dragover {
    background-color: #cfe2ff; /* Lighter primary color when dragging over - Bootstrap's primary-100 */
    border-color: #0056b3;     /* Darker primary color border */
    border-style: solid;       /* Change to solid border during drag */
}

.manual-upload-drop-area i { /* Styling for the upload icon */
    display: block; /* Make icon block for margin to work */
    margin-bottom: 0.75rem;
}

.manual-upload-drop-area p {
    margin-bottom: 0.25rem;
}
.step-guide-icon {
    font-size: 1.5rem; /* Adjust icon size within the circle */
}

.list-styled {
    padding-left: 1.5rem;
}
.list-styled li {
    position: relative;
    padding-left: 1.2rem;
    margin-bottom: 0.3rem;
}
.list-styled li::before {
    content: "\f058"; /* Font Awesome check-circle solid */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    color: #1cc88a; /* Bootstrap success color or your primary */
}

.get-started-section {
    border: 1px solid #e3e6f0; /* Light border to match card style */
    animation: fadeIn 0.5s ease-in-out; /* Simple fade-in */
}

.get-started-section .step-number {
    line-height: 1;
}

.get-started-section .card {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.get-started-section .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.page-content-wrapper{
	animation: fadeIn 0.5s ease-in-out; /* Simple fade-in */
}


/* Help Sidebar Styles */
.help-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0; /* Or height: 100vh; */
    width: 350px; /* Adjust width as needed */
    background-color: #ffffff;
    border-left: 1px solid #e3e6f0;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
    z-index: 1040; /* Above most content, below modals potentially */
    transform: translateX(100%); /* Start hidden */
    transition: transform 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* Prevent content overflow during transition */
    
}

.help-sidebar.active {
    transform: translateX(0); /* Slide in */
}

.help-sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
}

.help-sidebar-header .close {
    padding: 0.75rem 1.25rem;
    margin: -0.75rem -1.25rem -0.75rem auto; /* Align close button properly */
    font-size: 1.5rem;
    opacity: 0.7;
}
 .help-sidebar-header .close:hover {
    opacity: 1;
 }

input[name='googleSignIn']{
	    background-image: url(https://img.icons8.com/color/16/000000/google-logo.png);
    background-repeat: no-repeat;
    background-position-x: 28%;
    background-position-y: 60%;
}

.help-sidebar-title {
    margin-bottom: 0;
    font-size: 1.1rem;
    font-weight: bold;
    color: #5a5c69;
}

.help-sidebar-content {
    padding: 1.25rem;
    overflow-y: auto; /* Enable scrolling for content */
    flex-grow: 1; /* Take remaining vertical space */
}

/* Style content within the help sidebar */
.help-sidebar-content p {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #5a5c69; /* Bootstrap default text color */
    margin-bottom: 1rem;
}

.help-sidebar-content ul {
    padding-left: 1.2rem;
    margin-bottom: 1rem;
}

 .help-sidebar-content li {
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
 }

 .help-sidebar-content i { /* Style icons within help */
    margin-right: 0.3rem;
    color: #858796; /* Adjust icon color */
 }



.vh-100 {
  min-height: 100vh; /* Use min-height for flexibility */
}

.sidebar-brand-text{
	font-size:0.8rem;
}

/* Style the "OR" separator if Bootstrap's text-muted isn't enough */
.separator::before,
.separator::after {
    content: "";
    flex-grow: 1;
    background-color: #e5e7eb; /* Light gray line color */
    height: 1px;
    margin: 0 16px; /* Space around the text */
}
.separator {
    display: flex;
    align-items: center;
    color: #6c757d; /* text-muted color */
    font-size: 0.8rem;
    margin-top: 1.5rem; /* Adjust spacing */
    margin-bottom: 1.5rem;
}


/* Style the forgot password link if default link style isn't desired */
.forgot-link {
    color: #007bff; /* Standard Bootstrap link color */
    font-size: 0.8rem;
}
.forgot-link:hover {
    text-decoration: underline;
}


.table tr td:first-child, .table tr th:first-child{
	padding-left:1rem;
}

/* Style the Google button if default btn-light needs tweaks */
.google-button {
    /* Example: border color */
    border-color: #dee2e6;
}
.google-button img {
    height: 16px; /* Ensure icon size is controlled */
    width: 16px;
}

/* Add focus styles for accessibility if desired */
.form-control:focus {
    border-color: #80bdff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-check-input:focus {
     box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* Add to login-styles.css or create registration-styles.css */

/* Add styles for bootstrap's is-invalid class if needed,
   though bootstrap usually handles border colors. */
.form-control.is-invalid {
    border-color: #dc3545; /* Bootstrap's danger color */
}

.form-check-input.is-invalid ~ .form-check-label {
    color: #dc3545; /* Make label red */
}

.form-check-input.is-invalid {
     border-color: #dc3545; /* Add border to checkbox */
     box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); /* Focus shadow */
}

/* admin-styles.css */

body {
  font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #858796; /* Default text color */
  background-color: #f8f9fa;
}

#wrapper {
  display: flex;
}

#content-wrapper {
  background-color: #f8f9fa; /* Content area background */
  width: 100%;
  overflow-x: hidden; /* Prevent horizontal scroll */
}

#content {
  flex: 1 0 auto; /* Allow content to grow */
}

/* --- Sidebar Styles (Example based on common templates) --- */
.sidebar {
  width: 6.5rem; /* Collapsed width */
  min-height: 100vh;
  transition: width 0.2s ease-in-out;
}

.sidebar-dark{
	background: #2c91fb;
}
.sidebar.toggled { /* Style for when sidebar is expanded */
  width: 14rem; /* Expanded width */
}

.sidebar .nav-item {
  position: relative;
}

.sidebar .nav-item .nav-link {
  display: block;
  width: 100%;
  text-align: left;
  padding: 1rem;
  width: 6.5rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.85rem;
  white-space: nowrap; /* Prevent wrap when collapsed */
  overflow: hidden; /* Hide text when collapsed */
}
.sidebar.toggled .nav-item .nav-link {
     width: 14rem; /* Width when expanded */
     text-align: left; /* Ensure text aligns left when expanded */
     padding: 0.75rem 1rem;
}


.sidebar .nav-item .nav-link i {
  font-size: 0.85rem;
  margin-right: 0.25rem;
  width: 1.25rem; /* Ensure icon width is consistent */
  text-align: center; /* Center icon */

}
 .sidebar.toggled .nav-item .nav-link i {
      font-size: 0.85rem; /* Keep icon size same */
      margin-right: 0.5rem; /* More space when expanded */
 }


.sidebar .nav-item .nav-link span {
  font-size: 0.85rem;
  display: none; /* Hide text when collapsed */
}
.sidebar.toggled .nav-item .nav-link span {
  display: inline; /* Show text when expanded */
}


.sidebar .nav-item.active .nav-link {
  font-weight: 700;
  color: #fff;
  background-color: rgba(255, 255, 255, 0.1); /* Subtle active background */
}

.sidebar .sidebar-brand {
  height: 4.375rem;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 800;
  padding: 1.5rem 1rem;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  z-index: 1;
   color: #fff;
}
.sidebar .sidebar-brand .sidebar-brand-text {
     display: none; /* Hide text when collapsed */
}
.sidebar.toggled .sidebar-brand .sidebar-brand-text {
     display: inline;
}

.sidebar-heading {
  text-align: left; /* Align left when expanded */
  padding: 0 1rem;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.4);
  text-transform: uppercase;
   white-space: nowrap;
   overflow: hidden;
}

.sidebar.toggled .sidebar-heading {
     text-align: left;
}


/* Sidebar Collapse Styles */
.sidebar .nav-item .collapse {
  position: static;
  margin: 0 1rem;
}
.sidebar .nav-item .collapse .collapse-inner {
  padding: .5rem 0;
  min-width: 10rem;
  font-size: 0.85rem;
  margin: 0 0 1rem 0;
}
.sidebar .nav-item .collapsing {
    /* Smooth transition for collapse */
     transition: height 0.15s ease;
}
.sidebar .nav-item .collapse .collapse-inner .collapse-item,
.sidebar .nav-item .collapsing .collapse-inner .collapse-item {
  padding: .5rem 1rem;
  margin: 0 .5rem;
  display: block;
  color: #858796; /* Submenu item color */
  text-decoration: none;
  border-radius: .35rem;
  white-space: nowrap;
}
.sidebar .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar .nav-item .collapse .collapse-inner .collapse-item:active {
    background-color: #eaecf4; /* Hover background */
}

.sidebar-divider {
    margin: 0 1rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

/* --- Topbar Styles --- */
.topbar {
  height: 4.375rem;
}
.topbar .nav-item .nav-link {
    height: 4.375rem;
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
}
.topbar .nav-item .nav-link:hover {
    color: #d1d3e2;
}
.topbar .nav-item.dropdown .dropdown-menu {
     width: auto;
     right: 0; /* Align dropdowns right */
}
.topbar .img-profile {
    height: 2rem;
    width: 2rem;
}


/* --- Sticky Footer --- */
.sticky-footer {
  padding: 2rem 0;
  background-color: #fff; /* Match topbar */
  /* flex-shrink: 0; /* Prevent footer from shrinking */
}


/* --- Responsive Sidebar Toggle (Example) --- */
/* Hide text toggle on larger screens */
/* .sidebar .sidebar-toggler { display: none; } */

/* Media query for toggled sidebar behavior */
@media (min-width: 768px) {
  .sidebar {
    width: 14rem; /* Expanded by default on md and up */
  }
  .sidebar .nav-item .nav-link span {
     display: inline; /* Show text */
  }
   .sidebar .nav-item .nav-link {
     width: auto;
     text-align: left;
     padding: 0.75rem 1rem;
  }
   .sidebar .sidebar-brand .sidebar-brand-text {
      display: inline;
   }
   .sidebar .sidebar-heading {
       text-align: left;
   }

  /* Example: Hide the topbar toggle button on md and up */
  /* .navbar-nav .sidebar-toggle { display: none; } */
}


/* Add more responsive styles as needed */