/* KBOC standard UI system
   Shared overrides for public and authenticated Thymeleaf pages. */
:root {
  --kboc-font: Inter, Poppins, Arial, Helvetica, sans-serif;
  --kboc-bg: #eef5f3;
  --kboc-surface: #ffffff;
  --kboc-surface-muted: #f6faf9;
  --kboc-ink: #13231f;
  --kboc-text: #33413d;
  --kboc-muted: #62716d;
  --kboc-border: #cfded9;
  --kboc-primary: #0f766e;
  --kboc-primary-strong: #115e59;
  --kboc-primary-soft: #e5f4f1;
  --kboc-accent: #c2410c;
  --kboc-accent-strong: #9a3412;
  --kboc-warning: #b45309;
  --kboc-danger: #b42318;
  --kboc-radius: 8px;
  --kboc-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--kboc-font) !important;
  color: var(--kboc-text) !important;
  background:
    linear-gradient(180deg, #eef5f3 0%, #f8fbfa 46%, #eef2f7 100%) !important;
  letter-spacing: 0 !important;
}

a {
  color: var(--kboc-primary);
}

a:hover,
a:focus {
  color: var(--kboc-primary-strong);
}

h1,
h2,
h3,
h4,
h5,
h6,
.card-title,
.modal-title,
.page-title {
  color: var(--kboc-ink) !important;
  letter-spacing: 0 !important;
}

.text-muted {
  color: var(--kboc-muted) !important;
}

.container,
.app-container {
  max-width: 1280px;
}

.card,
.modal-content,
.dropdown-menu,
.table-responsive,
.table-responsive-custom,
.select2-dropdown,
.alert {
  border: 1px solid var(--kboc-border) !important;
  border-radius: var(--kboc-radius) !important;
  box-shadow: var(--kboc-shadow) !important;
}

.card {
  background: var(--kboc-surface) !important;
}

.card-header,
.modal-header,
.card-footer,
.modal-footer {
  background: var(--kboc-surface-muted) !important;
  border-color: var(--kboc-border) !important;
}

.btn {
  border-radius: 6px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}

.btn.btn-primary,
.btn.btn-dark,
.btn.btn-success,
.btn.btn-info,
.btn.btn-main,
.btn-get-started,
.bank-form-button,
.kboc-top-login,
.kboc-link-btn,
button[type="submit"],
input[type="submit"] {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-dark:hover,
.btn.btn-dark:focus,
.btn.btn-success:hover,
.btn.btn-success:focus,
.btn.btn-info:hover,
.btn.btn-info:focus,
.btn.btn-main:hover,
.btn.btn-main:focus,
.btn-get-started:hover,
.btn-get-started:focus,
.bank-form-button:hover,
.bank-form-button:focus,
.kboc-top-login:hover,
.kboc-top-login:focus,
.kboc-link-btn:hover,
.kboc-link-btn:focus,
button[type="submit"]:hover,
button[type="submit"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
  background: var(--kboc-primary-strong) !important;
  border-color: var(--kboc-primary-strong) !important;
  color: #ffffff !important;
}

.btn.btn-light-danger,
.btn.btn-active-danger,
.btn.btn-danger {
  background: #fff1f0 !important;
  border-color: #fecaca !important;
  color: var(--kboc-danger) !important;
}

.btn.btn-light-danger:hover,
.btn.btn-active-danger:hover,
.btn.btn-danger:hover {
  background: var(--kboc-danger) !important;
  border-color: var(--kboc-danger) !important;
  color: #ffffff !important;
}

.form-control,
.form-select,
.select2-container--bootstrap5 .select2-selection,
textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="date"],
input[type="number"] {
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  color: var(--kboc-ink) !important;
  background-color: #ffffff !important;
  box-shadow: none !important;
}

.kboc-password-field {
  position: relative;
  width: 100%;
}

.kboc-password-field .kboc-password-input {
  padding-right: 3.25rem !important;
}

.kboc-password-toggle {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  color: #64748b;
  background: transparent;
  border: 0;
  border-radius: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}

.kboc-password-toggle:hover,
.kboc-password-toggle:focus-visible {
  color: var(--kboc-primary);
  background: rgba(15, 118, 110, 0.1);
}

.kboc-password-toggle:focus-visible {
  outline: 2px solid var(--kboc-primary);
  outline-offset: 1px;
}

.form-control:focus,
.form-select:focus,
.select2-container--bootstrap5.select2-container--focus .select2-selection,
textarea:focus,
input:focus {
  border-color: var(--kboc-primary) !important;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.16) !important;
}

.form-control[readonly],
input[readonly],
textarea[readonly],
input.form-control:read-only,
textarea:read-only {
  background-color: #eef2f1 !important;
  border-color: #d6dfdc !important;
  color: #5f6f6b !important;
  cursor: default;
}

.form-control:disabled,
.form-select:disabled,
input:disabled,
textarea:disabled,
select:disabled {
  background-color: #e9eeee !important;
  border-color: #d3ddda !important;
  color: #70807b !important;
  opacity: 1 !important;
  cursor: not-allowed;
}

.form-label,
label {
  color: #243244 !important;
  font-weight: 700 !important;
}

.badge {
  border-radius: 999px !important;
  font-weight: 700 !important;
}

table,
.table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--kboc-text) !important;
  background: #ffffff !important;
  --bs-table-color: var(--kboc-text);
  --bs-table-bg: #ffffff;
  --bs-table-striped-bg: #f8fafc;
  --bs-table-hover-bg: #eef5ff;
  --bs-table-border-color: var(--kboc-border);
}

table > thead > tr > th,
.table > thead > tr > th,
table.dataTable > thead > tr > th {
  background: #143b3d !important;
  color: #ffffff !important;
  border-color: #1d4f51 !important;
  border-bottom: 1px solid #1d4f51 !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  font-size: 0.78rem;
}

table > :not(caption) > * > *,
.table > :not(caption) > * > * {
  padding: 0.72rem 0.85rem !important;
  vertical-align: middle !important;
  border-bottom-color: var(--kboc-border) !important;
}

table > tbody > tr:nth-child(even) > *,
.table > tbody > tr:nth-child(even) > * {
  background: #f8fafc !important;
}

table > tbody > tr:hover > *,
.table > tbody > tr:hover > * {
  background: var(--kboc-primary-soft) !important;
}

.dataTables_wrapper {
  padding: 0.25rem 0;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
  color: var(--kboc-muted) !important;
  font-weight: 700;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  margin-left: 0.4rem;
  border: 1px solid #cbd5d1 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: var(--kboc-ink) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  min-width: 36px;
  min-height: 36px;
  margin: 0 0.18rem !important;
  padding: 0.42rem 0.78rem !important;
  border: 1px solid #d4e0f4 !important;
  border-radius: 0.55rem !important;
  color: #334155 !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.04);
  font-weight: 700 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
  color: #9aa4b2 !important;
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

body.kboc-inner-page .pagination,
body.kboc-home .pagination,
body.bodybg .pagination {
  gap: 0.32rem;
}

body.kboc-inner-page .page-link,
body.kboc-home .page-link,
body.bodybg .page-link,
.dept-report-page-link {
  min-width: 36px;
  min-height: 36px;
  padding: 0.42rem 0.78rem !important;
  border: 1px solid #d4e0f4 !important;
  border-radius: 0.55rem !important;
  background: #ffffff !important;
  color: #334155 !important;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.04);
  font-weight: 700 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
}

body.kboc-inner-page .page-link:hover,
body.kboc-home .page-link:hover,
body.bodybg .page-link:hover,
.dept-report-page-link:hover,
body.kboc-inner-page .page-item.active .page-link,
body.kboc-home .page-item.active .page-link,
body.bodybg .page-item.active .page-link {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

body.kboc-inner-page .page-item.disabled .page-link,
body.kboc-home .page-item.disabled .page-link,
body.bodybg .page-item.disabled .page-link {
  color: #9aa4b2 !important;
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  box-shadow: none !important;
}

.dataTables_wrapper .dataTables_processing {
  min-width: 220px;
  margin-top: 0 !important;
  padding: 0.8rem 1rem !important;
  background: #ffffff !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: var(--kboc-radius) !important;
  box-shadow: var(--kboc-shadow) !important;
  color: var(--kboc-primary-strong) !important;
  font-weight: 800 !important;
}

table.dataTable.no-footer {
  border-bottom: 1px solid var(--kboc-border) !important;
}

.breadcrumb {
  gap: 0.25rem;
}

.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a {
  color: var(--kboc-muted) !important;
}

#loadingOverlay {
  display: none;
  position: absolute !important;
  inset: 0 !important;
  align-items: center;
  justify-content: center;
  min-height: 240px;
  background: rgba(255, 255, 255, 0.78) !important;
  backdrop-filter: blur(2px);
  z-index: 20 !important;
}

#loadingOverlay .loader-wrapper {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: transparent;
}

#loadingOverlay .spinner {
  width: 52px;
  height: 52px;
  border: 5px solid #dbe7e3;
  border-top-color: var(--kboc-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 0.75rem;
}

#loadingOverlay .loading-text {
  color: var(--kboc-primary-strong);
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
}

body.kboc-is-loading {
  cursor: progress;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes fadeInOut {
  0%,
  100% { opacity: 0; }
  50% { opacity: 1; }
}

@keyframes fadeOut {
  to {
    opacity: 0;
    pointer-events: none;
    display: none;
  }
}

/* Authenticated application shell */
body.kboc-inner-page {
  background: var(--kboc-bg) !important;
}

body.kboc-inner-page #kt_app_header.app-header {
  background: #ffffff !important;
  border-bottom: 1px solid var(--kboc-border) !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06) !important;
}

body.kboc-inner-page #kt_app_header_container {
  min-height: 72px;
  gap: 1rem;
}

body.kboc-inner-page #kt_app_content_container {
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
}

body.kboc-inner-page .page-title {
  margin: 0 !important;
}

body.kboc-inner-page .page-title h1,
body.kboc-inner-page .page-title .h5 {
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  margin-bottom: 0.35rem !important;
}

body.kboc-inner-page .kboc-sidebar {
  background: #143b3d !important;
  border-right: 1px solid #0b292a !important;
  box-shadow: 4px 0 18px rgba(15, 23, 42, 0.14) !important;
}

body.kboc-inner-page .kboc-sidebar-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.kboc-inner-page .kboc-sidebar-user {
  color: #ffffff !important;
  text-shadow: none !important;
}

body.kboc-inner-page .kboc-sidebar-avatar {
  border: 2px solid rgba(255, 255, 255, 0.35) !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link {
  min-height: 42px;
  color: #dbeafe !important;
  border-radius: 6px !important;
  padding-top: 0.64rem !important;
  padding-bottom: 0.64rem !important;
}

body.kboc-inner-page .kboc-sidebar .menu .menu-title,
body.kboc-inner-page .kboc-sidebar .menu .menu-icon,
body.kboc-inner-page .kboc-sidebar .menu .menu-icon i {
  color: inherit !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link:hover,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link:hover,
body.kboc-inner-page .kboc-sidebar .menu .menu-item.show > .kboc-menu-link,
body.kboc-inner-page .kboc-sidebar .menu .menu-item.here > .kboc-menu-link,
body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link.active {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  transform: none !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link.active {
  background: #ffffff !important;
  color: #143b3d !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16) !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active .menu-icon,
body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active .menu-icon i {
  color: #143b3d !important;
}

body.kboc-inner-page .kboc-sidebar .menu-item .menu-link .menu-arrow:after {
  background-color: #bfdbfe !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active .menu-arrow:after {
  background-color: #143b3d !important;
}

body.kboc-inner-page .app-footer .app-container {
  background: #ffffff !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: var(--kboc-radius) !important;
}

body.kboc-inner-page #userdashboarddiv.kboc-dashboard {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.kboc-inner-page .kboc-dashboard-panel {
  padding: 1rem;
  background: #ffffff;
  border: 1px solid var(--kboc-border);
  border-radius: 12px;
  box-shadow: var(--kboc-shadow);
}

body.kboc-inner-page .kboc-dashboard-panel + .kboc-dashboard-panel {
  margin-top: 1.25rem;
}

body.kboc-inner-page .kboc-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid #e4ece9;
}

body.kboc-inner-page .kboc-dashboard-header,
body.kboc-inner-page .kboc-section-title {
  padding: 1rem 1.15rem;
  background:
    linear-gradient(135deg, rgba(15, 118, 110, 0.08), rgba(194, 65, 12, 0.05)),
    #ffffff;
  border: 1px solid var(--kboc-border);
  border-left: 4px solid var(--kboc-primary);
  border-radius: var(--kboc-radius);
  box-shadow: var(--kboc-shadow);
}

body.kboc-inner-page .kboc-dashboard-header h3,
body.kboc-inner-page .kboc-dashboard h5 {
  color: #143b3d !important;
}

body.kboc-inner-page .kboc-dashboard-title-icon,
body.kboc-inner-page .kboc-section-icon {
  color: var(--kboc-primary) !important;
}

body.kboc-inner-page .kboc-stat-card,
body.kboc-inner-page .kboc-action-card {
  --kboc-card-accent: var(--kboc-primary);
  --kboc-card-ink: #143b3d;
  --kboc-card-tint: rgba(15, 118, 110, 0.1);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 250, 0.98)) !important;
  border-radius: var(--kboc-radius) !important;
  border: 1px solid #d7e4e0 !important;
  border-left: 4px solid var(--kboc-card-accent) !important;
  box-shadow: none !important;
  color: var(--kboc-card-ink) !important;
  transform: none !important;
  overflow: hidden;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

body.kboc-inner-page .kboc-stat-card::before,
body.kboc-inner-page .kboc-action-card::before {
  display: none !important;
}

body.kboc-inner-page .kboc-stat-card:hover,
body.kboc-inner-page .kboc-action-card:hover {
  border-color: #cbded9 !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
  transform: translateY(-2px) !important;
}

body.kboc-inner-page .kboc-tone-indigo,
body.kboc-inner-page .kboc-tone-navy {
  --kboc-card-accent: #0f766e;
  --kboc-card-ink: #0f4f4a;
  --kboc-card-tint: rgba(15, 118, 110, 0.12);
}

body.kboc-inner-page .kboc-tone-teal,
body.kboc-inner-page .kboc-tone-green {
  --kboc-card-accent: #1d4ed8;
  --kboc-card-ink: #1e3a8a;
  --kboc-card-tint: rgba(29, 78, 216, 0.11);
}

body.kboc-inner-page .kboc-tone-amber,
body.kboc-inner-page .kboc-tone-cyan {
  --kboc-card-accent: #b45309;
  --kboc-card-ink: #7a3e05;
  --kboc-card-tint: rgba(180, 83, 9, 0.12);
}

body.kboc-inner-page .kboc-tone-rose,
body.kboc-inner-page .kboc-tone-violet {
  --kboc-card-accent: #9a3412;
  --kboc-card-ink: #7c2d12;
  --kboc-card-tint: rgba(194, 65, 12, 0.12);
}

body.kboc-inner-page .kboc-tone-charcoal {
  --kboc-card-accent: #475569;
  --kboc-card-ink: #334155;
  --kboc-card-tint: rgba(71, 85, 105, 0.11);
}

body.kboc-inner-page .kboc-stat-card h3,
body.kboc-inner-page .kboc-stat-card h6,
body.kboc-inner-page .kboc-action-card h6,
body.kboc-inner-page .kboc-action-card small,
body.kboc-inner-page .kboc-stat-card .text-white,
body.kboc-inner-page .kboc-action-card .text-white {
  color: currentColor !important;
}

body.kboc-inner-page .kboc-card-icon {
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kboc-card-accent) !important;
  background: var(--kboc-card-tint);
  border-radius: 10px;
  opacity: 1;
}

body.kboc-inner-page .kboc-action-link {
  color: var(--kboc-card-accent) !important;
  background: var(--kboc-card-tint);
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
}

body.kboc-inner-page .kboc-table-card {
  border-color: var(--kboc-border) !important;
  box-shadow: var(--kboc-shadow) !important;
}

body.kboc-inner-page .kboc-dashboard-panel .kboc-table-card {
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.kboc-inner-page .kboc-dashboard-panel .kboc-table-card .table-responsive {
  margin-top: 0;
}

body.kboc-inner-page .kboc-activity-table thead,
body.kboc-inner-page .kboc-activity-table thead th {
  background: #143b3d !important;
  color: #ffffff !important;
}

/* Public website and login */
body.kboc-home,
body.kboc-auth-page,
body.bodybg {
  background: var(--kboc-bg) !important;
}

.kboc-site-header,
.kboc-login-header,
body.kboc-home #header,
body.kboc-home #header.header-scrolled,
body.kboc-home #header.header-inner-pages {
  background: #ffffff !important;
  border-bottom: 1px solid var(--kboc-border) !important;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.08) !important;
}

.kboc-topbar {
  background: #143b3d !important;
  border-bottom: 0 !important;
  color: #dbeafe !important;
}

.kboc-topbar a,
.kboc-topbar-label {
  color: #ffffff !important;
}

.kboc-topbar-inner {
  min-height: 36px;
}

.kboc-navshell {
  background: #ffffff !important;
  padding: 0.8rem 0 !important;
}

.kboc-brand-wrap img {
  max-height: 56px !important;
}

body.kboc-home .navbar-nav .nav-link,
.kboc-navshell .navbar-nav .nav-link {
  color: var(--kboc-ink) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 0.95rem !important;
  transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

body.kboc-home .navbar-nav .nav-link:hover,
body.kboc-home .navbar-nav .nav-link:focus,
.kboc-navshell .navbar-nav .nav-link.active,
body.kboc-home .navbar-nav .nav-link.active {
  background: #e5f4f1 !important;
  color: var(--kboc-primary) !important;
}

body.kboc-home .dropdown-menu,
.kboc-navshell .dropdown-menu {
  padding: 0.45rem !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: var(--kboc-radius) !important;
  box-shadow: var(--kboc-shadow) !important;
}

body.kboc-home .dropdown-item,
.kboc-navshell .dropdown-item {
  border-radius: 6px;
  color: var(--kboc-text) !important;
  font-weight: 700;
}

body.kboc-home .dropdown-item:hover,
body.kboc-home .dropdown-item:focus,
.kboc-navshell .dropdown-item:hover,
.kboc-navshell .dropdown-item:focus {
  background: var(--kboc-primary-soft) !important;
  color: var(--kboc-primary-strong) !important;
}

body.kboc-home .button-68,
body.bodybg .button-68,
.kboc-lang-btn,
.kboc-top-icon {
  background: #ffffff !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: 999px !important;
  color: var(--kboc-primary-strong) !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

body.kboc-home .button-68:hover,
body.kboc-home .button-68:focus,
body.bodybg .button-68:hover,
body.bodybg .button-68:focus,
.kboc-lang-btn:hover,
.kboc-lang-btn:focus,
.kboc-top-icon:hover,
.kboc-top-icon:focus {
  background: var(--kboc-primary-soft) !important;
  border-color: #a8ded5 !important;
  color: var(--kboc-primary-strong) !important;
}

body.kboc-home .btn-main,
body.kboc-home .btn-main-light,
body.kboc-home .c-btn,
body.kboc-home .t-btn,
body.kboc-home .a1-btn,
body.kboc-home .c-btn-w {
  border-radius: 999px !important;
  background: var(--kboc-primary) !important;
  border: 1px solid var(--kboc-primary) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

body.kboc-home .btn-main:hover,
body.kboc-home .btn-main-light:hover,
body.kboc-home .c-btn:hover,
body.kboc-home .t-btn:hover,
body.kboc-home .a1-btn:hover,
body.kboc-home .c-btn-w:hover {
  background: var(--kboc-primary-strong) !important;
  border-color: var(--kboc-primary-strong) !important;
  color: #ffffff !important;
}

.kboc-main {
  padding-top: 8.5rem !important;
}

.kboc-section {
  padding: 2rem 0 !important;
}

.kboc-section + .kboc-section {
  border-top: 1px solid var(--kboc-border) !important;
}

.kboc-section-head h2 {
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
}

.kboc-pill {
  background: #e5f4f1 !important;
  color: var(--kboc-primary) !important;
  border-radius: 999px !important;
}

.kboc-hero-card {
  border-radius: var(--kboc-radius) !important;
  border: 1px solid var(--kboc-border) !important;
  box-shadow: var(--kboc-shadow) !important;
}

.kboc-hero-slide::after {
  background: linear-gradient(90deg, rgba(20, 59, 61, 0.88) 0%, rgba(20, 59, 61, 0.62) 48%, rgba(20, 59, 61, 0.22) 100%) !important;
}

.kboc-hero-title {
  color: #ffffff !important;
  letter-spacing: 0 !important;
}

.kboc-hero-badge {
  background: rgba(255, 255, 255, 0.16) !important;
  border: 1px solid rgba(255, 255, 255, 0.28);
}

.kboc-stat-card,
.kboc-service-card,
.kboc-office-card,
.kboc-link-card,
.kboc-news-band,
.kboc-footer-card {
  border-radius: var(--kboc-radius) !important;
  border: 1px solid var(--kboc-border) !important;
  box-shadow: var(--kboc-shadow) !important;
}

body.kboc-home .kboc-service-card,
body.kboc-home .kboc-office-card,
body.kboc-home .kboc-link-card,
body.kboc-home .kboc-news-band,
body.kboc-home .kboc-footer-card,
body.bodybg .kboc-service-card,
body.bodybg .kboc-office-card,
body.bodybg .kboc-link-card {
  background: #ffffff !important;
  border-color: var(--kboc-border) !important;
  color: var(--kboc-text) !important;
}

.kboc-auth-shell {
  min-height: calc(100vh - 150px);
  padding: 2rem 0 !important;
  background:
    linear-gradient(120deg, rgba(15, 118, 110, 0.1), rgba(194, 65, 12, 0.08)),
    var(--kboc-bg) !important;
}

.kboc-login-panel {
  min-height: 62vh;
  background: transparent !important;
}

.kboc-auth-card {
  width: min(100%, 480px);
  margin: 0 auto;
  border-radius: var(--kboc-radius) !important;
  border: 1px solid var(--kboc-border) !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.12) !important;
}

.kboc-auth-card .card-body {
  padding: clamp(1.25rem, 3vw, 2rem) !important;
}

.role-card {
  border: 1px solid var(--kboc-border) !important;
  border-radius: var(--kboc-radius) !important;
  box-shadow: var(--kboc-shadow) !important;
  background: #ffffff !important;
  transform: none !important;
}

.role-card:hover,
.role-card:focus-within {
  border-color: var(--kboc-primary) !important;
  box-shadow: 0 12px 30px rgba(15, 118, 110, 0.18) !important;
}

.role-card.selected {
  border: 2px solid var(--kboc-primary) !important;
  background: #eef5ff !important;
}

.header-text,
.subheader-text {
  color: var(--kboc-ink) !important;
}

.kboc-timeout-card,
body.bg-light .card {
  max-width: 560px;
  margin: 0 auto;
  border-radius: var(--kboc-radius) !important;
}

.kboc-timeout-card .display-1,
body.bg-light .display-1 {
  font-size: clamp(2.4rem, 7vw, 4.5rem) !important;
}

.kboc-timeout-card {
  overflow: hidden;
  max-width: 760px;
  border: 1px solid var(--kboc-border) !important;
  box-shadow: var(--kboc-shadow-md) !important;
}

.kboc-timeout-card .card-body {
  padding: 2.5rem !important;
}

.kboc-timeout-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 auto 1.25rem;
  padding: 0.55rem 0.9rem;
  border-radius: 999px;
  background: var(--kboc-primary-soft);
  color: var(--kboc-primary);
  font-size: 0.84rem;
  font-weight: 700;
}

.kboc-timeout-icon-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.kboc-timeout-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 92px;
  height: 92px;
  border-radius: 28px;
  background: #163654;
  color: #ffffff;
  font-size: 2.6rem;
  box-shadow: 0 20px 45px rgba(22, 54, 84, 0.22);
}

