/* Klauke Enterprises - Keycloak Admin Theme
 * Brand Colors:
 * - Primary Orange: #ff5e14
 * - Dark Navy: #003049
 * - Light Gray Background: #F2F4F6
 */

@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700&display=swap');

:root {
    /* Klauke Brand Colors */
    --kle-primary: #ff5e14;
    --kle-primary-hover: #ff7329;
    --kle-primary-dark: #e54d00;
    --kle-navy: #003049;
    --kle-navy-light: #046;
    --kle-gray-bg: #F2F4F6;
    --kle-white: #fff;
    --kle-text-dark: #444;
    --kle-text-medium: #5A5B62;

    /* PatternFly 5 CSS Variable Overrides */
    --pf-v5-global--primary-color--100: var(--kle-primary);
    --pf-v5-global--primary-color--200: var(--kle-primary-hover);
    --pf-v5-global--primary-color--dark-100: var(--kle-primary-dark);
    --pf-v5-global--link--Color: var(--kle-primary);
    --pf-v5-global--link--Color--hover: var(--kle-primary-dark);
    --pf-v5-global--link--Color--visited: var(--kle-primary);
    --pf-v5-global--BackgroundColor--dark-100: var(--kle-navy);
    --pf-v5-global--BackgroundColor--dark-200: var(--kle-navy-light);
    --pf-v5-global--BackgroundColor--dark-300: #001f33;
    --pf-v5-global--BackgroundColor--dark-400: #00141f;
    --pf-v5-global--active-color--100: var(--kle-primary);
    --pf-v5-global--Color--100: var(--kle-text-dark);
    --pf-v5-global--Color--200: var(--kle-text-medium);

    /* PatternFly 4 fallbacks (for older components) */
    --pf-global--primary-color--100: var(--kle-primary);
    --pf-global--primary-color--200: var(--kle-primary-hover);
    --pf-global--link--Color: var(--kle-primary);
    --pf-global--link--Color--hover: var(--kle-primary-dark);
    --pf-global--BackgroundColor--dark-100: var(--kle-navy);
}

/* Font Family */
body,
.pf-v5-c-page,
.pf-c-page {
    font-family: Figtree, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Masthead / Header */
.pf-v5-c-masthead,
.pf-c-page__header {
    --pf-v5-c-masthead--BackgroundColor: var(--kle-navy);
    --pf-c-page__header--BackgroundColor: var(--kle-navy);

    background-color: var(--kle-navy);
}

/* Custom Logo - Replace Keycloak logo */
.pf-v5-c-masthead__brand img,
.pf-v5-c-brand,
.pf-c-page__header-brand-link img,
.pf-c-brand {
    max-height: 36px;
    content: url('../img/logo.png');
}

/* Hide default Keycloak logo SVG and replace with custom logo */
.pf-v5-c-masthead__brand svg,
.pf-c-page__header-brand svg {
    display: none;
}

.pf-v5-c-masthead__brand,
.pf-c-page__header-brand-link {
    background-image: url('../img/logo.png');
    background-repeat: no-repeat;
    background-position: center left;
    background-size: contain;
    min-width: 180px;
    min-height: 36px;
}

.pf-v5-c-masthead__brand:empty::before,
.pf-c-page__header-brand-link:empty::before {
    content: '';
    display: block;
    width: 180px;
    height: 36px;
}

/* Sidebar / Navigation */
.pf-v5-c-page__sidebar,
.pf-c-page__sidebar {
    --pf-v5-c-page__sidebar--BackgroundColor: var(--kle-navy);
    --pf-c-page__sidebar--BackgroundColor: var(--kle-navy);

    background-color: var(--kle-navy);
}

.pf-v5-c-nav__link,
.pf-c-nav__link {
    color: rgb(255, 255, 255, 0.8);
}

.pf-v5-c-nav__link:hover,
.pf-c-nav__link:hover {
    color: var(--kle-white);
    background-color: rgb(255, 255, 255, 0.1);
}

.pf-v5-c-nav__link.pf-m-current,
.pf-c-nav__link.pf-m-current {
    color: var(--kle-white);
    background-color: rgb(255, 94, 20, 0.2);
}

.pf-v5-c-nav__link.pf-m-current::after,
.pf-c-nav__link.pf-m-current::after {
    background-color: var(--kle-primary);
}

/* Primary Buttons */
.pf-v5-c-button.pf-m-primary,
.pf-c-button.pf-m-primary {
    --pf-v5-c-button--m-primary--BackgroundColor: var(--kle-primary);
    --pf-c-button--m-primary--BackgroundColor: var(--kle-primary);

    background-color: var(--kle-primary);
    border-color: var(--kle-primary);
}

.pf-v5-c-button.pf-m-primary:hover,
.pf-c-button.pf-m-primary:hover {
    --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--kle-primary-hover);
    --pf-c-button--m-primary--hover--BackgroundColor: var(--kle-primary-hover);

    background-color: var(--kle-primary-hover);
    border-color: var(--kle-primary-hover);
}

