/*
 * Rigor Admin Theme Styles
 * Custom styles for Keycloak Admin Console
 * Overrides keycloak.v2 admin theme
 */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&family=Manrope:wght@400;500;600;700&display=swap');

/* CSS Custom Properties */
:root {
    /* Brand Colors */
    --rigor-orange: #F37722;
    --rigor-yellow-1: #F89D1E;
    --rigor-yellow-2: #FFC514;
    --rigor-dark-gray: #595959;
    --rigor-black: #000000;
    --rigor-white: #FFFFFF;

    /* Gradient */
    --rigor-gradient: linear-gradient(135deg, #F37722 0%, #F89D1E 50%, #FFC514 100%);

    /* Override PatternFly primary color */
    --pf-v5-global--primary-color--100: #F37722;
    --pf-v5-global--primary-color--200: #F89D1E;
    --pf-v5-global--link--Color: #F37722;
    --pf-v5-global--link--Color--hover: #F89D1E;
    --pf-v5-global--active-color--100: #F37722;
}

/* ====================================
   HEADER / MASTHEAD - ALWAYS GREY
   ==================================== */

/* Masthead background - FORCE grey in all modes */
.pf-v5-c-masthead,
.pf-c-masthead,
header.pf-v5-c-masthead,
header.pf-c-masthead {
    --pf-v5-c-masthead--BackgroundColor: #3d3d3d !important;
    --pf-c-masthead--BackgroundColor: #3d3d3d !important;
    background: #3d3d3d !important;
    background-color: #3d3d3d !important;
}

/* Masthead child elements - ensure transparent or grey background */
.pf-v5-c-masthead__content,
.pf-v5-c-masthead__main,
.pf-v5-c-masthead__toggle,
.pf-v5-c-masthead__brand,
.pf-v5-c-toolbar,
.pf-c-masthead__content,
.pf-c-masthead__main,
.pf-c-masthead__toggle,
.pf-c-masthead__brand,
.pf-c-toolbar,
.pf-v5-c-masthead .pf-v5-c-toolbar,
.pf-v5-c-masthead .pf-c-toolbar {
    background: transparent !important;
    background-color: transparent !important;
}

/* Dark mode masthead - keep grey not black */
.pf-v5-theme-dark .pf-v5-c-masthead,
.pf-v5-theme-dark .pf-c-masthead,
.pf-v5-theme-dark header.pf-v5-c-masthead,
html.pf-v5-theme-dark .pf-v5-c-masthead,
html.pf-v5-theme-dark .pf-c-masthead,
[class*="pf-v5-theme-dark"] .pf-v5-c-masthead,
[class*="pf-v5-theme-dark"] .pf-c-masthead {
    --pf-v5-c-masthead--BackgroundColor: #3d3d3d !important;
    --pf-c-masthead--BackgroundColor: #3d3d3d !important;
    background: #3d3d3d !important;
    background-color: #3d3d3d !important;
}

/* Dark mode masthead child elements - force transparent */
.pf-v5-theme-dark .pf-v5-c-masthead__content,
.pf-v5-theme-dark .pf-v5-c-masthead__main,
.pf-v5-theme-dark .pf-v5-c-masthead__toggle,
.pf-v5-theme-dark .pf-v5-c-masthead__brand,
.pf-v5-theme-dark .pf-v5-c-toolbar,
.pf-v5-theme-dark .pf-c-masthead__content,
.pf-v5-theme-dark .pf-c-masthead__main,
.pf-v5-theme-dark .pf-c-toolbar,
html.pf-v5-theme-dark .pf-v5-c-masthead__content,
html.pf-v5-theme-dark .pf-v5-c-masthead__main,
html.pf-v5-theme-dark .pf-v5-c-masthead__toggle,
html.pf-v5-theme-dark .pf-v5-c-masthead__brand,
html.pf-v5-theme-dark .pf-v5-c-toolbar,
html.pf-v5-theme-dark .pf-c-toolbar,
[class*="pf-v5-theme-dark"] .pf-v5-c-masthead__content,
[class*="pf-v5-theme-dark"] .pf-v5-c-masthead__main,
[class*="pf-v5-theme-dark"] .pf-v5-c-toolbar {
    background: transparent !important;
    background-color: transparent !important;
}

/* Logo area */
.pf-v5-c-masthead__brand,
.pf-c-masthead__brand {
    font-family: 'Poppins', sans-serif;
}

/* Hide default Keycloak logo and replace with Rigor logo */
.pf-v5-c-brand,
.pf-c-brand,
.keycloak-logo,
[src*="img/logo.svg"],
img[alt="Keycloak logo"] {
    content: url('../img/logo.svg') !important;
    height: 60px !important;
    width: auto !important;
    max-width: 180px !important;
}

/* Alternative: Hide SVG content and use background */
.pf-v5-c-masthead__brand img,
.pf-c-masthead__brand img,
.pf-v5-c-page__header-brand-link img,
.pf-c-page__header-brand-link img {
    content: url('../img/logo.svg') !important;
    height: 60px !important;
    width: auto !important;
}

/* ====================================
   NAVIGATION
   ==================================== */

/* Sidebar / Navigation */
.pf-v5-c-nav__link.pf-m-current,
.pf-c-nav__link.pf-m-current,
.pf-v5-c-nav__link:hover,
.pf-c-nav__link:hover {
    --pf-v5-c-nav__link--m-current--BackgroundColor: rgba(243, 119, 34, 0.1);
    --pf-c-nav__link--m-current--BackgroundColor: rgba(243, 119, 34, 0.1);
    color: var(--rigor-orange);
}

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

/* ====================================
   BUTTONS
   ==================================== */

/* Primary buttons */
.pf-v5-c-button.pf-m-primary,
.pf-c-button.pf-m-primary {
    --pf-v5-c-button--m-primary--BackgroundColor: var(--rigor-orange);
    --pf-c-button--m-primary--BackgroundColor: var(--rigor-orange);
    background: var(--rigor-gradient);
    border: none;
}

.pf-v5-c-button.pf-m-primary:hover,
.pf-c-button.pf-m-primary:hover {
    --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--rigor-yellow-1);
    --pf-c-button--m-primary--hover--BackgroundColor: var(--rigor-yellow-1);
    background: linear-gradient(135deg, #e06a1a 0%, #e89118 50%, #e6b313 100%);
}

/* Link buttons */
.pf-v5-c-button.pf-m-link,
.pf-c-button.pf-m-link {
    --pf-v5-c-button--m-link--Color: var(--rigor-orange);
    --pf-c-button--m-link--Color: var(--rigor-orange);
    color: var(--rigor-orange);
}

.pf-v5-c-button.pf-m-link:hover,
.pf-c-button.pf-m-link:hover {
    --pf-v5-c-button--m-link--hover--Color: var(--rigor-yellow-1);
    --pf-c-button--m-link--hover--Color: var(--rigor-yellow-1);
    color: var(--rigor-yellow-1);
}

/* ====================================
   LINKS
   ==================================== */

a {
    color: var(--rigor-orange);
}

a:hover {
    color: var(--rigor-yellow-1);
}

/* ====================================
   TABS
   ==================================== */

.pf-v5-c-tabs__link::after,
.pf-c-tabs__link::after {
    --pf-v5-c-tabs__link--after--BorderColor: var(--rigor-orange);
    --pf-c-tabs__link--after--BorderColor: var(--rigor-orange);
}

.pf-v5-c-tabs__item.pf-m-current .pf-v5-c-tabs__link,
.pf-c-tabs__item.pf-m-current .pf-c-tabs__link {
    color: var(--rigor-orange);
}

/* ====================================
   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(--rigor-orange);
    --pf-c-switch__input--checked__toggle--BackgroundColor: var(--rigor-orange);
    background-color: var(--rigor-orange);
}

/* ====================================
   CHECKBOXES & RADIOS
   ==================================== */

.pf-v5-c-check__input:checked,
.pf-c-check__input:checked,
.pf-v5-c-radio__input:checked,
.pf-c-radio__input:checked {
    accent-color: var(--rigor-orange);
}

/* ====================================
   BADGES / LABELS
   ==================================== */

/* Blue labels - convert to orange brand colors */
.pf-v5-c-label.pf-m-blue,
.pf-c-label.pf-m-blue {
    /* Override all blue color variables */
    --pf-v5-c-label--m-blue--BackgroundColor: var(--rigor-orange) !important;
    --pf-v5-c-label--m-blue--Color: var(--rigor-white) !important;
    --pf-v5-c-label--m-blue--icon--Color: var(--rigor-white) !important;
    --pf-v5-c-label--BackgroundColor: var(--rigor-orange) !important;
    --pf-v5-c-label--Color: var(--rigor-white) !important;
    --pf-v5-c-label--BorderColor: var(--rigor-orange) !important;
    --pf-v5-c-label--icon--Color: var(--rigor-white) !important;

    /* Direct property overrides */
    background: var(--rigor-gradient) !important;
    background-color: var(--rigor-orange) !important;
    border-color: transparent !important;
    color: var(--rigor-white) !important;
    box-shadow: none !important;
}

/* Blue label icons */
.pf-v5-c-label.pf-m-blue .pf-v5-c-label__icon,
.pf-c-label.pf-m-blue .pf-c-label__icon,
.pf-v5-c-label.pf-m-blue svg,
.pf-c-label.pf-m-blue svg {
    color: var(--rigor-white) !important;
    fill: var(--rigor-white) !important;
}

/* Blue label text */
.pf-v5-c-label.pf-m-blue .pf-v5-c-label__content,
.pf-c-label.pf-m-blue .pf-c-label__content,
.pf-v5-c-label.pf-m-blue .pf-v5-c-label__text,
.pf-c-label.pf-m-blue .pf-c-label__text {
    color: var(--rigor-white) !important;
}

/* Outline variant of blue labels */
.pf-v5-c-label.pf-m-blue.pf-m-outline,
.pf-c-label.pf-m-blue.pf-m-outline {
    --pf-v5-c-label--m-outline--m-blue--BorderColor: var(--rigor-orange) !important;
    --pf-v5-c-label--m-outline--m-blue--Color: var(--rigor-orange) !important;

    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid var(--rigor-orange) !important;
    color: var(--rigor-orange) !important;
}

.pf-v5-c-label.pf-m-blue.pf-m-outline .pf-v5-c-label__icon,
.pf-v5-c-label.pf-m-blue.pf-m-outline svg {
    color: var(--rigor-orange) !important;
    fill: var(--rigor-orange) !important;
}

.pf-v5-c-label.pf-m-blue.pf-m-outline .pf-v5-c-label__content,
.pf-v5-c-label.pf-m-blue.pf-m-outline .pf-v5-c-label__text {
    color: var(--rigor-orange) !important;
}

/* Dark mode support */
.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue,
[data-theme="dark"] .pf-v5-c-label.pf-m-blue,
.pf-c-page.pf-m-dark .pf-c-label.pf-m-blue {
    background: var(--rigor-gradient) !important;
    border-color: transparent !important;
    color: var(--rigor-white) !important;
}

.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue.pf-m-outline,
[data-theme="dark"] .pf-v5-c-label.pf-m-blue.pf-m-outline {
    background: transparent !important;
    border-color: var(--rigor-orange) !important;
    color: var(--rigor-orange) !important;
}

/* ====================================
   PROGRESS & SPINNERS
   ==================================== */

.pf-v5-c-spinner,
.pf-c-spinner {
    --pf-v5-c-spinner--Color: var(--rigor-orange);
    --pf-c-spinner--Color: var(--rigor-orange);
}

/* ====================================
   FOCUS STATES
   ==================================== */

*:focus-visible {
    outline-color: var(--rigor-orange);
}

/* ====================================
   SELECTION
   ==================================== */

::selection {
    background-color: rgba(243, 119, 34, 0.2);
    color: var(--rigor-black);
}

/* ====================================
   ALERTS
   ==================================== */

.pf-v5-c-alert.pf-m-info,
.pf-c-alert.pf-m-info {
    --pf-v5-c-alert--m-info--BackgroundColor: rgba(243, 119, 34, 0.1);
    --pf-c-alert--m-info--BackgroundColor: rgba(243, 119, 34, 0.1);
}

/* ====================================
   DARK MODE SUPPORT
   ==================================== */

/* Dark mode navigation */
.pf-v5-theme-dark .pf-v5-c-nav__link.pf-m-current,
.pf-v5-theme-dark .pf-v5-c-nav__link:hover,
html.pf-v5-theme-dark .pf-v5-c-nav__link.pf-m-current,
html.pf-v5-theme-dark .pf-v5-c-nav__link:hover {
    color: var(--rigor-orange);
}

/* Dark mode links */
.pf-v5-theme-dark a,
html.pf-v5-theme-dark a {
    color: var(--rigor-orange);
}

.pf-v5-theme-dark a:hover,
html.pf-v5-theme-dark a:hover {
    color: var(--rigor-yellow-1);
}

/* Dark mode buttons */
.pf-v5-theme-dark .pf-v5-c-button.pf-m-link,
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-link {
    color: var(--rigor-orange);
}

.pf-v5-theme-dark .pf-v5-c-button.pf-m-link:hover,
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-link:hover {
    color: var(--rigor-yellow-1);
}

/* Dark mode selection */
.pf-v5-theme-dark ::selection,
html.pf-v5-theme-dark ::selection {
    background-color: rgba(243, 119, 34, 0.3);
    color: var(--rigor-white);
}

/* Dark mode labels */
.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue,
html.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue {
    background: var(--rigor-gradient) !important;
    border-color: transparent !important;
    color: var(--rigor-white) !important;
}

.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue.pf-m-outline,
html.pf-v5-theme-dark .pf-v5-c-label.pf-m-blue.pf-m-outline {
    background: transparent !important;
    border-color: var(--rigor-orange) !important;
    color: var(--rigor-orange) !important;
}