.kboc-timeout-copy {
  max-width: 560px;
  margin: 0 auto;
}

.kboc-timeout-eyebrow {
  margin-bottom: 0.65rem;
  color: var(--kboc-primary);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kboc-timeout-copy h1 {
  margin-bottom: 0.55rem;
  color: var(--kboc-ink) !important;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
}

.kboc-timeout-copy h2 {
  margin-bottom: 1rem;
  color: var(--kboc-text) !important;
  font-size: clamp(1.15rem, 2.8vw, 1.55rem);
  font-weight: 600;
}

.kboc-timeout-message {
  margin-bottom: 0;
  color: var(--kboc-muted) !important;
  font-size: 1rem;
  line-height: 1.8;
}

.kboc-timeout-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  max-width: 520px;
  margin: 1.8rem auto 0;
}

.kboc-timeout-meta-item {
  padding: 1rem 1.1rem;
  border: 1px solid var(--kboc-border);
  border-radius: 16px;
  background: var(--kboc-surface-soft);
  text-align: center;
}

.kboc-timeout-meta-label {
  display: block;
  margin-bottom: 0.3rem;
  color: var(--kboc-muted);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.kboc-timeout-meta-item strong {
  color: var(--kboc-ink);
  font-size: 1rem;
  font-weight: 800;
}

.kboc-timeout-actions {
  display: flex;
  justify-content: center;
  margin-top: 1.8rem;
}

.kboc-timeout-actions .btn.btn-primary,
.kboc-timeout-actions .btn.btn-primary:hover,
.kboc-timeout-actions .btn.btn-primary:focus,
.kboc-timeout-actions .btn.btn-primary:active {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

.kboc-timeout-actions .btn.btn-primary i,
.kboc-timeout-actions .btn.btn-primary:hover i,
.kboc-timeout-actions .btn.btn-primary:focus i,
.kboc-timeout-actions .btn.btn-primary:active i {
  color: #ffffff !important;
}

@media (max-width: 575.98px) {
  .kboc-timeout-card .card-body {
    padding: 1.5rem !important;
  }

  .kboc-timeout-icon {
    width: 76px;
    height: 76px;
    border-radius: 22px;
    font-size: 2.1rem;
  }

  .kboc-timeout-meta {
    grid-template-columns: 1fr;
  }

  .kboc-timeout-actions .btn {
    width: 100%;
  }
}

.lbg_1,
.lbg_2,
.lgb_3,
.bgwhite,
.bg-body {
  background: transparent !important;
}

.bgf1,
.lgbf1,
.footerbg,
.fbottom,
.ftop {
  background: #143b3d !important;
  color: #ffffff !important;
}

.fbottom a,
.footerbg a,
.ftop a {
  color: #dbeafe !important;
}

#scrolltop .top-button,
.scrolltop {
  background: var(--kboc-primary) !important;
  border-radius: 6px !important;
}

/* Compact horizontal spacing and color alignment */
.btn.btn-success,
.btn.btn-light-success,
.btn.btn-outline-success,
.btn.btn-active-success,
button.btn-success,
a.btn-success {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

.btn.btn-success:hover,
.btn.btn-success:focus,
.btn.btn-light-success:hover,
.btn.btn-light-success:focus,
.btn.btn-outline-success:hover,
.btn.btn-outline-success:focus,
.btn.btn-active-success:hover,
.btn.btn-active-success:focus,
button.btn-success:hover,
button.btn-success:focus,
a.btn-success:hover,
a.btn-success:focus {
  background: var(--kboc-primary-strong) !important;
  border-color: var(--kboc-primary-strong) !important;
  color: #ffffff !important;
}

.btn.btn-success i,
.btn.btn-light-success i,
.btn.btn-outline-success i,
.btn.btn-active-success i {
  color: currentColor !important;
}

body.kboc-inner-page .table-light > tr > th,
body.kboc-inner-page thead.table-light > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > th {
  background: #143b3d !important;
  color: #ffffff !important;
  border-color: #1d4f51 !important;
}

/* Full-screen fit and responsive layout */
html,
body {
  width: 100%;
  min-height: 100%;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

iframe,
embed,
object {
  max-width: 100%;
}

pre,
code,
.text-break,
td,
th,
p,
label,
span {
  overflow-wrap: anywhere;
}

.container-fluid,
.row,
.col,
[class*="col-"],
.card,
.card-body,
.modal-content,
form,
.form-control,
.form-select,
.input-group,
.select2,
.select2-container {
  max-width: 100%;
}

body.kboc-inner-page .app-root,
body.kboc-inner-page .app-page,
body.kboc-inner-page .app-content,
body.kboc-inner-page .app-content > *,
body.kboc-inner-page #kt_app_content,
body.kboc-inner-page #kt_app_content_container {
  width: 100% !important;
  max-width: none !important;
}

body.kboc-inner-page .app-root,
body.kboc-inner-page .app-page,
body.kboc-inner-page .app-wrapper,
body.kboc-inner-page .app-main {
  min-height: 100vh;
  min-width: 0;
  overflow-x: hidden;
}

body.kboc-inner-page .app-wrapper,
body.kboc-inner-page .app-main {
  width: auto !important;
  max-width: 100% !important;
}

@media (min-width: 992px) {
  body.kboc-inner-page[data-kt-app-sidebar-enabled="true"] #kt_app_header,
  body.kboc-inner-page[data-kt-app-sidebar-enabled="true"] #kt_app_wrapper {
    width: auto !important;
    max-width: calc(100vw - var(--bs-app-sidebar-width, 335px)) !important;
  }

  body.kboc-inner-page[data-kt-app-sidebar-enabled="true"] #kt_app_main {
    width: 100% !important;
    max-width: 100% !important;
  }
}

body.kboc-inner-page #kt_app_content_container {
  padding-left: clamp(0.75rem, 1.5vw, 1.5rem) !important;
  padding-right: clamp(0.75rem, 1.5vw, 1.5rem) !important;
  overflow-x: hidden;
}

body.kboc-inner-page #kt_app_content_container > section,
body.kboc-inner-page #kt_app_content_container > section > *,
body.kboc-inner-page #kt_app_content_container > div {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

body.kboc-inner-page .app-container.container-fluid,
body.kboc-inner-page .container-fluid {
  width: 100% !important;
  max-width: none !important;
}

body.kboc-inner-page #kt_app_content_container .row,
body.kboc-inner-page .modal-body .row,
body.kboc-inner-page .card-body .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.kboc-inner-page #kt_app_content_container [class*="col-"],
body.kboc-inner-page .modal-body [class*="col-"],
body.kboc-inner-page .card-body [class*="col-"] {
  min-width: 0;
}

body.kboc-inner-page .d-flex,
body.kboc-inner-page .flex-row-fluid,
body.kboc-inner-page .flex-column-fluid {
  min-width: 0;
}

.table-responsive,
.table-responsive-custom,
.dataTables_wrapper {
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

.table-responsive table,
.table-responsive-custom table,
.dataTables_wrapper table,
table.dataTable {
  min-width: max-content;
}

.modal-dialog {
  max-width: min(96vw, var(--bs-modal-width, 800px)) !important;
}

.modal-xl {
  --bs-modal-width: min(1140px, 96vw);
}

.modal-lg {
  --bs-modal-width: min(800px, 96vw);
}

body.kboc-home .kboc-main,
body.kboc-home main,
body.kboc-auth-page #authContainer,
body.bodybg main {
  width: 100%;
  max-width: 100%;
}

body.kboc-home .kboc-container {
  width: min(1280px, calc(100% - 1.5rem)) !important;
  max-width: 100%;
}

body.kboc-auth-page .kboc-auth-shell,
body.kboc-auth-page .kboc-login-panel {
  min-height: calc(100dvh - 150px);
}

body.kboc-auth-page .kboc-auth-card {
  width: min(480px, calc(100vw - 1.5rem));
}

body.kboc-auth-page,
body.kboc-auth-page #authContainer,
body.kboc-auth-page .kboc-auth-shell,
body.kboc-auth-page .kboc-login-panel {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
}

body.kboc-auth-page .container-fluid,
body.kboc-auth-page .container {
  max-width: 100%;
}

body.kboc-auth-page .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.kboc-auth-page [class*="col-"] {
  min-width: 0;
}

body.kboc-auth-page .kboc-site-header,
body.kboc-auth-page .kboc-login-header,
body.kboc-auth-page .kboc-topbar,
body.kboc-auth-page .kboc-navshell {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
}

body.kboc-login-page {
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
}

body.kboc-login-page #header {
  flex: 0 0 auto;
}

body.kboc-login-page #authContainer {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
}

body.kboc-login-page .kboc-auth-shell {
  flex: 1 1 auto;
  min-height: 0 !important;
  height: auto !important;
  padding: 0.75rem 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.kboc-login-page .kboc-auth-shell > .row,
body.kboc-login-page .kboc-auth-shell > .row > .col,
body.kboc-login-page .kboc-auth-shell > .row > .col > .container-fluid {
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

body.kboc-login-page .kboc-login-panel,
body.kboc-login-page .lgb_3 {
  width: 100% !important;
  min-height: 500px !important;
  height: auto !important;
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  align-items: center;
  justify-content: center !important;
  background: #ffffff !important;
  border: 0 !important;
  border-radius: 5px !important;
  box-shadow: 1px 1px 1px 1px #f3f2f2 !important;
}

body.kboc-login-page .kboc-login-panel > .bgwhite {
  flex: 0 0 auto !important;
  width: 41.66666667% !important;
  max-width: 41.66666667% !important;
  padding: 0 !important;
  justify-content: center !important;
  background: #ffffff !important;
}

body.kboc-login-page .kboc-auth-card {
  width: 100% !important;
  max-width: 80% !important;
  min-height: 0;
  max-height: calc(100dvh - 210px);
  overflow: auto;
  border-radius: 18px !important;
}

body.kboc-login-page .kboc-auth-card .card-body {
  padding: clamp(1.4rem, 3vw, 2.25rem) !important;
}

body.kboc-login-page #loginForm {
  width: 100%;
}

body.kboc-login-page #loginForm .form-control {
  min-height: 46px;
  font-size: 0.95rem;
}

body.kboc-login-page .fv-row {
  margin-bottom: 1rem !important;
}

body.kboc-login-page .text-center.mb-10,
body.kboc-login-page .alert.mb-10,
body.kboc-login-page #submitLogin.mb-5 {
  margin-bottom: 1rem !important;
}

body.kboc-login-page .kboc-navshell .navbar-nav,
body.kboc-login-page .kboc-navshell .offcanvas-body,
body.kboc-login-page #loginHeaderNav,
body.kboc-login-page #loginHeaderNav .offcanvas-body {
  overflow: visible !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  max-height: none !important;
}

body.kboc-login-page .kboc-navshell .navbar-nav {
  flex-wrap: nowrap;
}

body.kboc-login-page .bgf1,
body.kboc-login-page .lgbf1 {
  flex: 0 0 auto;
  min-height: 0 !important;
}

body.kboc-login-page .lgbf1 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

body.kboc-login-form-page .kboc-auth-shell {
  align-items: flex-start;
  padding: 1.85rem 1rem 1rem !important;
}

body.kboc-login-form-page .kboc-auth-shell > .row,
body.kboc-login-form-page .kboc-auth-shell > .row > .col,
body.kboc-login-form-page .kboc-auth-shell > .row > .col > .container-fluid {
  display: flex;
  justify-content: center;
}

body.kboc-login-form-page .kboc-login-panel {
  width: min(1200px, calc(100vw - 2rem)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  padding: 2.25rem 1rem !important;
  background: #ffffff !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: 22px !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, 0.09) !important;
}

body.kboc-login-form-page .kboc-login-panel > .bgwhite {
  width: min(465px, 100%) !important;
  max-width: 465px !important;
  flex: 0 0 min(465px, 100%) !important;
}

body.kboc-login-form-page .kboc-auth-card {
  width: 100% !important;
  max-width: 465px !important;
  min-height: 0 !important;
  border-radius: 14px !important;
  border: 1px solid var(--kboc-border) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.1) !important;
}

body.kboc-login-form-page .kboc-auth-card .card-body {
  padding: 2.15rem 1.9rem !important;
}

body.kboc-login-form-page .text-center.mb-10 {
  margin-bottom: 1.35rem !important;
}

body.kboc-login-form-page #loginForm .form-control {
  min-height: 48px;
}

body.kboc-login-form-page #submitLogin {
  min-height: 46px;
  border-radius: 999px !important;
}

.kboc-change-password-page .kboc-auth-shell {
  min-height: calc(100dvh - 170px) !important;
  padding: 1.85rem 1rem 1rem !important;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.kboc-change-password-page .kboc-auth-shell > .row,
.kboc-change-password-page .kboc-auth-shell > .row > .col,
.kboc-change-password-page .kboc-auth-shell > .row > .col > .container-fluid {
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  justify-content: center;
}

.kboc-change-password-page .kboc-login-panel {
  width: min(1200px, 100%) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  padding: 2.25rem 1rem !important;
  align-items: center;
  justify-content: center !important;
  background: #ffffff !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: 22px !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, 0.09) !important;
}

.kboc-change-password-page .kboc-login-panel > .bgwhite {
  width: min(465px, 100%) !important;
  max-width: 465px !important;
  flex: 0 0 min(465px, 100%) !important;
  padding: 0 !important;
  justify-content: center !important;
  background: #ffffff !important;
}

.kboc-change-password-page .kboc-auth-card {
  width: 100% !important;
  max-width: 465px !important;
  min-height: 0 !important;
  border: 1px solid var(--kboc-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.1) !important;
}

.kboc-change-password-page .kboc-auth-card .card-body {
  padding: 2.15rem 1.9rem !important;
}

.kboc-change-password-page .form-control {
  min-height: 48px;
}

.kboc-change-password-page #btnUpdatePassword {
  min-height: 46px;
  border-radius: 999px !important;
}

@media (max-width: 991.98px) {
  .kboc-main {
    padding-top: 7.5rem !important;
  }

  body.kboc-inner-page #kt_app_header_container {
    min-height: 64px;
  }

  body.kboc-inner-page .page-title h1,
  body.kboc-inner-page .page-title .h5 {
    font-size: 0.98rem !important;
  }

  .kboc-auth-shell {
    padding: 1rem 0 !important;
  }

  body.kboc-login-page .kboc-login-panel > .bgwhite {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.kboc-login-page .kboc-auth-card {
    max-width: min(520px, 100%) !important;
  }

  body.kboc-login-form-page .kboc-auth-shell {
    padding: 1rem 0.75rem !important;
  }

  body.kboc-login-form-page .kboc-login-panel {
    width: 100% !important;
    min-height: 0 !important;
    padding: 1rem !important;
  }

  .kboc-change-password-page .kboc-auth-shell {
    min-height: 0 !important;
    padding: 1rem 0.75rem !important;
  }

  .kboc-change-password-page .kboc-login-panel {
    width: 100% !important;
    min-height: 0 !important;
    padding: 1rem !important;
  }

  body.kboc-inner-page .app-wrapper {
    min-width: 0;
  }

  body.kboc-inner-page #kt_app_header_wrapper {
    min-width: 0;
  }

  body.kboc-inner-page #kt_app_content_container {
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }

  .card-body {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .table-responsive table,
  .table-responsive-custom table,
  .dataTables_wrapper table,
  table.dataTable {
    min-width: 720px;
  }
}

@media (max-width: 575.98px) {
  .container,
  .app-container {
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }

  .btn {
    white-space: normal;
  }

  .kboc-main {
    padding-top: 8.4rem !important;
  }

  body.kboc-inner-page #kt_app_header_wrapper {
    gap: 0.75rem;
  }

  body.kboc-inner-page .breadcrumb {
    display: none;
  }

  body.kboc-inner-page #kt_app_header_container,
  body.kboc-inner-page #kt_app_header_wrapper {
    align-items: center;
  }

  body.kboc-inner-page .page-title {
    min-width: 0;
  }

  body.kboc-inner-page .page-title h1,
  body.kboc-inner-page .page-title .h5 {
    white-space: normal;
  }

  body.kboc-inner-page .d-flex.justify-content-end,
  body.kboc-inner-page .d-flex.justify-content-between {
    gap: 0.5rem;
  }

  body.kboc-inner-page .card,
  body.kboc-inner-page .modal-content,
  body.kboc-inner-page .alert {
    border-radius: 6px !important;
  }

  .modal-dialog {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
    max-width: calc(100vw - 1rem) !important;
  }

  .table-responsive table,
  .table-responsive-custom table,
  .dataTables_wrapper table,
  table.dataTable {
    min-width: 640px;
  }
}

/* Compact authenticated UI refinement */
body.kboc-inner-page {
  --kboc-bg: #f3f7f6;
  --kboc-border: #dbe7e3;
  --kboc-shadow: 0 6px 18px rgba(15, 23, 42, 0.055);
  font-size: 0.9rem;
  background: #f3f7f6 !important;
}

body.kboc-inner-page #kt_app_header_container {
  min-height: 60px;
}

body.kboc-inner-page #kt_app_content_container {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
  padding-left: clamp(0.65rem, 1vw, 1rem) !important;
  padding-right: clamp(0.65rem, 1vw, 1rem) !important;
}

body.kboc-inner-page .card,
body.kboc-inner-page .modal-content,
body.kboc-inner-page .table-responsive,
body.kboc-inner-page .table-responsive-custom,
body.kboc-inner-page .select2-dropdown,
body.kboc-inner-page .alert {
  border-color: var(--kboc-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--kboc-shadow) !important;
}

body.kboc-inner-page .card-header,
body.kboc-inner-page .modal-header,
body.kboc-inner-page .card-footer,
body.kboc-inner-page .modal-footer {
  min-height: 0 !important;
  padding: 0.75rem 0.95rem !important;
}

body.kboc-inner-page .card-body,
body.kboc-inner-page .modal-body {
  padding: 0.9rem !important;
}

body.kboc-inner-page .card-title,
body.kboc-inner-page .modal-title,
body.kboc-inner-page h5 {
  font-size: 1rem !important;
}

body.kboc-inner-page h1,
body.kboc-inner-page h2,
body.kboc-inner-page h3,
body.kboc-inner-page h4 {
  line-height: 1.25;
}

body.kboc-inner-page .row {
  --bs-gutter-x: 0.85rem;
  --bs-gutter-y: 0.85rem;
}

body.kboc-inner-page .form-group,
body.kboc-inner-page .bank-form-group,
body.kboc-inner-page .fv-row {
  margin-bottom: 0.75rem !important;
}

body.kboc-inner-page .form-label,
body.kboc-inner-page label {
  margin-bottom: 0.3rem !important;
  font-size: 0.82rem !important;
  line-height: 1.25;
}

