@font-face {
    font-family: "Satoshi";
    font-style: normal;
    font-weight: 100 200 300 400 500 600 700 800 900;
    src: url("../fonts/Satoshi.woff2") format("woff2");
}

:root {
    --aireal-bg: #faf8f2;
    --aireal-border: #e9e4da;
    --aireal-orange: #f85e25;
    --aireal-orange-hover: #fc742b;
    --aireal-orange-light: #fdf0eb;
    --aireal-dark: #121214;
    --aireal-muted: #6b6b6b;
    --aireal-white: #ffffff;
    --aireal-nav-background: #f4f1ea;

    /* PatternFly v5 token overrides */
    --pf-v5-global--FontFamily--sans-serif: "Satoshi", sans-serif;
    --pf-v5-global--FontFamily--heading: "Satoshi", sans-serif;
    --pf-v5-global--FontFamily--heading--sans-serif: "Satoshi", sans-serif;
    --pf-v5-global--FontFamily--monospace: "Satoshi", monospace;
    --pf-v5-global--primary-color--100: var(--aireal-orange);
    --pf-v5-global--primary-color--200: var(--aireal-orange-hover);
    --pf-v5-global--link--Color: var(--aireal-orange);
    --pf-v5-global--link--Color--hover: var(--aireal-orange-hover);
    --pf-v5-global--Color--100: var(--aireal-dark);
    --pf-v5-c-page--BackgroundColor: var(--aireal-bg);
    --pf-v5-c-masthead--BackgroundColor: var(--aireal-bg);
    --pf-v5-c-page__sidebar--BackgroundColor: var(--aireal-bg);
    --pf-v5-c-nav--BackgroundColor: transparent;
    --pf-v5-c-card--BackgroundColor: var(--aireal-white);
    --pf-v5-c-button--m-primary--BackgroundColor: var(--aireal-orange);
    --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--aireal-orange-hover);
    --pf-v5-c-button--m-primary--active--BackgroundColor: var(--aireal-orange-hover);
    --pf-v5-c-toolbar--BackgroundColor: transparent !important;
    --pf-v5-c-form-control--BackgroundColor: var(--aireal-white);
    --pf-v5-c-form-control--Color: var(--aireal-dark);
}

* {
    scrollbar-width: auto;
    scrollbar-color: var(--text) transparent
}

body, html {
    font-family: "Satoshi", sans-serif;
    background-color: var(--aireal-bg);
    color: var(--aireal-dark);
}

/* ── Masthead / Header ──────────────────────────────────────────── */
.pf-v5-c-masthead {
    background-color: var(--aireal-bg) !important;
    /* border-bottom: 1px solid var(--aireal-border) !important; */
    box-shadow: none !important;
    padding: 0 32px;
    min-height: 64px;
}

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

a[data-testid="applications"] {
    display: none;
}

dl.signed-in-device-grid > div:nth-child(3) {
    display: none;
}

@media (width >= 992px) {
    .pf-v5-c-description-list.pf-m-3-col-on-lg {
        --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count) !important;
    }
}

.pf-v5-c-page__header, .pf-v5-c-page>.pf-v5-c-masthead {
    padding: 8px 32px;
}

/* Logo — natural ratio is 185×49px, scale to fit header */
.pf-v5-c-masthead__brand img {
    height: 38px;
    width: auto;
    display: block;
}

.pf-v5-c-toolbar {
    background: transparent;
}

.pf-v5-c-nav__link:focus {
    background-color: transparent;
}

/* Hamburger toggle */
.pf-v5-c-masthead__toggle .pf-v5-c-button {
    color: var(--aireal-dark) !important;
}

.pf-v5-c-menu-toggle:before {
    color: var(--aireal-dark) !important;
    border-radius: 8px !important;
    border: 1px solid var(--aireal-border) !important;
}
.pf-v5-c-menu-toggle:after {
    border-block-end: 0;
}

.pf-v5-c-menu-toggle {
    border: 0 !important;
}

