/* Rome AI Custom Admin Console Theme */

/* ============================================
   IMMEDIATE FIXES - Apply regardless of dark mode
   ============================================ */

/* Force light backgrounds immediately - highest priority */
html,
html.pf-v5-theme-dark,
body,
#app {
  background: #f8fafc !important;
  color: #1f2937 !important;
}

/* ============================================
   GLOBAL OVERRIDES - Force Light Theme
   ============================================ */

/* CRITICAL: Override PatternFly v5 dark mode CSS variables - COMPREHENSIVE */
html.pf-v5-theme-dark,
html.pf-v5-theme-dark *,
html.pf-v5-theme-dark *::before,
html.pf-v5-theme-dark *::after {
  /* Override ALL PatternFly v5 dark theme variables with light theme colors */
  --pf-v5-global--BackgroundColor--100: var(--rome-background) !important;
  --pf-v5-global--BackgroundColor--200: var(--rome-card-bg) !important;
  --pf-v5-global--BackgroundColor--300: var(--rome-background) !important;
  --pf-v5-global--Color--100: var(--rome-primary-dark) !important;
  --pf-v5-global--Color--200: var(--rome-secondary) !important;
  --pf-v5-global--Color--300: var(--rome-primary) !important;
  --pf-v5-global--BorderColor--100: var(--rome-border) !important;
  --pf-v5-global--BorderColor--200: var(--rome-border) !important;
  --pf-v5-global--BorderColor--300: var(--rome-border) !important;
  --pf-v5-global--primary-color--100: var(--rome-primary) !important;
  --pf-v5-global--primary-color--200: var(--rome-primary-dark) !important;
  --pf-v5-global--link--Color: var(--rome-primary) !important;
  --pf-v5-global--link--Color--hover: var(--rome-primary-dark) !important;
  --pf-v5-global--active-color--100: var(--rome-primary) !important;
  --pf-v5-global--active-color--200: var(--rome-primary-dark) !important;
  --pf-v5-global--disabled-color--100: var(--rome-disabled) !important;
  --pf-v5-global--disabled-color--200: var(--rome-disabled) !important;
}

/* Force light color scheme and remove dark backgrounds */
html.pf-v5-theme-dark {
  color-scheme: light !important;
  background: var(--rome-background) !important;
}

html.pf-v5-theme-dark body {
  background: var(--rome-background) !important;
  color: var(--rome-primary-dark) !important;
}

/* Custom Favicon - Multiple approaches for maximum compatibility */
link[rel*="icon"],
link[rel="shortcut icon"],
link[rel="apple-touch-icon"] {
  content: url("../img/favicon.ico") !important;
}

/* Inject favicon via JavaScript-like CSS (for browsers that support it) */
head::before {
  content: "";
  background-image: url("../img/favicon.ico");
}

/* Custom Logo in Header/Brand Area - PatternFly v5 */
.pf-v5-c-masthead__brand img,
.keycloak__pageheader_brand,
[class*="masthead"] img[class*="brand"],
[class*="brand"] img {
  display: block !important;
  max-height: 40px !important;
  height: auto !important;
  width: auto !important;
  max-width: 200px !important;
  min-width: 120px !important;
  object-fit: contain !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Ensure logo container is visible and has explicit dimensions */
.pf-v5-c-masthead__brand,
a[class*="brand"] {
  display: flex !important;
  align-items: center !important;
  min-height: 40px !important;
  min-width: 120px !important;
  width: auto !important;
}

/* Force SVG to render even with width="100%" */
.keycloak__pageheader_brand[src$=".svg"],
.pf-v5-c-masthead__brand img[src$=".svg"] {
  width: 150px !important;
  height: 40px !important;
  object-fit: contain !important;
}

/* Legacy PatternFly v4 support (if needed) */
.pf-c-page__header-brand-link::before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  background-image: url("../img/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 0.5rem;
  vertical-align: middle;
}

/* Global Styles - Target root and body for maximum coverage */
:root,
#app,
#root {
  --rome-primary: #374151;
  --rome-primary-dark: #1f2937;
  --rome-secondary: #6b7280;
  --rome-border: #e5e7eb;
  --rome-background: #f8fafc;
  --rome-card-bg: #ffffff;
  --rome-error: #dc2626;
  --rome-error-bg: #fef2f2;
  --rome-disabled: #9ca3af;
}