body.kboc-inner-page .form-control,
body.kboc-inner-page .form-select,
body.kboc-inner-page .select2-container--bootstrap5 .select2-selection,
body.kboc-inner-page textarea,
body.kboc-inner-page input[type="text"],
body.kboc-inner-page input[type="password"],
body.kboc-inner-page input[type="email"],
body.kboc-inner-page input[type="date"],
body.kboc-inner-page input[type="number"] {
  min-height: 38px !important;
  padding: 0.45rem 0.65rem !important;
  font-size: 0.875rem !important;
  border-color: #d5e1dd !important;
}

body.kboc-inner-page textarea.form-control,
body.kboc-inner-page textarea {
  min-height: 84px !important;
}

body.kboc-inner-page .input-group-text {
  min-height: 38px;
  padding: 0.45rem 0.65rem;
  border-color: #d5e1dd !important;
}

body.kboc-inner-page .btn {
  min-height: 36px;
  padding: 0.43rem 0.75rem !important;
  font-size: 0.86rem !important;
  border-radius: 6px !important;
}

body.kboc-inner-page .btn-sm,
body.kboc-inner-page .btn.btn-sm {
  min-height: 30px;
  padding: 0.28rem 0.55rem !important;
  font-size: 0.78rem !important;
}

body.kboc-inner-page .view-receipt-details-btn.btn-outline-primary {
  color: var(--bs-primary) !important;
  background-color: #ffffff !important;
  border: 1px solid var(--bs-primary) !important;
  border-radius: 50rem !important;
}

.view-receipt-details-btn.btn-outline-primary {
  color: var(--bs-primary) !important;
  background-color: #ffffff !important;
  border: 1px solid var(--bs-primary) !important;
  border-radius: 50rem !important;
}

body.kboc-inner-page .view-receipt-details-btn.btn-outline-primary:hover,
body.kboc-inner-page .view-receipt-details-btn.btn-outline-primary:focus {
  color: #ffffff !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.view-receipt-details-btn.btn-outline-primary:hover,
.view-receipt-details-btn.btn-outline-primary:focus {
  color: #ffffff !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

body.kboc-inner-page .view-receipt-details-btn.btn-outline-primary i {
  color: inherit !important;
}

.view-receipt-details-btn.btn-outline-primary i {
  color: inherit !important;
}

body.kboc-inner-page .table-responsive,
body.kboc-inner-page .table-responsive-custom,
body.kboc-inner-page .dataTables_wrapper {
  margin-top: 0.5rem;
  border-radius: 8px !important;
}

body.kboc-inner-page table,
body.kboc-inner-page .table {
  font-size: 0.84rem;
}

body.kboc-inner-page table > :not(caption) > * > *,
body.kboc-inner-page .table > :not(caption) > * > * {
  padding: 0.52rem 0.65rem !important;
}

body.kboc-inner-page table > thead > tr > th,
body.kboc-inner-page .table > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > th {
  font-size: 0.72rem !important;
  letter-spacing: 0;
}

body.kboc-inner-page .dataTables_wrapper .row {
  align-items: center;
  row-gap: 0.5rem;
}

body.kboc-inner-page .dataTables_wrapper .dataTables_length,
body.kboc-inner-page .dataTables_wrapper .dataTables_filter,
body.kboc-inner-page .dataTables_wrapper .dataTables_info,
body.kboc-inner-page .dataTables_wrapper .dataTables_paginate {
  font-size: 0.82rem;
}

body.kboc-inner-page .dataTables_wrapper .dataTables_filter input,
body.kboc-inner-page .dataTables_wrapper .dataTables_length select {
  min-height: 32px !important;
  padding: 0.3rem 0.5rem !important;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link {
  min-height: 36px;
  padding-top: 0.45rem !important;
  padding-bottom: 0.45rem !important;
  font-size: 0.86rem;
}

body.kboc-inner-page .kboc-sidebar .menu .menu-item {
  margin-bottom: 0.1rem;
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link.active {
  background: #ffffff !important;
  color: #143b3d !important;
  box-shadow: inset 3px 0 0 var(--kboc-accent);
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link.active .menu-icon,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link.active .menu-icon {
  color: var(--kboc-accent) !important;
}

body.kboc-inner-page .kboc-dashboard {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

body.kboc-inner-page .kboc-dashboard-header {
  margin-bottom: 0.65rem !important;
  padding: 0.62rem 0.8rem;
}

body.kboc-inner-page .kboc-dashboard-header h3 {
  font-size: 1.05rem !important;
  margin-bottom: 0 !important;
}

body.kboc-inner-page .kboc-dashboard-panel {
  padding: 0.65rem;
  margin-bottom: 0.75rem !important;
  border-radius: 8px;
  box-shadow: var(--kboc-shadow);
}

body.kboc-inner-page .kboc-panel-head {
  margin-bottom: 0.55rem;
  padding-bottom: 0.48rem;
}

body.kboc-inner-page .kboc-panel-head h5 {
  font-size: 1rem !important;
}

body.kboc-inner-page .kboc-stat-card .card-body,
body.kboc-inner-page .kboc-action-card .card-body {
  padding: 0.68rem !important;
}

body.kboc-inner-page .kboc-stat-card h3 {
  font-size: 1.25rem !important;
  margin-bottom: 0;
}

body.kboc-inner-page .kboc-stat-card h6,
body.kboc-inner-page .kboc-action-card h6 {
  font-size: 0.82rem !important;
  margin-bottom: 0.25rem;
}

body.kboc-inner-page .kboc-action-card small {
  font-size: 0.78rem;
  line-height: 1.2;
}

body.kboc-inner-page .kboc-card-icon {
  width: 2rem;
  height: 2rem;
  margin-bottom: 0.35rem !important;
  font-size: 1rem !important;
  border-radius: 7px;
}

body.kboc-inner-page .kboc-divider {
  margin: 1rem 0 !important;
}

@media (min-width: 992px) {
  body.kboc-inner-page .table-responsive table,
  body.kboc-inner-page .table-responsive-custom table,
  body.kboc-inner-page .dataTables_wrapper table,
  body.kboc-inner-page table.dataTable {
    width: 100% !important;
  }
}

/* Readable authenticated pages and unified form/table system */
body.kboc-inner-page {
  --kboc-bg: #ffffff;
  --kboc-border: #e0e7e4;
  --kboc-surface-muted: #f7faf9;
  --kboc-shadow: 0 4px 14px rgba(15, 23, 42, 0.045);
  font-size: 1rem;
  line-height: 1.45;
  background: #ffffff !important;
}

body.kboc-inner-page .app-page,
body.kboc-inner-page .app-wrapper,
body.kboc-inner-page .app-main,
body.kboc-inner-page .app-content,
body.kboc-inner-page #kt_app_content,
body.kboc-inner-page #kt_app_content_container {
  background: #ffffff !important;
}

body.kboc-inner-page #kt_app_content_container {
  position: relative;
  min-height: calc(100vh - 125px);
  padding-top: 0.85rem !important;
  padding-bottom: 1rem !important;
}

body.kboc-inner-page .card {
  border-color: #e3ebe8 !important;
  box-shadow: none !important;
}

body.kboc-inner-page .card.shadow,
body.kboc-inner-page .card.shadow-sm,
body.kboc-inner-page .card.shadow-lg,
body.kboc-inner-page .shadow,
body.kboc-inner-page .shadow-sm,
body.kboc-inner-page .shadow-lg {
  box-shadow: var(--kboc-shadow) !important;
}

body.kboc-inner-page .card-header,
body.kboc-inner-page .modal-header {
  background: #f7faf9 !important;
  border-bottom: 1px solid #e3ebe8 !important;
}

body.kboc-inner-page .bank-form-title,
body.kboc-inner-page .title-text,
body.kboc-inner-page .card-title,
body.kboc-inner-page .modal-title,
body.kboc-inner-page .page-title h1,
body.kboc-inner-page .page-title .h5 {
  display: flex;
  align-items: center;
  min-height: 38px;
  margin: 0 0 0.85rem !important;
  padding: 0.55rem 0.75rem;
  color: #143b3d !important;
  -webkit-text-fill-color: #143b3d !important;
  background: #f7faf9 !important;
  border: 1px solid #e0e7e4;
  border-left: 4px solid var(--kboc-primary);
  border-radius: 8px;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.25;
  text-align: left !important;
}

body.kboc-inner-page .card-header .card-title,
body.kboc-inner-page .modal-header .modal-title,
body.kboc-inner-page .page-title h1,
body.kboc-inner-page .page-title .h5 {
  margin-bottom: 0 !important;
  padding: 0;
  background: transparent !important;
  border: 0;
  min-height: 0;
}

body.kboc-inner-page .bank-form-title::after,
body.kboc-inner-page .title-text::after,
body.kboc-inner-page .card-title::after {
  display: none !important;
}

body.kboc-inner-page .form-label,
body.kboc-inner-page label {
  color: #263b36 !important;
  font-size: 0.94rem !important;
  font-weight: 700 !important;
}

body.kboc-inner-page .form-control,
body.kboc-inner-page .form-select,
body.kboc-inner-page .select2-container--bootstrap5 .select2-selection,
body.kboc-inner-page textarea,
body.kboc-inner-page input[type="text"],
body.kboc-inner-page input[type="password"],
body.kboc-inner-page input[type="email"],
body.kboc-inner-page input[type="date"],
body.kboc-inner-page input[type="number"] {
  min-height: 42px !important;
  padding: 0.52rem 0.72rem !important;
  font-size: 0.96rem !important;
  border-color: #d7e2df !important;
  border-radius: 7px !important;
}

body.kboc-inner-page .btn {
  min-height: 40px;
  padding: 0.5rem 0.9rem !important;
  font-size: 0.93rem !important;
}

body.kboc-inner-page table,
body.kboc-inner-page .table,
body.kboc-inner-page table.dataTable {
  width: 100% !important;
  font-size: 0.94rem !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid #e0e7e4 !important;
  border-radius: 8px;
  overflow: hidden;
}

body.kboc-inner-page table > thead > tr > th,
body.kboc-inner-page .table > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > td,
body.kboc-inner-page .table-light > tr > th,
body.kboc-inner-page thead.table-light > tr > th {
  padding: 0.62rem 0.72rem !important;
  background: #143b3d !important;
  color: #ffffff !important;
  border-color: #1d4f51 !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  vertical-align: middle !important;
}

body.kboc-inner-page table > :not(caption) > * > *,
body.kboc-inner-page .table > :not(caption) > * > * {
  padding: 0.62rem 0.72rem !important;
  color: #2f403c;
  border-bottom-color: #e3ebe8 !important;
  vertical-align: middle !important;
}

body.kboc-inner-page table > tbody > tr:nth-child(even) > *,
body.kboc-inner-page .table > tbody > tr:nth-child(even) > * {
  background: #f8fbfa !important;
}

body.kboc-inner-page table > tbody > tr:hover > *,
body.kboc-inner-page .table > tbody > tr:hover > * {
  background: #eef7f4 !important;
}

body.kboc-inner-page .table-responsive,
body.kboc-inner-page .table-responsive-custom,
body.kboc-inner-page .dataTables_wrapper {
  border: 0 !important;
  box-shadow: none !important;
  background: #ffffff !important;
}

body.kboc-inner-page .dataTables_wrapper .dataTables_length,
body.kboc-inner-page .dataTables_wrapper .dataTables_filter,
body.kboc-inner-page .dataTables_wrapper .dataTables_info,
body.kboc-inner-page .dataTables_wrapper .dataTables_paginate {
  font-size: 0.9rem;
}

/* Clean personalized dashboard */
body.kboc-inner-page .kboc-dashboard-shell {
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

body.kboc-inner-page .kboc-dashboard-bottom {
  --bs-gutter-x: 0.85rem;
  --bs-gutter-y: 0.85rem;
}

body.kboc-inner-page .kboc-dashboard-summary-panel,
body.kboc-inner-page .kboc-dashboard-panel {
  padding: 0.95rem 1rem;
  border: 1px solid #e5ebf2;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfcfe 0%, #f5f7fb 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

body.kboc-inner-page .kboc-dashboard-welcome {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 0.95rem 1rem;
  border: 1px solid #e5ebf2;
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

body.kboc-inner-page .kboc-dashboard-welcome-avatar {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #e5eefc 0%, #eef7ff 100%);
  color: #3c7be6;
  font-size: 1.8rem;
}

body.kboc-inner-page .kboc-dashboard-welcome-copy {
  min-width: 0;
}

body.kboc-inner-page .kboc-dashboard-welcome-label {
  margin-bottom: 0.18rem;
  color: #6b7280;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.kboc-inner-page .kboc-dashboard-welcome-copy h4 {
  margin: 0 0 0.16rem;
  color: #18212f;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1.2;
}

body.kboc-inner-page .kboc-dashboard-welcome-copy p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  color: #5f6b7a;
  font-size: 0.9rem;
  font-weight: 600;
}

body.kboc-inner-page .kboc-dashboard-welcome-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c7d2e0;
}

body.kboc-inner-page .kboc-dashboard-section-head {
  margin-bottom: 0.72rem;
  text-align: left;
}

body.kboc-inner-page .kboc-dashboard-section-head h5 {
  margin: 0 0 0.25rem;
  color: #18212f;
  font-size: 1.12rem !important;
  font-weight: 900 !important;
}

body.kboc-inner-page .kboc-dashboard-section-head p {
  margin: 0;
  color: #5f6b7a;
  font-size: 0.88rem;
  font-weight: 600;
}

body.kboc-inner-page .col-xl-2-4 {
  width: 20%;
}

body.kboc-inner-page .kboc-summary-card {
  height: 100%;
  padding: 0.9rem 0.78rem;
  border: 1px solid rgba(229, 235, 242, 0.9);
  border-radius: 18px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.032);
  text-align: left;
}

body.kboc-inner-page .kboc-summary-card-green {
  background: linear-gradient(180deg, #eefbf2 0%, #f7fdf9 100%);
}

body.kboc-inner-page .kboc-summary-card-blue {
  background: linear-gradient(180deg, #eef5ff 0%, #f8fbff 100%);
}

body.kboc-inner-page .kboc-summary-card-orange {
  background: linear-gradient(180deg, #fff5e9 0%, #fffaf2 100%);
}

body.kboc-inner-page .kboc-summary-card-pink {
  background: linear-gradient(180deg, #fff1f3 0%, #fff8f9 100%);
}

body.kboc-inner-page .kboc-summary-card-yellow {
  background: linear-gradient(180deg, #fff9df 0%, #fffdf4 100%);
}

body.kboc-inner-page .kboc-summary-card-purple {
  background: linear-gradient(180deg, #f4efff 0%, #faf7ff 100%);
}

body.kboc-inner-page .kboc-summary-icon,
body.kboc-inner-page .kboc-quick-icon {
  width: 42px;
  height: 42px;
  margin: 0 0 0.58rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 1rem;
  border: 1px solid transparent;
}

body.kboc-inner-page .kboc-summary-icon-green,
body.kboc-inner-page .kboc-quick-icon.kboc-summary-icon-green {
  background: #eefbf2;
  border-color: #d7f4df;
  color: #2f9d57;
}

body.kboc-inner-page .kboc-summary-icon-orange {
  background: #fff5e9;
  border-color: #ffe3bf;
  color: #eb8f1c;
}

body.kboc-inner-page .kboc-summary-icon-blue {
  background: #eef5ff;
  border-color: #dce8ff;
  color: #3c7be6;
}

body.kboc-inner-page .kboc-summary-icon-red {
  background: #fff1f1;
  border-color: #ffd9d9;
  color: #df5f63;
}

body.kboc-inner-page .kboc-summary-icon-purple {
  background: #f4efff;
  border-color: #e2d8ff;
  color: #8661df;
}

body.kboc-inner-page .kboc-summary-label {
  margin-bottom: 0.28rem;
  color: #475467;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

body.kboc-inner-page .kboc-summary-value {
  margin-bottom: 0.18rem;
  color: #161f2d;
  font-size: 1.38rem;
  font-weight: 900;
  line-height: 1.2;
}

body.kboc-inner-page .kboc-summary-note,
body.kboc-inner-page .kboc-summary-subnote {
  color: #596579;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.3;
}

body.kboc-inner-page .kboc-summary-subnote {
  margin-top: 0.3rem;
}

body.kboc-inner-page .kboc-quick-card {
  height: 100%;
  display: block;
  padding: 0.88rem 0.88rem;
  border: 1px solid #edf1f5;
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fafd 100%);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.035);
  text-align: left;
  text-decoration: none;
}

body.kboc-inner-page .kboc-quick-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.42rem;
}

body.kboc-inner-page .kboc-quick-icon {
  background: #f7f8fb;
  border-color: #e8edf4;
  color: #475467;
}

body.kboc-inner-page .kboc-quick-arrow {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #e8edf4;
  color: #64748b;
  font-size: 0.9rem;
}

body.kboc-inner-page .kboc-quick-title {
  margin-bottom: 0.18rem;
  color: #172030;
  font-size: 0.95rem;
  font-weight: 800;
}

body.kboc-inner-page .kboc-quick-copy {
  color: #5f6b7a;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.28;
}

body.kboc-inner-page .kboc-dashboard-table-wrap {
  overflow: visible;
  border: 1px solid #e9edf2;
  border-radius: 18px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.03);
  max-height: none;
}

/* Compact dashboard: no nested scrolling and only essential information. */
body.kboc-inner-page #userdashboarddiv.kboc-dashboard {
  padding-top: 0.6rem !important;
  padding-bottom: 0.6rem !important;
  overflow: visible !important;
}

body.kboc-inner-page .kboc-dashboard-shell {
  gap: 0.55rem;
}

body.kboc-inner-page .kboc-dashboard-welcome,
body.kboc-inner-page .kboc-dashboard-summary-panel,
body.kboc-inner-page .kboc-dashboard-panel {
  padding: 0.65rem 0.75rem;
  border-radius: 12px;
}

body.kboc-inner-page .kboc-dashboard-welcome-avatar {
  width: 40px;
  height: 40px;
  font-size: 1.3rem;
}

body.kboc-inner-page .kboc-dashboard-welcome-label,
body.kboc-inner-page .kboc-summary-note,
body.kboc-inner-page .kboc-quick-copy,
body.kboc-inner-page .kboc-dashboard-section-head p {
  display: none;
}

body.kboc-inner-page .kboc-dashboard-section-head {
  margin-bottom: 0.4rem;
}

body.kboc-inner-page .kboc-summary-grid,
body.kboc-inner-page .kboc-dashboard-bottom,
body.kboc-inner-page .kboc-dashboard-bottom .row {
  --bs-gutter-x: 0.55rem;
  --bs-gutter-y: 0.55rem;
}

body.kboc-inner-page .kboc-summary-card,
body.kboc-inner-page .kboc-quick-card {
  padding: 0.55rem 0.65rem;
  border-radius: 12px;
}

body.kboc-inner-page .kboc-summary-icon,
body.kboc-inner-page .kboc-quick-icon {
  width: 32px;
  height: 32px;
  margin-bottom: 0.3rem;
}

body.kboc-inner-page .kboc-dashboard-table-wrap {
  border-radius: 12px;
}

body.kboc-inner-page .kboc-clean-table th,
body.kboc-inner-page .kboc-clean-table td {
  padding-top: 0.45rem !important;
  padding-bottom: 0.45rem !important;
}

body.kboc-inner-page .kboc-clean-table {
  border: 0 !important;
  border-radius: 0;
  overflow: visible;
}

body.kboc-inner-page .kboc-clean-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f3f5f7 !important;
  color: #4b5563 !important;
  border-bottom: 1px solid #e5e7eb !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

body.kboc-inner-page .kboc-clean-table tbody td {
  height: 40px;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  background: #ffffff !important;
  color: #243041 !important;
  font-size: 0.88rem !important;
  font-weight: 600;
}

body.kboc-inner-page .kboc-clean-table tbody tr:nth-child(even) td {
  background: #fbfcfd !important;
}

body.kboc-inner-page .kboc-clean-table tbody tr:hover td {
  background: #f6f9fc !important;
}

body.kboc-inner-page .kboc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.2;
  border: 1px solid transparent;
}

body.kboc-inner-page .kboc-status-created {
  background: #edf9f0;
  border-color: #d8f0de;
  color: #2c8b51;
}

body.kboc-inner-page .kboc-status-approval {
  background: #fff4e7;
  border-color: #ffe1ba;
  color: #d97706;
}

body.kboc-inner-page .kboc-status-pending {
  background: #fff0f0;
  border-color: #ffd8d8;
  color: #d14343;
}

@media (max-width: 1399.98px) {
  body.kboc-inner-page .col-xl-2-4 {
    width: 33.333333%;
  }
}

@media (max-width: 991.98px) {
  body.kboc-inner-page .col-xl-2-4 {
    width: 50%;
  }
}

@media (max-width: 767.98px) {
  body.kboc-inner-page .col-xl-2-4 {
    width: 100%;
  }

  body.kboc-inner-page .kboc-dashboard-welcome {
    align-items: flex-start;
    flex-direction: column;
  }

  body.kboc-inner-page .kboc-dashboard-welcome,
  body.kboc-inner-page .kboc-dashboard-summary-panel,
  body.kboc-inner-page .kboc-dashboard-panel {
    padding: 0.9rem;
    border-radius: 16px;
  }
}

@media (min-width: 992px) {
  body.kboc-inner-page .kboc-dashboard-bottom > div {
    display: flex;
  }

  body.kboc-inner-page .kboc-dashboard-bottom .kboc-dashboard-panel {
    width: 100%;
  }

  body.kboc-inner-page .kboc-dashboard-bottom .col-lg-4 .kboc-dashboard-panel,
  body.kboc-inner-page .kboc-dashboard-bottom .col-lg-8 .kboc-dashboard-panel {
    min-height: 430px;
  }

  body.kboc-inner-page .kboc-dashboard-bottom .col-lg-4 .row.g-3 {
    --bs-gutter-y: 0.65rem;
  }

  body.kboc-inner-page .kboc-dashboard-bottom .col-lg-4 .kboc-quick-card {
    min-height: 102px;
  }
}

body.kboc-inner-page .kboc-sidebar .menu .kboc-menu-link,
body.kboc-inner-page .kboc-sidebar .menu .kboc-submenu-link {
  min-height: 38px;
  padding-top: 0.48rem !important;
  padding-bottom: 0.48rem !important;
  font-size: 0.92rem;
}

body.kboc-inner-page #userdashboarddiv.kboc-dashboard,
body.kboc-inner-page .kboc-dashboard {
  background: #ffffff !important;
}

/* Inner page compact alignment refinements */
body.kboc-inner-page #kt_app_content_container {
  padding-top: 0.65rem !important;
  padding-bottom: 0.65rem !important;
}

body.kboc-inner-page .card,
body.kboc-inner-page .modal-content,
body.kboc-inner-page .alert {
  border-color: #e7eeeb !important;
  border-radius: 7px !important;
}

body.kboc-inner-page .card + .card,
body.kboc-inner-page form + .card,
body.kboc-inner-page .card + form,
body.kboc-inner-page .table-responsive + .card,
body.kboc-inner-page .table-responsive-custom + .card {
  margin-top: 0.75rem !important;
}

body.kboc-inner-page .card-header,
body.kboc-inner-page .modal-header,
body.kboc-inner-page .card-footer,
body.kboc-inner-page .modal-footer {
  padding: 0.58rem 0.75rem !important;
}

body.kboc-inner-page .card-body,
body.kboc-inner-page .modal-body {
  padding: 0.72rem !important;
}

body.kboc-inner-page .row {
  --bs-gutter-x: 0.65rem;
  --bs-gutter-y: 0.58rem;
}

body.kboc-inner-page .form-group,
body.kboc-inner-page .bank-form-group,
body.kboc-inner-page .fv-row,
body.kboc-inner-page .mb-3,
body.kboc-inner-page .mb-4 {
  margin-bottom: 0.58rem !important;
}

body.kboc-inner-page .form-label,
body.kboc-inner-page label {
  margin-bottom: 0.18rem !important;
  font-size: 0.9rem !important;
  line-height: 1.2;
}

body.kboc-inner-page .form-control,
body.kboc-inner-page .form-select,
body.kboc-inner-page .select2-container--bootstrap5 .select2-selection,
body.kboc-inner-page textarea,
body.kboc-inner-page input[type="text"],
body.kboc-inner-page input[type="password"],
body.kboc-inner-page input[type="email"],
body.kboc-inner-page input[type="date"],
body.kboc-inner-page input[type="number"] {
  min-height: 38px !important;
  padding: 0.42rem 0.62rem !important;
  border-color: #dce6e2 !important;
  border-radius: 6px !important;
}

body.kboc-inner-page .form-control:focus,
body.kboc-inner-page .form-select:focus,
body.kboc-inner-page .select2-container--bootstrap5.select2-container--focus .select2-selection,
body.kboc-inner-page textarea:focus,
body.kboc-inner-page input:focus {
  border-color: #8fc9bf !important;
  box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.12) !important;
}

body.kboc-inner-page .input-group-text {
  min-height: 38px;
  padding: 0.42rem 0.6rem;
  background: #f7faf9 !important;
  border-color: #dce6e2 !important;
}

body.kboc-inner-page .btn {
  min-height: 36px;
  padding: 0.42rem 0.72rem !important;
  border-radius: 6px !important;
}

body.kboc-inner-page .bank-form-button {
  min-height: 40px;
  padding: 0.5rem 0.9rem !important;
  background: var(--kboc-primary) !important;
  border: 1px solid var(--kboc-primary) !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-size: 0.93rem !important;
  font-weight: 700 !important;
}

body.kboc-inner-page .bank-form-button:hover,
body.kboc-inner-page .bank-form-button:focus {
  background: var(--kboc-primary-strong) !important;
  border-color: var(--kboc-primary-strong) !important;
  color: #ffffff !important;
}

body.kboc-inner-page .btn-icon,
body.kboc-inner-page .btn.btn-icon {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.kboc-inner-page .bank-form-title,
body.kboc-inner-page .title-text,
body.kboc-inner-page .card-title,
body.kboc-inner-page .modal-title {
  margin-bottom: 0.58rem !important;
  padding: 0.45rem 0.65rem;
  font-size: 0.98rem !important;
  border-color: #e2ebe8;
}

body.kboc-inner-page .table-responsive,
body.kboc-inner-page .table-responsive-custom,
body.kboc-inner-page .dataTables_wrapper {
  margin-top: 0.35rem !important;
  margin-bottom: 0 !important;
}

body.kboc-inner-page table,
body.kboc-inner-page .table,
body.kboc-inner-page table.dataTable {
  border-color: #e3ebe8 !important;
  font-size: 0.9rem !important;
}

body.kboc-inner-page table > thead > tr > th,
body.kboc-inner-page .table > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > td {
  padding: 0.5rem 0.62rem !important;
  font-size: 0.78rem !important;
}

body.kboc-inner-page table > :not(caption) > * > *,
body.kboc-inner-page .table > :not(caption) > * > * {
  padding: 0.5rem 0.62rem !important;
}

body.kboc-inner-page .dataTables_wrapper .row,
body.kboc-inner-page .dataTables_wrapper .dataTables_length,
body.kboc-inner-page .dataTables_wrapper .dataTables_filter,
body.kboc-inner-page .dataTables_wrapper .dataTables_info,
body.kboc-inner-page .dataTables_wrapper .dataTables_paginate {
  margin-top: 0 !important;
  margin-bottom: 0.35rem !important;
}

body.kboc-inner-page .dataTables_wrapper .dataTables_info,
body.kboc-inner-page .dataTables_wrapper .dataTables_paginate {
  margin-bottom: 0 !important;
  padding-top: 0.45rem !important;
}

body.kboc-inner-page .dataTables_wrapper .dataTables_filter input,
body.kboc-inner-page .dataTables_wrapper .dataTables_length select {
  min-height: 30px !important;
  padding: 0.25rem 0.45rem !important;
}

body.kboc-inner-page .table-responsive table,
body.kboc-inner-page .table-responsive-custom table,
body.kboc-inner-page .dataTables_wrapper table,
body.kboc-inner-page table.dataTable {
  margin-bottom: 0 !important;
}

body.kboc-inner-page .kboc-adddesig-page .table-responsive {
  width: 100%;
  overflow-x: hidden !important;
}

body.kboc-inner-page .kboc-adddesig-page #desigtable,
body.kboc-inner-page .kboc-adddesig-page #desigtable_wrapper {
  width: 100% !important;
}

body.kboc-inner-page .kboc-adddesig-page #desigtable {
  table-layout: fixed;
}

body.kboc-inner-page .kboc-adddesig-page .kboc-col-shortcode,
body.kboc-inner-page .kboc-adddesig-page #desigtable tbody td:nth-child(3) {
  width: 90px !important;
  max-width: 90px;
  text-align: center;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-adddesig-page .kboc-col-level,
body.kboc-inner-page .kboc-adddesig-page #desigtable tbody td:nth-child(4) {
  width: 70px !important;
  max-width: 70px;
  text-align: center;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-adddesig-page .kboc-col-actions,
body.kboc-inner-page .kboc-adddesig-page #desigtable tbody td:nth-child(5) {
  width: 62px !important;
  max-width: 62px;
  text-align: center;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-adddesig-page #desigtable tbody td {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.kboc-inner-page .kboc-adddesig-page .kboc-desig-search {
  max-width: 260px;
}

body.kboc-inner-page .kboc-add-department-page .table-responsive {
  width: 100%;
  overflow-x: hidden !important;
}

body.kboc-inner-page .kboc-add-department-page .kboc-department-table {
  width: 100% !important;
  table-layout: fixed;
}

body.kboc-inner-page .kboc-add-department-page .kboc-col-sector,
body.kboc-inner-page .kboc-add-department-page .kboc-department-table tbody td:nth-child(1) {
  width: 25%;
}

body.kboc-inner-page .kboc-add-department-page .kboc-col-dept-name,
body.kboc-inner-page .kboc-add-department-page .kboc-department-table tbody td:nth-child(2) {
  width: 28%;
}

body.kboc-inner-page .kboc-add-department-page .kboc-col-dept-name-mal,
body.kboc-inner-page .kboc-add-department-page .kboc-department-table tbody td:nth-child(3) {
  width: 34%;
}

body.kboc-inner-page .kboc-add-department-page .kboc-col-status,
body.kboc-inner-page .kboc-add-department-page .kboc-department-table tbody td:nth-child(4) {
  width: 90px;
  text-align: center;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-add-department-page .kboc-department-table tbody td {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.kboc-inner-page .kboc-view-establishment-page {
  margin: 0 !important;
}

body.kboc-inner-page .kboc-view-establishment-card {
  background: #ffffff !important;
  border: 1px solid #e1eae7 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body.kboc-inner-page .kboc-view-establishment-card .card-body {
  padding: 1rem 1.1rem !important;
}

body.kboc-inner-page .kboc-list-toolbar,
body.kboc-inner-page .kboc-filter-toolbar {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

body.kboc-inner-page .kboc-list-toolbar {
  justify-content: space-between;
  margin-bottom: 0.85rem;
}

body.kboc-inner-page .kboc-filter-toolbar {
  justify-content: flex-end;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
  padding: 0.75rem;
  background: #f7faf9;
  border: 1px solid #e2ebe8;
  border-radius: 9px;
}

body.kboc-inner-page .kboc-search-field {
  flex: 1 1 360px;
  max-width: 520px;
}

body.kboc-inner-page .kboc-filter-field {
  flex: 0 1 320px;
}

body.kboc-inner-page .kboc-search-field .form-label,
body.kboc-inner-page .kboc-filter-field .form-label {
  margin-bottom: 0.25rem !important;
}

body.kboc-inner-page .kboc-add-button {
  min-height: 38px;
  font-weight: 800 !important;
}

body.kboc-inner-page .kboc-establishment-table {
  table-layout: fixed;
  width: 100% !important;
}

body.kboc-inner-page .kboc-view-establishment-page .table-responsive {
  width: 100%;
  overflow-x: hidden !important;
  border: 1px solid #e3ebe8 !important;
  border-radius: 9px;
}

body.kboc-inner-page .kboc-col-est-name {
  width: 24%;
}

body.kboc-inner-page .kboc-col-est-address {
  width: 25%;
}

body.kboc-inner-page .kboc-col-est-email {
  width: 18%;
}

body.kboc-inner-page .kboc-col-est-phone {
  width: 12%;
}

body.kboc-inner-page .kboc-col-est-status {
  width: 9%;
}

body.kboc-inner-page .kboc-col-est-actions {
  width: 12%;
}

body.kboc-inner-page .kboc-establishment-table tbody td {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.kboc-inner-page .kboc-establishment-table tbody td:nth-child(5),
body.kboc-inner-page .kboc-establishment-table tbody td:nth-child(6) {
  white-space: nowrap;
}

body.kboc-inner-page .kboc-status-badge {
  min-width: 68px;
  padding: 0.34rem 0.5rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

body.kboc-inner-page .kboc-status-active {
  color: #08705f !important;
  background: #dff6ef !important;
}

body.kboc-inner-page .kboc-status-deleted {
  color: #b42318 !important;
  background: #ffe4e6 !important;
}

body.kboc-inner-page .kboc-action-cell {
  white-space: nowrap;
}

body.kboc-inner-page .kboc-action-cell .kboc-row-action + .kboc-row-action {
  margin-left: 0.35rem;
}

body.kboc-inner-page .kboc-row-action {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2563eb !important;
  background: #eff6ff !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px;
}

body.kboc-inner-page .kboc-row-action-warning {
  color: #b45309 !important;
  background: #fff7ed !important;
  border-color: #fed7aa !important;
}

body.kboc-inner-page .kboc-row-action-danger {
  color: #b42318 !important;
  background: #fff1f2 !important;
  border-color: #fecaca !important;
}

body.kboc-inner-page .kboc-row-action:hover,
body.kboc-inner-page .kboc-row-action:focus {
  color: #ffffff !important;
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
}

body.kboc-inner-page .kboc-view-establishment-card .card-footer {
  margin-top: 0.75rem;
  padding: 0.75rem 0 0 !important;
  background: transparent !important;
  border-top: 0 !important;
}

@media (max-width: 767.98px) {
  body.kboc-inner-page .kboc-list-toolbar,
  body.kboc-inner-page .kboc-filter-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  body.kboc-inner-page .kboc-search-field,
  body.kboc-inner-page .kboc-filter-field,
  body.kboc-inner-page .kboc-add-button {
    width: 100%;
    max-width: none;
  }

  body.kboc-inner-page .kboc-view-establishment-page .table-responsive {
    overflow-x: auto !important;
  }

  body.kboc-inner-page .kboc-establishment-table {
    min-width: 820px;
  }
}

body.kboc-inner-page #kt_create_establishment_form label,
body.kboc-inner-page #kt_create_establishment_form .form-label,
body.kboc-inner-page #kt_create_establishment_form label .required {
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: #1f3430 !important;
  line-height: 1.3;
}

body.kboc-inner-page #kt_create_establishment_form label i {
  font-size: 1rem !important;
}

body.kboc-inner-page #kt_create_establishment_form .fv-row {
  margin-bottom: 0.9rem !important;
}

body.kboc-inner-page #kt_create_establishment_form h1 {
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  color: #143b3d !important;
}

/* Global inner-page readability bump */
body.kboc-inner-page {
  font-size: 1.04rem !important;
}

body.kboc-inner-page .form-label,
body.kboc-inner-page label {
  font-size: 1rem !important;
}

body.kboc-inner-page .form-control,
body.kboc-inner-page .form-select,
body.kboc-inner-page .select2-container--bootstrap5 .select2-selection,
body.kboc-inner-page textarea,
body.kboc-inner-page input,
body.kboc-inner-page select,
body.kboc-inner-page table,
body.kboc-inner-page .table,
body.kboc-inner-page table.dataTable {
  font-size: 1rem !important;
}

body.kboc-inner-page .btn {
  font-size: 0.98rem !important;
}

body.kboc-inner-page .bank-form-title,
body.kboc-inner-page .title-text,
body.kboc-inner-page .card-title,
body.kboc-inner-page .modal-title {
  font-size: 1.3rem !important;
}

body.kboc-inner-page .kboc-form-heading-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem !important;
}

body.kboc-inner-page .kboc-form-heading-row .bank-form-title {
  flex: 1 1 auto;
  margin: 0 !important;
}

body.kboc-inner-page .kboc-establishment-create-card {
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1px solid #e1eae7 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body.kboc-inner-page .kboc-establishment-create-form {
  padding: 1.15rem 1.25rem !important;
}

body.kboc-inner-page .kboc-create-heading-row {
  align-items: center;
  padding: 0.72rem 0.85rem;
  margin-bottom: 1.1rem !important;
  background: linear-gradient(135deg, #eef8f6 0%, #f8fbfa 100%);
  border: 1px solid #d8e7e3;
  border-left: 4px solid var(--kboc-primary);
  border-radius: 10px;
}

body.kboc-inner-page .kboc-create-heading-row .bank-form-title {
  min-height: 0;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: #123f3c !important;
  -webkit-text-fill-color: #123f3c !important;
  font-size: 1.28rem !important;
  font-weight: 850 !important;
  line-height: 1.25;
}

body.kboc-inner-page .kboc-heading-icon {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kboc-primary-strong);
  background: #ffffff;
  border: 1px solid #d6e8e3;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(15, 118, 110, 0.08);
}

body.kboc-inner-page .kboc-heading-icon i {
  color: currentColor !important;
  font-size: 1.2rem !important;
}

body.kboc-inner-page .kboc-establishment-create-form > [data-kt-stepper-element="content"] > .w-100 > .row {
  --bs-gutter-x: 1rem;
  --bs-gutter-y: 0.15rem;
}

body.kboc-inner-page .kboc-establishment-create-form .pt-5,
body.kboc-inner-page .kboc-establishment-create-form .pt-6 {
  padding-top: 0 !important;
}

body.kboc-inner-page .kboc-close-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-width: 86px;
  min-height: 38px;
  padding: 0.45rem 0.75rem !important;
  background: #fff1f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 999px !important;
  color: #b42318 !important;
  font-size: 0.96rem !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(180, 35, 24, 0.1) !important;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-close-action:hover,
body.kboc-inner-page .kboc-close-action:focus {
  background: #b42318 !important;
  border-color: #b42318 !important;
  color: #ffffff !important;
}

body.kboc-inner-page .kboc-close-action i {
  color: currentColor !important;
  font-size: 0.98rem !important;
}

body.kboc-inner-page .kboc-project-list-card .card-body {
  padding-left: 0.85rem !important;
  padding-right: 0.85rem !important;
}

body.kboc-inner-page .kboc-project-table-wrap {
  width: 100%;
  overflow-x: hidden !important;
}

body.kboc-inner-page .kboc-project-table-wrap table,
body.kboc-inner-page .kboc-project-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed;
}