/* Email dropdown toggle — light header */
.pf-v5-c-menu-toggle:not(.pf-m-plain) {
    background: var(--aireal-white) !important;
    color: var(--aireal-dark) !important;
    border-radius: 8px !important;
    font-family: "Satoshi", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.pf-v5-c-menu-toggle:not(.pf-m-plain):hover {
    background: var(--aireal-bg) !important;
    /* border-color: #cdc8be !important; */
}
.pf-v5-c-menu-toggle:not(.pf-m-plain) svg {
    color: var(--aireal-muted) !important;
}

/* Kebab */
.pf-v5-c-menu-toggle.pf-m-plain {
    color: var(--aireal-muted) !important;
}
.pf-v5-c-menu-toggle.pf-m-plain:hover {
    color: var(--aireal-dark) !important;
    background: transparent !important;
}

/* Avatar */
.pf-v5-c-avatar {
    border: 2px solid var(--aireal-border) !important;
    border-radius: 50% !important;
}

/* ── Sidebar navigation ─────────────────────────────────────────── */
.pf-v5-c-page__sidebar {
    background-color: var(--aireal-nav-background) !important;
    border-right: none;
}

.pf-v5-c-page__sidebar-body {
    padding: 24px 16px;
}

/* Remove PF5 default item separators */
.pf-v5-c-nav__list {
    gap: 2px;
    display: flex;
    flex-direction: column;
    border: 0 !important;
}

.pf-v5-c-data-list__item {
    background-color: white !important;
    color: var(--aireal-dark);
    border-block-end: none !important;

    &:nth-child(even){
        background-color: rgb(250, 250, 250) !important;
    }
}

.pf-v5-c-data-list__item-row {
    padding-block: 8px !important;
    align-items: center !important;
}
.pf-v5-c-data-list__item-content {
    flex-direction: row !important;
    align-items: center !important;
    padding-block: 0 !important;
    gap: 16px;
}
.pf-v5-c-data-list__cell {
    padding-block: 0 !important;
}
.pf-v5-c-data-list__item-action {
    align-self: center !important;
    margin-block: 0 !important;
}

.pf-v5-c-data-list.pf-m-grid-md {
    border: 0;
}

:where(.pf-v5-theme-dark) .pf-v5-c-nav__link:before {
    border: 0;
}
.pf-v5-c-nav__item::before,
.pf-v5-c-nav__item + .pf-v5-c-nav__item {
    border-top: none !important;
}

.pf-v5-c-nav__link, .pf-v5-c-nav__link:hover, .pf-v5-c-nav__link:focus, .pf-v5-c-nav__link:active {
    text-decoration-color: transparent;
}
.pf-v5-c-nav__item .pf-v5-c-nav__link {
    color: var(--aireal-muted);
    border-radius: 10px;
    font-size: 0.9375rem;
    font-weight: 500;
    padding: 10px 16px;
    position: relative;
    transition: color 0.15s ease, background 0.15s ease;
    /* Remove PF5 left accent border */
    --pf-v5-c-nav__link--before--BorderLeftWidth: 0;
    --pf-v5-c-nav__link--m-current--before--BorderLeftColor: transparent;
}
.pf-v5-c-nav__item .pf-v5-c-nav__link:hover {
    color: var(--aireal-dark);
    background-color: transparent;
}
.pf-v5-c-nav__link:hover:after, .pf-v5-c-nav__link.pf-m-hover:after {
    border: 0;
}
.pf-v5-c-nav__item .pf-v5-c-nav__link.pf-m-current {
    color: var(--aireal-orange);
    background-color: transparent;
    font-weight: 600;
}
/* Orange left indicator on active item */
.pf-v5-c-nav__item .pf-v5-c-nav__link.pf-m-current::before {
    content: none;
}

/* Expandable nav item button */
.pf-v5-c-nav__item.pf-m-expandable > .pf-v5-c-nav__link {
    color: var(--aireal-muted);
}
.pf-v5-c-nav__item.pf-m-expandable > .pf-v5-c-nav__link:hover {
    color: var(--aireal-dark);
    background-color: transparent;
}
/* Expanded state — treat parent as active */
.pf-v5-c-nav__item.pf-m-expandable.pf-m-expanded > .pf-v5-c-nav__link {
    color: var(--aireal-dark);
    font-weight: 600;
}

.pf-v5-c-nav__item.pf-m-expandable::before {
    content: none;
}

/* Toggle chevron */
.pf-v5-c-nav__toggle-icon {
    color: var(--aireal-muted);
    transition: transform 0.2s ease;
}

/* Subnav indented items */
.pf-v5-c-nav__subnav {
    --pf-v5-c-nav__subnav--PaddingTop: 2px;
    --pf-v5-c-nav__subnav--PaddingBottom: 4px;
}
.pf-v5-c-nav__subnav .pf-v5-c-nav__link {
    padding-left: 28px !important;
    font-size: 0.875rem;
}

.pf-v5-c-nav__link.pf-m-current:after, .pf-v5-c-nav__link.pf-m-current:hover:after, .pf-v5-c-nav__item.pf-m-current:not(.pf-m-expanded) .pf-v5-c-nav__link:after {
    border-color: transparent;
}

/* ── Page background ────────────────────────────────────────────── */
.pf-v5-c-page__main,
.pf-v5-c-page__main-section,
.pf-v5-c-page__main-section.pf-m-light {
    background-color: var(--aireal-bg) !important;
}

/* ── Page heading ───────────────────────────────────────────────── */
.pf-v5-c-content h1.pf-v5-c-title {
    color: var(--aireal-dark);
    
    font-weight: 700;
    font-size: 36px;
    line-height: 1.15;
    margin: 0;
}
.pf-v5-c-content p {
    color: var(--aireal-muted);
    font-size: 0.9375rem;
    margin-top: 4px;
}

/* ── Form card ──────────────────────────────────────────────────── */
.pf-v5-c-form.pf-m-horizontal {
    background: var(--aireal-white);
    border-radius: 16px;
    padding: 36px 40px 32px;
}

/* ── Override horizontal layout → stack labels above inputs ─────── */
.pf-v5-c-form.pf-m-horizontal .pf-v5-c-form__group {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px;
    margin-bottom: 20px;
    --pf-v5-c-form--m-horizontal__group-label--md--GridColumnWidth: unset;
    --pf-v5-c-form--m-horizontal__group-control--md--GridColumnWidth: unset;
}
.pf-v5-c-form.pf-m-horizontal .pf-v5-c-form__group-label {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    grid-column: unset !important;
}
.pf-v5-c-form.pf-m-horizontal .pf-v5-c-form__group-control {
    width: 100% !important;
    max-width: 540px;
    grid-column: unset !important;
}
/* Keep actions row horizontal */
.pf-v5-c-form.pf-m-horizontal .pf-v5-c-form__group.pf-m-action {
    flex-direction: row !important;
    align-items: center;
}

/* ── Hide the jump-to-section panel ─────────────────────────────── */
/* It adds no value with a single section on the page */
.pf-v5-l-grid__item:has(.pf-v5-c-jump-links) {
    display: none !important;
}
/* Expand the form column to full width when nav is hidden */
.pf-v5-l-grid__item:has(.pf-v5-c-form__group),
.pf-v5-l-grid__item.pf-m-8-col-on-md {
    --pf-v5-l-grid--item--GridColumn: 1 / -1 !important;
    max-width: 100%;
}

/* ── Section headings (General, etc.) ──────────────────────────── */
.pf-v5-c-title.pf-m-xl {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--aireal-dark);
    letter-spacing: -0.01em;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--aireal-border);
    margin-bottom: 24px !important;
}