/* Base Typography - More specific selectors */
body,
html,
#app,
#root,
[data-ouia-component-type] {
  font-family:
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;
}

/* Remove test indicator - theme is confirmed loading */

/* Force light theme - override dark mode (PatternFly v5) */
html.pf-v5-theme-dark,
html.pf-v5-theme-dark body,
html.pf-v5-theme-dark #app,
html.pf-v5-theme-dark #root,
html.pf-v5-theme-dark [data-ouia-page-id] {
  background: var(--rome-background) !important;
  color: var(--rome-primary-dark) !important;
}

/* Override dark mode background colors - PatternFly v5 classes */
html.pf-v5-theme-dark .pf-v5-c-page,
html.pf-v5-theme-dark .pf-v5-c-page__main,
html.pf-v5-theme-dark .pf-v5-c-page__main-section,
html.pf-v5-theme-dark [class*="pf-v5-c-page"] {
  background: var(--rome-background) !important;
  color: var(--rome-primary-dark) !important;
}

/* Header/Navigation Styling - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-masthead,
html.pf-v5-theme-dark .pf-v5-c-page__header,
html.pf-v5-theme-dark header,
html.pf-v5-theme-dark [class*="masthead"],
html.pf-v5-theme-dark [class*="pf-v5-c-masthead"] {
  background: var(--rome-card-bg) !important;
  border-bottom: 1px solid var(--rome-border) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  color: var(--rome-primary-dark) !important;
}

.pf-c-page__header-brand-link {
  padding: 1rem 1.5rem !important;
}

/* Sidebar Navigation - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-nav,
html.pf-v5-theme-dark .pf-v5-c-nav__list,
html.pf-v5-theme-dark .pf-v5-c-nav__item,
html.pf-v5-theme-dark .pf-v5-c-page__sidebar {
  background: var(--rome-card-bg) !important;
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-nav__link {
  color: var(--rome-secondary) !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
}

html.pf-v5-theme-dark .pf-v5-c-nav__link:hover {
  background: var(--rome-background) !important;
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-nav__link.pf-m-current,
html.pf-v5-theme-dark .pf-v5-c-nav__link.pf-m-current:hover {
  background: var(--rome-primary) !important;
  color: white !important;
}

/* Main Content Area - PatternFly v5 - Force light background */
html.pf-v5-theme-dark .pf-v5-c-page__main,
html.pf-v5-theme-dark .pf-v5-c-page__main-section,
html.pf-v5-theme-dark main,
html.pf-v5-theme-dark [class*="pf-v5-c-page__main"] {
  background: var(--rome-background) !important;
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-page__main-section {
  padding: 2rem !important;
}

/* Override any dark mode text colors - PatternFly v5 */
html.pf-v5-theme-dark p,
html.pf-v5-theme-dark span,
html.pf-v5-theme-dark div,
html.pf-v5-theme-dark h1,
html.pf-v5-theme-dark h2,
html.pf-v5-theme-dark h3,
html.pf-v5-theme-dark h4,
html.pf-v5-theme-dark h5,
html.pf-v5-theme-dark h6,
html.pf-v5-theme-dark label,
html.pf-v5-theme-dark input,
html.pf-v5-theme-dark textarea,
html.pf-v5-theme-dark select,
html.pf-v5-theme-dark [class*="pf-v5-c-form__label"] {
  color: var(--rome-primary-dark) !important;
}

/* Cards and Panels - PatternFly v5 - Force white backgrounds */
html.pf-v5-theme-dark .pf-v5-c-card,
html.pf-v5-theme-dark .pf-v5-c-panel,
html.pf-v5-theme-dark .pf-v5-c-data-list__item,
html.pf-v5-theme-dark [class*="pf-v5-c-card"],
html.pf-v5-theme-dark [class*="pf-v5-c-panel"] {
  background: var(--rome-card-bg) !important;
  border: 1px solid var(--rome-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
  padding: 1.5rem !important;
  margin-bottom: 1.5rem !important;
  color: var(--rome-primary-dark) !important;
}

/* Card Headers and Titles - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-card__header,
html.pf-v5-theme-dark [class*="pf-v5-c-card__header"] {
  border-bottom: 1px solid var(--rome-border) !important;
  padding-bottom: 1rem !important;
  margin-bottom: 1rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-card__title,
html.pf-v5-theme-dark [class*="pf-v5-c-card__title"],
html.pf-v5-theme-dark h1,
html.pf-v5-theme-dark h2,
html.pf-v5-theme-dark h3 {
  color: var(--rome-primary-dark) !important;
  font-weight: 700 !important;
}

/* Buttons - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-button,
html.pf-v5-theme-dark button[class*="pf-v5-c-button"] {
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
  text-transform: none !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-primary,
html.pf-v5-theme-dark button[class*="pf-v5-c-button"].pf-m-primary {
  background: var(--rome-primary) !important;
  border: none !important;
  color: white !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-primary:hover {
  background: var(--rome-primary-dark) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-secondary {
  background: transparent !important;
  border: 2px solid var(--rome-border) !important;
  color: var(--rome-primary) !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-secondary:hover {
  border-color: var(--rome-primary) !important;
  background: var(--rome-background) !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-danger {
  background: var(--rome-error) !important;
  border: none !important;
  color: white !important;
}

html.pf-v5-theme-dark .pf-v5-c-button.pf-m-danger:hover {
  background: #b91c1c !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25) !important;
}

html.pf-v5-theme-dark .pf-v5-c-button:disabled {
  background: var(--rome-disabled) !important;
  color: white !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Form Inputs - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-form-control,
html.pf-v5-theme-dark input[class*="pf-v5-c-form-control"],
html.pf-v5-theme-dark textarea[class*="pf-v5-c-form-control"],
html.pf-v5-theme-dark select[class*="pf-v5-c-form-control"] {
  border: 2px solid var(--rome-border) !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  background: var(--rome-card-bg) !important;
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-form-control:focus {
  border-color: var(--rome-primary) !important;
  box-shadow: 0 0 0 3px rgba(55, 65, 81, 0.1) !important;
  outline: none !important;
}

html.pf-v5-theme-dark .pf-v5-c-form-control:hover {
  border-color: var(--rome-secondary) !important;
}

/* Labels - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-form__label,
html.pf-v5-theme-dark label[class*="pf-v5-c-form__label"] {
  color: var(--rome-primary) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-bottom: 0.5rem !important;
}

/* Tables - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-table,
html.pf-v5-theme-dark table[class*="pf-v5-c-table"] {
  background: var(--rome-card-bg) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

html.pf-v5-theme-dark .pf-v5-c-table thead {
  background: var(--rome-background) !important;
}

html.pf-v5-theme-dark .pf-v5-c-table th {
  color: var(--rome-primary) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 1rem !important;
  border-bottom: 2px solid var(--rome-border) !important;
}

html.pf-v5-theme-dark .pf-v5-c-table td {
  padding: 1rem !important;
  border-bottom: 1px solid var(--rome-border) !important;
  color: var(--rome-primary-dark) !important;
}

/* Table row hover - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-table tbody tr:hover {
  background: var(--rome-background) !important;
}

/* Alerts and Notifications - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-alert,
html.pf-v5-theme-dark [class*="pf-v5-c-alert"] {
  border-radius: 8px !important;
  padding: 1rem 1.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-alert.pf-m-danger {
  background: var(--rome-error-bg) !important;
  border: 1px solid #fecaca !important;
  color: var(--rome-error) !important;
}

html.pf-v5-theme-dark .pf-v5-c-alert.pf-m-success {
  background: #f0fdf4 !important;
  border: 1px solid #86efac !important;
  color: #166534 !important;
}

html.pf-v5-theme-dark .pf-v5-c-alert.pf-m-warning {
  background: #fffbeb !important;
  border: 1px solid #fde68a !important;
  color: #92400e !important;
}

html.pf-v5-theme-dark .pf-v5-c-alert.pf-m-info {
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  color: #1e40af !important;
}

/* Badges and Labels - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-badge,
html.pf-v5-theme-dark .pf-v5-c-label {
  border-radius: 6px !important;
  font-weight: 500 !important;
  padding: 0.25rem 0.75rem !important;
  font-size: 0.75rem !important;
}

/* Dropdowns and Selects - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-dropdown__menu,
html.pf-v5-theme-dark .pf-v5-c-menu,
html.pf-v5-theme-dark [class*="pf-v5-c-menu"] {
  background: var(--rome-card-bg) !important;
  border: 1px solid var(--rome-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
  padding: 0.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-menu__list-item,
html.pf-v5-theme-dark [class*="pf-v5-c-menu__list-item"] {
  border-radius: 6px !important;
  padding: 0.75rem 1rem !important;
  transition: all 0.2s ease !important;
}

html.pf-v5-theme-dark .pf-v5-c-menu__list-item:hover {
  background: var(--rome-background) !important;
}

/* Tabs - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-tabs__list {
  border-bottom: 2px solid var(--rome-border) !important;
}

html.pf-v5-theme-dark .pf-v5-c-tabs__link {
  font-weight: 500 !important;
  color: var(--rome-secondary) !important;
  transition: all 0.2s ease !important;
}

html.pf-v5-theme-dark .pf-v5-c-tabs__link:hover {
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-tabs__item.pf-m-current .pf-v5-c-tabs__link {
  color: var(--rome-primary) !important;
  border-bottom: 2px solid var(--rome-primary) !important;
}

/* Checkboxes and Radio Buttons - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-check,
html.pf-v5-theme-dark .pf-v5-c-radio,
html.pf-v5-theme-dark .pf-v5-c-switch {
  margin: 0.5rem 0 !important;
}

html.pf-v5-theme-dark .pf-v5-c-check__label,
html.pf-v5-theme-dark .pf-v5-c-radio__label,
html.pf-v5-theme-dark .pf-v5-c-switch__label {
  color: var(--rome-primary-dark) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
}

input[type="checkbox"],
input[type="radio"] {
  width: 1.125rem !important;
  height: 1.125rem !important;
  border: 2px solid var(--rome-border) !important;
  border-radius: 4px !important;
  transition: all 0.2s ease !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background: var(--rome-primary) !important;
  border-color: var(--rome-primary) !important;
}

/* Links - PatternFly v5 */
html.pf-v5-theme-dark a,
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-link {
  color: var(--rome-primary) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  transition: color 0.2s ease !important;
}

html.pf-v5-theme-dark a:hover,
html.pf-v5-theme-dark .pf-v5-c-button.pf-m-link:hover {
  color: var(--rome-primary-dark) !important;
  text-decoration: underline !important;
}

/* Breadcrumbs - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-breadcrumb {
  margin-bottom: 1.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-breadcrumb__item {
  color: var(--rome-secondary) !important;
  font-size: 0.875rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-breadcrumb__item a {
  color: var(--rome-secondary) !important;
}

html.pf-v5-theme-dark .pf-v5-c-breadcrumb__item a:hover {
  color: var(--rome-primary) !important;
}

/* Toolbar - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-toolbar {
  background: var(--rome-card-bg) !important;
  border: 1px solid var(--rome-border) !important;
  border-radius: 8px !important;
  padding: 1rem 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

/* Empty States - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-empty-state {
  padding: 3rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-empty-state__body {
  color: var(--rome-secondary) !important;
}

/* Loading States - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-spinner {
  color: var(--rome-primary) !important;
}

/* Modal/Drawer - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-modal-box,
html.pf-v5-theme-dark .pf-v5-c-drawer__panel {
  background: var(--rome-card-bg) !important;
  border-radius: 16px !important;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
}

html.pf-v5-theme-dark .pf-v5-c-modal-box__header {
  border-bottom: 1px solid var(--rome-border) !important;
  padding: 1.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-modal-box__title {
  color: var(--rome-primary-dark) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
}

html.pf-v5-theme-dark .pf-v5-c-modal-box__body {
  padding: 1.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-modal-box__footer {
  border-top: 1px solid var(--rome-border) !important;
  padding: 1.5rem !important;
}

/* Data List - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-data-list__item-content {
  padding: 1.5rem !important;
}

html.pf-v5-theme-dark .pf-v5-c-data-list__item-row {
  border-bottom: 1px solid var(--rome-border) !important;
}

html.pf-v5-theme-dark .pf-v5-c-data-list__item-row:last-child {
  border-bottom: none !important;
}

/* Wizard - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-wizard__nav {
  background: var(--rome-background) !important;
  border-right: 1px solid var(--rome-border) !important;
}

html.pf-v5-theme-dark .pf-v5-c-wizard__nav-link {
  color: var(--rome-secondary) !important;
  font-weight: 500 !important;
  padding: 1rem 1.5rem !important;
  border-radius: 8px !important;
  margin: 0.25rem !important;
  transition: all 0.2s ease !important;
}

html.pf-v5-theme-dark .pf-v5-c-wizard__nav-link:hover {
  background: var(--rome-card-bg) !important;
  color: var(--rome-primary-dark) !important;
}

html.pf-v5-theme-dark .pf-v5-c-wizard__nav-link.pf-m-current {
  background: var(--rome-primary) !important;
  color: white !important;
}

/* Helper Text - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-form__helper-text {
  color: var(--rome-secondary) !important;
  font-size: 0.875rem !important;
  margin-top: 0.5rem !important;
}

/* Required Indicator - PatternFly v5 */
html.pf-v5-theme-dark .pf-v5-c-form__label-required {
  color: var(--rome-error) !important;
}

/* Scrollbar Styling (Webkit browsers) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--rome-background);
}

::-webkit-scrollbar-thumb {
  background: var(--rome-border);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--rome-secondary);
}

/* Responsive adjustments - PatternFly v5 */
@media (max-width: 768px) {
  html.pf-v5-theme-dark .pf-v5-c-page__main-section {
    padding: 1rem !important;
  }

  html.pf-v5-theme-dark .pf-v5-c-card,
  html.pf-v5-theme-dark .pf-v5-c-panel {
    padding: 1rem !important;
    border-radius: 12px !important;
  }
}

/* Additional comprehensive overrides for all PatternFly v5 components */
html.pf-v5-theme-dark .pf-v5-c-content,
html.pf-v5-theme-dark .pf-v5-c-form,
html.pf-v5-theme-dark .pf-v5-c-form__group,
html.pf-v5-theme-dark .pf-v5-l-flex,
html.pf-v5-theme-dark .pf-v5-l-level {
  color: var(--rome-primary-dark) !important;
}

/* Override any remaining dark backgrounds */
html.pf-v5-theme-dark [style*="background"],
html.pf-v5-theme-dark [style*="background-color"] {
  /* Let CSS variables handle it */
}

/* Force light backgrounds on common containers */
html.pf-v5-theme-dark .pf-v5-c-page__main-section.pf-m-light {
  background: var(--rome-background) !important;
}