body.kboc-inner-page .kboc-project-table th,
body.kboc-inner-page .kboc-project-table td {
  padding: 0.46rem 0.42rem !important;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.28;
}

body.kboc-inner-page .kboc-project-table th {
  font-size: 0.72rem !important;
}

body.kboc-inner-page .kboc-project-table td {
  font-size: 1.0rem !important;
}

body.kboc-inner-page .kboc-project-col-id {
  width: 12%;
}

body.kboc-inner-page .kboc-project-col-name {
  width: 21%;
}

body.kboc-inner-page .kboc-project-col-status {
  width: 12%;
}

body.kboc-inner-page .kboc-project-col-amount {
  width: 12%;
}

body.kboc-inner-page .kboc-project-col-cess {
  width: 11%;
}

body.kboc-inner-page .kboc-project-col-payment {
  width: 14%;
}

body.kboc-inner-page .kboc-project-col-actions {
  width: 18%;
}

body.kboc-inner-page .kboc-project-id a,
body.kboc-inner-page .kboc-project-name,
body.kboc-inner-page .kboc-project-status .badge,
body.kboc-inner-page .kboc-project-payment .badge {
  max-width: 100%;
}

body.kboc-inner-page .kboc-project-id a {
  font-size: 1.2rem !important;
  line-height: 1.2;
}

body.kboc-inner-page .kboc-project-amount {
  overflow-wrap: normal;
  word-break: normal;
}

body.kboc-inner-page .kboc-project-status .badge,
body.kboc-inner-page .kboc-project-payment .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 0.3rem 0.46rem !important;
  white-space: normal;
  text-align: center;
  line-height: 1.18;
}

body.kboc-inner-page .kboc-project-action-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.28rem;
}

