/* DennyTips theme — restyles standard Bootstrap 4/5 components to the new design.
   Load AFTER bootstrap.css. Works with the DashLite→clean migration: brand #1878D0 / #2FB1EA. */
:root {
  --dt-blue: #1878d0;
  --dt-blue-dark: #0f5da8;
  --dt-cyan: #2fb1ea;
  --dt-ink: #12283c;
  --dt-muted: #5b6b7a;
  --dt-grey: #8fa0af;
  --dt-bg: #f6f8fa;
  --dt-side: #e3ebf2;
  --dt-line: #e6ebf0;
  --dt-ok: #0f9d58;
  --dt-warn: #e08a00;
  --dt-err: #d93025;
  --dt-radius: 10px;
  --dt-radius-lg: 14px;
  --dt-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
body { font-family: var(--dt-font); background: var(--dt-bg); color: var(--dt-ink); }
a { color: var(--dt-blue); text-decoration: none; }
a:hover { color: var(--dt-blue-dark); }
h1, h2, h3, h4, h5, h6 { color: var(--dt-ink); font-weight: 700; }

/* Buttons */
.btn { border-radius: var(--dt-radius); font-weight: 600; font-size: 13px; padding: 0.55rem 1.25rem; border-width: 1px; box-shadow: none !important; white-space: nowrap; outline: none; }
.btn:focus { outline: none; }
.btn:focus-visible { box-shadow: 0 0 0 3px rgba(24,120,208,.22) !important; }
.btn-primary:focus-visible, .btn-info:focus-visible, .btn-success:focus-visible, .btn-danger:focus-visible { box-shadow: 0 0 0 3px rgba(24,120,208,.25) !important; }
.btn-primary, .btn-info { background: var(--dt-blue); border-color: var(--dt-blue); color: #fff; }
.btn-primary:hover, .btn-info:hover { background: var(--dt-blue-dark); border-color: var(--dt-blue-dark); }
.btn-success { background: var(--dt-ok); border-color: var(--dt-ok); }
.btn-success:hover { background: #0c7d46; border-color: #0c7d46; }
.btn-warning { background: #fdf3e3; border-color: #f0dcb2; color: var(--dt-warn); }
.btn-warning:hover { background: #f8e8c8; color: var(--dt-warn); }
.btn-danger { background: var(--dt-err); border-color: var(--dt-err); }
.btn-secondary, .btn-light, .btn-dark { background: #fff; border-color: #d7dfe6; color: #3c4a58; }
.btn-secondary:hover, .btn-light:hover, .btn-dark:hover { background: #f2f5f8; border-color: var(--dt-blue); color: var(--dt-blue); }
.btn-outline-primary { border-color: var(--dt-blue); color: var(--dt-blue); }
.btn-outline-primary:hover { background: #eaf3fb; color: var(--dt-blue); }
.btn-outline-danger { border-color: var(--dt-err); color: var(--dt-err); background: #fff; }
.btn-outline-danger:hover { background: #fdeceb; color: var(--dt-err); }
.btn-outline-light { border-color: #d7dfe6; color: var(--dt-muted); }
.btn-lg { padding: 0.7rem 1.6rem; font-size: 15px; border-radius: var(--dt-radius); }
.btn-sm { padding: 0.35rem 0.9rem; font-size: 13px; border-radius: 8px; }
/* pill toolbar buttons (split methods etc.) */
.btn-pill { border-radius: 20px; background: #fff; border: 1px solid #d7dfe6; color: #3c4a58; font-weight: 600; font-size: 13px; }
.btn-pill:hover { border-color: var(--dt-blue); color: var(--dt-blue); }
.btn-pill.active { background: #eaf3fb; border-color: var(--dt-blue); color: var(--dt-blue); font-weight: 700; }

/* Forms */
.form-label, label { font-size: 13px; font-weight: 600; color: #3c4a58; }
.form-control, .form-select, .custom-select {
  background: var(--dt-bg); border: 1px solid transparent; border-radius: var(--dt-radius);
  height: 44px; font-size: 14px; color: var(--dt-ink); box-shadow: none;
}
.form-control:focus, .form-select:focus, .custom-select:focus {
  background: #fff; border-color: var(--dt-blue); box-shadow: 0 0 0 3px rgba(24,120,208,.12); color: var(--dt-ink);
}
.form-control::placeholder { color: #9aa7b4; }
.form-control[readonly], .form-control:disabled { background: #eef2f6; color: var(--dt-grey); }
textarea.form-control { height: auto; }
.form-control-lg { height: 48px; font-size: 15px; }
.form-control-sm { height: 38px; font-size: 13px; }
.form-note, .form-text, small.text-muted { font-size: 12px; color: var(--dt-grey); }
/* validation */
.form-control.is-invalid, .was-validated .form-control:invalid { border-color: var(--dt-err); background: #fff; box-shadow: 0 0 0 3px rgba(217,48,37,.10); }
.invalid, .invalid-feedback, .field-validation-error { color: var(--dt-err); font-size: 12.5px; font-weight: 600; }
.form-control.is-valid, .was-validated .form-control:valid { border-color: var(--dt-ok); background: #fff; }
/* checkboxes & switches (BS4 custom-* and BS5 form-check) */
.custom-control-input:checked ~ .custom-control-label::before,
.form-check-input:checked { background-color: var(--dt-blue); border-color: var(--dt-blue); }
.form-check-input { width: 1.15em; height: 1.15em; border: 1.5px solid #d7dfe6; border-radius: 5px; }
.form-check-input:focus { outline: none; box-shadow: 0 0 0 3px rgba(24,120,208,.15); border-color: var(--dt-blue); }
.custom-switch { padding-left: 3.4rem; }
.custom-switch .custom-control-label::before { left: -3.4rem; top: 0; border-radius: 14px; background: #d7dfe6; border: none; height: 1.4rem; width: 2.6rem; }
.custom-switch .custom-control-label::after { left: calc(-3.4rem + 3px); top: 3px; width: calc(1.4rem - 6px); height: calc(1.4rem - 6px); border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.custom-switch .custom-control-input:checked ~ .custom-control-label::after { background-color: #fff; transform: translateX(1.2rem); }
.custom-switch .custom-control-input:checked ~ .custom-control-label::before { background: var(--dt-blue); }
.form-switch .form-check-input { height: 1.4em; width: 2.6em; background-color: #d7dfe6; border: none; }
.form-switch .form-check-input:checked { background-color: var(--dt-blue); }
/* input group */
.input-group-text, .input-group-addon { background: #eef2f6; border: 1px solid transparent; color: var(--dt-muted); border-radius: var(--dt-radius); font-size: 14px; }

/* Cards */
.card { border: 1px solid var(--dt-line); border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(13,34,54,.04); }
.card-bordered { border: 1px solid var(--dt-line) !important; }
.card-header { background: transparent; border-bottom: 1px solid #eef2f6; font-weight: 700; color: var(--dt-ink); }
.card-inner { padding: 22px 24px; }
/* stat card (subtle background per feedback) */
.card-stat { background: rgba(255,255,255,.45); border: 1px solid #e1e8ee; border-radius: 12px; padding: 14px 18px; }
.card-stat .label { font-size: 12px; color: var(--dt-grey); }
.card-stat .value { font-size: 21px; font-weight: 700; color: var(--dt-ink); font-variant-numeric: tabular-nums; }

/* Tables */
.table { color: #3c4a58; font-size: 13px; }
.table thead th, .nk-tb-head .sub-text {
  font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--dt-grey);
  font-weight: 600; border-top: none; border-bottom: 1px solid var(--dt-line); background: #fafcfd;
}
.table td, .table th { border-color: #f0f4f8; vertical-align: middle; padding: 11px 12px; }
.table-striped tbody tr:nth-of-type(odd) { background: transparent; }
.table-hover tbody tr:hover, .table tbody tr:hover { background: #f8fbfd; }
.table .tb-lead { font-weight: 600; color: var(--dt-ink); font-size: 13px; }
/* wrap any table in .card for the rounded container look */

/* Alerts */
.alert { border-radius: var(--dt-radius); font-size: 13.5px; border-width: 1px; }
.alert-info, .alert-primary { background: #eaf3fb; border-color: #bcd8ef; color: #155a99; }
.alert-success { background: #e8f5ee; border-color: #bfe3d0; color: #0b6e3f; }
.alert-warning, .alert-light { background: #fff8ec; border-color: #f0dcb2; color: #7a5a12; }
.alert-danger { background: #fdeceb; border-color: #f2c4c0; color: #a91e14; }

/* Badges */
.badge { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 12px; }
.badge-success, .bg-success { background: #e8f5ee !important; color: var(--dt-ok) !important; }
.badge-warning, .bg-warning { background: #fdf3e3 !important; color: var(--dt-warn) !important; }
.badge-danger, .bg-danger { background: #fdeceb !important; color: var(--dt-err) !important; }
.badge-info, .badge-primary, .bg-info, .bg-primary { background: #eaf3fb !important; color: var(--dt-blue) !important; }
.badge-secondary, .bg-secondary { background: #eef2f6 !important; color: var(--dt-muted) !important; }
/* dot status indicators (plain yes/no/status values) */
.dt-status { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.dt-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.dt-status-ok { color: var(--dt-ok); }
.dt-status-err { color: var(--dt-err); }
.dt-status-info { color: var(--dt-blue); }
.dt-status-warn { color: var(--dt-warn); }
.dt-status-muted { color: var(--dt-grey); }
/* status text used across DashLite pages */
.text-success, .tb-status.text-success { color: var(--dt-ok) !important; }
.text-warning { color: var(--dt-warn) !important; }
.text-danger { color: var(--dt-err) !important; }
.text-info { color: var(--dt-blue) !important; }
.text-soft, .text-muted { color: var(--dt-grey) !important; }

/* Pagination */
.pagination { gap: 4px; }
.page-link { border: 1px solid #d7dfe6; border-radius: 9px !important; color: #3c4a58; font-size: 13px; font-weight: 600; min-width: 38px; height: 36px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; text-align: center; margin: 0; outline: none; }
.page-link:hover { background: #f2f5f8; color: var(--dt-blue); border-color: var(--dt-blue); box-shadow: none; }
.page-link:focus { outline: none; box-shadow: none; }
.page-link:focus-visible { box-shadow: 0 0 0 3px rgba(24,120,208,.22); }
.page-item.active .page-link { background: var(--dt-blue); border-color: var(--dt-blue); color: #fff; font-weight: 700; }
.page-item.disabled .page-link { color: #c1ccd6; border-color: #e6ebf0; background: transparent; }

/* Nav tabs → segmented control */
.nav-tabs, .nav-pills { background: #e4eaf0; padding: 4px; border-radius: 11px; border: none; display: inline-flex; gap: 4px; }
.nav-tabs .nav-link, .nav-pills .nav-link { border: none; border-radius: 8px; padding: 9px 16px; font-size: 13.5px; font-weight: 600; color: var(--dt-muted); }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active { background: #fff; color: var(--dt-ink); font-weight: 700; box-shadow: 0 1px 3px rgba(20,40,70,.12); }
.nav-tabs .nav-link .badge-error-count { background: var(--dt-err); color: #fff; border-radius: 9px; font-size: 11px; padding: 1px 6px; margin-left: 6px; }

/* Dropdown menus */
.dropdown-menu { border: 1px solid #e1e8ee; border-radius: 11px; box-shadow: 0 10px 30px rgba(13,34,54,.16); padding: 6px; min-width: 200px; }
.dropdown-item, .link-list-opt a { border-radius: 8px; font-size: 13.5px; color: #3c4a58; padding: 10px 12px; }
.dropdown-item:hover, .link-list-opt a:hover { background: #f2f5f8; color: var(--dt-ink); }
.dropdown-item.text-danger:hover { background: #fdeceb; }
.dropdown-divider { border-color: #eef2f6; }

/* Modals */
.modal-content { border: 1px solid #e1e8ee; border-radius: var(--dt-radius-lg); box-shadow: 0 20px 60px rgba(13,34,54,.25); }
.modal-header { border-bottom: 1px solid #eef2f6; }
.modal-title { font-size: 16px; font-weight: 700; color: var(--dt-ink); }
.modal-footer { border-top: 1px solid #eef2f6; }
.modal-backdrop.show { background: #0d2236; opacity: .45; }
.close { text-shadow: none; color: var(--dt-grey); opacity: 1; }
.close:hover { color: var(--dt-ink); }

/* Progress & spinners */
.progress { height: 8px; border-radius: 4px; background: #e4eaf0; }
.progress-bar { background: linear-gradient(90deg, var(--dt-cyan), var(--dt-blue)); border-radius: 4px; }
.spinner-border, .spinner-grow { color: var(--dt-blue); }

/* List group */
.list-group { border-radius: var(--dt-radius-lg); }
.list-group-item { border-color: #eef2f6; color: #3c4a58; font-size: 13.5px; padding: 12px 18px; }
.list-group-item.active { background: #eaf3fb; border-color: #eaf3fb; color: var(--dt-blue); font-weight: 700; }

/* Breadcrumb */
.breadcrumb { background: transparent; padding: 0; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; }
.breadcrumb-item, .breadcrumb-item a { color: var(--dt-grey); }
.breadcrumb-item.active { color: var(--dt-ink); }

/* Toasts */
.toast { border: 1px solid #e1e8ee; border-radius: 12px; box-shadow: 0 10px 30px rgba(13,34,54,.16); background: #fff; }
.toast-header { border-bottom: 1px solid #eef2f6; color: var(--dt-ink); font-weight: 700; }

/* Tooltips / popovers */
.tooltip-inner { background: #0d2236; border-radius: 8px; font-size: 12px; }
.popover { border: 1px solid #e1e8ee; border-radius: 11px; box-shadow: 0 10px 30px rgba(13,34,54,.16); }

/* Avatars (DashLite user-card pattern) */
.user-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--dt-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }
.user-avatar.bg-white { background: #fff; border: 1px solid var(--dt-line); }

/* Sidebar helpers (for porting the shell) */
.dt-sidebar { background: rgba(247,248,250,.92); width: 248px; }
.dt-sidebar .nk-menu-link { border-radius: 8px; color: #3c4a58; font-weight: 500; padding: 8px 12px; }
.dt-sidebar .nk-menu-item.active > .nk-menu-link { background: #e4eefb; color: var(--dt-blue); font-weight: 700; box-shadow: none; }
.dt-sidebar .nk-menu-heading .overline-title { font-size: 11px; letter-spacing: .08em; color: #9aa2ad; }

/* Touch targets on mobile */
@media (max-width: 1023px) {
  .btn, .form-control, .form-select, .page-link { min-height: 44px; }
  .dropdown-item { padding: 12px; }
}

/* ---- Select2 (matches .form-control filled style) ---- */
.select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  background: var(--dt-bg); border: 1px solid transparent; border-radius: var(--dt-radius); min-height: 44px;
}
.select2-container--default .select2-selection--single { height: 44px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 42px; padding-left: 14px; color: var(--dt-ink); font-size: 14px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; right: 10px; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--dt-grey) transparent transparent transparent; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--multiple {
  background: #fff; border-color: var(--dt-blue); box-shadow: 0 0 0 3px rgba(24,120,208,.12);
}
.select2-container--default .select2-selection--multiple { padding: 3px 8px 7px 3px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: #eaf3fb; border: none; border-radius: 8px; color: var(--dt-blue); font-weight: 600; font-size: 13px; padding: 5px 10px; margin: 5px 0 0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: var(--dt-blue); margin-right: 6px; font-weight: 700; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: var(--dt-blue-dark); }
.select2-container--default .select2-search--inline .select2-search__field { margin-top: 10px; margin-left: 10px; font-size: 14px; }
.select2-dropdown { border: 1px solid #e1e8ee; border-radius: 11px; box-shadow: 0 10px 30px rgba(13,34,54,.16); overflow: hidden; z-index: 1060; }
.select2-search--dropdown { padding: 8px; }
.select2-search--dropdown .select2-search__field { border: 1px solid var(--dt-line); border-radius: 8px; height: 38px; padding: 0 12px; font-size: 13.5px; outline: none; }
.select2-search--dropdown .select2-search__field:focus { border-color: var(--dt-blue); box-shadow: 0 0 0 3px rgba(24,120,208,.12); }
.select2-results__option { font-size: 13.5px; padding: 10px 14px; color: #3c4a58; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: #eaf3fb; color: var(--dt-blue); }
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option--selected { background: var(--dt-blue); color: #fff; }

/* ---- Bootstrap-datepicker ---- */
.datepicker.dropdown-menu, .datepicker.datepicker-inline { border: 1px solid #e1e8ee; border-radius: 11px; box-shadow: 0 10px 30px rgba(13,34,54,.16); padding: 12px; font-family: var(--dt-font); }
.datepicker table { border-collapse: separate; border-spacing: 2px; }
.datepicker table tr td, .datepicker table tr th { width: 36px; height: 36px; min-width: 36px; padding: 0; border-radius: 9px; font-size: 13px; color: var(--dt-ink); text-align: center; vertical-align: middle; line-height: 36px; }
.datepicker table tr th.dow { color: var(--dt-grey); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.datepicker .datepicker-switch { font-weight: 700; color: var(--dt-ink); font-size: 14px; }
.datepicker .datepicker-switch:hover, .datepicker .prev:hover, .datepicker .next:hover, .datepicker tfoot tr th:hover { background: #f2f5f8; }
.datepicker .prev, .datepicker .next { color: var(--dt-muted); font-weight: 700; }
.datepicker table tr td.day:hover, .datepicker table tr td.focused { background: #f2f5f8; cursor: pointer; }
.datepicker table tr td.old, .datepicker table tr td.new { color: #c1ccd6; }
.datepicker table tr td.today, .datepicker table tr td.today:hover { background: #eaf3fb; color: var(--dt-blue); font-weight: 700; }
.datepicker table tr td.active, .datepicker table tr td.active:hover,
.datepicker table tr td.active.active, .datepicker table tr td.active:hover.active,
.datepicker table tr td span.active, .datepicker table tr td span.active:hover {
  background: var(--dt-blue) !important; color: #fff !important; font-weight: 700; text-shadow: none; border: none; background-image: none !important;
}
.datepicker table tr td span { border-radius: 9px; }
.datepicker table tr td span:hover { background: #f2f5f8; }
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover { color: #d7dfe6; background: transparent; }