/*
 * Telerik theme overrides — reshape kendo-theme-bootstrap defaults to match ACP design tokens.
 * Loaded AFTER the Telerik kendo-theme-bootstrap CSS so these selectors win.
 *
 * Only override what breaks the ACP look; leave grid/date-picker internals alone.
 */

/* --- Buttons — the k-button primary should be teal, not bootstrap blue --- */
.k-button.k-button-solid-primary,
.k-button-solid-primary {
    background-color: var(--acp-primary);
    border-color: var(--acp-primary);
    color: var(--acp-primary-on);
}
.k-button.k-button-solid-primary:hover,
.k-button-solid-primary:hover {
    background-color: var(--acp-primary-2);
    border-color: var(--acp-primary-2);
    color: var(--acp-primary-on);
}
.k-button-outline-primary,
.k-button.k-button-outline-primary {
    color: var(--acp-primary);
    border-color: var(--acp-primary);
}
.k-button-outline-primary:hover {
    background-color: var(--acp-primary-soft);
    color: var(--acp-primary);
}

/* --- Tab strip — thinner underline, teal active, mono counter matches acp-tab-count --- */
.k-tabstrip-items .k-item.k-active,
.k-tabstrip-items .k-item.k-state-active {
    color: var(--acp-ink);
    border-bottom-color: var(--acp-primary);
    font-weight: 600;
}
.k-tabstrip-items .k-item {
    color: var(--acp-muted); font-weight: 500;
    font-family: var(--acp-font-sans);
    font-size: var(--acp-fs-13);
}
.k-tabstrip-items .k-item:hover { color: var(--acp-ink); }

/* --- Drop-down / combo — align input backgrounds with acp-surface tokens --- */
.k-input-solid, .k-picker-solid {
    background-color: var(--acp-card);
    border-color: var(--acp-line-2);
    color: var(--acp-ink);
    font-family: var(--acp-font-sans);
}

/* AcpCard wraps TelerikCard. Telerik's default k-card ships its own padding/border
   which doubles up over the .acp-card outer rules. Zero out the k-* insets and
   keep the design-system border/padding as the single source of visual truth. */
.acp-card.k-card {
    padding: var(--acp-space-4) var(--acp-space-5);
    background: var(--acp-card);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-lg);
    box-shadow: none;
}
.acp-card > .k-card-header,
.acp-card > .k-card-body {
    padding: 0;
    background: transparent;
    border: none;
}

.k-input-solid:focus-within, .k-picker-solid:focus-within {
    border-color: var(--acp-primary);
    box-shadow: 0 0 0 2px var(--acp-primary-soft);
}

/* --- Checkbox / radio — primary accent --- */
.k-checkbox:checked, .k-radio:checked {
    background-color: var(--acp-primary);
    border-color: var(--acp-primary);
}

/* --- App bar (used by MainLayout.razor) — restyle to match our top bar --- */
.k-appbar.acp-topbar-telerik {
    background: var(--acp-card);
    border-bottom: 1px solid var(--acp-line);
    color: var(--acp-ink);
    height: var(--acp-topbar-h);
}

/* --- Dialog / Window — content padding stays flat; overrides sit alongside the global
      dialog scroll cap in app.css (max-height: 90vh) --- */
.k-window, .k-dialog {
    border-color: var(--acp-line-2);
    border-radius: var(--acp-radius-lg);
}
.k-window-titlebar, .k-dialog-titlebar {
    background: var(--acp-card); color: var(--acp-ink);
    border-bottom: 1px solid var(--acp-line);
    font-family: var(--acp-font-sans);
    font-weight: 600;
}

/* --- Panel bar (NavMenu) — align with our sidebar look; kept subtle since we'll move to
      AcpSidebar for new pages --- */
.k-panelbar > .k-item > .k-link.k-selected {
    background: var(--acp-primary-soft);
    color: var(--acp-primary);
}

/* --- Notification / badge --- */
.k-notification-primary {
    background: var(--acp-primary-soft);
    color: var(--acp-primary);
    border-color: transparent;
}
.k-notification-error {
    background: var(--acp-critical-soft);
    color: var(--acp-critical);
    border-color: transparent;
}
.k-notification-warning {
    background: var(--acp-warn-soft);
    color: var(--acp-warn);
    border-color: transparent;
}
.k-notification-success {
    background: var(--acp-good-soft);
    color: var(--acp-good);
    border-color: transparent;
}