body.kboc-inner-page .kboc-project-action-group .btn {
  width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0 !important;
  font-size: 0.99rem !important;
  line-height: 1.15;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

body.kboc-inner-page .kboc-project-view-panel {
  overflow: hidden;
  border: 1px solid #cfded9 !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

body.kboc-inner-page .kboc-project-view-panel .card-body {
  padding: 0 !important;
}

body.kboc-inner-page .kboc-project-view-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 1.35rem;
  background: linear-gradient(135deg, #f8fafc 0%, #e8f4f1 100%);
  border-bottom: 1px solid #d8e5e1;
}

body.kboc-inner-page .kboc-project-view-title {
  min-width: 0;
}

body.kboc-inner-page .kboc-project-view-kicker {
  display: block;
  margin-bottom: 0.35rem;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.kboc-inner-page #viewProjectName {
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.kboc-inner-page .kboc-project-view-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  flex: 0 0 auto;
}

body.kboc-inner-page .kboc-project-view-actions .badge {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
  text-align: center;
}

body.kboc-inner-page .kboc-project-view-body {
  padding: 1.25rem;
  background: #ffffff;
}

body.kboc-inner-page .kboc-project-view-section {
  padding: 1rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

body.kboc-inner-page .kboc-project-view-section + .kboc-project-view-section {
  margin-top: 1rem;
}

body.kboc-inner-page .kboc-project-view-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.9rem;
}

body.kboc-inner-page .kboc-project-view-section-head h5 {
  margin: 0;
  color: #183b3b !important;
  font-size: 0.98rem;
  font-weight: 800;
}

body.kboc-inner-page .kboc-project-view-field {
  height: 100%;
}

body.kboc-inner-page .kboc-project-view-field .form-label {
  margin-bottom: 0.45rem;
  color: #475569 !important;
  font-size: 0.82rem;
  letter-spacing: 0.04em !important;
  text-transform: uppercase;
}

body.kboc-inner-page .kboc-project-view-field .form-control {
  min-height: 44px;
  border-color: #d6e0dc !important;
  background: #ffffff !important;
  color: #162923 !important;
  font-weight: 700;
}

body.kboc-inner-page .kboc-project-view-field textarea.form-control {
  min-height: 126px;
  line-height: 1.5;
  resize: none;
}

body.kboc-inner-page .kboc-project-view-finance {
  background: #fffdf7;
  border-color: #eadfcb;
}

body.kboc-inner-page .kboc-project-view-field-accent .form-control {
  border-color: #fecaca !important;
  background: #fff7f7 !important;
}

body.kboc-inner-page .kboc-project-view-return {
  margin-top: 1rem;
  padding: 1rem;
  background: #fff7f7;
  border: 1px solid #fecaca;
  border-radius: 12px;
}

body.kboc-inner-page .kboc-project-view-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: #f8fafc;
  border-top: 1px solid #d8e5e1;
}

body.kboc-inner-page .kboc-project-view-footer .btn {
  min-width: 96px;
  min-height: 40px;
}

@media (max-width: 991.98px) {
  body.kboc-inner-page .kboc-project-table th,
  body.kboc-inner-page .kboc-project-table td {
    padding: 0.36rem 0.26rem !important;
    font-size:1.2rem !important;
  }

  body.kboc-inner-page .kboc-project-table th {
    font-size: 1.2rem !important;
  }

  body.kboc-inner-page .kboc-project-action-group .btn {
    width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0 !important;
    font-size: 1.2rem !important;
  }

  body.kboc-inner-page .kboc-project-view-header {
    flex-direction: column;
    align-items: stretch;
  }

  body.kboc-inner-page .kboc-project-view-actions {
    justify-content: space-between;
  }
}

@media (max-width: 575.98px) {
  body.kboc-inner-page .kboc-form-heading-row {
    align-items: stretch;
    flex-direction: column;
  }

  body.kboc-inner-page .kboc-close-action {
    align-self: flex-end;
  }

  body.kboc-inner-page .kboc-project-view-body,
  body.kboc-inner-page .kboc-project-view-header,
  body.kboc-inner-page .kboc-project-view-footer {
    padding: 0.9rem;
  }

  body.kboc-inner-page .kboc-project-view-footer {
    flex-direction: column;
    align-items: stretch;
  }

  body.kboc-inner-page .kboc-project-view-footer .btn {
    width: 100%;
  }
}

body.kboc-inner-page table > thead > tr > th,
body.kboc-inner-page .table > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > th,
body.kboc-inner-page table.dataTable > thead > tr > td {
  font-size: 0.88rem !important;
}

/* Cleaner dashboard layout: no nested panel chrome, filled visual tiles */
body.kboc-inner-page #userdashboarddiv.kboc-dashboard {
  padding-top: 0.35rem !important;
}

body.kboc-inner-page .kboc-dashboard-panel {
  padding: 0 !important;
  margin-bottom: 1rem !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.kboc-inner-page .kboc-dashboard-panel + .kboc-dashboard-panel {
  margin-top: 0 !important;
}

body.kboc-inner-page .kboc-panel-head {
  margin-bottom: 0.55rem !important;
  padding: 0 !important;
  border: 0 !important;
}

body.kboc-inner-page .kboc-panel-head h5,
body.kboc-inner-page .kboc-dashboard h5 {
  min-height: 0;
  padding: 0 !important;
  color: #143b3d !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
}

body.kboc-inner-page .kboc-dashboard-header {
  padding: 0 !important;
  margin-bottom: 0.85rem !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.kboc-inner-page .kboc-dashboard-header h3 {
  font-size: 1.15rem !important;
  color: #143b3d !important;
}

body.kboc-inner-page .kboc-summary-row,
body.kboc-inner-page .kboc-actions-row {
  --bs-gutter-x: 0.85rem;
  --bs-gutter-y: 0.85rem;
}

body.kboc-inner-page .kboc-stat-card,
body.kboc-inner-page .kboc-action-card {
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--kboc-card-ink) !important;
}

body.kboc-inner-page .kboc-stat-card:hover,
body.kboc-inner-page .kboc-action-card:hover {
  border: 0 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08) !important;
  transform: translateY(-1px) !important;
}

body.kboc-inner-page .kboc-tone-indigo,
body.kboc-inner-page .kboc-tone-navy {
  --kboc-card-accent: #0f766e;
  --kboc-card-ink: #083f3b;
  --kboc-card-tint: rgba(255, 255, 255, 0.55);
  background: linear-gradient(135deg, #cceee8 0%, #e8f8f5 100%) !important;
}

body.kboc-inner-page .kboc-tone-teal,
body.kboc-inner-page .kboc-tone-green {
  --kboc-card-accent: #2563eb;
  --kboc-card-ink: #1d3f7a;
  --kboc-card-tint: rgba(255, 255, 255, 0.58);
  background: linear-gradient(135deg, #d7e6ff 0%, #eef5ff 100%) !important;
}

body.kboc-inner-page .kboc-tone-amber,
body.kboc-inner-page .kboc-tone-cyan {
  --kboc-card-accent: #b45309;
  --kboc-card-ink: #7a3e05;
  --kboc-card-tint: rgba(255, 255, 255, 0.58);
  background: linear-gradient(135deg, #ffe6b8 0%, #fff6df 100%) !important;
}

body.kboc-inner-page .kboc-tone-rose,
body.kboc-inner-page .kboc-tone-violet {
  --kboc-card-accent: #9a3412;
  --kboc-card-ink: #74270f;
  --kboc-card-tint: rgba(255, 255, 255, 0.58);
  background: linear-gradient(135deg, #ffd9cc 0%, #fff0ea 100%) !important;
}

body.kboc-inner-page .kboc-tone-charcoal {
  --kboc-card-accent: #475569;
  --kboc-card-ink: #243244;
  --kboc-card-tint: rgba(255, 255, 255, 0.58);
  background: linear-gradient(135deg, #dce5ee 0%, #f3f6f8 100%) !important;
}

body.kboc-inner-page .kboc-stat-card .card-body,
body.kboc-inner-page .kboc-action-card .card-body {
  padding: 0.85rem !important;
}

body.kboc-inner-page .kboc-card-icon {
  color: var(--kboc-card-accent) !important;
  background: var(--kboc-card-tint) !important;
}

body.kboc-inner-page .kboc-action-link {
  color: var(--kboc-card-ink) !important;
  background: rgba(255, 255, 255, 0.52) !important;
}

body.kboc-inner-page .kboc-dashboard-panel .kboc-table-card,
body.kboc-inner-page .kboc-table-card {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Receipt details modal */
.receipt-details-modal .modal-dialog {
  --bs-modal-width: min(1120px, 94vw);
}

.receipt-details-modal .modal-content {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22) !important;
  overflow: hidden;
}

.receipt-details-modal .modal-header {
  padding: 1.15rem 1.4rem !important;
  background: #ffffff !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.receipt-details-modal .modal-title {
  color: #111827 !important;
  font-size: 2.35rem !important;
  letter-spacing: 0 !important;
}

.receipt-modal-subtitle {
  color: #6b7280;
  font-size: 0.78rem;
  font-weight: 600;
  margin-top: 0.1rem;
}

.receipt-modal-icon,
.receipt-info-icon,
.receipt-field-icon,
.receipt-summary-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 50%;
}

.receipt-modal-icon {
  width: 48px;
  height: 48px;
  background: #16a34a;
  color: #ffffff;
  font-size: 1.35rem;
  box-shadow: 0 10px 20px rgba(22, 163, 74, 0.24);
}

.receipt-status-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 0.78rem;
  border-radius: 999px;
  background: #dcfce7;
  color: #15803d;
  border: 1px solid #bbf7d0;
  font-size: 0.90rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0;
  white-space: nowrap;
}

.receipt-details-modal .btn-close {
  width: 36px;
  height: 36px;
  margin: 0 !important;
  border-radius: 50%;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  opacity: 1;
  box-shadow: none;
}

.receipt-details-modal .modal-body {
  padding: 1.25rem 1.4rem !important;
  background: #ffffff;
}

.receipt-details-modal .modal-footer {
  padding: 1rem 1.4rem !important;
  background: #ffffff !important;
  border-top: 1px solid #e5e7eb !important;
}

.receipt-close-btn {
  min-width: 96px;
  border-radius: 999px !important;
  border: 1px solid #020a12 !important;
  border: 1px solid #020a12 !important;
  background: #143b3d !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}

.receipt-close-btn:hover {
  background: #426c97 !important;
  border-color: #02060b !important;
}

.receipt-forwarded-status-card {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 1rem;
  padding: 0.95rem 1.15rem;
  background: #eaf4ff;
  border: 1px solid #b9dcff;
  border-radius: 12px;
  color: #111827;
}

.receipt-forwarded-status-label {
  font-size: 1.5rem;
  font-weight: 900;
  color: #143b3d;
}

.receipt-forwarded-status-text {
  font-size: 1.5rem;
  font-weight: 800;
  color: #111827;
}

.receipt-details-view {
  color: #111827;
}

.receipt-info-banner {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem 1.1rem;
  margin-bottom: 1rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(22, 163, 74, 0.08);
}

.receipt-info-icon {
  width: 42px;
  height: 42px;
  background: #dcfce7;
  color: #15803d;
  font-size: 1.2rem;
}

.receipt-info-banner h6 {
  color: #14532d !important;
  font-size: 1.5rem;
  font-weight: 800;
}

.receipt-bill-no {
  color: #4b5563;
  font-size: 1rem;
  font-weight: 600;
}

.receipt-bill-no span {
  color: #111827;
}

.receipt-detail-card {
  height: 100%;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.receipt-detail-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.09);
}

.receipt-detail-item {
  display: grid;
  grid-template-columns: 34px minmax(130px, 0.58fr) 12px minmax(0, 1fr);
  align-items: center;
  gap: 0.65rem;
  min-height: 58px;
  padding: 0.74rem 0.95rem;
}

.receipt-detail-item + .receipt-detail-item {
  border-top: 1px solid #eef2f7;
}

.receipt-field-icon {
  width: 34px;
  height: 34px;
  background: #ecfdf3;
  color: #16a34a;
  font-size: 0.98rem;
}

.receipt-field-label {
  color: #374151;
  font-size: 1.2rem;
  font-weight: 900;
}

.receipt-field-separator {
  color: #9ca3af;
  font-weight: 800;
  text-align: center;
}

.receipt-field-value {
  color: #111827;
  font-size: 1.2rem;
  font-weight: 1000;
  line-height: 1.35;
  min-width: 0;
}

.receipt-amount {
  color: #15803d !important;
  font-size: 1.2rem;
  font-weight: 900;
}

.receipt-summary-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1.05rem 1.1rem;
  background: linear-gradient(135deg, #f0fdf4 0%, #eff6ff 100%);
  border: 1px solid #c7ead3;
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.07);
}

.receipt-summary-left {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  min-width: 280px;
}

.receipt-summary-icon {
  width: 54px;
  height: 54px;
  background: #dcfce7;
  color: #15803d;
  font-size: 1.55rem;
  border: 1px solid #bbf7d0;
}

.receipt-summary-title {
  color: #374151;
  font-size: 0.86rem;
  font-weight: 800;
}

.receipt-summary-amount {
  color: #15803d;
  font-size: 1.45rem;
  font-weight: 900;
  line-height: 1.1;
  margin-top: 0.2rem;
}

.receipt-summary-words {
  flex: 1;
  padding-left: 1rem;
  border-left: 1px solid rgba(22, 163, 74, 0.18);
}

.receipt-summary-text {
  color: #6b7280;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.5;
  margin-top: 0.25rem;
}

.info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #eaf4ff;
  font-size: 1.15rem;
}

@media (max-width: 991.98px) {
  .receipt-details-modal .modal-dialog {
    --bs-modal-width: 96vw;
  }

  .receipt-detail-item {
    grid-template-columns: 34px minmax(120px, 0.54fr) 12px minmax(0, 1fr);
  }

  .receipt-summary-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .receipt-summary-left {
    min-width: 0;
  }

  .receipt-summary-words {
    width: 100%;
    padding-left: 0;
    padding-top: 0.85rem;
    border-left: 0;
    border-top: 1px solid rgba(22, 163, 74, 0.18);
  }
}

@media (max-width: 575.98px) {
  .receipt-details-modal .modal-header {
    align-items: flex-start;
    gap: 0.9rem;
  }

  .receipt-details-modal .modal-title {
    font-size: 2.5rem !important;
  }

  .receipt-status-pill {
    display: none;
  }

  .receipt-detail-item {
    grid-template-columns: 34px 1fr;
    gap: 0.35rem 0.65rem;
  }

  .receipt-field-separator {
    display: none;
  }

  .receipt-field-value {
    grid-column: 2;
  }
}

/* Project / Work bill statements */
.bill-statement-page {
  color: #111827;
}

.bill-statement-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.15rem 1.25rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.bill-statement-search {
  width: min(340px, 100%);
}

.bill-statement-shell {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 1rem;
  align-items: stretch;
  min-height: 620px;
}

.bill-list-panel {
  display: flex;
  flex-direction: column;
  min-height: 620px;
  max-height: 720px;
  overflow: hidden;
  background: transparent;
  border: 1px solid var(--kboc-border);
  border-radius: 8px;
  box-shadow: none;
}

.bill-list-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem;
  border-bottom: 1px solid var(--kboc-border);
}

.bill-list-eyebrow {
  color: var(--kboc-primary);
  font-size: 0.75rem;
  font-weight: 800;
  text-transform: uppercase;
}

.bill-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 0.55rem;
  color: var(--kboc-primary-strong);
  background: var(--kboc-primary-soft);
  border-radius: 999px;
  font-weight: 900;
}

.bill-list-scroll {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  overflow-y: auto;
  padding: 1rem;
}

.bill-list-scroll::-webkit-scrollbar {
  width: 8px;
}

.bill-list-scroll::-webkit-scrollbar-thumb {
  background: var(--kboc-border);
  border-radius: 999px;
}

.bill-list-card {
  display: block;
  width: 100%;
  padding: 0.95rem;
  color: var(--kboc-ink);
  text-align: left;
  background: transparent;
  border: 1px solid var(--kboc-border);
  border-radius: 8px;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.bill-list-card:hover,
.bill-list-card.active {
  background: var(--kboc-primary);
  color: #ffffff;
  border-color: var(--kboc-primary);
  transform: translateY(-1px);
}

.bill-list-card .text-white-50 {
  color: var(--kboc-muted) !important;
}

.bill-list-card:hover .text-white-50,
.bill-list-card.active .text-white-50 {
  color: rgba(255, 255, 255, 0.78) !important;
}

.bill-list-card-top,
.bill-list-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.bill-list-id {
  min-width: 0;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bill-list-meta {
  margin-top: 0.7rem;
  font-size: 0.8rem;
  font-weight: 700;
}

.bill-mini-status {
  flex: 0 0 auto;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: #e0f2fe;
  color: #075985;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.bill-status-success {
  background: #dcfce7 !important;
  color: #166534 !important;
}

.bill-status-danger {
  background: #fee2e2 !important;
  color: #991b1b !important;
}

.bill-status-warning {
  background: #fef3c7 !important;
  color: #92400e !important;
}

.bill-detail-panel {
  min-width: 0;
}

.bill-detail-card {
  display: flex;
  flex-direction: column;
  min-height: 620px;
  padding: 1.25rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.08);
}

.bill-detail-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #eef2f7;
}

.bill-detail-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  color: var(--kboc-primary);
  background: var(--kboc-primary-soft);
  border-radius: 50%;
  font-size: 1.25rem;
}

.bill-detail-subtitle {
  color: #6b7280;
  font-size: 0.92rem;
  font-weight: 800;
  text-transform: uppercase;
}

.bill-detail-card-header h3 {
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.2;
}

.bill-amount-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1rem 0;
}

