/* SCAAK Theme v1
   Goal: consistent modern buttons/inputs/dropdowns across Bootstrap + Kendo UI.
   Keep overrides conservative to avoid breaking legacy views. */

:root {
  --scaak-brand: #317256;
  --scaak-brand-ink: #14324F;
  --scaak-bg: #f6f8fb;
  --scaak-surface: #ffffff;
  --scaak-border: #d8dee6;
  --scaak-text: #0f172a;
  --scaak-muted: #5b6676;
  --scaak-radius: 10px;
  --scaak-radius-sm: 8px;
  --scaak-focus: rgba(49, 114, 86, 0.18);
  --scaak-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

body {
  color: var(--scaak-text);
  background: var(--scaak-bg);
}

/* ---------- Bootstrap: buttons ---------- */
.btn {
  border-radius: var(--scaak-radius-sm) !important;
  font-weight: 600;
  letter-spacing: 0.2px;
  box-shadow: none !important;
}

.btn-primary {
  background-color: var(--scaak-brand) !important;
  border-color: var(--scaak-brand) !important;
}

.btn-primary:hover,
.btn-primary:focus {
  filter: brightness(0.96);
}

.btn-outline-primary {
  color: var(--scaak-brand) !important;
  border-color: color-mix(in srgb, var(--scaak-brand) 65%, #ffffff) !important;
}

.btn-outline-primary:hover {
  background-color: color-mix(in srgb, var(--scaak-brand) 12%, #ffffff) !important;
}

.btn-secondary {
  background-color: #eef2f6 !important;
  border-color: #d7dee7 !important;
  color: #223048 !important;
}

/* ---------- Bootstrap: inputs/selects ---------- */
.form-control,
.form-select,
input.form-control,
select.form-select,
textarea.form-control {
  border-radius: var(--scaak-radius-sm) !important;
  border-color: var(--scaak-border) !important;
  min-height: 38px;
}

.form-control:focus,
.form-select:focus {
  border-color: color-mix(in srgb, var(--scaak-brand) 55%, #ffffff) !important;
  box-shadow: 0 0 0 0.22rem var(--scaak-focus) !important;
}

/* ---------- “Card” surfaces ---------- */
.card,
.k-card {
  border-radius: var(--scaak-radius) !important;
  border-color: color-mix(in srgb, var(--scaak-border) 70%, #ffffff) !important;
  box-shadow: var(--scaak-shadow);
}

/* ---------- Kendo: inputs & dropdowns ---------- */
.k-input,
.k-textbox,
.k-picker,
.k-dropdownlist,
.k-combobox,
.k-multiselect,
.k-autocomplete,
.k-numerictextbox {
  border-radius: var(--scaak-radius-sm) !important;
}

/* Kendo sizing: make dropdowns/datepickers align with Bootstrap inputs */
.k-picker,
.k-dropdownlist,
.k-combobox,
.k-multiselect,
.k-numerictextbox {
  min-height: 38px;
}

/* Fluent theme uses .k-input-inner + buttons; normalize padding/height */
.k-input-inner {
  min-height: 38px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.k-input-button,
.k-picker-wrap .k-select,
.k-picker .k-input-button {
  width: 38px;
}

.k-input-button .k-icon,
.k-picker .k-input-button .k-icon {
  color: var(--scaak-brand-ink);
}

/* DatePicker: remove green calendar button background */
.k-datepicker .k-input-button,
.k-dateinput .k-input-button,
.k-datetimepicker .k-input-button {
  background: #ffffff !important;
  border-color: var(--scaak-border) !important;
}

.k-datepicker .k-input-button:hover,
.k-dateinput .k-input-button:hover,
.k-datetimepicker .k-input-button:hover {
  background: #f2f4f7 !important;
}

/* Dropdown filter input (search box in dropdown list) */
.k-list-filter .k-textbox,
.k-list-filter .k-input {
  border-radius: var(--scaak-radius-sm) !important;
  border-color: var(--scaak-border) !important;
}

.k-list-filter .k-textbox:focus-within,
.k-list-filter .k-input:focus-within {
  border-color: color-mix(in srgb, var(--scaak-brand) 55%, #ffffff) !important;
  box-shadow: 0 0 0 0.22rem var(--scaak-focus) !important;
}

.k-input-solid,
.k-picker-solid,
.k-dropdownlist.k-picker-solid,
.k-combobox.k-picker-solid,
.k-multiselect.k-picker-solid {
  border-color: var(--scaak-border) !important;
  background-color: var(--scaak-surface) !important;
}

.k-input-solid:focus-within,
.k-picker-solid:focus-within,
.k-dropdownlist.k-picker-solid:focus-within,
.k-combobox.k-picker-solid:focus-within,
.k-multiselect.k-picker-solid:focus-within {
  border-color: color-mix(in srgb, var(--scaak-brand) 55%, #ffffff) !important;
  box-shadow: 0 0 0 0.22rem var(--scaak-focus) !important;
}

/* Kendo: buttons */
.k-button {
  border-radius: var(--scaak-radius-sm) !important;
  font-weight: 600;
}

.k-button-solid-primary {
  background-color: var(--scaak-brand) !important;
  border-color: var(--scaak-brand) !important;
}

/* ---------- Dashboard: TileLayout polish (global) ---------- */
#dashboard-tilelayout {
  padding: 8px 6px 18px 6px;
}

#dashboard-tilelayout .k-tilelayout-item {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--scaak-shadow);
  border-color: color-mix(in srgb, var(--scaak-border) 70%, #ffffff) !important;
}

#dashboard-tilelayout .k-card-header {
  background: #fff;
  border-bottom: 1px solid rgba(216, 222, 230, 0.8);
  padding: 14px 16px;
}

#dashboard-tilelayout .k-card-body {
  background: #fff;
  padding: 16px;
}

#dashboard-tilelayout .k-card-title {
  font-weight: 800;
  letter-spacing: 0.2px;
  color: var(--scaak-brand-ink);
}

/* Kendo Window close “X” (fallback; you already override some per-window) */
.k-window-titlebar .k-window-titlebar-actions .k-button,
.k-window-titlebar .k-window-titlebar-actions .k-icon-button,
.k-window-titlebar .k-window-titlebar-actions .k-button .k-icon,
.k-window-titlebar .k-window-titlebar-actions .k-icon-button .k-icon {
  color: var(--scaak-brand-ink) !important;
}