/* ==========================================================================
   Junovy Design System - Keycloak Account Theme
   ========================================================================== */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@400;500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');

/* --------------------------------------------------------------------------
   CSS Custom Properties (Design Tokens)
   -------------------------------------------------------------------------- */
:root {
  /* Brand colors */
  --junovy-primary: #613f75;
  --junovy-primary-light: #7d5a91;
  --junovy-primary-dark: #4a2f5a;
  --junovy-secondary: #7d82b8;
  --junovy-secondary-light: #9da1d0;
  --junovy-accent: #e8b4bc;
  --junovy-accent-light: #f5d5da;

  /* Light mode (default) */
  --bg-primary: #ffffff;
  --bg-secondary: #f8f7fc;
  --bg-tertiary: #f0eef5;
  --bg-card: #ffffff;
  --bg-nav: rgba(255, 255, 255, 0.95);

  --text-primary: #1a1625;
  --text-secondary: #524b5e;
  --text-muted: #7a7489;
  --text-inverse: #ffffff;

  --border-light: #e8e5f0;
  --border-medium: #d4d0e0;

  --shadow-sm: 0 2px 8px rgba(97, 63, 117, 0.06);
  --shadow-md: 0 4px 20px rgba(97, 63, 117, 0.1);
  --shadow-lg: 0 8px 40px rgba(97, 63, 117, 0.15);

  --transition-fast: 0.15s ease;
  --transition-medium: 0.3s ease;

  /* Typography */
  --font-heading: 'Darker Grotesque', sans-serif;
  --font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Dark mode */
.pf-v5-theme-dark,
html[class*="pf-v5-theme-dark"] {
  --bg-primary: #0f0d13;
  --bg-secondary: #171420;
  --bg-tertiary: #1f1b29;
  --bg-card: #1a1725;
  --bg-nav: rgba(15, 13, 19, 0.95);

  --text-primary: #f5f3f8;
  --text-secondary: #b8b3c4;
  --text-muted: #7a7489;

  --border-light: #2a2636;
  --border-medium: #3d3650;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.4);
}

/* --------------------------------------------------------------------------
   Base Styles
   -------------------------------------------------------------------------- */
html, body {
  font-family: var(--font-body);
  background: var(--bg-primary) !important;
  color: var(--text-primary);
}

/* Override PatternFly dark theme defaults */
.pf-v5-theme-dark,
html.pf-v5-theme-dark {
  --pf-v5-global--BackgroundColor--100: var(--bg-primary) !important;
  --pf-v5-global--BackgroundColor--200: var(--bg-secondary) !important;
  --pf-v5-global--BackgroundColor--dark-100: var(--bg-primary) !important;
  --pf-v5-global--BackgroundColor--dark-200: var(--bg-secondary) !important;
  --pf-v5-global--BackgroundColor--dark-300: var(--bg-tertiary) !important;
}

/* --------------------------------------------------------------------------
   Masthead / Header
   -------------------------------------------------------------------------- */
.pf-v5-c-masthead,
.pf-v5-c-masthead__main,
.pf-v5-c-masthead__content,
.pf-v5-c-masthead__toggle,
.pf-v5-c-masthead__brand,
.pf-v5-c-masthead > *,
.pf-v5-c-masthead::before,
.pf-v5-c-masthead::after,
header.pf-v5-c-masthead,
[class*="pf-v5-c-masthead"],
.pf-v5-c-toolbar,
.pf-v5-c-toolbar__content,
.pf-v5-c-toolbar__content-section,
.pf-v5-c-toolbar__group,
.pf-v5-c-toolbar__item,
.pf-v5-c-masthead .pf-v5-c-toolbar,
.pf-v5-c-masthead .pf-v5-c-toolbar__content {
  background: var(--bg-secondary) !important;
  background-color: var(--bg-secondary) !important;
}

.pf-v5-c-masthead {
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-light) !important;
  /* Ensure no gaps show different color */
  gap: 0 !important;
}

/* Also set the page header wrapper */
.pf-v5-c-page__header,
.pf-v5-c-page > header {
  background: var(--bg-secondary) !important;
}

/* Logo in header */
.pf-v5-c-masthead__brand img,
.pf-v5-c-brand img {
  height: 36px;
  width: auto;
  /* Show regular logo in light mode - use relative path from css/ folder */
  content: url('../LandscapeLogo.svg');
}