.bill-amount-strip > div {
  padding: 1rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.bill-amount-strip > div > span,
.bill-info-tile span {
  display: block;
  color: #6b7280;
  font-size: 1.2rem;
  font-weight: 800;
}

.bill-amount-strip strong {
  display: block;
  margin-top: 0.25rem;
  color: #166534;
  font-size: 1.7rem;
  font-weight: 900;
}

.bill-amount-strip strong span {
  display: inline;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.bill-info-tile {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 0.1rem 0.75rem;
  height: 100%;
  padding: 0.9rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.bill-info-tile i {
  grid-row: span 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  color: var(--kboc-primary);
  background: var(--kboc-primary-soft);
  border-radius: 50%;
}

.bill-info-tile strong {
  min-width: 0;
  color: #111827;
  font-size: 1.08rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.bill-details-page-panel {
  margin-top: 1rem;
}

.bill-details-page-panel .card {
  border-radius: 8px !important;
  overflow: hidden;
}

.kboc-bill-details-section + .kboc-bill-details-section,
.kboc-bill-details-section + .bill-description-card {
  margin-top: 1rem;
}

.kboc-bill-details-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.85rem;
}

.kboc-bill-details-section-head h4 {
  margin: 0;
  color: #183b3b !important;
  font-size: 1rem;
  font-weight: 900;
}

.bill-details-page-panel .bill-amount-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.bill-details-page-panel .card-footer {
  flex-wrap: wrap;
}

body.kboc-inner-page .kboc-bill-payment-view-card {
  overflow: hidden;
  border: 1px solid #cfded9 !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

body.kboc-inner-page .kboc-bill-payment-view-card > .card-body {
  padding: 0 !important;
}

body.kboc-inner-page .kboc-bill-payment-view-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 1.35rem;
  background: linear-gradient(135deg, #f8fafc 0%, #e8f4f1 100%);
  border-bottom: 1px solid #d8e5e1;
}

body.kboc-inner-page .kboc-bill-payment-view-title {
  min-width: 0;
}

body.kboc-inner-page .kboc-bill-payment-view-kicker {
  display: block;
  margin-bottom: 0.35rem;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.kboc-inner-page .kboc-bill-payment-view-title .modal-title {
  margin: 0;
  color: #13231f !important;
  font-size: 1.15rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

body.kboc-inner-page .kboc-bill-payment-view-body {
  padding: 1.25rem;
  background: #ffffff;
}

body.kboc-inner-page .kboc-bill-payment-summary-grid,
body.kboc-inner-page .kboc-bill-payment-amount-grid {
  display: grid;
  gap: 1rem;
}

body.kboc-inner-page .kboc-bill-payment-summary-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.kboc-inner-page .kboc-bill-payment-amount-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 1rem;
}

body.kboc-inner-page .kboc-bill-payment-info-tile,
body.kboc-inner-page .kboc-bill-payment-amount-card,
body.kboc-inner-page .kboc-bill-payment-status-strip,
body.kboc-inner-page .kboc-bill-payment-description {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

body.kboc-inner-page .kboc-bill-payment-info-tile {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 0.15rem 0.8rem;
  min-height: 98px;
  padding: 1rem;
  align-content: center;
}

body.kboc-inner-page .kboc-bill-payment-info-tile i,
body.kboc-inner-page .kboc-bill-payment-status-strip i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: var(--kboc-primary);
  background: var(--kboc-primary-soft);
  border-radius: 50%;
}

body.kboc-inner-page .kboc-bill-payment-info-tile i {
  grid-row: span 2;
}

body.kboc-inner-page .kboc-bill-payment-info-tile span,
body.kboc-inner-page .kboc-bill-payment-amount-card span,
body.kboc-inner-page .kboc-bill-payment-status-strip span {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.kboc-inner-page .kboc-bill-payment-info-tile strong,
body.kboc-inner-page .kboc-bill-payment-status-strip strong {
  min-width: 0;
  color: #162923;
  font-size: 1.02rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

body.kboc-inner-page .kboc-bill-payment-amount-card {
  padding: 1.1rem;
  background: #f7fbff;
  border-color: #d9e7f7;
}

body.kboc-inner-page .kboc-bill-payment-amount-card-accent {
  background: #f6fffb;
  border-color: #cdeee1;
}

body.kboc-inner-page .kboc-bill-payment-amount-card strong {
  display: block;
  margin-top: 0.25rem;
  font-size: 1.6rem;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.kboc-inner-page .kboc-bill-payment-status-strip {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 1rem;
  padding: 1rem;
  background: #fffdf7;
  border-color: #eadfcb;
}

body.kboc-inner-page .kboc-bill-payment-status-strip i {
  flex: 0 0 auto;
  color: #b45309;
  background: #fff7ed;
}

body.kboc-inner-page .kboc-bill-payment-description {
  margin-top: 1rem;
  padding: 1rem;
  background: #ffffff;
}

body.kboc-inner-page .kboc-bill-payment-description h6 {
  margin: 0 0 0.7rem;
  color: #183b3b !important;
  font-size: 0.98rem;
  font-weight: 900;
}

body.kboc-inner-page .kboc-bill-payment-description div {
  min-height: 72px;
  padding: 0.85rem;
  color: #334155;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-weight: 700;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

body.kboc-inner-page .kboc-bill-payment-view-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: #f8fafc;
  border-top: 1px solid #d8e5e1;
}

body.kboc-inner-page .kboc-bill-payment-view-footer .btn {
  min-width: 96px;
  min-height: 40px;
}

.payment-details-full-text {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.35;
}

.history-click-hint {
  font-size: 0.95rem;
}

details[open] .history-click-hint {
  display: none !important;
}

.kboc-error-card {
  max-width: 620px;
  width: 100%;
}

.kboc-input-group-280 {
  width: 280px;
}

.kboc-content-thumb {
  width: 130px;
  height: 130px;
  object-fit: cover;
  border: 2px solid #ddd;
}

.kboc-editor-preview {
  height: 200px;
  overflow: auto;
  background: #fafafa;
}

.kboc-editor-250 {
  height: 250px;
}

.kboc-editor-300 {
  height: 300px;
}

.kboc-editor-400 {
  height: 400px;
}

@media (max-width: 991.98px) {
  body.kboc-inner-page .kboc-bill-payment-summary-grid {
    grid-template-columns: 1fr;
  }

  body.kboc-inner-page .kboc-bill-payment-view-header {
    align-items: stretch;
  }
}

@media (max-width: 575.98px) {
  body.kboc-inner-page .kboc-bill-payment-view-header,
  body.kboc-inner-page .kboc-bill-payment-view-body,
  body.kboc-inner-page .kboc-bill-payment-view-footer {
    padding: 0.9rem;
  }

  body.kboc-inner-page .kboc-bill-payment-amount-grid {
    grid-template-columns: 1fr;
  }

  body.kboc-inner-page .kboc-bill-payment-view-footer {
    flex-direction: column;
    align-items: stretch;
  }

  body.kboc-inner-page .kboc-bill-payment-view-footer .btn {
    width: 100%;
  }
}

.kboc-readonly-muted {
  pointer-events: none;
  background-color: #f8f9fa;
  opacity: 0.9;
}

.kboc-worker-photo {
  max-width: 150px;
  max-height: 200px;
}

.kboc-nomination-action-col {
  width: 90px;
}

.kboc-header-title {
  color: var(--kboc-heading-color, #1d2a35);
  font-weight: bold;
}

.kboc-heading-text {
  color: var(--kboc-heading-color, #1d2a35);
}

.kboc-select-seat-icon {
  font-size: 4rem;
}

.kboc-code-pill {
  padding: 2px 6px;
  border-radius: 4px;
  background-color: #f1f1f1;
  font-family: "Courier New", Courier, monospace;
}

.kboc-borderless-frame {
  border: none;
}

.kboc-movement-history-wrap {
  max-width: 1040px;
}

.receipt-detail-tabs {
  gap: 0.25rem;
  margin: 0 0 0.75rem;
  border-bottom: 1px solid #dbe3ea;
}

.receipt-detail-tabs .nav-link {
  padding: 0.55rem 0.85rem;
  color: #52606d;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  font-size: 0.82rem;
  font-weight: 700;
}

.receipt-detail-tabs .nav-link.active {
  color: #0f766e;
  background: transparent;
  border-bottom-color: #0f766e;
}

.receipt-tab-content {
  min-height: 240px;
}

.receipt-related-content {
  padding-top: 0.15rem;
  font-size: 0.78rem;
}

.receipt-tab-section-title {
  margin-bottom: 0.45rem;
  color: #334155;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.receipt-compact-details-table {
  min-width: 760px;
  table-layout: fixed;
  font-size: 0.78rem;
}

.receipt-compact-details-table th,
.receipt-compact-details-table td {
  padding: 0.55rem 0.65rem !important;
  vertical-align: middle;
}

.receipt-compact-details-table th {
  width: 17%;
  color: #52606d;
  background: #f8fafc;
  font-size: 0.72rem;
  font-weight: 700;
}

.receipt-compact-details-table td {
  width: 33%;
  color: #1e293b;
  overflow-wrap: anywhere;
}

.receipt-document-row {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid #dbe3ea;
  border-radius: 0.5rem;
  background: #fff;
}

.receipt-document-icon {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 0.4rem;
  color: #b42318;
  background: #fef3f2;
  font-size: 1rem;
}

.receipt-history-content {
  padding-top: 0.15rem;
}

.receipt-history-table {
  min-width: 900px;
  table-layout: fixed;
  font-size: 0.76rem;
  line-height: 1.3;
}

.receipt-history-table th {
  padding: 0.55rem 0.6rem !important;
  vertical-align: middle;
  white-space: nowrap;
  font-size: 0.72rem;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.receipt-history-table td {
  padding: 0.5rem 0.6rem !important;
  vertical-align: top;
  color: #334155;
  overflow-wrap: anywhere;
}

.receipt-history-table th:nth-child(1),
.receipt-history-table th:nth-child(2) {
  width: 16%;
}

.receipt-history-table th:nth-child(3) {
  width: 22%;
}

.receipt-history-table th:nth-child(4) {
  width: 18%;
}

.receipt-history-table th:nth-child(5) {
  width: 16%;
}

.receipt-history-table th:nth-child(6) {
  width: 12%;
}

.receipt-history-table .small {
  margin-top: 0.1rem;
  font-size: 0.7rem !important;
  line-height: 1.25;
}

.kboc-otp-input {
  width: 38px;
  height: 42px;
}

.kboc-otp-input-lg {
  width: 42px;
  height: 45px;
  font-size: 16px;
}

.kboc-hidden {
  display: none;
}

.cess-receipt-field-wide {
  max-width: 380px;
  flex: 1 1 320px;
}

.cess-certificate-header {
  line-height: 1.2;
}

.cess-certificate-logo {
  display: block;
  width: auto;
  max-width: 105px;
  height: auto;
  max-height: 80px;
  margin: 0 auto 1px;
}

.cess-certificate-title {
  margin-top: 0;
}

.cess-receipt-meta {
  padding-top: 0.75rem;
  padding-bottom: 1rem;
}

.cess-receipt-meta p + p {
  margin-top: 0.45rem;
}

.cess-receipt-matter {
  line-height: 2;
  padding-top: 0.75rem;
  padding-bottom: 1.25rem;
}

.cess-certificate-signature-row {
  min-height: 150px;
}

.receipt-gradient-header {
  border: 0;
  background: linear-gradient(135deg, #0056b3, #007bff);
}

.project-duration-label {
  width: 70px;
}

.kboc-profile-shell {
  background: #f5f7f9;
  border: 1px solid #e4ebee;
  border-radius: 28px;
  padding: 28px;
}

.kboc-profile-hero {
  background: linear-gradient(135deg, #ffffff 0%, #f8fbfc 100%);
  border: 1px solid #e3ecef;
  border-radius: 26px;
  padding: 28px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
}

.kboc-profile-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 112px;
  height: 112px;
  padding: 12px;
  background: linear-gradient(135deg, #d9f6ee 0%, #effbf7 100%);
  border: 1px solid #cfe7df;
  border-radius: 28px;
}

.kboc-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.kboc-profile-name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  color: #17313b;
  font-size: 1.9rem;
  font-weight: 800;
}

.kboc-profile-role {
  margin-top: 6px;
  color: #0f8a67;
  font-size: 0.98rem;
  font-weight: 700;
}

.kboc-profile-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.kboc-profile-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  background: #f3f8f9;
  border: 1px solid #dde8eb;
  border-radius: 999px;
  color: #35515b;
  font-size: 0.88rem;
  font-weight: 600;
}

.kboc-profile-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.kboc-profile-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 14px;
  padding: 11px 16px;
  font-weight: 700;
}

.kboc-profile-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 22px 0 24px;
  border: 0;
}

.kboc-profile-tabs .nav-link {
  padding: 10px 18px;
  background: #ffffff;
  border: 1px solid #dde8eb;
  border-radius: 999px;
  color: #33505a;
  font-size: 0.92rem;
  font-weight: 700;
}

.kboc-profile-tabs .nav-link.active {
  background: #17313b;
  border-color: #17313b;
  color: #ffffff;
}

.kboc-profile-panel {
  padding: 24px;
  background: #ffffff;
  border: 1px solid #e3ecef;
  border-radius: 24px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.04);
}

.kboc-profile-panel-title {
  margin-bottom: 18px;
  color: #17313b;
  font-size: 1.15rem;
  font-weight: 800;
}

.kboc-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.kboc-profile-field {
  min-height: 98px;
  padding: 16px 18px;
  background: #f7fafb;
  border: 1px solid #e7eef1;
  border-radius: 18px;
}

.kboc-profile-label {
  margin-bottom: 8px;
  color: #6d8189;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.kboc-profile-value {
  color: #18323c;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.45;
  word-break: break-word;
}

@media (max-width: 991.98px) {
  .kboc-profile-shell {
    padding: 18px;
  }

  .kboc-profile-hero {
    padding: 20px;
  }

  .kboc-profile-grid {
    grid-template-columns: 1fr;
  }

  .kboc-profile-actions {
    justify-content: flex-start;
    margin-top: 16px;
  }
}

.bill-description-card {
  margin-top: 1rem;
  padding: 1rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.bill-description-card p {
  color: #4b5563;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.55;
}

.bill-detail-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 1.2rem;
}

@media (max-width: 991.98px) {
  .bill-statement-header {
    align-items: stretch;
    flex-direction: column;
  }

  .bill-statement-search {
    width: 100%;
  }

  .bill-statement-shell {
    grid-template-columns: 1fr;
  }

  .bill-list-panel {
    min-height: auto;
    max-height: 360px;
  }

  .bill-detail-card {
    min-height: 540px;
  }
}

@media (max-width: 575.98px) {
  .bill-statement-header,
  .bill-detail-card {
    padding: 1rem;
  }

  .bill-detail-card-header,
  .bill-list-card-top,
  .bill-list-meta {
    align-items: flex-start;
    flex-direction: column;
  }

  .bill-amount-strip {
    grid-template-columns: 1fr;
  }

  .bill-detail-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .bill-detail-actions .btn {
    width: 100%;
  }
}

/* Extracted from .\src\main\resources\templates\auth\segment\bill.html */
.status-hover-card {
            position: relative;
            overflow: visible;
            z-index: 1;
        }

        .status-hover-card::after {
            content: attr(data-status-message);
            position: absolute;
            left: 50%;
            bottom: calc(100% + 12px);
            transform: translateX(-50%) translateY(6px);
            min-width: 220px;
            max-width: 320px;
            padding: 10px 12px;
            border-radius: 12px;
            background: #183153;
            color: #fff;
            font-size: 0.82rem;
            line-height: 1.45;
            text-align: left;
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.24);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
            z-index: 20;
            white-space: normal;
        }

        .status-hover-card::before {
            content: "";
            position: absolute;
            left: 50%;
            bottom: calc(100% + 4px);
            transform: translateX(-50%) translateY(6px);
            border-width: 8px 7px 0 7px;
            border-style: solid;
            border-color: #183153 transparent transparent transparent;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
            z-index: 20;
        }

        .status-hover-card:hover::after,
        .status-hover-card:hover::before,
        .status-hover-card:focus-visible::after,
        .status-hover-card:focus-visible::before {
            opacity: 1;
            visibility: visible;
            transform: translateX(-50%) translateY(0);
        }

        .status-hover-card:hover,
        .status-hover-card:focus-visible {
            z-index: 30;
        }

        .bill-list-panel-header,
        .bill-list-panel .px-3.pt-3,
        .bill-list-scroll {
            position: relative;
        }

        .bill-statement-shell {
            min-height: 620px;
        }

        .bill-list-panel,
        .bill-detail-card {
            min-height: 620px;
        }

        .bill-list-panel {
            max-height: none;
            overflow: visible;
        }

        .bill-detail-panel {
            display: flex;
        }

        .bill-detail-card {
            width: 100%;
        }

        .bill-list-panel-header,
        .bill-list-panel .px-3.pt-3 {
            z-index: 5;
        }

        .bill-list-scroll {
            z-index: 10;
            padding-top: 20px;
            overflow: visible !important;
            overflow-x: visible !important;
            overflow-y: visible !important;
            max-height: none !important;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .bill-list-scroll::-webkit-scrollbar {
            display: none;
        }

        .bill-list-meta {
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
            gap: 0.35rem;
        }

        .bill-list-meta > span {
            display: block;
            width: 100%;
        }

        .bill-list-status-note {
            white-space: normal;
            line-height: 1.35;
            word-break: break-word;
        }

        .bill-list-scroll > .status-hover-card:first-of-type::after {
            top: calc(100% + 12px);
            bottom: auto;
            transform: translateX(-50%) translateY(-6px);
        }

        .bill-list-scroll > .status-hover-card:first-of-type::before {
            top: calc(100% + 4px);
            bottom: auto;
            transform: translateX(-50%) translateY(-6px);
            border-width: 0 7px 8px 7px;
            border-color: transparent transparent #183153 transparent;
        }

        .bill-list-scroll > .status-hover-card:first-of-type:hover::after,
        .bill-list-scroll > .status-hover-card:first-of-type:hover::before,
        .bill-list-scroll > .status-hover-card:first-of-type:focus-visible::after,
        .bill-list-scroll > .status-hover-card:first-of-type:focus-visible::before {
            transform: translateX(-50%) translateY(0);
        }
/* End extracted from .\src\main\resources\templates\auth\segment\bill.html */

/* Extracted from .\src\main\resources\templates\auth\segment\establishment.html */
.modal-content.cess-user-modal {
					border: 1px solid #dbe7f5;
					border-radius: 0.9rem;
					box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
					overflow: hidden;
				}

				.cess-user-modal-header {
					display: flex;
					align-items: center;
					justify-content: space-between;
					gap: 1rem;
					padding: 1.25rem 1.5rem;
					background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
					border-bottom: 1px solid #dbe7f5;
				}

				.cess-user-modal-title-wrap {
					display: flex;
					align-items: center;
					gap: 0.9rem;
				}

				.cess-user-modal-icon {
					display: inline-flex;
					align-items: center;
					justify-content: center;
					width: 44px;
					height: 44px;
					border-radius: 0.75rem;
					color: #ffffff;
					background: linear-gradient(135deg, #2752b8 0%, #563afa 100%);
					box-shadow: 0 10px 22px rgba(39, 82, 184, 0.22);
					font-size: 1.25rem;
					flex: 0 0 44px;
				}

				.cess-user-modal-subtitle {
					margin: 0.15rem 0 0;
					color: #64748b;
					font-weight: 600;
				}

				.cess-user-modal-body {
					padding: 2rem 2.25rem;
					background: #ffffff;
				}

				.cess-user-form-section {
					padding: 1.5rem 1.65rem;
					border: 1px solid #e2eaf5;
					border-radius: 1rem;
					background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
					box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
				}

				.cess-user-section-title {
					display: flex;
					align-items: center;
					gap: 0.65rem;
					margin-bottom: 1.35rem;
					color: #1d2a35;
					font-size: 1.02rem;
					font-weight: 800;
				}

				.cess-user-field label {
					display: block;
					margin-bottom: 0.55rem;
					color: #475569;
					font-size: 0.8rem;
					font-weight: 700;
					text-transform: uppercase;
					letter-spacing: 0.05em;
				}

				.cess-user-field {
					display: flex;
					flex-direction: column;
					gap: 0.1rem;
				}

				.cess-user-control {
					display: flex;
					align-items: center;
					min-height: 52px;
					border: 1px solid #d5e0ee;
					border-radius: 0.85rem;
					background: #ffffff;
					transition: border-color 0.2s ease, box-shadow 0.2s ease;
				}

				.cess-user-control:focus-within {
					border-color: #2563eb;
					box-shadow: 0 0 0 0.22rem rgba(37, 99, 235, 0.12);
				}

				.cess-user-control-icon {
					display: inline-flex;
					align-items: center;
					justify-content: center;
					width: 48px;
					color: #2563eb;
					font-size: 1.05rem;
					flex: 0 0 48px;
				}

				.cess-user-control .form-control,
				.cess-user-control .form-select {
					min-height: 50px;
					padding: 0.9rem 1rem 0.9rem 0;
					border: 0 !important;
					background-color: transparent !important;
					box-shadow: none !important;
					color: #0f172a;
					font-weight: 600;
				}

				.cess-user-control .form-control:focus,
				.cess-user-control .form-select:focus {
					border: 0 !important;
					box-shadow: none !important;
				}

				.cess-user-modal-actionbar {
					display: flex;
					justify-content: flex-end;
					margin-top: 1.75rem;
					padding-top: 1.4rem;
					border-top: 1px solid #e2eaf5;
				}

				.cess-user-submit-btn {
					min-height: 44px;
					border-radius: 0.7rem;
					font-weight: 800;
				}

				@media (max-width: 767px) {
					.cess-user-modal-header,
					.cess-user-modal-body {
						padding: 1.2rem;
					}

					.cess-user-modal-actionbar,
					.cess-user-submit-btn {
						width: 100%;
					}
				}
/* End extracted from .\src\main\resources\templates\auth\segment\establishment.html */

/* Extracted from .\src\main\resources\templates\auth\segment\establishment.html */
.cess-user-create-shell,
.cess-user-page-shell {
	padding: 1.25rem 0;
	background:
		linear-gradient(180deg, #f7fbff 0%, #eef6f8 100%);
}

.cess-user-create-panel,
.cess-user-page-panel {
	border: 1px solid #d7e6ee;
	border-radius: 1rem;
	background: #ffffff;
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
	overflow: hidden;
}

.cess-user-create-header,
.cess-user-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
	padding: 1.35rem 1.65rem;
	background:
		linear-gradient(135deg, rgba(236, 248, 255, 0.92) 0%, rgba(245, 253, 252, 0.92) 100%),
		#ffffff;
	border-bottom: 1px solid #dbeaf0;
}

.cess-user-create-title-wrap,
.cess-user-page-title-wrap {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	min-width: 0;
}

.cess-user-create-icon,
.cess-user-page-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid rgba(255, 255, 255, 0.65);
	border-radius: 0.85rem;
	color: #ffffff;
	background: linear-gradient(135deg, #1d4ed8 0%, #0f766e 100%);
	box-shadow: 0 12px 24px rgba(29, 78, 216, 0.18);
	font-size: 1.3rem;
	flex: 0 0 48px;
}

.cess-user-page-icon--view {
	background: linear-gradient(135deg, #0f766e 0%, #334155 100%);
	box-shadow: 0 12px 24px rgba(15, 118, 110, 0.18);
}

.cess-user-create-title-wrap h1,
.cess-user-page-title-wrap h2 {
	color: #10233f;
	font-size: clamp(1.25rem, 1.4vw, 1.55rem);
	line-height: 1.25;
	letter-spacing: 0;
}

.cess-user-create-subtitle,
.cess-user-page-subtitle {
	margin: 0.2rem 0 0;
	color: #5f7187;
	font-size: 0.92rem;
	font-weight: 500;
}

.cess-user-form-body,
.cess-user-page-body {
	padding: 1.65rem;
}

.cess-user-form-section {
	height: 100%;
	padding: 1.45rem;
	border: 1px solid #dfebf2;
	border-radius: 0.9rem;
	background: #ffffff;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.045);
}

.cess-user-section-title {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	margin-bottom: 1.25rem;
	padding-bottom: 0.8rem;
	border-bottom: 1px solid #edf3f7;
	color: #10233f;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0;
}

.cess-user-section-title i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 0.65rem;
	background: #eaf4ff;
	color: #1d4ed8 !important;
}

.cess-user-field {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.cess-user-field label {
	display: block;
	margin-bottom: 0.5rem;
	color: #415169;
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.cess-user-control {
	display: flex;
	align-items: center;
	min-height: 52px;
	border: 1px solid #cfdeea;
	border-radius: 0.75rem;
	background: #fbfdff;
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.cess-user-control:hover {
	border-color: #aac8dc;
	background: #ffffff;
}

.cess-user-control:focus-within {
	border-color: #1d4ed8;
	background: #ffffff;
	box-shadow: 0 0 0 0.22rem rgba(29, 78, 216, 0.11);
}

.cess-user-control-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	color: #0f766e;
	font-size: 1.05rem;
	flex: 0 0 46px;
}

.cess-user-control .form-control,
.cess-user-control .form-select {
	min-height: 50px;
	padding: 0.85rem 1rem 0.85rem 0;
	border: 0 !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: #111827;
	font-size: 0.94rem;
	font-weight: 600;
}

.cess-user-control .form-control:focus,
.cess-user-control .form-select:focus {
	border: 0 !important;
	box-shadow: none !important;
}

.cess-user-control .form-control::placeholder {
	color: #94a3b8;
	font-weight: 500;
}

.cess-user-actionbar,
.cess-user-page-actionbar {
	display: flex;
	justify-content: flex-end;
	margin-top: 1.65rem;
	padding-top: 1.35rem;
	border-top: 1px solid #e3edf4;
}

.cess-user-submit-btn {
	min-height: 46px;
	border-radius: 0.7rem;
	font-weight: 800;
	box-shadow: 0 10px 20px rgba(29, 78, 216, 0.16);
}

.cess-user-page-header .btn,
.cess-user-create-header .btn {
	border-radius: 0.7rem;
	font-weight: 800;
}

.cess-user-page-header .btn-light-primary {
	border: 1px solid #cfe2ef;
	background: #ffffff;
	color: #1d4ed8;
}

.cess-user-page-header .btn-light-primary:hover,
.cess-user-page-header .btn-light-primary:focus {
	background: #eaf4ff;
	color: #1746c7;
}

.cess-user-detail-field {
	height: 100%;
	padding: 1rem;
	border: 1px solid #dbe8f0;
	border-radius: 0.85rem;
	background: #fbfdff;
	box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
}

.cess-user-detail-field label {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	margin-bottom: 0.5rem;
	color: #415169;
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.cess-user-detail-field label i {
	color: #0f766e;
	font-size: 0.95rem;
}

.cess-user-detail-field .form-control {
	min-height: 46px;
	border: 1px solid #d4e1ea;
	border-radius: 0.7rem;
	background-color: #ffffff;
	color: #10233f;
	font-size: 0.95rem;
	font-weight: 700;
	box-shadow: none;
}

.cess-user-detail-field .form-control:read-only {
	background-color: #ffffff;
	cursor: default;
}

.cess-user-detail-field--status .form-control {
	border-color: #bfe3d7;
	background: #f2fbf8;
	color: #0f766e;
}

@media (max-width: 767px) {
	.cess-user-create-shell,
	.cess-user-page-shell {
		padding: 0.75rem 0;
	}

	.cess-user-create-header,
	.cess-user-page-header,
	.cess-user-form-body,
	.cess-user-page-body {
		padding: 1rem;
	}

	.cess-user-create-title-wrap,
	.cess-user-page-title-wrap {
		align-items: flex-start;
		width: 100%;
	}

	.cess-user-create-icon,
	.cess-user-page-icon {
		width: 42px;
		height: 42px;
		flex-basis: 42px;
	}

	.cess-user-form-section {
		padding: 1rem;
	}

	.cess-user-actionbar,
	.cess-user-page-actionbar,
	.cess-user-page-header .btn,
	.cess-user-submit-btn {
		width: 100%;
	}
}
/* End extracted from .\src\main\resources\templates\auth\segment\establishment.html */

/* Extracted from .\src\main\resources\templates\auth\segment\paymentreceipt.html */
.cess-receipt-toolbar {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			flex-wrap: wrap;
			gap: 1rem;
			margin-bottom: 1.5rem;
			padding: 1rem;
			border: 1px solid #dbe7f5;
			border-radius: 0.9rem;
			background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
			box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
		}

		.cess-receipt-field {
			min-width: 240px;
		}

		.cess-receipt-filter-group {
			display: flex;
			align-items: flex-end;
			flex-wrap: wrap;
			gap: 0.85rem;
		}

		.cess-receipt-field label {
			display: block;
			margin-bottom: 0.35rem;
			color: #475569;
			font-size: 0.78rem;
			font-weight: 700;
			text-transform: uppercase;
			letter-spacing: 0.04em;
		}

		.cess-receipt-control {
			display: flex;
			align-items: center;
			min-height: 44px;
			border: 1px solid #d5e0ee;
			border-radius: 0.7rem;
			background: #ffffff;
			transition: border-color 0.2s ease, box-shadow 0.2s ease;
		}

		.cess-receipt-control:focus-within {
			border-color: #2563eb;
			box-shadow: 0 0 0 0.22rem rgba(37, 99, 235, 0.12);
		}

		.cess-receipt-control-icon {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 42px;
			color: #2563eb;
			font-size: 1rem;
		}

		.cess-receipt-control .form-control,
		.cess-receipt-control .form-select {
			min-height: 42px;
			border: 0;
			background-color: transparent;
			box-shadow: none;
			color: #0f172a;
			font-weight: 600;
		}

		.cess-receipt-control .form-control:focus,
		.cess-receipt-control .form-select:focus {
			border: 0;
			box-shadow: none;
		}

		@media (max-width: 767px) {
			.cess-receipt-toolbar,
			.cess-receipt-filter-group,
			.cess-receipt-field {
				width: 100%;
			}
		}
/* End extracted from .\src\main\resources\templates\auth\segment\paymentreceipt.html */

/* Extracted from .\src\main\resources\templates\auth\segment\paymentstatus.html */
.status-hover-card {
            position: relative;
            overflow: visible;
            z-index: 1;
        }

        .status-hover-card::after {
            content: attr(data-status-message);
            position: absolute;
            left: 50%;
            bottom: calc(100% + 12px);
            transform: translateX(-50%) translateY(6px);
            min-width: 220px;
            max-width: 320px;
            padding: 10px 12px;
            border-radius: 12px;
            background: #183153;
            color: #fff;
            font-size: 0.82rem;
            line-height: 1.45;
            text-align: left;
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.24);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
            z-index: 20;
            white-space: normal;
        }

        .status-hover-card::before {
            content: "";
            position: absolute;
            left: 50%;
            bottom: calc(100% + 4px);
            transform: translateX(-50%) translateY(6px);
            border-width: 8px 7px 0 7px;
            border-style: solid;
            border-color: #183153 transparent transparent transparent;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
            z-index: 20;
        }

        .status-hover-card:hover::after,
        .status-hover-card:hover::before,
        .status-hover-card:focus-visible::after,
        .status-hover-card:focus-visible::before {
            opacity: 1;
            visibility: visible;
            transform: translateX(-50%) translateY(0);
        }

        .status-hover-card:hover,
        .status-hover-card:focus-visible {
            z-index: 30;
        }

        .bill-list-panel-header,
        .bill-list-panel .px-3.pt-3,
        .bill-list-scroll {
            position: relative;
        }

        .bill-statement-shell {
            min-height: 620px;
        }

        .bill-list-panel,
        .bill-detail-card {
            min-height: 620px;
        }

        .bill-list-panel {
            max-height: none;
            overflow: visible;
        }

        .bill-detail-panel {
            display: flex;
        }

        .bill-detail-card {
            width: 100%;
        }

        .bill-list-panel-header,
        .bill-list-panel .px-3.pt-3 {
            z-index: 5;
        }

        .bill-list-scroll {
            z-index: 10;
            padding-top: 20px;
            overflow: visible !important;
            overflow-x: visible !important;
            overflow-y: visible !important;
            max-height: none !important;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .bill-list-scroll::-webkit-scrollbar {
            display: none;
        }

        .bill-list-scroll > .status-hover-card:first-of-type::after {
            top: calc(100% + 12px);
            bottom: auto;
            transform: translateX(-50%) translateY(-6px);
        }

        .bill-list-scroll > .status-hover-card:first-of-type::before {
            top: calc(100% + 4px);
            bottom: auto;
            transform: translateX(-50%) translateY(-6px);
            border-width: 0 7px 8px 7px;
            border-color: transparent transparent #183153 transparent;
        }

        .bill-list-scroll > .status-hover-card:first-of-type:hover::after,
        .bill-list-scroll > .status-hover-card:first-of-type:hover::before,
        .bill-list-scroll > .status-hover-card:first-of-type:focus-visible::after,
        .bill-list-scroll > .status-hover-card:first-of-type:focus-visible::before {
            transform: translateX(-50%) translateY(0);
        }
/* End extracted from .\src\main\resources\templates\auth\segment\paymentstatus.html */

/* Extracted from .\src\main\resources\templates\auth\segment\usermanager.html */
#userAssignForm .select2-container {
			width: 100% !important;
		}

		#userAssignForm .select2-container--default .select2-selection--multiple {
			min-height: 38px;
			border: 1px solid #ced4da;
			border-radius: 0.375rem;
			padding: 2px 34px 2px 6px;
			position: relative;
			background-color: #fff;
		}

		#userAssignForm .select2-container--default .select2-selection--multiple::after {
			content: "\25BE";
			position: absolute;
			right: 12px;
			top: 50%;
			transform: translateY(-50%);
			color: #6c757d;
			font-size: 12px;
			pointer-events: none;
		}

		#userAssignForm .select2-container--default .select2-search--inline .select2-search__field {
			margin-top: 5px;
		}

		#userAssignForm .select2-container--default .select2-selection--multiple .select2-selection__choice {
			background-color: #e9f2ff;
			border: 1px solid #cfe0ff;
			color: #1f4e8c;
			border-radius: 999px;
			padding: 2px 8px;
			margin-top: 4px;
		}

		#userAssignForm .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
			color: #6c757d;
			margin-top: 5px;
		}
/* End extracted from .\src\main\resources\templates\auth\segment\usermanager.html */

/* Extracted from .\src\main\resources\templates\auth\segment\usermanager.html */
.kboc-role-assign-card {
			background: #ffffff;
			border-radius: 24px;
			padding: 28px 24px;
			box-shadow: 0 14px 38px rgba(15, 23, 42, 0.08);
			border: 1px solid #e6eef0;
		}

		.kboc-role-assign-header {
			display: flex;
			align-items: center;
			gap: 14px;
			margin-bottom: 20px;
		}

		.kboc-role-assign-icon {
			width: 48px;
			height: 48px;
			border-radius: 14px;
			background: linear-gradient(135deg, #d9f7ee 0%, #eefcf6 100%);
			color: #118a67;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			font-size: 1.2rem;
		}

		.kboc-role-assign-title {
			font-size: 1.18rem;
			font-weight: 700;
			color: #17313b;
			margin: 0;
		}

		.kboc-role-assign-subtitle {
			font-size: 0.88rem;
			color: #6b7c85;
			margin: 2px 0 0;
		}

		.kboc-role-field-label {
			font-size: 0.9rem;
			font-weight: 700;
			color: #29434e;
			margin-bottom: 8px;
		}

		.kboc-selection-panel {
			margin-top: 18px;
			background: #f5f8f9;
			border: 1px solid #dde7ea;
			border-radius: 18px;
			padding: 16px;
		}

		.kboc-summary-head {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 10px;
			margin-bottom: 12px;
		}

		.kboc-summary-label {
			font-size: 0.92rem;
			font-weight: 700;
			color: #2a4148;
		}

		.kboc-summary-count {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			padding: 5px 12px;
			border-radius: 999px;
			background: #e3f7ef;
			color: #13795b;
			font-size: 0.78rem;
			font-weight: 700;
			white-space: nowrap;
		}

		.kboc-summary-body {
			min-height: 74px;
			display: flex;
			flex-wrap: wrap;
			gap: 10px;
			align-items: flex-start;
		}

		.kboc-summary-chip {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			padding: 8px 12px;
			border-radius: 999px;
			background: #ffffff;
			border: 1px solid #d8e6e3;
			color: #1f3b42;
			font-size: 0.83rem;
			font-weight: 600;
		}

		.kboc-summary-chip i {
			color: #159570;
			font-size: 0.8rem;
		}

		.kboc-summary-chip--soft {
			background: #edf7f4;
		}

		.kboc-summary-chip--new {
			background: #eef8fb;
			border-color: #d6ebf2;
		}

		.kboc-seat-placeholder {
			display: flex;
			align-items: center;
			min-height: 42px;
			color: #7b8b92;
			font-size: 0.85rem;
			font-weight: 500;
		}

		.kboc-role-assign-btn {
			margin-top: 20px;
		}

		.kboc-role-table-wrap {
			margin-top: 14px;
			background: #fbfcfc;
			border: 1px solid #e3ecee;
			border-radius: 18px;
			padding: 12px;
		}

		.kboc-role-select-table {
			margin-bottom: 0;
		}

		.kboc-role-select-table thead th {
			background: #f3f7f8;
			color: #2f4650;
			font-size: 0.82rem;
			font-weight: 700;
			border-bottom: 1px solid #e1eaed;
		}

		.kboc-role-select-table td {
			vertical-align: middle;
			font-size: 0.88rem;
			color: #304952;
		}

		.kboc-role-select-table tbody tr.is-checked {
			background: #f2fbf7;
		}

		.kboc-selected-seat-card {
			display: flex;
			flex-direction: column;
			gap: 6px;
			padding: 16px;
			border-radius: 18px;
			background: linear-gradient(135deg, #eaf8f3 0%, #f6fbf9 100%);
			border: 1px solid #d8ebe3;
		}

		.kboc-selected-seat-name {
			font-size: 1rem;
			font-weight: 700;
			color: #153840;
		}

		.kboc-selected-seat-meta {
			font-size: 0.84rem;
			color: #67808a;
		}

		.assign-seat-role-table .kboc-seat-row.is-selected {
			background: #f2fbf7;
		}

		.kboc-seat-select-btn {
			min-width: 92px;
			border-radius: 999px;
			font-weight: 700;
		}

		.kboc-seat-select-btn.is-selected {
			background: #138a67;
			border-color: #138a67;
			color: #ffffff;
		}
/* End extracted from .\src\main\resources\templates\auth\segment\usermanager.html */

/* Extracted from .\src\main\resources\templates\public\index.html */
:root {
		--kboc-ink: #1f2933;
		--kboc-muted: #667481;
		--kboc-accent: #166534;
		--kboc-accent-2: #a16207;
		--kboc-surface: #ffffff;
		--kboc-surface-soft: #f8fafc;
		--kboc-border: #dbe3ea;
		--kboc-shadow: 0 18px 45px rgba(15, 23, 42, 0.06);
	}

	body.kboc-home {
		background:
			linear-gradient(180deg, #f8fafc 0%, #ffffff 18%, #f8fafc 100%);
		color: var(--kboc-ink);
	}

	.kboc-home .whitebg,
	.kboc-home .whitebg2 {
		background: transparent !important;
	}

	.kboc-home .navbar.whitebg {
		background: rgba(255, 255, 255, 0.92) !important;
		backdrop-filter: blur(14px);
		border-bottom: 1px solid rgba(20, 83, 45, 0.08);
		box-shadow: 0 8px 30px rgba(15, 23, 42, 0.05);
	}

	.kboc-home #header,
	.kboc-home #header.header-scrolled,
	.kboc-home #header.header-inner-pages {
		background: #ffffff !important;
		background-image: none !important;
		padding: 0 !important;
	}

	.kboc-site-header {
		background: rgba(255, 255, 255, 0.98);
		border-bottom: 1px solid #dbe3ea;
		box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
		z-index: 1030;
	}

	.kboc-topbar {
		padding: 0.45rem 0;
		background: #f8fafc;
		border-bottom: 1px solid #e5ebf0;
	}

	.kboc-topbar-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		min-height: 34px;
	}

	.kboc-lang-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 0.45rem;
		padding: 0.38rem 0.75rem;
		border-radius: 10px;
		border: 1px solid #d7e0e8;
		background: #ffffff;
		color: #1f2933;
		font-weight: 700;
		font-size: 0.85rem;
		min-width: 96px;
	}

	.kboc-lang-btn:hover,
	.kboc-lang-btn:focus {
		background: #f8fafc;
		color: #1f2933;
	}

	.kboc-top-actions {
		display: flex;
		align-items: center;
		gap: 0.6rem;
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.kboc-top-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: #ffffff;
		border: 1px solid #d7e0e8;
		color: #475569;
		text-decoration: none;
		font-size: 0.85rem;
	}

	.kboc-top-login {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 0.42rem 0.85rem;
		border-radius: 999px;
		background: #166534;
		color: #ffffff !important;
		font-weight: 700;
		font-size: 0.85rem;
		text-decoration: none;
	}

	.kboc-top-login:hover,
	.kboc-top-login:focus {
		background: #14532d;
		color: #ffffff !important;
	}

	.kboc-navshell {
		padding: 1rem 0;
		background: #ffffff;
	}

	.kboc-site-header .container,
	.kboc-main .kboc-container {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

	.kboc-navshell .container {
		align-items: center;
	}

	.kboc-brand-wrap {
		display: flex;
		align-items: center;
		gap: 0.9rem;
		text-decoration: none;
		margin-right: 1.25rem;
	}

	.kboc-brand-wrap img {
		max-height: 58px;
		width: auto;
	}

	.kboc-brand-copy {
		display: flex;
		flex-direction: column;
	}

	.kboc-brand-copy strong {
		font-size: 1.02rem;
		line-height: 1.2;
		color: #1f2933;
	}

	.kboc-brand-copy span {
		font-size: 0.82rem;
		color: #667481;
	}

	.kboc-home .navbar-nav {
		gap: 0.4rem;
		align-items: center;
	}

	.kboc-home .navbar-nav .nav-link {
		padding: 0.8rem 1rem;
		border-radius: 12px;
		font-weight: 600;
		color: #243240;
	}

	.kboc-navshell .navbar-toggler {
		border: 1px solid #d7e0e8;
		border-radius: 10px;
		padding: 0.45rem 0.65rem;
	}

	.kboc-navshell .navbar-toggler .icon {
		font-size: 1.1rem;
		color: #1f2933;
		line-height: 1;
	}

	.kboc-navshell .navbar-toggler:focus {
		box-shadow: 0 0 0 0.2rem rgba(22, 101, 52, 0.15);
	}

	#offcanvasNavbar2 {
		--bs-offcanvas-width: min(86vw, 360px);
		z-index: 2005;
	}

	.offcanvas-backdrop.show {
		z-index: 2000;
	}

	.kboc-home .navbar-nav .nav-link:hover,
	.kboc-home .navbar-nav .nav-link:focus {
		background: #f3f6f8;
		color: #111827;
	}

	.kboc-home .dropdown-menu {
		border: 1px solid var(--kboc-border);
		border-radius: 16px;
		box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08);
		padding: 0.45rem;
	}

	.kboc-home .dropdown-item {
		border-radius: 10px;
		padding: 0.65rem 0.85rem;
		font-weight: 500;
	}

	.kboc-home .dropdown-item:hover,
	.kboc-home .dropdown-item:focus {
		background: #f4f7f9;
	}

	.kboc-main {
		padding: 9.5rem 0 0;
	}

	.footerbg {
		margin-bottom: 0;
	}

	.kboc-container {
		width: min(1180px, calc(100% - 2rem));
		margin: 0 auto;
	}

	.kboc-section {
		padding: 0;
		margin-top: 2rem;
	}

	.kboc-section + .kboc-section {
		padding-top: 2rem;
		border-top: 1px solid #e5ebf0;
	}

	.kboc-section-head {
		display: flex;
		align-items: end;
		justify-content: space-between;
		gap: 1rem;
		margin-bottom: 1.35rem;
	}

	.kboc-section-head h2 {
		margin: 0;
		font-size: clamp(1.55rem, 2vw, 2.1rem);
		font-weight: 800;
		color: #1d2a35;
	}

	.kboc-section-head p {
		margin: 0.5rem 0 0;
		color: var(--kboc-muted);
		max-width: 640px;
	}

	.kboc-pill {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		padding: 0.55rem 0.95rem;
		border-radius: 999px;
		background: #ecfdf3;
		color: var(--kboc-accent);
		font-size: 0.78rem;
		font-weight: 800;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.kboc-hero-shell {
		width: 100%;
		padding: 0;
	}

	.kboc-home #hero,
	.kboc-home #home-hero {
		width: 100%;
		background: none !important;
		background-image: none !important;
		min-height: calc(100vh - 9.5rem);
		padding: 0;
	}

	.kboc-hero-card {
		background: #0f172a;
		border: 1px solid var(--kboc-border);
		border-radius: 24px;
		box-shadow: var(--kboc-shadow);
		padding: 0;
		overflow: hidden;
		position: relative;
		min-height: calc(100vh - 12rem);
	}

	.kboc-hero-slider {
		position: relative;
		width: 100%;
		height: 100%;
		min-height: calc(100vh - 12rem);
	}

	.kboc-hero-slide {
		position: absolute;
		inset: 0;
		opacity: 0;
		visibility: hidden;
		transition: opacity 650ms ease;
	}

	.kboc-hero-slide::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(120deg, rgba(8, 47, 73, 0.78) 0%, rgba(15, 23, 42, 0.5) 45%, rgba(15, 23, 42, 0.28) 100%);
	}

	.kboc-hero-slide.is-active {
		opacity: 1;
		visibility: visible;
	}

	.kboc-hero-slide img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		transform: scale(1);
		transition: transform 5500ms linear;
	}

	.kboc-hero-slide.is-active img {
		transform: scale(1.05);
	}

	.kboc-hero-slide-content {
		position: absolute;
		left: clamp(1.25rem, 4vw, 3.5rem);
		top: 50%;
		z-index: 2;
		transform: translateY(-50%);
		width: min(980px, calc(100% - 2.5rem));
		padding: clamp(1rem, 2.4vw, 1.85rem);
		border-radius: 18px;
		background: transparent;
		border: 0;
		backdrop-filter: none;
		text-align: left;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.kboc-hero-badge {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		padding: 0.42rem 0.8rem;
		border-radius: 999px;
		background: rgba(255, 255, 255, 0.2);
		color: #f8fafc;
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		margin-bottom: 0.8rem;
	}

	.kboc-hero-title {
		font-family: Arial, Helvetica, sans-serif;
		font-size: clamp(2.6rem, 6vw, 5.8rem);
		line-height: 1;
		font-weight: 800;
		color: #ffffff;
		margin-bottom: 0.5rem;
		text-shadow: 0 8px 30px rgba(15, 23, 42, 0.4);
	}

	.kboc-hero-subtitle {
		font-size: 0.95rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #e2e8f0;
		margin-bottom: 0.85rem;
	}

	.kboc-hero-copy {
		font-size: 1rem;
		line-height: 1.6;
		color: #f1f5f9;
		margin-bottom: 0;
		max-width: 90ch;
	}

	.kboc-hero-stat,
	.kboc-stat-card,
	.kboc-service-card,
	.kboc-office-card,
	.kboc-link-card,
	.kboc-news-band,
	.kboc-footer-card {
		background: #ffffff;
		border: 1px solid var(--kboc-border);
		border-radius: 22px;
		box-shadow: 0 12px 35px rgba(15, 23, 42, 0.06);
	}

	.kboc-hero-stat {
		padding: 1rem 1.1rem;
	}

	.kboc-hero-stat strong,
	.kboc-stat-card strong {
		display: block;
		font-size: 1.4rem;
		line-height: 1;
		color: #18212b;
		margin-bottom: 0.35rem;
	}

	.kboc-hero-stat span,
	.kboc-stat-card span {
		display: block;
		font-size: 0.93rem;
		line-height: 1.5;
		color: #667481;
	}

	.kboc-hero-actions {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 1rem;
		flex-wrap: wrap;
		margin-top: 1rem;
	}

	.kboc-hero-note {
		font-size: 0.92rem;
		font-weight: 600;
		color: #e2e8f0;
	}

	.kboc-home .btn-get-started,
	.kboc-home .kboc-link-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 0.9rem 1.4rem;
		border-radius: 999px;
		background: #166534;
		color: #fff !important;
		font-weight: 700;
		text-decoration: none;
		border: 0;
		box-shadow: 0 12px 24px rgba(22, 101, 52, 0.18);
	}

	.kboc-home .btn-get-started:focus,
	.kboc-home .kboc-link-btn:focus {
		outline: 2px solid #ffffff;
		outline-offset: 2px;
	}

	.kboc-home .btn-get-started:hover,
	.kboc-home .kboc-link-btn:hover {
		background: #14532d;
	}

	.kboc-hero-controls {
		position: absolute;
		right: clamp(0.8rem, 2vw, 1.75rem);
		bottom: clamp(0.8rem, 2vw, 1.75rem);
		z-index: 3;
		display: inline-flex;
		gap: 0.45rem;
	}

	.kboc-hero-control-btn {
		width: 42px;
		height: 42px;
		border: 1px solid rgba(255, 255, 255, 0.55);
		border-radius: 999px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		color: #ffffff;
		background: rgba(15, 23, 42, 0.45);
		backdrop-filter: blur(6px);
		font-size: 1.05rem;
	}

	.kboc-hero-control-btn:hover,
	.kboc-hero-control-btn:focus {
		background: rgba(15, 23, 42, 0.72);
		color: #ffffff;
	}

	.kboc-hero-indicators {
		position: absolute;
		left: clamp(0.8rem, 2vw, 1.75rem);
		bottom: clamp(0.9rem, 2vw, 1.75rem);
		z-index: 3;
		display: inline-flex;
		gap: 0.45rem;
		align-items: center;
	}

	.kboc-hero-indicator-btn {
		width: 12px;
		height: 12px;
		padding: 0;
		border-radius: 50%;
		border: 1px solid rgba(255, 255, 255, 0.5);
		background: rgba(255, 255, 255, 0.35);
		line-height: 0;
	}

	.kboc-hero-indicator-btn.is-active {
		background: #ffffff;
		border-color: #ffffff;
		transform: scale(1.15);
	}

	#scrolltop .top-button {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		text-indent: 0 !important;
	}

	#scrolltop .top-button i {
		font-size: 0.95rem;
		color: #ffffff;
	}

	.kboc-stats-grid,
	.kboc-services-grid,
	.kboc-links-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1rem;
	}

	.kboc-stat-card,
	.kboc-service-card,
	.kboc-link-card {
		padding: 1.3rem;
		height: 100%;
	}

	.kboc-service-card h3,
	.kboc-link-card h3,
	.kboc-office-card h3 {
		font-size: 1.1rem;
		font-weight: 800;
		margin-bottom: 0.55rem;
		color: #1f2933;
	}

	.kboc-service-card p,
	.kboc-link-card p {
		margin: 0;
		color: var(--kboc-muted);
		line-height: 1.65;
	}

	.kboc-news-band {
		padding: 1rem 1.25rem;
		margin-top: 0.5rem;
	}

	.kboc-news-head {
		display: flex;
		align-items: center;
		gap: 0.75rem;
		color: #1f2933;
		background: #f8fafc;
		border: 1px solid var(--kboc-border);
		border-radius: 18px;
		padding: 0.9rem 1rem;
		margin-bottom: 1rem;
	}

	.kboc-news-head strong {
		font-size: 1rem;
	}

	.kboc-news-stream {
		position: relative;
		padding: 0.9rem 0.25rem 0.2rem;
	}

	.kboc-news-stream marquee,
	.kboc-news-stream a {
		color: #334155 !important;
	}

	.kboc-office-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1rem;
	}

	.kboc-office-card {
		padding: 1.3rem;
		text-align: center;
		height: 100%;
	}

	.kboc-office-card img {
		width: 112px;
		height: 112px;
		object-fit: cover;
		border-radius: 50%;
		border: 4px solid #edf2f7;
		margin-bottom: 1rem;
	}

	.kboc-office-card p {
		margin: 0;
		color: var(--kboc-muted);
		line-height: 1.6;
	}

	.kboc-link-card a {
		color: #1c2731;
		font-weight: 700;
		text-decoration: none;
	}

	.kboc-link-card ul {
		padding-left: 1rem;
		margin: 0.75rem 0 0;
	}

	.kboc-link-card li {
		margin-bottom: 0.45rem;
		color: var(--kboc-muted);
	}

	.kboc-footer-card {
		padding: 2rem;
		margin-top: 1rem;
	}

	.kboc-footer-brand img {
		max-width: 180px;
	}

	.kboc-footer-meta {
		color: var(--kboc-muted);
		line-height: 1.75;
	}

	.kboc-footer-links {
		display: flex;
		gap: 1rem;
		flex-wrap: wrap;
		margin-top: 1rem;
	}

	.kboc-footer-links a {
		color: #166534;
		font-weight: 700;
		text-decoration: none;
	}

	.kboc-legacy-hide {
		display: none;
	}

	@media (max-width: 991.98px) {
		.kboc-main {
			padding-top: 9.4rem;
		}

		.kboc-home #hero,
		.kboc-home #home-hero {
			min-height: auto;
		}

		.kboc-topbar-inner {
			flex-direction: column;
			align-items: stretch;
			gap: 0.75rem;
		}

		.kboc-top-actions {
			justify-content: space-between;
		}

		.kboc-navshell {
			padding: 0.6rem 0;
		}

		.kboc-brand-wrap img {
			max-height: 46px;
		}

		.kboc-home .navbar .container {
			gap: 0.5rem;
		}

		#offcanvasNavbar2 .offcanvas-body .navbar-nav {
			align-items: flex-start;
			gap: 0.2rem;
		}

		#offcanvasNavbar2 .offcanvas-body {
			padding: 0.75rem 0.75rem 1rem;
			overflow-y: auto;
		}

		#offcanvasNavbar2.offcanvas {
			width: 100vw !important;
			max-width: 100vw;
			height: 100dvh;
			border-left: 0;
		}

		#offcanvasNavbar2 .offcanvas-header {
			padding: 0.9rem 0.9rem 0.7rem;
			border-bottom: 1px solid #e5ebf0;
		}

		#offcanvasNavbar2 .nav-item {
			width: 100%;
		}

		#offcanvasNavbar2 .navbar-nav .nav-link {
			width: 100%;
			padding: 0.7rem 0.85rem;
			border-radius: 10px;
		}

		#offcanvasNavbar2 .navbar-nav .dropdown-toggle::after {
			margin-left: auto;
		}

		#offcanvasNavbar2 .dropdown-menu {
			position: static !important;
			float: none;
			width: 100%;
			margin-top: 0.2rem;
			border: 0;
			border-radius: 10px;
			box-shadow: none;
			background: #f8fafc;
			padding: 0.35rem;
			display: none;
			transform: none !important;
		}

		#offcanvasNavbar2 .dropdown.show > .dropdown-menu {
			display: block;
		}

		#offcanvasNavbar2 .dropdown-item {
			white-space: normal;
			padding: 0.6rem 0.75rem;
		}

		.kboc-brand-copy {
			display: none;
		}

		.kboc-footer-card {
			padding: 1.5rem;
		}

		.kboc-stats-grid,
		.kboc-services-grid,
		.kboc-office-grid,
		.kboc-links-grid {
			grid-template-columns: 1fr;
		}

		.kboc-hero-card,
		.kboc-hero-slider {
			min-height: 620px;
		}

		.kboc-hero-slide-content {
			left: 1rem;
			width: calc(100% - 2rem);
			top: auto;
			bottom: 3.75rem;
			transform: none;
		}

		.kboc-hero-copy {
			font-size: 0.92rem;
			line-height: 1.5;
			max-width: 100%;
		}

		.kboc-section-head {
			display: block;
		}
	}

	@media (max-width: 575.98px) {
		.kboc-main {
			padding-top: 10rem;
		}

		.kboc-top-login,
		.kboc-lang-btn {
			width: 100%;
		}

		.kboc-top-actions {
			flex-direction: column;
			align-items: stretch;
		}

		.kboc-topbar {
			padding: 0.35rem 0;
		}

		.kboc-topbar-inner {
			gap: 0.5rem;
		}

		.kboc-navshell {
			padding: 0.45rem 0;
		}

		.kboc-brand-wrap img {
			max-height: 38px;
		}

		.kboc-navshell .navbar-toggler {
			padding: 0.35rem 0.55rem;
		}

		.kboc-hero-card,
		.kboc-hero-slider {
			min-height: 660px;
			border-radius: 14px;
		}

		.kboc-hero-badge {
			font-size: 0.68rem;
		}

		.kboc-hero-title {
			font-size: clamp(1.75rem, 8.4vw, 2.5rem);
			line-height: 1.04;
		}

		.kboc-hero-subtitle {
			font-size: 0.82rem;
			margin-bottom: 0.6rem;
		}

		.kboc-hero-slide-content {
			width: calc(100% - 1.25rem);
			left: 0.625rem;
			bottom: 3.5rem;
			padding: 0.8rem 0.6rem;
		}

		.kboc-hero-copy {
			font-size: 0.84rem;
			line-height: 1.45;
		}

		.kboc-hero-note {
			display: none;
		}

		.kboc-hero-control-btn {
			width: 36px;
			height: 36px;
			font-size: 0.95rem;
		}

		.kboc-hero-controls {
			right: 0.625rem;
			bottom: 0.75rem;
		}

		.kboc-hero-indicators {
			left: 0.625rem;
			bottom: 0.95rem;
		}
	}
	.kboc-news-badge {
		z-index: 10;
		transition: opacity 0.2s ease;
	}

	.kboc-office-image {
		width: 150px;
		height: 150px;
		object-fit: cover;
	}