.pf-v5-c-button.pf-m-primary:focus,
.pf-c-button.pf-m-primary:focus {
    box-shadow: 0 0 0 3px rgb(255, 94, 20, 0.3);
}

/* Link Buttons */
.pf-v5-c-button.pf-m-link,
.pf-c-button.pf-m-link {
    --pf-v5-c-button--m-link--Color: var(--kle-primary);
    --pf-c-button--m-link--Color: var(--kle-primary);

    color: var(--kle-primary);
}

.pf-v5-c-button.pf-m-link:hover,
.pf-c-button.pf-m-link:hover {
    --pf-v5-c-button--m-link--hover--Color: var(--kle-primary-dark);
    --pf-c-button--m-link--hover--Color: var(--kle-primary-dark);

    color: var(--kle-primary-dark);
}

/* Form Controls */
.pf-v5-c-form-control:focus,
.pf-c-form-control:focus {
    --pf-v5-c-form-control--focus--BorderBottomColor: var(--kle-primary);
    --pf-c-form-control--focus--BorderBottomColor: var(--kle-primary);

    border-bottom-color: var(--kle-primary);
    box-shadow: 0 1px 0 0 var(--kle-primary);
}

/* Switches/Toggles */
.pf-v5-c-switch__input:checked + .pf-v5-c-switch__toggle,
.pf-c-switch__input:checked + .pf-c-switch__toggle {
    --pf-v5-c-switch__input--checked__toggle--BackgroundColor: var(--kle-primary);
    --pf-c-switch__input--checked__toggle--BackgroundColor: var(--kle-primary);

    background-color: var(--kle-primary);
}

/* Tabs */
.pf-v5-c-tabs__link::after,
.pf-c-tabs__link::after {
    background-color: transparent;
}

.pf-v5-c-tabs__link:hover::after,
.pf-c-tabs__link:hover::after,
.pf-v5-c-tabs__link.pf-m-current::after,
.pf-c-tabs__link.pf-m-current::after {
    background-color: var(--kle-primary);
}

.pf-v5-c-tabs__link.pf-m-current,
.pf-c-tabs__link.pf-m-current {
    color: var(--kle-primary);
}

/* Alerts */
.pf-v5-c-alert.pf-m-info,
.pf-c-alert.pf-m-info {
    --pf-v5-c-alert--m-info--BackgroundColor: #eff6ff;
}

/* Badges */
.pf-v5-c-badge.pf-m-unread,
.pf-c-badge.pf-m-unread {
    --pf-v5-c-badge--m-unread--BackgroundColor: var(--kle-primary);

    background-color: var(--kle-primary);
}

/* Chips */
.pf-v5-c-chip,
.pf-c-chip {
    --pf-v5-c-chip--BackgroundColor: rgb(255, 94, 20, 0.1);
}

/* Progress bars */
.pf-v5-c-progress__indicator,
.pf-c-progress__indicator {
    background-color: var(--kle-primary);
}

/* Dropdown menu hover */
.pf-v5-c-menu__list-item:hover,
.pf-c-dropdown__menu-item:hover {
    background-color: rgb(255, 94, 20, 0.1);
}

/* Cards */
.pf-v5-c-card,
.pf-c-card {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0, 0, 0, 0.06);
}

/* Page Title */
.pf-v5-c-title,
.pf-c-title {
    color: var(--kle-navy);
}

/* Data list hover */
.pf-v5-c-data-list__item:hover,
.pf-c-data-list__item:hover {
    background-color: var(--kle-gray-bg);
}

/* Table row hover */
.pf-v5-c-table tbody tr:hover,
.pf-c-table tbody tr:hover {
    background-color: var(--kle-gray-bg);
}

/* Checkbox accent */
input[type="checkbox"]:checked {
    accent-color: var(--kle-primary);
}

/* Radio accent */
input[type="radio"]:checked {
    accent-color: var(--kle-primary);
}

/* Spinner */
.pf-v5-c-spinner,
.pf-c-spinner {
    --pf-v5-c-spinner--Color: var(--kle-primary);
    --pf-c-spinner--Color: var(--kle-primary);
}

/* Empty state */
.pf-v5-c-empty-state__icon,
.pf-c-empty-state__icon {
    color: var(--kle-primary);
}

/* Wizard step active */
.pf-v5-c-wizard__nav-link.pf-m-current,
.pf-c-wizard__nav-link.pf-m-current {
    color: var(--kle-primary);
}

.pf-v5-c-wizard__nav-link.pf-m-current::before,
.pf-c-wizard__nav-link.pf-m-current::before {
    border-color: var(--kle-primary);
    background-color: var(--kle-primary);
}