/* Dark mode: switch to white logo */
.pf-v5-theme-dark .pf-v5-c-masthead__brand img,
.pf-v5-theme-dark .pf-v5-c-brand img,
html[class*="pf-v5-theme-dark"] .pf-v5-c-masthead__brand img,
html[class*="pf-v5-theme-dark"] .pf-v5-c-brand img {
  content: url('../LandscapeWhiteLogo.svg');
}

/* User dropdown in header */
.pf-v5-c-masthead__content .pf-v5-c-menu-toggle {
  font-family: var(--font-body);
  font-weight: 500;
}

/* --------------------------------------------------------------------------
   Page Sidebar / Navigation
   -------------------------------------------------------------------------- */
.pf-v5-c-page__sidebar {
  background: var(--bg-secondary) !important;
  border-right: 1px solid var(--border-light) !important;
}

.pf-v5-c-page__sidebar-body {
  background: var(--bg-secondary) !important;
}

/* Navigation container */
.pf-v5-c-nav {
  background: transparent !important;
}

.pf-v5-c-nav__link {
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--text-secondary);
  border-radius: 8px;
  margin: 0 0.5rem;
  transition: all var(--transition-fast);
}

.pf-v5-c-nav__link:hover {
  background: var(--bg-tertiary);
  color: var(--text-primary);
}

.pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-nav__item.pf-m-current > .pf-v5-c-nav__link {
  background: var(--junovy-primary);
  color: var(--text-inverse);
}

.pf-v5-c-nav__link.pf-m-current:hover,
.pf-v5-c-nav__item.pf-m-current > .pf-v5-c-nav__link:hover {
  background: var(--junovy-primary-light);
}

/* --------------------------------------------------------------------------
   Page Content
   -------------------------------------------------------------------------- */
.pf-v5-c-page__main {
  background: var(--bg-primary) !important;
}

.pf-v5-c-page__main-section {
  background: var(--bg-primary) !important;
}

/* Page wrapper */
.pf-v5-c-page {
  background: var(--bg-primary) !important;
}

/* Page titles */
.pf-v5-c-title,
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--text-primary);
}

.pf-v5-c-title.pf-m-xl,
.pf-v5-c-title.pf-m-2xl,
.pf-v5-c-title.pf-m-3xl {
  font-weight: 700;
}

/* --------------------------------------------------------------------------
   Form Elements
   -------------------------------------------------------------------------- */
.pf-v5-c-form__label-text {
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--text-primary);
}

.pf-v5-c-form-control {
  background: var(--bg-primary);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  font-family: var(--font-body);
  color: var(--text-primary);
  transition: all var(--transition-fast);
}

.pf-v5-c-form-control:focus,
.pf-v5-c-form-control:focus-within {
  border-color: var(--junovy-primary);
  box-shadow: 0 0 0 3px rgba(97, 63, 117, 0.15);
  outline: none;
}