/* End extracted from .\src\main\resources\templates\public\index.html */

/* Extracted from .\src\main\resources\templates\public\pageview.html */
body.kboc-public-page {
			background: linear-gradient(180deg, #f8fafc 0%, #ffffff 18%, #f8fafc 100%);
			color: #1f2933;
		}

		.kboc-site-header {
			background: rgba(255, 255, 255, 0.98);
			border-bottom: 1px solid #dbe3ea;
			box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
			z-index: 1030;
		}

		.kboc-topbar {
			padding: 0.45rem 0;
			background: #f8fafc;
			border-bottom: 1px solid #e5ebf0;
		}

		.kboc-topbar-inner {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 1rem;
			min-height: 34px;
		}

		.kboc-lang-btn {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 0.45rem;
			padding: 0.38rem 0.75rem;
			border-radius: 10px;
			border: 1px solid #d7e0e8;
			background: #ffffff;
			color: #1f2933;
			font-weight: 700;
			font-size: 0.85rem;
			min-width: 96px;
		}

		.kboc-lang-btn:hover,
		.kboc-lang-btn:focus {
			background: #f8fafc;
			color: #1f2933;
		}

		.kboc-top-actions {
			display: flex;
			align-items: center;
			gap: 0.6rem;
			flex-wrap: wrap;
			justify-content: flex-end;
		}

		.kboc-top-icon {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 32px;
			height: 32px;
			border-radius: 50%;
			background: #ffffff;
			border: 1px solid #d7e0e8;
			color: #475569;
			text-decoration: none;
			font-size: 0.85rem;
		}

		.kboc-top-login {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			padding: 0.42rem 0.85rem;
			border-radius: 999px;
			background: #166534;
			color: #ffffff !important;
			font-weight: 700;
			font-size: 0.85rem;
			text-decoration: none;
		}

		.kboc-top-login:hover,
		.kboc-top-login:focus {
			background: #14532d;
			color: #ffffff !important;
		}

		.kboc-navshell {
			padding: 1rem 0;
			background: #ffffff !important;
		}

		.kboc-navshell .container {
			align-items: center;
		}

		.kboc-brand-wrap {
			display: flex;
			align-items: center;
			gap: 0.9rem;
			text-decoration: none;
			margin-right: 1.25rem;
		}

		.kboc-brand-wrap img {
			max-height: 58px;
			width: auto;
		}

		.kboc-public-page .navbar-nav {
			gap: 0.4rem;
			align-items: center;
		}

		.kboc-public-page .navbar-nav .nav-link {
			padding: 0.8rem 1rem;
			border-radius: 12px;
			font-weight: 600;
			color: #243240;
		}

		.kboc-public-page .navbar-nav .nav-link:hover,
		.kboc-public-page .navbar-nav .nav-link:focus {
			background: #f3f6f8;
			color: #111827;
		}

		.kboc-navshell .navbar-toggler {
			border: 1px solid #d7e0e8;
			border-radius: 10px;
			padding: 0.45rem 0.65rem;
		}

		.kboc-navshell .navbar-toggler .icon {
			font-size: 1.1rem;
			color: #1f2933;
			line-height: 1;
		}

		.kboc-navshell .navbar-toggler:focus {
			box-shadow: 0 0 0 0.2rem rgba(22, 101, 52, 0.15);
		}

		.kboc-public-page .dropdown-menu {
			border: 1px solid #dbe3ea;
			border-radius: 16px;
			box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08);
			padding: 0.45rem;
		}

		.kboc-public-page .dropdown-item {
			border-radius: 10px;
			padding: 0.65rem 0.85rem;
			font-weight: 500;
		}

		.kboc-public-page .dropdown-item:hover,
		.kboc-public-page .dropdown-item:focus {
			background: #f4f7f9;
		}

		#offcanvasNavbar2 {
			--bs-offcanvas-width: min(86vw, 360px);
			z-index: 2005;
		}

		.offcanvas-backdrop.show {
			z-index: 2000;
		}

		@media (max-width: 991.98px) {
			.kboc-topbar-inner {
				flex-direction: column;
				align-items: stretch;
				gap: 0.75rem;
			}

			.kboc-top-actions {
				justify-content: space-between;
			}

			.kboc-navshell {
				padding: 0.6rem 0;
			}

			.kboc-brand-wrap img {
				max-height: 46px;
			}

			#offcanvasNavbar2 .offcanvas-body .navbar-nav {
				align-items: flex-start;
				gap: 0.2rem;
			}

			#offcanvasNavbar2 .offcanvas-body {
				padding: 0.75rem 0.75rem 1rem;
				overflow-y: auto;
			}

			#offcanvasNavbar2.offcanvas {
				width: 100vw !important;
				max-width: 100vw;
				height: 100dvh;
				border-left: 0;
			}

			#offcanvasNavbar2 .offcanvas-header {
				padding: 0.9rem 0.9rem 0.7rem;
				border-bottom: 1px solid #e5ebf0;
			}

			#offcanvasNavbar2 .nav-item {
				width: 100%;
			}

			#offcanvasNavbar2 .navbar-nav .nav-link {
				width: 100%;
				padding: 0.7rem 0.85rem;
				border-radius: 10px;
			}

			#offcanvasNavbar2 .navbar-nav .dropdown-toggle::after {
				margin-left: auto;
			}

			#offcanvasNavbar2 .dropdown-menu {
				position: static !important;
				float: none;
				width: 100%;
				margin-top: 0.2rem;
				border: 0;
				border-radius: 10px;
				box-shadow: none;
				background: #f8fafc;
				padding: 0.35rem;
				display: none;
				transform: none !important;
			}

			#offcanvasNavbar2 .dropdown.show > .dropdown-menu {
				display: block;
			}

			#offcanvasNavbar2 .dropdown-item {
				white-space: normal;
				padding: 0.6rem 0.75rem;
			}
		}

		@media (max-width: 575.98px) {
			.kboc-top-login,
			.kboc-lang-btn {
				width: 100%;
			}

			.kboc-top-actions {
				flex-direction: column;
				align-items: stretch;
			}

			.kboc-topbar {
				padding: 0.35rem 0;
			}

			.kboc-topbar-inner {
				gap: 0.5rem;
			}

			.kboc-navshell {
				padding: 0.45rem 0;
			}

			.kboc-brand-wrap img {
				max-height: 38px;
			}

			.kboc-navshell .navbar-toggler {
				padding: 0.35rem 0.55rem;
			}
		}
