:root {
    --ui-bg: #f5f7fb;
    --ui-surface: #ffffff;
    --ui-surface-muted: #f8fafc;
    --ui-surface-raised: #ffffff;
    --ui-border: #e5e7eb;
    --ui-border-strong: #d1d5db;
    --ui-text: #111827;
    --ui-heading: #0f172a;
    --ui-muted: #6b7280;
    --ui-muted-strong: #475569;
    --ui-radius: 8px;
    --ui-radius-sm: 6px;
    --ui-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    --ui-focus: 0 0 0 3px rgba(var(--app-primary-rgb), 0.16);
    --ui-control-height: 38px;
}

[data-bs-theme="dark"] {
    --ui-bg: #0b1120;
    --ui-surface: #111827;
    --ui-surface-muted: #0f172a;
    --ui-surface-raised: #151f31;
    --ui-border: #273244;
    --ui-border-strong: #334155;
    --ui-text: #f8fafc;
    --ui-heading: #ffffff;
    --ui-muted: #94a3b8;
    --ui-muted-strong: #cbd5e1;
    --ui-shadow: none;
}

.admin-layout {
    color: var(--ui-text);
    background: var(--ui-bg) !important;
}

.admin-layout .main-content {
    background: var(--ui-bg);
}

.admin-layout .container-fluid {
    min-width: 0;
}

.admin-layout .card,
.admin-layout .modal-content,
.tbl-panel,
.mdc-card,
.mkpi,
.mcc,
.mui-tabs__nav,
.mui-tabs__content,
.chat-summary-card,
.chat-detail-card,
.chat-list__item,
.settings-info-card,
.ins-card {
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-radius) !important;
    background: var(--ui-surface) !important;
    box-shadow: var(--ui-shadow) !important;
    transform: none !important;
}

.admin-layout .card:hover,
.tbl-panel:hover,
.mkpi:hover,
.mcc:hover,
.mdc-card:hover,
.chat-list__item:hover {
    border-color: var(--ui-border-strong) !important;
    box-shadow: var(--ui-shadow) !important;
    transform: none !important;
}

.admin-layout .card > .card-header,
.admin-layout .card .card-header:first-child,
.tbl-panel__head,
.modal-header {
    border-bottom: 1px solid var(--ui-border) !important;
    background: var(--ui-surface) !important;
}

.admin-layout .card-header {
    padding: 0.9rem 1rem !important;
}

.admin-layout .card-body {
    padding: 1rem !important;
}

.admin-layout h1,
.admin-layout h2,
.admin-layout h3,
.admin-layout h4,
.admin-layout h5,
.admin-layout h6,
.mphb__title,
.mcc__title,
.mdc-card__title {
    color: var(--ui-heading) !important;
    letter-spacing: 0 !important;
}

.admin-layout h6 {
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.35;
}

.text-secondary,
.admin-layout .text-muted,
.admin-layout .text-secondary,
.mphb__subtitle,
.mcc__subtitle,
.mdc-card__subtitle {
    color: var(--ui-muted) !important;
}

.mphb__graphics,
.mphb::before,
.mphb::after,
.mkpi::before,
.mkpi::after,
.mcc::before,
.mdc-card::before,
.mui-btn__layer,
.mui-btn__layer::before,
.mui-btn__layer::after {
    display: none !important;
}

.badge,
.tbl-pill,
.tbl-status,
.mdc-badge,
.mphb__badge,
.mkpi__trend {
    border-radius: var(--ui-radius-sm) !important;
    letter-spacing: 0 !important;
}

.badge[class*="bg-gradient"],
.bg-gradient-primary,
.bg-gradient-secondary,
.bg-gradient-success,
.bg-gradient-danger,
.bg-gradient-warning,
.bg-gradient-info,
.bg-gradient-dark {
    background-image: none !important;
}

.btn,
.mui-btn,
.admin-layout .btn {
    min-height: var(--ui-control-height);
    border-radius: var(--ui-radius-sm) !important;
    box-shadow: none !important;
    letter-spacing: 0 !important;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

.btn-sm,
.mui-btn--sm {
    min-height: 32px;
}

.admin-layout .btn-dark {
    border-color: #111827 !important;
    background: #111827 !important;
    color: #fff !important;
}

.admin-layout .btn-outline-dark {
    border-color: var(--ui-border-strong) !important;
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;
}

.admin-layout .btn-outline-dark:hover {
    background: var(--ui-surface-muted) !important;
    color: var(--ui-text) !important;
}

.mui-btn:focus-visible,
.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: var(--ui-focus) !important;
}

