/*
 * Skin mobileux — penyesuaian template MobileUX untuk aplikasi TM eCleaning.
 * 1) Warna Bootstrap (primary) mengikuti warna skin (theme-*) yang dipilih admin.
 * 2) Class bantu yang dipakai halaman mobile (berasal dari Materialize) agar tampil benar di template ini:
 *    bg-label-*, text-heading, avatar(-sm/-lg/-xl) + avatar-initial, btn-icon, btn-text-*.
 * 3) Layout: header, konten, menu bawah, login.
 */

body {
  --bs-primary: var(--adminuiux-theme-1);
  --bs-primary-rgb: var(--adminuiux-theme-1-rgb);
  --bs-link-color: var(--adminuiux-theme-1);
  --bs-link-color-rgb: var(--adminuiux-theme-1-rgb);
}
.btn-primary {
  --bs-btn-bg: var(--adminuiux-theme-1);
  --bs-btn-border-color: var(--adminuiux-theme-1);
  --bs-btn-hover-bg: var(--adminuiux-theme-1-hover);
  --bs-btn-hover-border-color: var(--adminuiux-theme-1-hover);
  --bs-btn-active-bg: var(--adminuiux-theme-1-active);
  --bs-btn-active-border-color: var(--adminuiux-theme-1-active);
  --bs-btn-disabled-bg: var(--adminuiux-theme-1);
  --bs-btn-disabled-border-color: var(--adminuiux-theme-1);
  --bs-btn-color: var(--adminuiux-theme-1-text);
}
.btn-outline-primary {
  --bs-btn-color: var(--adminuiux-theme-1);
  --bs-btn-border-color: var(--adminuiux-theme-1);
  --bs-btn-hover-bg: var(--adminuiux-theme-1);
  --bs-btn-hover-border-color: var(--adminuiux-theme-1);
  --bs-btn-active-bg: var(--adminuiux-theme-1);
  --bs-btn-active-border-color: var(--adminuiux-theme-1);
}
.text-primary {
  color: var(--adminuiux-theme-1) !important;
}
.bg-primary {
  background-color: var(--adminuiux-theme-1) !important;
}
.progress-bar {
  --bs-progress-bar-bg: var(--adminuiux-theme-1);
}

/* ---------------------------------------------------------------- class bantu dari Materialize */
.bg-label-primary { background-color: rgba(var(--adminuiux-theme-1-rgb), 0.14) !important; color: var(--adminuiux-theme-1) !important; }
.bg-label-secondary { background-color: rgba(var(--bs-secondary-rgb), 0.16) !important; color: var(--bs-secondary) !important; }
.bg-label-success { background-color: rgba(var(--bs-success-rgb), 0.16) !important; color: var(--bs-success) !important; }
.bg-label-info { background-color: rgba(var(--bs-info-rgb), 0.16) !important; color: var(--bs-info-text-emphasis, var(--bs-info)) !important; }
.bg-label-warning { background-color: rgba(var(--bs-warning-rgb), 0.18) !important; color: var(--bs-warning-text-emphasis, #997404) !important; }
.bg-label-danger { background-color: rgba(var(--bs-danger-rgb), 0.14) !important; color: var(--bs-danger) !important; }
.bg-label-dark { background-color: rgba(var(--bs-dark-rgb), 0.14) !important; color: var(--bs-emphasis-color) !important; }
.text-heading { color: var(--bs-emphasis-color) !important; }

.avatar:not([class*=' avatar-']):not([class^='avatar-']) { width: 2.5rem; height: 2.5rem; }
.avatar.avatar-sm { width: 2rem; height: 2rem; }
.avatar.avatar-lg { width: 3.5rem; height: 3.5rem; }
.avatar.avatar-xl { width: 4.5rem; height: 4.5rem; }
.avatar { position: relative; display: inline-flex; flex-shrink: 0; background: none; border-radius: 0.5rem; }
.avatar .avatar-initial {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}
.avatar-initial.rounded { border-radius: 0.75rem !important; }

.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  width: 2.375rem;
  height: 2.375rem;
}
.btn-icon.btn-sm { width: 2rem; height: 2rem; }
.btn-text-primary { color: var(--adminuiux-theme-1); background: transparent; border: 0; }
.btn-text-secondary { color: var(--bs-secondary-color); background: transparent; border: 0; }
.btn-text-primary:hover, .btn-text-secondary:hover { background: rgba(var(--adminuiux-theme-1-rgb), 0.08); }

/* Ikon Remix di tombol & menu template */
.adminuiux-mobile-footer .nav-icon[class*='ri-'] { font-size: 1.35rem; line-height: 1; }
.adminuiux-sidebar .menu-icon[class*='ri-'] { font-size: 1.15rem; width: 1.5rem; text-align: center; }

/* ---------------------------------------------------------------- layout */
.m-header-title { min-width: 0; line-height: 1.2; }
.m-header-title h6 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-header-title .company-tagline { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 55vw; }
.adminuiux-header .btn-icon { color: inherit; font-size: 1.3rem; }
.adminuiux-content #main-content { max-width: 640px; padding-bottom: 6rem; }
.adminuiux-mobile-footer .center-menu-btn > span { display: inline-flex; align-items: center; justify-content: center; }
.adminuiux-mobile-footer button.nav-link { width: 100%; border: 0; background: none; }
.card { --bs-card-border-color: transparent; }
.list-group-item-action { cursor: pointer; }
.offcanvas-bottom.m-menu-sheet { border-radius: 20px 20px 0 0; max-height: 85vh; }
/* Link di kartu/daftar tanpa garis bawah (seperti tampilan Materialize); link di dalam teks tetap bergaris saat hover */
a { text-decoration: none; }
a:hover { text-decoration: underline; }
a.btn:hover, a.card:hover, a.list-group-item:hover, a.nav-link:hover, a.stretched-link:hover, .card a:hover, .adminuiux-sidebar a:hover { text-decoration: none; }

/* Choices.js select tunggal: template mewarnai item terpilih seperti tag multi-select → kembalikan seperti input biasa */
.choices[data-type*='select-one'] .choices__inner .choices__list--single .choices__item {
  background: transparent; border: 0; color: inherit; padding: 0; margin: 0; font-size: inherit;
}
.choices[data-type*='select-one'] .choices__inner .choices__placeholder { opacity: .6; }

/* Login */
.m-auth-card { border-radius: 1.25rem; }