/* End extracted from .\src\main\resources\templates\public\pageview.html */

.kboc-error-action.btn.btn-primary,
.kboc-error-action.btn.btn-primary:hover,
.kboc-error-action.btn.btn-primary:focus,
.kboc-error-action.btn.btn-primary:active {
  background: var(--kboc-primary) !important;
  border-color: var(--kboc-primary) !important;
  color: #ffffff !important;
}

.kboc-error-action.btn.btn-primary:hover,
.kboc-error-action.btn.btn-primary:focus {
  background: var(--kboc-primary-strong) !important;
  border-color: var(--kboc-primary-strong) !important;
}

.change-user-search {
  max-width: 190px;
}

#changeExistingUserTable {
  font-size: 0.875rem;
}

#changeExistingUserTable td,
#changeExistingUserTable th {
  padding: 0.45rem 0.5rem;
}

.cess-admin-change-shell {
  overflow: hidden;
  background: var(--kboc-surface);
  border: 1px solid var(--kboc-border);
  border-radius: var(--kboc-radius);
  box-shadow: var(--kboc-shadow);
}

.cess-admin-change-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: var(--kboc-surface-muted);
  border-bottom: 1px solid var(--kboc-border);
}

.cess-admin-change-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  min-width: 0;
}

.cess-admin-change-icon,
.cess-admin-context-icon,
.cess-admin-section-title span,
.cess-admin-control-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kboc-primary);
  background: var(--kboc-primary-soft);
}

.cess-admin-change-icon {
  width: 44px;
  height: 44px;
  border: 1px solid #bcded8;
  border-radius: var(--kboc-radius);
  font-size: 1.25rem;
  flex: 0 0 44px;
}

.cess-admin-change-title {
  margin: 0;
  color: var(--kboc-ink);
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1.25;
}

.cess-admin-change-subtitle {
  margin: 0.2rem 0 0;
  color: var(--kboc-muted);
  font-size: 0.875rem;
  font-weight: 600;
}

.cess-admin-change-close {
  flex: 0 0 36px;
}

.cess-admin-change-body {
  padding: 1.5rem;
}

.cess-admin-establishment-context {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr);
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem;
  background: var(--kboc-primary-soft);
  border: 1px solid #bcded8;
  border-radius: var(--kboc-radius);
}

.cess-admin-context-item {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  min-width: 0;
}

.cess-admin-context-icon {
  width: 38px;
  height: 38px;
  background: var(--kboc-surface);
  border: 1px solid #bcded8;
  border-radius: 6px;
  flex: 0 0 38px;
}

.cess-admin-context-content {
  min-width: 0;
  flex: 1;
}

.cess-admin-context-content label,
.cess-admin-field label {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--kboc-muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0;
}

.cess-admin-context-content .form-control {
  min-height: 32px;
  padding: 0;
  color: var(--kboc-primary-strong) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 1rem;
  font-weight: 800;
}

.cess-admin-form-section {
  height: 100%;
  padding: 1.25rem;
  background: var(--kboc-surface);
  border: 1px solid var(--kboc-border);
  border-radius: var(--kboc-radius);
}

.cess-admin-section-title {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 1.125rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--kboc-border);
}

.cess-admin-section-title span {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  flex: 0 0 32px;
}

.cess-admin-section-title h3 {
  margin: 0;
  color: var(--kboc-ink);
  font-size: 1rem;
  font-weight: 800;
}

.cess-admin-control {
  display: flex;
  align-items: center;
  min-height: 48px;
  overflow: hidden;
  background: var(--kboc-surface-muted);
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.cess-admin-control:hover {
  background: var(--kboc-surface);
  border-color: #a9c8c1;
}

.cess-admin-control:focus-within {
  background: var(--kboc-surface);
  border-color: var(--kboc-primary);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.14);
}

.cess-admin-control-icon {
  width: 44px;
  height: 46px;
  background: transparent;
  flex: 0 0 44px;
}

.cess-admin-control .form-control {
  min-height: 46px;
  padding: 0.75rem 0.875rem 0.75rem 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 600;
}

.cess-admin-control-textarea {
  align-items: flex-start;
}

.cess-admin-control-textarea .cess-admin-control-icon {
  align-items: flex-start;
  padding-top: 0.9rem;
}

.cess-admin-control-textarea .form-control {
  min-height: 96px;
  resize: vertical;
}

.cess-admin-change-actionbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  background: var(--kboc-surface-muted);
  border-top: 1px solid var(--kboc-border);
}

.cess-admin-change-submit {
  min-width: 180px;
}

@media (max-width: 767.98px) {
  .cess-admin-change-header,
  .cess-admin-change-body,
  .cess-admin-change-actionbar {
    padding: 1rem;
  }

  .cess-admin-change-actionbar {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .cess-admin-change-actionbar .btn {
    width: 100%;
  }

  .cess-admin-establishment-context {
    grid-template-columns: minmax(0, 1fr);
  }
}