.form-control,
.form-select,
.mui-input,
.mun-input,
.mps-input,
.mut-textarea,
.mdp-input,
.mcl-input,
.mti-input,
.mph-input {
    min-height: var(--ui-control-height) !important;
    border-color: var(--ui-border) !important;
    border-radius: var(--ui-radius-sm) !important;
    background-color: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    font-size: 0.84rem !important;
    box-shadow: none !important;
}

.form-control::placeholder,
.mui-input::placeholder,
.mun-input::placeholder,
.mps-input::placeholder,
.mut-textarea::placeholder,
.mdp-input::placeholder,
.mcl-input::placeholder,
.mti-input::placeholder,
.mph-input::placeholder {
    color: color-mix(in srgb, var(--ui-muted) 70%, var(--ui-surface)) !important;
}

.form-label,
.mui-label,
.mdu-label,
.miu-label,
.mus-switch-card__title,
.mdc-check-card__title,
.mrc-card__title {
    color: var(--ui-text) !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.mui-hint,
.mdu-hint,
.miu-hint,
.mus-switch-card__desc,
.mdc-check-card__desc,
.mrc-card__desc {
    color: var(--ui-muted) !important;
}

.mui-field,
.mds-field,
.mps-field,
.mut-field,
.mun-field,
.mcl-field,
.mti-field,
.mdp-field,
.mph-field,
.mdu-field,
.miu-field,
.mus-field {
    margin-bottom: 1rem !important;
}

.mdc-check-card,
.mrc-card,
.mus-switch-card,
.mdu-upload__dropzone,
.mdu-upload__meta,
.miu-card,
.miu-preview,
.miu-file-info,
.mui-select,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
    transform: none !important;
}

.mdc-check-card:hover,
.mrc-card:hover,
.mus-switch-card:hover,
.mdu-upload__dropzone:hover,
.miu-card:hover {
    border-color: var(--ui-border-strong) !important;
    box-shadow: none !important;
    transform: none !important;
}

.mdu-upload__icon,
.mdu-upload__file-icon,
.miu-preview,
.miu-file-info,
.mdc-check-card__icon,
.mrc-card__icon,
.mui-input-icon-box {
    border-color: var(--ui-border) !important;
    border-radius: var(--ui-radius-sm) !important;
    background: var(--ui-surface-muted) !important;
    box-shadow: none !important;
}

.mkpi__chart,
.mcc__chart {
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-radius-sm) !important;
    background: var(--ui-surface-muted) !important;
}

.table,
.tbl-table,
.mdc-table {
    color: var(--ui-text) !important;
}

.table thead th,
.tbl-table thead th,
.mdc-table thead th {
    border-bottom: 1px solid var(--ui-border) !important;
    background: var(--ui-surface-muted) !important;
    color: var(--ui-muted) !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.table tbody td,
.tbl-table tbody td,
.mdc-table tbody td {
    border-bottom: 1px solid var(--ui-border) !important;
    color: var(--ui-text) !important;
    font-size: 0.84rem !important;
}

.table tbody tr:hover td,
.tbl-table tbody tr:hover td {
    background: var(--ui-surface-muted) !important;
}

.border,
.rounded,
.rounded-3 {
    border-color: var(--ui-border) !important;
}

.admin-layout .navbar-main,
.admin-layout .app-sidenav {
    box-shadow: none !important;
}

.admin-layout .navbar-main {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
    background: var(--ui-surface) !important;
}

.admin-layout .app-sidenav {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius) !important;
}

.admin-layout .nav-link {
    border-radius: var(--ui-radius-sm) !important;
}

.admin-layout .nav-link.active,
.admin-layout .nav-link[aria-expanded="true"] {
    background: color-mix(in srgb, var(--bs-primary) 9%, var(--ui-surface)) !important;
    color: var(--bs-primary) !important;
}

.chat-desk .row,
.admin-layout .row {
    min-width: 0;
}

.chat-desk [class*="col-"],
.admin-layout [class*="col-"] {
    min-width: 0;
}

.chat-list,
.card-body,
.tbl-wrap,
.mdc-table-wrap {
    min-width: 0;
}

@media (max-width: 767.98px) {
    .admin-layout .card-header,
    .admin-layout .card-body {
        padding: 0.85rem !important;
    }

    .btn,
    .mui-btn,
    .admin-layout .btn {
        white-space: normal;
    }
}