/* ── Form labels ────────────────────────────────────────────────── */
.pf-v5-c-form__label-text {
    color: var(--aireal-dark);
    font-weight: 600;
    font-size: 0.875rem;
}
.pf-v5-c-form__label-required {
    color: var(--aireal-orange);
}

/* ── Inputs ─────────────────────────────────────────────────────── */
.pf-v5-c-form-control {
    background-color: var(--aireal-white) !important;
    --pf-v5-c-form-control--BackgroundColor: var(--aireal-white) !important;
    border: 1.5px solid var(--aireal-border) !important;
    border-radius: 10px !important;
    font-family: "Satoshi", sans-serif;
    box-shadow: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pf-v5-c-form-control::before,
.pf-v5-c-form-control::after {
    display: none !important;
}
.pf-v5-c-form-control input,
.pf-v5-c-form-control textarea,
.pf-v5-c-form-control select {
    background-color: var(--aireal-white) !important;
    color: var(--aireal-dark) !important;
    font-family: "Satoshi", sans-serif;
    font-size: 0.9375rem;
    border: none !important;
    border-radius: 10px;
    box-shadow: none !important;
    padding: 12px 16px;
    height: 48px;
    line-height: 1.4;
}
.pf-v5-c-form-control input::placeholder {
    color: #c2bdb4;
    font-weight: 400;
}
.pf-v5-c-form-control:focus-within {
    border-color: var(--aireal-orange) !important;
    box-shadow: 0 0 0 3px rgba(248, 94, 37, 0.10) !important;
}

/* Disabled input */
.pf-v5-c-form-control.pf-m-disabled,
.pf-v5-c-form-control.pf-m-disabled input {
    background-color: #f4f0e8 !important;
    color: var(--aireal-muted) !important;
    border-color: var(--aireal-border) !important;
    cursor: not-allowed;
}

/* ── Buttons ────────────────────────────────────────────────────── */
.pf-v5-c-button.pf-m-primary, .pf-v5-c-button.pf-m-secondary, .pf-v5-c-button.pf-m-danger {
    border-radius: 10px;
    font-family: "Satoshi", sans-serif;
    font-weight: 600;
    font-size: 0.9375rem;
    padding: 0 28px;
    color: var(--aireal-white) !important;
    height: 48px;
    transition: background 0.15s ease;

    &:after {
        border: 0;
    }
}
.pf-v5-c-button.pf-m-danger {
    background-color: var(--aireal-orange);
}
.pf-v5-c-label__content {
    color: white !important;
}
.pf-v5-c-button.pf-m-primary, .pf-v5-c-button.pf-m-secondary {
    background-color: var(--aireal-orange) !important;
    border-color: var(--aireal-orange) !important;
}
.pf-v5-c-button.pf-m-primary:hover, .pf-v5-c-button.pf-m-secondary:hover {
    background-color: var(--aireal-orange-hover) !important;
    border-color: var(--aireal-orange-hover) !important;
}
.pf-v5-c-button.pf-m-link {
    color: var(--aireal-orange) !important;
    font-family: "Satoshi", sans-serif;
    font-weight: 500;
    font-size: 0.9375rem;
    padding: 0 16px;
    height: 48px;
    display: inline-flex;
    align-items: center;
}
.pf-v5-c-button.pf-m-link:hover {
    color: var(--aireal-orange-hover) !important;
    background-color: transparent !important;
    text-decoration: none;
}
.pf-v5-c-button.pf-m-link.pf-m-inline {
    display: flex;
}

/* Action row separator */
.pf-v5-c-form__group.pf-m-action {
    margin-top: 8px;
    padding-top: 24px;
    border-top: 1px solid var(--aireal-border);
    gap: 4px !important;
}

/* ── Cards ──────────────────────────────────────────────────────── */
.pf-v5-c-card {
    background-color: var(--aireal-white);
    border: 1px solid var(--aireal-border);
    border-radius: 12px;
    box-shadow: none;
}
.pf-v5-c-card__header {
    border-bottom: 1px solid var(--aireal-border);
}

/* ── Tabs ───────────────────────────────────────────────────────── */
.pf-v5-c-tabs__link.pf-m-current {
    color: var(--aireal-orange);
}
.pf-v5-c-tabs__link.pf-m-current::before {
    border-bottom-color: var(--aireal-orange) !important;
}

/* ── Checkbox / radio ───────────────────────────────────────────── */
.pf-v5-c-check__input,
.pf-v5-c-radio__input {
    accent-color: var(--aireal-orange);
}

/* ── Chip / label ───────────────────────────────────────────────── */
.pf-v5-c-label.pf-m-blue {
    --pf-v5-c-label--BackgroundColor: var(--aireal-orange-light);
    --pf-v5-c-label--Color: var(--aireal-orange);
    --pf-v5-c-label__icon--Color: var(--aireal-orange);
}

/* ── Dropdown menus ─────────────────────────────────────────────── */
.pf-v5-c-menu {
    background-color: var(--aireal-white) !important;
    border: 1px solid var(--aireal-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
    overflow: hidden;
}
.pf-v5-c-menu__item-text {
    color: var(--aireal-dark);
    font-family: "Satoshi", sans-serif;
    font-size: 0.9rem;
}
.pf-v5-c-menu__item:hover {
    background-color: var(--aireal-orange-light) !important;
}
.pf-v5-c-menu__item:hover .pf-v5-c-menu__item-text {
    color: var(--aireal-orange);
}

/* ── Alerts / toasts ────────────────────────────────────────────── */
.pf-v5-c-alert.pf-m-success {
    border-radius: 10px;
    border: 1px solid #b6e8d0;
    background-color: #f0faf5;
}