Global overrides loaded after theme styles to ensure specificity

/* Highly specific selectors for rounded-input-y to override theme rules */
html body .signup-container input.rounded-input-y,
html body .signup-container select.rounded-input-y,
html body .signup-container textarea.rounded-input-y,
html body .signup-container .form-control.rounded-input-y,
html body .signup-container .form-select.rounded-input-y,
html body .signup-container .input-group .rounded-input-y,
html body .signup-container .file-input-hidden.rounded-input-y,
input.rounded-input-y,
select.rounded-input-y,
textarea.rounded-input-y {
  background-color: #e5e5e5 !important;
  border: none !important;
  border-radius: 40px !important;
  padding: 14px 20px !important;
  font-size: 0.95rem !important;
  color: #333 !important;
}

/* Placeholder rules */
input.rounded-input-y::placeholder,
textarea.rounded-input-y::placeholder {
  color: #6f6f6f !important;
}
input.rounded-input-y::-webkit-input-placeholder { color: #6f6f6f !important; }
input.rounded-input-y:-ms-input-placeholder { color: #6f6f6f !important; }
textarea.rounded-input-y::-webkit-input-placeholder { color: #6f6f6f !important; }
textarea.rounded-input-y:-ms-input-placeholder { color: #6f6f6f !important; }

/* Focus state */
html body .signup-container input.rounded-input-y:focus,
html body .signup-container select.rounded-input-y:focus,
html body .signup-container textarea.rounded-input-y:focus,
input.rounded-input-y:focus,
select.rounded-input-y:focus,
textarea.rounded-input-y:focus {
  background-color: #dddddd !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.12) !important;
  outline: none !important;
}

/* File input label (if using wrapper) */
html body .signup-container .file-input-label {
  background-color: transparent;
  color: #3b82f6;
}


.rounded-input-y input{
    width: 100%;
    background-color: #e5e7eb; /* equivalent to bg-gray-200 */
    border-radius: 9999px; /* equivalent to rounded-full */
    padding: 0.75rem 1.25rem; /* py-3 px-5 */
    text-align: right;
    transition: background-color 0.15s ease;
}
.rounded-input-y input:focus {
    background-color: #d1d5db; /* equivalent to bg-gray-300 */
    outline: none;
}

.rounded-input-y {
    position: relative;
}

.rounded-input-y input {
    padding-right: 3rem; /* space for eye icon */
}

/* ─── Sidebar design tokens ────────────────────────────────────────── */
:root {
  --sidebar-bg:            rgb(234, 244, 242);
  --sidebar-text:          #637381;
  --sidebar-icon:          #637381;
  --sidebar-item-bg:       transparent;
  --sidebar-item-bg-hover: rgba(0, 167, 111, 0.08);
  --sidebar-item-bg-active:#BEE8DA;
  --sidebar-item-color-active: #637381;
  --sidebar-logout-color:  #B71D18;
  --topbar-bg:             #00A76F;
}

/* ─── Sidebar shell ─────────────────────────────────────────────────── */
.app-sidebar,
.main-sidebar {
  background-color: var(--sidebar-bg) !important;
  color: var(--sidebar-text) !important;
}

.main-sidebar {
  margin-top: 20px !important;
}

/* ─── Nav items — base state ─────────────────────────────────────────── */
.app-sidebar .side-menu__item {
  color:            var(--sidebar-text) !important;
  background-color: var(--sidebar-item-bg) !important;
  border-radius:    8px;
  transition:       background-color 0.18s ease, color 0.18s ease;
}

.app-sidebar .side-menu__icon {
  color: var(--sidebar-icon) !important;
  transition: color 0.18s ease;
}

/* ─── Nav items — hover ─────────────────────────────────────────────── */
.app-sidebar .side-menu__item:hover {
  background-color: var(--sidebar-item-bg-hover) !important;
  color:            var(--sidebar-item-color-active) !important;
}

.app-sidebar .side-menu__item:hover .side-menu__icon {
  color: var(--sidebar-item-color-active) !important;
}

/* ─── Nav items — active / selected ────────────────────────────────── */
.app-sidebar .side-menu__item.active,
.app-sidebar .slide.active > .side-menu__item,
.app-sidebar .slide.selected > .side-menu__item {
  background-color: var(--sidebar-item-bg-active) !important;
  color:            var(--sidebar-item-color-active) !important;
}

.app-sidebar .side-menu__item.active .side-menu__icon,
.app-sidebar .slide.active > .side-menu__item .side-menu__icon,
.app-sidebar .slide.selected > .side-menu__item .side-menu__icon {
  color: var(--sidebar-item-color-active) !important;
}

/* ─── Logout item ────────────────────────────────────────────────────── */
.app-sidebar .side-menu__item.logout-nav-link,
.app-sidebar .side-menu__item.logout-nav-link .side-menu__icon,
.app-sidebar .side-menu__item.logout-nav-link .side-menu__label {
  color: var(--sidebar-logout-color) !important;
}

.app-sidebar .side-menu__item.logout-nav-link:hover {
  background-color: var(--sidebar-logout-color) !important;
}

/* Ensure sidebar text & icons keep the active color on hover/active (except logout) */
.app-sidebar .side-menu__item:not(.logout-nav-link):hover,
.app-sidebar .side-menu__item:not(.logout-nav-link):hover .side-menu__label,
.app-sidebar .side-menu__item:not(.logout-nav-link):hover .side-menu__icon,
.app-sidebar .side-menu__item:not(.logout-nav-link).active,
.app-sidebar .side-menu__item:not(.logout-nav-link).active .side-menu__label,
.app-sidebar .side-menu__item:not(.logout-nav-link).active .side-menu__icon,
.app-sidebar .slide.active > .side-menu__item:not(.logout-nav-link),
.app-sidebar .slide.active > .side-menu__item:not(.logout-nav-link) .side-menu__label,
.app-sidebar .slide.active > .side-menu__item:not(.logout-nav-link) .side-menu__icon,
.app-sidebar .slide.selected > .side-menu__item:not(.logout-nav-link),
.app-sidebar .slide.selected > .side-menu__item:not(.logout-nav-link) .side-menu__label,
.app-sidebar .slide.selected > .side-menu__item:not(.logout-nav-link) .side-menu__icon {
  color: var(--sidebar-item-color-active) !important;
}


/* ─── Category headings ──────────────────────────────────────────────── */
.app-sidebar .category-name {
  color: var(--sidebar-text) !important;
  opacity: 0.6;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* ─── Topbar ─────────────────────────────────────────────────────────── */
.app-topbar {
  background-color: var(--topbar-bg) !important;
  color: white !important;
}

/* ─── Header: truly full-width, no sidebar offset ───────────────────── */
    [data-vertical-style=overlay][data-toggled=icon-overlay-close] .app-header {
        padding-inline-start: 0rem !important;
    }
.app-header {
  padding-inline-start: 0 !important;
}

/* ─── Sidebar: start below the header (header height = 3.75rem) ─────── */
.app-sidebar {
  inset-block-start: 3.75rem !important;
}

.app-sidebar .main-sidebar {
  margin-block-start: 0 !important;
  height: calc(100vh - 3.75rem) !important;
}

/* ─── Content: keep top offset for fixed header only (no sidebar indent removed elsewhere) ── */
.content {
  padding-inline-start: 0;
}

:root {
  --body-bg: 240 241 247;
  --primary: 0 175 116;
  --primary-rgb:
    0,
    175, 116;
  --primary-color: rgb(var(--primary-rgb));
  --secondary: 35 183 229;
  --warning: 245 184 73;
  --info: 73 182 245;
  --success: 38 191 148;
  --danger: 230 83 60;
  --light: 243 246 248;
  --dark: 35 35 35;
  --orange: 255 165 5;
  --pink: 231 145 188;
  --teal: 18 194 194;
  --purple: 137 32 173;
  --default-text-color: 51 51 53;
  --default-border: 243 243 243;
  --default-background: 247 248 249;
  --menu-prime-color: 83 100 133;
  --menu-border-color: 243 243 243;
  --header-prime-color: 83 100 133;
  --header-border-color: 243 243 243;
  --bootstrap-card-border: 243 243 243;
  --list-hover-focus-bg: 245 246 247;
  --text-muted: 140 144 151;
  --input-border: 233 237 246;
  --red: 208 61 70;
  --blue: 43 62 101;
  --green: 29 216 113;
  --cyan: 0 209 209;
  --indigo: 77 93 219;
  --gray: 134 153 163;
  --yellow: 255 193 2;
  --facebook: 59 89 152;
  --twitter: 0 172 238;
  --github: 51 51 51;
  --google: 207 78 67;
  --youtube: 255 0 0;
  --bs-width: 1px;
}
.main-sidebar-header {
    background-color: rgb(var(--primary)) !important;
    color: #fff !important;
    font-size: 1.25rem;
    font-weight: 600;
    padding: 1rem 1.5rem;
    text-align: center;
}