.pf-v5-theme-dark .pf-v5-c-form-control {
  background: var(--bg-tertiary);
  border-color: var(--border-light);
  color: var(--text-primary);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.pf-v5-c-button.pf-m-primary {
  background: var(--junovy-primary);
  color: var(--text-inverse);
  font-family: var(--font-body);
  font-weight: 600;
  border-radius: 10px;
  border: none;
  transition: all var(--transition-fast);
}

.pf-v5-c-button.pf-m-primary:hover {
  background: var(--junovy-primary-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.pf-v5-c-button.pf-m-secondary {
  background: transparent;
  color: var(--junovy-primary);
  border: 1px solid var(--junovy-primary);
  font-family: var(--font-body);
  font-weight: 600;
  border-radius: 10px;
  transition: all var(--transition-fast);
}

.pf-v5-c-button.pf-m-secondary:hover {
  background: var(--junovy-primary);
  color: var(--text-inverse);
}

.pf-v5-c-button.pf-m-link {
  color: var(--junovy-primary);
  font-weight: 500;
}

.pf-v5-c-button.pf-m-link:hover {
  color: var(--junovy-primary-light);
}

/* Dark mode buttons */
.pf-v5-theme-dark .pf-v5-c-button.pf-m-secondary {
  color: var(--junovy-secondary-light);
  border-color: var(--junovy-secondary-light);
}

.pf-v5-theme-dark .pf-v5-c-button.pf-m-secondary:hover {
  background: var(--junovy-secondary);
  color: var(--text-inverse);
}

.pf-v5-theme-dark .pf-v5-c-button.pf-m-link {
  color: var(--junovy-secondary-light);
}

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
.pf-v5-c-card {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 16px;
  box-shadow: var(--shadow-sm);
  transition: all var(--transition-medium);
}

.pf-v5-c-card:hover {
  border-color: var(--junovy-secondary);
  box-shadow: var(--shadow-md);
}

.pf-v5-theme-dark .pf-v5-c-card {
  background: var(--bg-card);
  border-color: var(--border-light);
}

/* --------------------------------------------------------------------------
   Dropdowns, Menus & Select Components
   -------------------------------------------------------------------------- */
.pf-v5-c-menu,
.pf-v5-c-dropdown__menu,
.pf-v5-c-select__menu,
.pf-v5-c-menu-toggle__menu {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: 8px !important;
  box-shadow: var(--shadow-lg) !important;
}

.pf-v5-theme-dark .pf-v5-c-menu,
.pf-v5-theme-dark .pf-v5-c-dropdown__menu,
.pf-v5-theme-dark .pf-v5-c-select__menu {
  background: var(--bg-tertiary) !important;
  border-color: var(--border-medium) !important;
}

/* Menu items */
.pf-v5-c-menu__item,
.pf-v5-c-dropdown__menu-item,
.pf-v5-c-select__menu-item {
  color: var(--text-primary) !important;
  transition: all var(--transition-fast) !important;
}

.pf-v5-c-menu__item:hover,
.pf-v5-c-dropdown__menu-item:hover,
.pf-v5-c-select__menu-item:hover,
.pf-v5-c-menu__list-item:hover {
  background: var(--junovy-primary) !important;
  color: var(--text-inverse) !important;
}

.pf-v5-c-menu__item:focus,
.pf-v5-c-dropdown__menu-item:focus,
.pf-v5-c-select__menu-item:focus {
  background: var(--junovy-primary) !important;
  color: var(--text-inverse) !important;
}

/* Menu item text */
.pf-v5-c-menu__item-text {
  color: inherit !important;
}

/* Remove default blue accent line on menus */
.pf-v5-c-menu::before,
.pf-v5-c-menu::after,
.pf-v5-c-dropdown__menu::before,
.pf-v5-c-dropdown__menu::after,
.pf-v5-c-select__menu::before,
.pf-v5-c-select__menu::after,
.pf-v5-c-menu__content::before,
.pf-v5-c-menu__content::after,
.pf-v5-c-menu-content::before,
.pf-v5-c-menu-content::after,
[class*="pf-v5-c-menu"]::before,
[class*="pf-v5-c-menu"]::after {
  display: none !important;
  background: transparent !important;
  border: none !important;
  content: none !important;
}

/* Override PatternFly menu CSS variable for accent color */
.pf-v5-c-menu,
.pf-v5-c-dropdown__menu,
.pf-v5-c-select__menu {
  --pf-v5-c-menu--m-flyout--top-offset: 0 !important;
  --pf-v5-c-menu__content--before--BorderTopColor: transparent !important;
  --pf-v5-c-menu__content--before--BorderTopWidth: 0 !important;
}

/* Remove top accent line via border-top color */
.pf-v5-c-menu__content,
.pf-v5-c-menu-content,
.pf-v5-c-menu__list {
  border-top: none !important;
}

/* Override any box-shadow that might appear as a line */
.pf-v5-c-menu,
.pf-v5-c-dropdown__menu {
  box-shadow: var(--shadow-lg) !important;
}

/* Menu toggle buttons */
.pf-v5-c-menu-toggle,
.pf-v5-c-dropdown__toggle,
.pf-v5-c-select__toggle {
  border-color: var(--border-light) !important;
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

.pf-v5-theme-dark .pf-v5-c-menu-toggle,
.pf-v5-theme-dark .pf-v5-c-dropdown__toggle,
.pf-v5-theme-dark .pf-v5-c-select__toggle {
  background: var(--bg-tertiary) !important;
  border-color: var(--border-medium) !important;
}

.pf-v5-c-menu-toggle:hover,
.pf-v5-c-dropdown__toggle:hover,
.pf-v5-c-select__toggle:hover {
  border-color: var(--junovy-primary) !important;
}

.pf-v5-c-menu-toggle:focus,
.pf-v5-c-menu-toggle:active,
.pf-v5-c-dropdown__toggle:focus,
.pf-v5-c-select__toggle:focus {
  border-color: var(--junovy-primary) !important;
  box-shadow: 0 0 0 1px var(--junovy-primary) !important;
}

/* Menu toggle button text and icon colors */
.pf-v5-c-menu-toggle__text,
.pf-v5-c-dropdown__toggle-text {
  color: var(--text-primary) !important;
}

.pf-v5-c-menu-toggle__icon,
.pf-v5-c-dropdown__toggle-icon {
  color: var(--text-secondary) !important;
}

/* User dropdown in header */
.pf-v5-c-masthead .pf-v5-c-menu-toggle,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle {
  background: transparent !important;
  border-color: var(--border-light) !important;
}

.pf-v5-c-masthead .pf-v5-c-menu-toggle:hover,
.pf-v5-c-masthead .pf-v5-c-dropdown__toggle:hover {
  background: rgba(97, 63, 117, 0.2) !important;
  border-color: var(--junovy-primary) !important;
}

/* Selected/checked menu items */
.pf-v5-c-menu__item.pf-m-selected,
.pf-v5-c-select__menu-item.pf-m-selected {
  background: rgba(97, 63, 117, 0.15) !important;
}

.pf-v5-c-menu__item.pf-m-selected::before,
.pf-v5-c-select__menu-item.pf-m-selected::before {
  background: var(--junovy-primary) !important;
}

/* Menu group titles */
.pf-v5-c-menu__group-title {
  color: var(--text-muted) !important;
  font-weight: 600 !important;
}

/* Menu list separator */
.pf-v5-c-menu__list-item + .pf-v5-c-menu__list-item {
  border-top-color: var(--border-light) !important;
}

/* Listbox for select options */
.pf-v5-c-menu.pf-m-scrollable {
  background: var(--bg-card) !important;
}

.pf-v5-theme-dark .pf-v5-c-menu.pf-m-scrollable {
  background: var(--bg-tertiary) !important;
}

/* --------------------------------------------------------------------------
   Alerts
   -------------------------------------------------------------------------- */
.pf-v5-c-alert {
  border-radius: 8px;
}

.pf-v5-c-alert.pf-m-danger {
  background: rgba(220, 53, 69, 0.1);
  border-left: 4px solid #dc3545;
}

.pf-v5-c-alert.pf-m-success {
  background: rgba(62, 134, 53, 0.1);
  border-left: 4px solid #3e8635;
}

.pf-v5-c-alert.pf-m-warning {
  background: rgba(240, 171, 0, 0.1);
  border-left: 4px solid #f0ab00;
}

.pf-v5-c-alert.pf-m-info {
  background: rgba(97, 63, 117, 0.1);
  border-left: 4px solid var(--junovy-primary);
}

/* --------------------------------------------------------------------------
   Data List / Tables
   -------------------------------------------------------------------------- */
.pf-v5-c-data-list {
  border-radius: 12px;
  overflow: hidden;
  background: var(--bg-card) !important;
  border: 1px solid var(--border-light) !important;
}

.pf-v5-c-data-list__item {
  border-color: var(--border-light) !important;
  background: var(--bg-card) !important;
}

.pf-v5-c-data-list__item:hover {
  background: var(--bg-tertiary) !important;
}

.pf-v5-c-data-list__item-row {
  background: transparent !important;
}

.pf-v5-c-data-list__item-content {
  color: var(--text-primary) !important;
}

.pf-v5-c-data-list__cell {
  color: var(--text-primary) !important;
}

/* Tables */
.pf-v5-c-table {
  font-family: var(--font-body);
  background: var(--bg-card) !important;
  border-radius: 12px !important;
  overflow: hidden;
}

.pf-v5-c-table thead,
.pf-v5-c-table__thead {
  background: var(--bg-secondary) !important;
}

.pf-v5-c-table thead tr,
.pf-v5-c-table__thead tr {
  background: var(--bg-secondary) !important;
}

.pf-v5-c-table th,
.pf-v5-c-table__th {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  font-weight: 600 !important;
  font-size: 0.8125rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.025em !important;
  border-bottom: 1px solid var(--border-light) !important;
  padding: 1rem 1.5rem !important;
}

.pf-v5-c-table tbody,
.pf-v5-c-table__tbody {
  background: var(--bg-card) !important;
}

.pf-v5-c-table tbody tr,
.pf-v5-c-table__tbody tr {
  background: var(--bg-card) !important;
  border-bottom: 1px solid var(--border-light) !important;
  transition: background var(--transition-fast) !important;
}

.pf-v5-c-table tbody tr:hover,
.pf-v5-c-table__tbody tr:hover {
  background: var(--bg-tertiary) !important;
}

.pf-v5-c-table tbody tr:last-child,
.pf-v5-c-table__tbody tr:last-child {
  border-bottom: none !important;
}

.pf-v5-c-table td,
.pf-v5-c-table__td {
  color: var(--text-primary) !important;
  padding: 1rem 1.5rem !important;
  border-bottom: none !important;
}

/* Table row expansion */
.pf-v5-c-table__expandable-row {
  background: var(--bg-tertiary) !important;
}

.pf-v5-c-table__expandable-row-content {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Table toggle button */
.pf-v5-c-table__toggle .pf-v5-c-button {
  color: var(--text-secondary) !important;
}

.pf-v5-c-table__toggle .pf-v5-c-button:hover {
  color: var(--junovy-primary) !important;
}

/* Sortable table headers */
.pf-v5-c-table__sort .pf-v5-c-table__button {
  color: var(--text-secondary) !important;
}

.pf-v5-c-table__sort .pf-v5-c-table__button:hover {
  color: var(--junovy-primary) !important;
}

.pf-v5-c-table__sort.pf-m-selected .pf-v5-c-table__button {
  color: var(--junovy-primary) !important;
}

/* Table action column */
.pf-v5-c-table__action {
  padding-right: 1rem !important;
}

/* --------------------------------------------------------------------------
   Labels / Chips / Badges
   -------------------------------------------------------------------------- */
.pf-v5-c-label,
.pf-v5-c-chip,
.pf-v5-c-badge {
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
}

/* Default/grey label */
.pf-v5-c-label {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-light) !important;
  padding: 0.25rem 0.75rem !important;
}

.pf-v5-c-label__content {
  color: inherit !important;
}

.pf-v5-c-label__icon {
  color: var(--text-secondary) !important;
}

/* Filled label variants */
.pf-v5-c-label.pf-m-purple,
.pf-v5-c-label.pf-m-purple.pf-m-filled {
  background: rgba(97, 63, 117, 0.15) !important;
  color: var(--junovy-primary-light) !important;
  border-color: rgba(97, 63, 117, 0.3) !important;
}

.pf-v5-c-label.pf-m-blue,
.pf-v5-c-label.pf-m-blue.pf-m-filled {
  background: rgba(125, 130, 184, 0.15) !important;
  color: var(--junovy-secondary-light) !important;
  border-color: rgba(125, 130, 184, 0.3) !important;
}

.pf-v5-c-label.pf-m-green,
.pf-v5-c-label.pf-m-green.pf-m-filled {
  background: rgba(62, 134, 53, 0.15) !important;
  color: #5cb85c !important;
  border-color: rgba(62, 134, 53, 0.3) !important;
}

.pf-v5-c-label.pf-m-red,
.pf-v5-c-label.pf-m-red.pf-m-filled {
  background: rgba(220, 53, 69, 0.15) !important;
  color: #ff6b6b !important;
  border-color: rgba(220, 53, 69, 0.3) !important;
}

.pf-v5-c-label.pf-m-orange,
.pf-v5-c-label.pf-m-orange.pf-m-filled,
.pf-v5-c-label.pf-m-gold,
.pf-v5-c-label.pf-m-gold.pf-m-filled {
  background: rgba(240, 171, 0, 0.15) !important;
  color: #f0ab00 !important;
  border-color: rgba(240, 171, 0, 0.3) !important;
}

.pf-v5-c-label.pf-m-cyan,
.pf-v5-c-label.pf-m-cyan.pf-m-filled {
  background: rgba(0, 168, 189, 0.15) !important;
  color: #00b8d4 !important;
  border-color: rgba(0, 168, 189, 0.3) !important;
}

/* Outline label variants */
.pf-v5-c-label.pf-m-outline {
  background: transparent !important;
}

/* Chips */
.pf-v5-c-chip {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-light) !important;
}

.pf-v5-c-chip__text {
  color: inherit !important;
}

.pf-v5-c-chip__icon {
  color: var(--text-secondary) !important;
}

.pf-v5-c-chip .pf-v5-c-button {
  color: var(--text-secondary) !important;
}

.pf-v5-c-chip .pf-v5-c-button:hover {
  color: var(--text-primary) !important;
}

/* Badges */
.pf-v5-c-badge {
  padding: 0.125rem 0.5rem !important;
}

.pf-v5-c-badge.pf-m-read {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.pf-v5-c-badge.pf-m-unread {
  background: var(--junovy-primary) !important;
  color: var(--text-inverse) !important;
}

/* --------------------------------------------------------------------------
   Panels / Description Lists
   -------------------------------------------------------------------------- */
.pf-v5-c-panel {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow-sm) !important;
}

.pf-v5-c-panel__header {
  background: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border-light) !important;
  padding: 1rem 1.5rem !important;
}

.pf-v5-c-panel__main {
  background: var(--bg-card) !important;
}

.pf-v5-c-panel__main-body {
  padding: 1.5rem !important;
  color: var(--text-primary) !important;
}

/* Description list (used in Device activity, Application details) */
.pf-v5-c-description-list {
  color: var(--text-primary) !important;
}

.pf-v5-c-description-list__term {
  color: var(--text-secondary) !important;
  font-weight: 600 !important;
  font-size: 0.8125rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.025em !important;
  margin-bottom: 0.25rem !important;
}

.pf-v5-c-description-list__description {
  color: var(--text-primary) !important;
}

.pf-v5-c-description-list__text {
  color: inherit !important;
}

/* Expandable section */
.pf-v5-c-expandable-section {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: 12px !important;
  margin-bottom: 1rem !important;
}

.pf-v5-c-expandable-section__toggle {
  background: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  padding: 1rem 1.5rem !important;
  border-radius: 12px !important;
}

.pf-v5-c-expandable-section.pf-m-expanded .pf-v5-c-expandable-section__toggle {
  border-radius: 12px 12px 0 0 !important;
  border-bottom: 1px solid var(--border-light) !important;
}

.pf-v5-c-expandable-section__toggle:hover {
  background: var(--bg-tertiary) !important;
}

.pf-v5-c-expandable-section__toggle-icon {
  color: var(--text-secondary) !important;
}

.pf-v5-c-expandable-section__content {
  background: var(--bg-card) !important;
  padding: 1.5rem !important;
  color: var(--text-primary) !important;
}

/* Card variations for panels */
.pf-v5-c-card__header {
  background: transparent !important;
  border-bottom: 1px solid var(--border-light) !important;
}

.pf-v5-c-card__title {
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
}

.pf-v5-c-card__body {
  color: var(--text-primary) !important;
}

/* Session/Device cards styling */
.pf-v5-c-card.pf-m-selectable {
  border: 1px solid var(--border-light) !important;
}

.pf-v5-c-card.pf-m-selectable:hover {
  border-color: var(--junovy-primary) !important;
}

.pf-v5-c-card.pf-m-selected {
  border-color: var(--junovy-primary) !important;
  box-shadow: 0 0 0 1px var(--junovy-primary) !important;
}

/* Current session badge */
.pf-v5-c-label.pf-m-compact {
  font-size: 0.75rem !important;
  padding: 0.125rem 0.5rem !important;
}

/* Application links */
.pf-v5-c-card a,
.pf-v5-c-panel a {
  color: var(--junovy-secondary-light) !important;
}

.pf-v5-c-card a:hover,
.pf-v5-c-panel a:hover {
  color: var(--junovy-primary-light) !important;
}

/* --------------------------------------------------------------------------
   Toolbar / Action Bars
   -------------------------------------------------------------------------- */
.pf-v5-c-toolbar {
  background: transparent !important;
}

.pf-v5-c-toolbar__content {
  background: transparent !important;
}

/* Pagination in toolbars */
.pf-v5-c-pagination {
  background: transparent !important;
}

.pf-v5-c-pagination__nav-control .pf-v5-c-button {
  color: var(--text-secondary) !important;
}

.pf-v5-c-pagination__nav-control .pf-v5-c-button:hover {
  color: var(--text-primary) !important;
  background: var(--bg-tertiary) !important;
}

.pf-v5-c-pagination__nav-control .pf-v5-c-button:disabled {
  color: var(--text-muted) !important;
  opacity: 0.5 !important;
}

/* --------------------------------------------------------------------------
   Avatar Section (Custom)
   -------------------------------------------------------------------------- */
#dds-avatar-section {
  margin-bottom: 1rem;
}

#dds-avatar-preview {
  border-color: var(--border-medium) !important;
}

/* --------------------------------------------------------------------------
   Focus & Accessibility
   -------------------------------------------------------------------------- */
:focus-visible {
  outline: 2px solid var(--junovy-primary);
  outline-offset: 2px;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .pf-v5-c-page__sidebar {
    width: 280px;
  }
}