/* Pixfuture admin shell — layout, navigation, dashboard panels */

:root {
    --bg: #061a38;
    --card: #181c24;
    --border: #262b36;
    --text: #e8ecf1;
    --muted: #9aa4b2;
    --green: #4ade80;
    --blue: #60a5fa;
    --red: #f87171;
    --radius-lg: 14px;
    --radius-md: 10px;
    --shadow-elevated: 0 8px 32px rgba(0, 0, 0, 0.45);
    --transition-fast: 0.15s ease;
    --focus-ring: 0 0 0 3px rgba(96, 165, 250, 0.45);
    --shell-bg-overlay: rgba(3, 8, 20, 0.62);
    --pf-sidebar-width: 300px;
    --pf-sidebar-mini-width: 4.6rem;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--bg);
    background-image: none;
    color: var(--text);
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

.pf-skip-link {
    position: absolute;
    left: 12px;
    top: -48px;
    z-index: 2000;
    padding: 10px 14px;
    border-radius: 8px;
    background: #0b1220;
    color: #fff;
    border: 1px solid rgba(96, 165, 250, 0.7);
    text-decoration: none;
    font-weight: 600;
    transition: top var(--transition-fast);
}

.pf-skip-link:focus {
    top: 10px;
}

/* --- Top bar --- */
.main-header.navbar {
    background: linear-gradient(
        180deg,
        rgba(24, 32, 48, 0.95) 0%,
        rgba(18, 24, 36, 0.92) 100%
    ) !important;
    border-bottom: 1px solid rgba(38, 43, 54, 0.9) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    min-height: 57px;
    padding-top: 0;
    padding-bottom: 0;
}

.main-header .nav-link {
    border-radius: var(--radius-md);
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.main-header .nav-link:hover,
.main-header .nav-link:focus {
    background: rgba(96, 165, 250, 0.12);
    outline: none;
}

.main-header .dropdown-menu {
    background: rgba(24, 28, 36, 0.98);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-elevated);
    padding: 0.35rem 0;
    margin-top: 0.35rem;
}

.main-header .dropdown-item {
    color: var(--text);
    font-size: 0.9rem;
    padding: 0.5rem 1rem;
}

.main-header .dropdown-item:hover,
.main-header .dropdown-item:focus {
    background: rgba(96, 165, 250, 0.15);
    color: #fff;
}

.main-header .dropdown-item-text {
    color: var(--muted);
    font-size: 0.85rem;
}

.main-header .dropdown-divider {
    border-color: var(--border);
}

.pf-user-menu-toggle {
    display: flex;
    align-items: center;
    padding: 0.35rem 0.5rem !important;
}

.pf-user-avatar-ring {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(96, 165, 250, 0.35);
}

.pf-user-avatar-ring--nav {
    width: 32px;
    height: 32px;
}

.pf-user-avatar-ring--menu {
    width: 40px;
    height: 40px;
}

.pf-user-avatar {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    flex-shrink: 0;
    clip-path: circle(50% at 50% 50%);
}

.pf-user-avatar-ring .pf-user-avatar {
    box-shadow: none;
}

.pf-user-avatar--nav {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px;
    min-height: 32px;
}

.pf-user-avatar--menu {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px;
    min-height: 40px;
}

.pf-user-dropdown {
    min-width: 14rem;
}

.pf-user-dropdown-head {
    display: flex !important;
    align-items: center;
    gap: 0.65rem;
    padding: 0.65rem 1rem !important;
    color: var(--text) !important;
    white-space: normal;
}

.pf-user-dropdown-meta {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.pf-user-dropdown-meta strong {
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.25;
}

.pf-user-dropdown-meta small {
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.3;
    word-break: break-all;
}

/* --- Content --- */
.content-wrapper {
    background-color: transparent !important;
    margin-top: 57px;
}

.content .container-fluid {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(16px, 2vw, 28px);
    padding-right: clamp(16px, 2vw, 28px);
}

.content {
    padding-bottom: 2.5rem;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
.btn:focus-visible {
    outline: none !important;
    box-shadow: var(--focus-ring) !important;
}

/* --- Sidebar --- */
.main-sidebar {
    top: 57px;
    background-color: rgba(20, 26, 36, 0.55) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-right: 1px solid rgba(38, 43, 54, 0.6);
    width: var(--pf-sidebar-width) !important;
    overflow-x: hidden;
}

.main-sidebar::before {
    width: var(--pf-sidebar-width) !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar,
body.sidebar-mini.sidebar-collapse .main-sidebar::before {
    margin-left: 0 !important;
    width: var(--pf-sidebar-mini-width) !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover::before,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused::before {
    width: var(--pf-sidebar-width) !important;
}

.sidebar-bg {
    background-color: rgba(18, 22, 30, 0.35) !important;
}

.sidebar {
    background: transparent !important;
    padding-bottom: 1.5rem;
    overflow-x: hidden !important;
}

.pf-global-search {
    position: relative;
    margin: 0.85rem 0.85rem 0.35rem;
    z-index: 20;
}

.pf-global-search-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pf-global-search-field {
    position: relative;
}

.pf-global-search-icon {
    position: absolute;
    left: 0.72rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted);
    font-size: 0.82rem;
    pointer-events: none;
}

.pf-global-search-input {
    width: 100%;
    padding: 0.52rem 0.75rem 0.52rem 2rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-md);
    background: rgba(8, 14, 28, 0.55);
    color: var(--text);
    font-size: 0.84rem;
    line-height: 1.3;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}

.pf-global-search-input::placeholder {
    color: rgba(154, 164, 178, 0.85);
}

.pf-global-search-input:focus {
    outline: none;
    border-color: rgba(96, 165, 250, 0.55);
    box-shadow: var(--focus-ring);
    background: rgba(8, 14, 28, 0.78);
}

.pf-global-search-results {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 0.35rem);
    max-height: min(24rem, 55vh);
    overflow-y: auto;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-md);
    background: rgba(16, 22, 34, 0.98);
    box-shadow: var(--shadow-elevated);
}

.pf-global-search-empty {
    padding: 0.75rem;
    font-size: 0.8rem;
    color: var(--muted);
}

.pf-user-profile-page .pf-user-profile-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.pf-user-profile-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pf-user-profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.pf-user-profile-card {
    padding: 1rem 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-lg);
    background: rgba(16, 22, 34, 0.92);
    box-shadow: var(--shadow-elevated);
}

.pf-user-profile-card-title {
    margin: 0 0 0.85rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--blue);
}

.pf-user-profile-dl {
    margin: 0;
}

.pf-user-profile-dl > div {
    display: grid;
    grid-template-columns: minmax(7rem, 34%) 1fr;
    gap: 0.5rem 0.85rem;
    padding: 0.3rem 0;
    font-size: 0.9rem;
    line-height: 1.4;
}

.pf-user-profile-dl dt {
    margin: 0;
    color: var(--muted);
    font-weight: 500;
}

.pf-user-profile-dl dd {
    margin: 0;
    color: var(--text);
    word-break: break-word;
}

.pf-user-profile-card--websites {
    margin-bottom: 0;
}

.pf-user-profile-card--payment-info {
    margin-bottom: 1rem;
}

.pf-user-profile-subrow td {
    background: rgba(8, 14, 28, 0.35);
    border-top: none !important;
    padding-top: 0.35rem;
    padding-bottom: 0.85rem;
}

.pf-user-profile-publisher-subrow td {
    padding-top: 0;
    padding-bottom: 1rem;
}

.pf-user-profile-publisher-detail {
    padding: 0.75rem 0.15rem 0.25rem;
}

.pf-user-profile-card--websites .pf-table-shell td.pf-user-profile-website-cell {
    max-width: 16rem;
    word-break: break-word;
}

.pf-user-profile-publisher-detail .pf-user-profile-publisher-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.pf-user-profile-publisher-detail .pf-user-profile-publisher-block {
    padding: 0.85rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-md);
    background: rgba(16, 22, 34, 0.55);
}

.pf-user-profile-publisher-detail .pf-user-profile-publisher-block--zones {
    margin-bottom: 0;
}

.pf-user-profile-block-title {
    margin: 0 0 0.65rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--blue);
}

.pf-user-profile-dl--inline > div {
    padding: 0.15rem 0;
}

.pf-user-profile-payment-details {
    padding: 0.15rem 0.1rem 0;
}

.pf-user-profile-page .pf-pagination {
    margin-top: 1rem;
}

.pf-user-profile-page .pf-footer-info {
    margin-top: 0.65rem;
    margin-bottom: 1.25rem;
    font-size: 0.82rem;
    color: var(--muted);
}

.pf-user-profile-table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.pf-user-profile-sources {
    margin-top: -0.35rem;
    margin-bottom: 1rem;
}

.pf-user-profile-sources code {
    font-size: 0.82em;
}

@media (max-width: 991.98px) {
    .pf-user-profile-grid {
        grid-template-columns: 1fr;
    }

    .pf-user-profile-publisher-detail .pf-user-profile-publisher-grid {
        grid-template-columns: 1fr;
    }
}

body.sidebar-mini.sidebar-collapse .pf-global-search {
    margin-left: 0.45rem;
    margin-right: 0.45rem;
}

.pf-global-search-item {
    display: grid;
    gap: 0.1rem;
    padding: 0.62rem 0.75rem;
    color: var(--text);
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background var(--transition-fast);
}

.pf-global-search-item:last-child {
    border-bottom: none;
}

.pf-global-search-item:hover,
.pf-global-search-item.is-active {
    background: rgba(96, 165, 250, 0.14);
    color: #fff;
    text-decoration: none;
}

.pf-global-search-item-type {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--blue);
}

.pf-global-search-item-title {
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.25;
}

.pf-global-search-item-subtitle,
.pf-global-search-item-meta {
    font-size: 0.74rem;
    color: var(--muted);
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.sidebar-mini.sidebar-collapse .pf-global-search-input {
    padding-left: 2rem;
    font-size: 0;
}

body.sidebar-mini.sidebar-collapse .pf-global-search-input::placeholder {
    color: transparent;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .pf-global-search-input,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .pf-global-search-input {
    font-size: 0.84rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .pf-global-search-input::placeholder,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .pf-global-search-input::placeholder {
    color: rgba(154, 164, 178, 0.85);
}

.brand-link {
    padding-left: 1.25rem !important;
    padding-right: 1rem !important;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    transition: background var(--transition-fast);
    display: flex;
    align-items: center;
}

.brand-link:hover {
    background: transparent !important;
}

.brand-link .pf-brand-logo {
    display: block;
    width: 7.8rem;
    max-width: 100%;
    height: auto;
}

body.sidebar-mini.sidebar-collapse .main-sidebar {
    overflow-x: hidden;
}

body.sidebar-mini.sidebar-collapse .brand-link {
    justify-content: center;
    overflow: hidden !important;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
}

body.sidebar-mini.sidebar-collapse .brand-link .pf-brand-logo {
    width: 1.55rem !important;
    height: 1.55rem !important;
    max-width: 1.55rem !important;
    flex-shrink: 0;
    object-fit: cover !important;
    object-position: 0 50% !important;
    clip-path: inset(0 24% 0 0);
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .brand-link,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .brand-link {
    justify-content: flex-start;
    overflow: visible !important;
    padding-left: 1.25rem !important;
    padding-right: 1rem !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .brand-link .pf-brand-logo,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .brand-link .pf-brand-logo {
    width: 7.8rem !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    clip-path: none;
}

.brand-prefix {
    color: #facc15 !important;
    -webkit-text-fill-color: #facc15 !important;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.brand-text {
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.brand-word {
    display: inline;
}

body.sidebar-mini.sidebar-collapse .brand-word {
    display: none;
}

body.sidebar-mini.sidebar-collapse .brand-prefix {
    font-size: 1.35rem;
    line-height: 1;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .brand-word,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .brand-word {
    display: inline;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover .brand-prefix,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused .brand-prefix {
    font-size: inherit;
}

.icon-color {
    color: #fff;
}

.nav-sidebar .nav-link {
    border-radius: var(--radius-md);
    margin: 2px 10px;
    padding: 0.55rem 0.85rem;
    align-items: center;
    gap: 0.65rem;
    transition: background var(--transition-fast), transform var(--transition-fast);
    width: auto;
    max-width: 100%;
    overflow: hidden;
}

.nav-sidebar .nav-link p {
    margin: 0;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
}

.nav-sidebar .nav-link svg {
    flex-shrink: 0;
    opacity: 0.88;
    stroke: currentColor;
}

.nav-sidebar .nav-link:hover {
    background: rgba(96, 165, 250, 0.12) !important;
    color: #fff !important;
}

.nav-sidebar .nav-link:focus-visible {
    box-shadow: var(--focus-ring);
}

.nav-sidebar .nav-link.active {
    background: linear-gradient(
        90deg,
        rgba(96, 165, 250, 0.25) 0%,
        rgba(96, 165, 250, 0.06) 100%
    ) !important;
    border-left: 3px solid var(--blue);
    padding-left: calc(0.85rem - 3px);
    color: #fff !important;
    box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.15);
}

.nav-sidebar .nav-header {
    color: var(--muted) !important;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 1rem 1rem 0.35rem;
    padding: 0;
    opacity: 0.95;
}

/* --- Page chrome (analysis & generic pages) --- */
.pf-page-section {
    margin-bottom: 2rem;
}

.pf-page-head {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.pf-page-title {
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.02em;
    margin: 0 0 0.35rem;
    line-height: 1.25;
}

.pf-page-lead {
    margin: 0;
    color: #b4bfce;
    font-size: 0.95rem;
    max-width: 52ch;
}

.pf-meta-badge {
    display: inline-block;
    margin-top: 0.75rem;
    padding: 0.35rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    font-family: ui-monospace, monospace;
    color: var(--blue);
    background: rgba(96, 165, 250, 0.12);
    border: 1px solid rgba(96, 165, 250, 0.35);
    border-radius: 8px;
}

.page-title {
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    font-weight: 700;
    color: #fff;
    padding-bottom: 1rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    letter-spacing: -0.02em;
}

.beta-pulse {
    animation: beta-fade 3s infinite ease-in-out;
}

.beta-notice {
    color: #b4bfce;
    font-size: 0.82rem;
    font-style: italic;
    max-width: 36rem;
    text-align: center;
    line-height: 1.4;
}

.beta-notice-icon {
    color: var(--blue);
}

.beta-notice-text {
    color: rgba(255, 255, 255, 0.92);
}

.nav-sidebar .nav-link-text {
    color: inherit;
}

.nav-link-text--disabled {
    text-decoration: line-through;
    opacity: 0.55;
}

@keyframes beta-fade {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.45;
    }
}

.brand-link:hover .brand-text {
    display: inline-block;
}

.brand-link:hover .brand-word {
    color: var(--green) !important;
    text-shadow: 0 0 8px var(--green);
    animation: matrix-vibe 0.1s infinite;
}

.brand-link:hover .brand-prefix {
    color: #facc15 !important;
    -webkit-text-fill-color: #facc15 !important;
    text-shadow: none;
    animation: none;
}

@keyframes matrix-vibe {
    0% {
        transform: translate(0.5px, 0.5px);
    }
    25% {
        transform: translate(-0.5px, -0.5px);
    }
    50% {
        transform: translate(-0.5px, 0.5px);
    }
    75% {
        transform: translate(0.5px, -0.5px);
    }
    100% {
        transform: translate(0, 0);
    }
}

/* --- Dashboard (scoped) --- */
/* Series colors — shared by .pf-stats cards and All Platforms bar chart */
.pf-dashboard {
    --pf-chart-total: #4ade80;
    --pf-chart-adapter: #60a5fa;
    --pf-chart-ortb: #a78bfa;
    --pf-chart-video: #facc15;
    --pf-chart-other: #f87171;
    --pf-chart-requests: #60a5fa;
    --pf-chart-impressions: #f87171;
    --pf-chart-revenue: #4ade80;
}

.pf-dashboard .pf-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.pf-dashboard .pf-stats .pf-stat-card .pf-stat-label,
.pf-dashboard .pf-stats .pf-stat-card .pf-stat-value {
    font-weight: 700;
}

.pf-dashboard .pf-stats .pf-stat-card .pf-stat-label {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
}

.pf-dashboard .pf-stats .pf-stat-card .pf-stat-value {
    font-size: 1.5rem;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    line-height: 1.2;
}

.pf-dashboard .pf-stats .pf-stat-card .pf-stat-pct {
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.88;
}

.pf-dashboard .pf-stat-card--total .pf-stat-label,
.pf-dashboard .pf-stat-card--total .pf-stat-value {
    color: var(--pf-chart-total);
}

.pf-dashboard .pf-stat-card--adapter .pf-stat-label,
.pf-dashboard .pf-stat-card--adapter .pf-stat-value {
    color: var(--pf-chart-adapter);
}

.pf-dashboard .pf-stat-card--ortb .pf-stat-label,
.pf-dashboard .pf-stat-card--ortb .pf-stat-value {
    color: var(--pf-chart-ortb);
}

.pf-dashboard .pf-stat-card--video .pf-stat-label,
.pf-dashboard .pf-stat-card--video .pf-stat-value {
    color: var(--pf-chart-video);
}

.pf-dashboard .pf-stat-card--other .pf-stat-label,
.pf-dashboard .pf-stat-card--other .pf-stat-value {
    color: var(--pf-chart-other);
}

.pf-dashboard .pf-stat-card--total { border-left: 3px solid var(--pf-chart-total); }
.pf-dashboard .pf-stat-card--adapter { border-left: 3px solid var(--pf-chart-adapter); }
.pf-dashboard .pf-stat-card--ortb { border-left: 3px solid var(--pf-chart-ortb); }
.pf-dashboard .pf-stat-card--video { border-left: 3px solid var(--pf-chart-video); }
.pf-dashboard .pf-stat-card--other { border-left: 3px solid var(--pf-chart-other); }

.pf-dashboard .pf-chart-panel--adapter > .pf-stat-label { color: var(--pf-chart-adapter); }
.pf-dashboard .pf-chart-panel--ortb > .pf-stat-label { color: var(--pf-chart-ortb); }
.pf-dashboard .pf-chart-panel--video > .pf-stat-label { color: var(--pf-chart-video); }
.pf-dashboard .pf-chart-panel--other > .pf-stat-label { color: var(--pf-chart-other); }

.pf-dashboard .pf-stats .pf-panel {
    min-width: 0;
    margin-bottom: 0;
}

.pf-dashboard .pf-panel {
    background: rgba(24, 28, 36, 0.82);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.35rem 1.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
    margin-bottom: 1rem;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.pf-dashboard .pf-panel:hover {
    border-color: rgba(96, 165, 250, 0.35);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4);
}

.pf-dashboard .pf-stat-label {
    font-size: 0.8125rem;
    color: var(--muted);
    margin-bottom: 0.35rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pf-dashboard .pf-stat-value {
    font-size: 1.5rem;
    font-weight: 700;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    line-height: 1.2;
}

.pf-dashboard .pf-stat-pct {
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.85;
}

.pf-dashboard .green {
    color: var(--green);
}
.pf-dashboard .blue {
    color: var(--blue);
}
.pf-dashboard .purple {
    color: #a78bfa;
}
.pf-dashboard .red {
    color: var(--red);
}

.pf-dashboard canvas {
    max-height: 400px;
    margin-top: 0.75rem;
}

.pf-dashboard .pf-dashboard-period {
    margin-bottom: 1.25rem;
    padding: 1rem 1.35rem;
}

.pf-dashboard-period__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.25rem;
}

.pf-dashboard-period__label {
    margin-bottom: 0;
    flex-shrink: 0;
}

.pf-dashboard-period__toggle {
    display: inline-flex;
    flex-wrap: wrap;
    padding: 0.35rem;
    gap: 0.35rem;
    background: rgba(38, 43, 54, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: var(--radius-md);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.pf-dashboard-period__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 7.5rem;
    padding: 0.55rem 1.15rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    color: #e2e8f0;
    text-decoration: none;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: rgba(51, 65, 85, 0.85);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    transition:
        color var(--transition-fast),
        background-color var(--transition-fast),
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        transform var(--transition-fast);
}

.pf-dashboard-period__btn:hover {
    color: #fff;
    background: rgba(71, 85, 105, 0.95);
    border-color: rgba(96, 165, 250, 0.65);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4);
}

.pf-dashboard-period__btn:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

.pf-dashboard-period__btn.is-active {
    color: #fff;
    background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
    border-color: #93c5fd;
    box-shadow:
        0 2px 12px rgba(37, 99, 235, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.pf-dashboard-period__btn.is-active:hover {
    color: #fff;
    background: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);
    border-color: #bfdbfe;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .pf-dashboard .pf-stats .pf-panel {
        min-width: 0;
    }

    .nav-sidebar .nav-link {
        margin-left: 6px;
        margin-right: 6px;
    }
}

@media (min-width: 992px) {
    body:not(.layout-top-nav) .main-header,
    body:not(.layout-top-nav) .content-wrapper,
    body:not(.layout-top-nav) .main-footer {
        margin-left: var(--pf-sidebar-width) !important;
    }

    body.sidebar-collapse:not(.sidebar-mini):not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header,
    body.sidebar-collapse:not(.sidebar-mini):not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper,
    body.sidebar-collapse:not(.sidebar-mini):not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer {
        margin-left: 0 !important;
    }

    body.sidebar-collapse:not(.sidebar-mini):not(.sidebar-mini-md):not(.sidebar-mini-xs) .main-sidebar,
    body.sidebar-collapse:not(.sidebar-mini):not(.sidebar-mini-md):not(.sidebar-mini-xs) .main-sidebar::before {
        margin-left: calc(-1 * var(--pf-sidebar-width)) !important;
    }

    body.sidebar-mini.sidebar-collapse:not(.layout-top-nav) .main-header,
    body.sidebar-mini.sidebar-collapse:not(.layout-top-nav) .content-wrapper,
    body.sidebar-mini.sidebar-collapse:not(.layout-top-nav) .main-footer {
        margin-left: var(--pf-sidebar-mini-width) !important;
    }
}

@media (max-width: 991.98px) {
    body:not(.layout-top-nav) .main-header,
    body:not(.layout-top-nav) .content-wrapper,
    body:not(.layout-top-nav) .main-footer {
        margin-left: 0 !important;
    }

    .main-sidebar,
    .main-sidebar::before,
    body.sidebar-mini.sidebar-collapse .main-sidebar,
    body.sidebar-mini.sidebar-collapse .main-sidebar::before,
    body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover,
    body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused,
    body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover::before,
    body.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand).sidebar-focused::before {
        margin-left: calc(-1 * var(--pf-sidebar-width)) !important;
        width: var(--pf-sidebar-width) !important;
    }

    body.sidebar-open .main-sidebar,
    body.sidebar-open .main-sidebar::before,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar::before,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar:not(.sidebar-no-expand):hover,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar:not(.sidebar-no-expand).sidebar-focused,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar:not(.sidebar-no-expand):hover::before,
    body.sidebar-mini.sidebar-collapse.sidebar-open .main-sidebar:not(.sidebar-no-expand).sidebar-focused::before {
        margin-left: 0 !important;
        width: var(--pf-sidebar-width) !important;
    }

    body.sidebar-open #sidebar-overlay {
        display: block;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .brand-link {
        justify-content: flex-start;
        overflow: visible !important;
        padding-left: 1.25rem !important;
        padding-right: 1rem !important;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .brand-link .pf-brand-logo {
        width: 7.8rem !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        object-position: center !important;
        clip-path: none;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .brand-word {
        display: inline;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .brand-prefix {
        font-size: inherit;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .pf-global-search-input {
        font-size: 0.84rem;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .pf-global-search-input::placeholder {
        color: rgba(154, 164, 178, 0.85);
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .nav-header {
        display: block;
    }

    body.sidebar-mini.sidebar-collapse.sidebar-open .nav-sidebar .nav-link p {
        margin-left: 0;
        visibility: visible;
        width: auto;
        animation: none;
        display: inline-block;
    }
}

@media (max-width: 992px) {
    .pf-dashboard .pf-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .pf-dashboard .pf-stats {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .beta-pulse {
        animation: none;
    }

    .brand-link:hover .brand-word {
        animation: none;
    }

    .pf-stats-skeleton-card::after,
    .pf-stats-skeleton-line::after,
    .pf-websites-skeleton-line {
        animation: none !important;
    }
}

/* --- Website management (/administrator/websites) --- */
.pf-sites-page .pf-sites-lead {
    margin: -0.35rem 0 1.25rem;
    max-width: 48rem;
    color: var(--muted);
    font-size: 0.95rem;
    line-height: 1.5;
}

.pf-sites-page {
    --pf-sites-table-border: #c5cad3;
    --pf-sites-table-header-bg: #dde1e8;
}

.pf-sites-page .pf-sites-table-card {
    padding: 0;
    overflow: visible;
}

.pf-sites-page .pf-panel.pf-sites-table-card {
    border-color: var(--pf-sites-table-border);
}

.pf-sites-page .pf-sites-table-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    padding: 1rem 1.35rem;
    border-bottom: 1px solid var(--pf-sites-table-border);
    background: rgba(220, 225, 232, 0.12);
}

.pf-sites-page .pf-sites-table-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.02em;
}

.pf-sites-page .pf-sites-table-body {
    padding: 0.75rem 1rem 1.1rem;
    overflow-x: auto;
    overflow-y: visible;
    /* Keeps right table edge visible when scrollbar touches card */
    box-sizing: border-box;
}

.pf-sites-page .pf-sites-link-strong {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.pf-sites-page .pf-sites-link-strong:hover {
    color: var(--blue);
    text-decoration: none;
}

.pf-sites-page .pf-sites-mono {
    font-family: ui-monospace, monospace;
    font-size: 0.875rem;
    color: rgba(232, 236, 241, 0.92);
}

.pf-sites-page .pf-sites-btn {
    border-radius: 8px;
    font-weight: 500;
}

.pf-sites-page .pf-sites-url-cell {
    vertical-align: middle;
    min-width: 8.5rem;
}

.pf-sites-page .pf-sites-url-btn {
    white-space: nowrap;
}

/* DataTables toolbar: Add + exports left, “Show n entries” right */
.pf-sites-page .pf-sites-dt-toolbar {
    width: 100%;
}

.pf-sites-page .pf-sites-dt-toolbar-start {
    flex: 1 1 auto;
    min-width: 0;
}

.pf-sites-page .pf-sites-add-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0 0 1.25rem;
}

.pf-sites-page .pf-sites-add-centered {
    font-weight: 600;
    padding: 0.5rem 1.5rem;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

.pf-sites-page .pf-sites-dt-toolbar-start .dt-buttons {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin: 0 !important;
}

.pf-sites-page .pf-sites-dt-toolbar-end {
    flex: 0 0 auto;
}

.pf-sites-page .pf-sites-dt-toolbar-end .dataTables_length {
    margin: 0 !important;
}

.pf-sites-page .pf-sites-dt-toolbar-end .dataTables_length label {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--text);
    font-weight: 500;
}

.pf-sites-page .pf-sites-dt-toolbar-end select {
    min-width: 4.5rem;
}

.pf-sites-page .pf-sites-empty {
    color: var(--muted);
    padding: 1.5rem 1rem !important;
}

.pf-sites-page .text-muted {
    color: var(--muted) !important;
}

.pf-sites-page table.dataTable,
.pf-sites-page table.table.dataTable {
    width: 100% !important;
    max-width: none;
    background: rgba(15, 17, 23, 0.35) !important;
    color: var(--text);
    border-collapse: collapse !important;
    border: 1px solid var(--pf-sites-table-border) !important;
    box-sizing: border-box;
}

.pf-sites-page table.dataTable thead th,
.pf-sites-page table.dataTable tfoot th,
.pf-sites-page table.table.dataTable thead th,
.pf-sites-page table.table.dataTable tfoot th {
    color: #1a1f2e !important;
    background: var(--pf-sites-table-header-bg) !important;
    border: 1px solid var(--pf-sites-table-border) !important;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    vertical-align: middle;
}

.pf-sites-page table.dataTable tbody td,
.pf-sites-page table.table.dataTable tbody td {
    color: var(--text);
    border: 1px solid var(--pf-sites-table-border) !important;
    vertical-align: middle;
    background: rgba(15, 17, 23, 0.25);
}

.pf-sites-page table.dataTable tbody tr:hover td,
.pf-sites-page table.table.dataTable tbody tr:hover td {
    background-color: rgba(96, 165, 250, 0.1) !important;
    border-color: var(--pf-sites-table-border) !important;
}

.pf-sites-page .dataTables_wrapper .dataTables_length,
.pf-sites-page .dataTables_wrapper .dataTables_filter,
.pf-sites-page .dataTables_wrapper .dataTables_info,
.pf-sites-page .dataTables_wrapper .dataTables_paginate {
    color: var(--text) !important;
}

.pf-sites-page .dataTables_wrapper .dataTables_filter {
    margin: 0.75rem 0 0.5rem;
}

.pf-sites-page .dataTables_wrapper .dataTables_filter input,
.pf-sites-page .dataTables_wrapper .dataTables_length select {
    background: rgba(15, 17, 23, 0.85);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.35rem 0.65rem;
}

/* Footer: pagination then “Showing …” — same rhythm as OpenRTB / stats pages */
.pf-sites-page .pf-sites-dt-footer {
    width: 100%;
}

.pf-sites-page .pf-sites-dt-footer .dataTables_info {
    float: none !important;
    width: 100%;
    margin: 0.65rem 0 0 !important;
    padding: 0;
    text-align: center;
    font-size: 0.9rem;
    color: var(--muted);
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate {
    float: none !important;
    width: 100%;
    margin: 0.75rem 0 0 !important;
    padding: 0;
    text-align: center;
}

/* Bootstrap 4 style (DataTables + dataTables.bootstrap4) */
.pf-sites-page .dataTables_wrapper .dataTables_paginate .pagination {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .page-item .page-link {
    position: relative;
    display: inline-block;
    min-width: 2.25rem;
    padding: 0.4rem 0.65rem;
    margin: 0 2px;
    border-radius: 6px;
    background: rgba(44, 44, 44, 0.95) !important;
    border: 1px solid var(--border) !important;
    color: #f1f5f9 !important;
    font-size: 0.875rem;
    text-align: center;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .page-item:not(.disabled):not(.active) .page-link:hover {
    background: rgba(96, 165, 250, 0.22) !important;
    border-color: rgba(96, 165, 250, 0.45) !important;
    color: #fff !important;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .page-item.active .page-link {
    background: #3498db !important;
    border-color: #3498db !important;
    color: #fff !important;
    font-weight: 700;
    z-index: 0;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link {
    opacity: 0.45;
    cursor: not-allowed;
}

/* Fallback: plain .paginate_button links (non-Bootstrap skin) */
.pf-sites-page .dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-block !important;
    padding: 0.4rem 0.65rem !important;
    margin: 0 3px !important;
    border-radius: 6px !important;
    background: rgba(44, 44, 44, 0.95) !important;
    border: 1px solid var(--border) !important;
    color: #f1f5f9 !important;
    font-size: 0.875rem !important;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #3498db !important;
    border-color: #3498db !important;
    color: #fff !important;
    font-weight: 700 !important;
}

.pf-sites-page .dataTables_wrapper .dataTables_paginate .paginate_button:not(.current):not(.disabled):hover {
    background: rgba(96, 165, 250, 0.22) !important;
    border-color: rgba(96, 165, 250, 0.45) !important;
    color: #fff !important;
}

.pf-sites-page .dt-buttons {
    margin-bottom: 0.75rem;
}

.pf-sites-page .pf-sites-dt-btn,
.pf-sites-page .dt-buttons .btn {
    margin-right: 0.35rem;
    margin-bottom: 0.35rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 8px;
}

.pf-sites-page .pf-sites-dt-btn:hover,
.pf-sites-page .dt-buttons .btn:hover {
    background: rgba(96, 165, 250, 0.15);
    border-color: rgba(96, 165, 250, 0.4);
    color: #fff;
}

/* Admin pages using /admin/stats chrome (user list, websites, bidders, …) */
.pf-users-admin .pf-sites-lead {
    margin: 0 0 1.25rem;
}

.pf-users-admin .pf-summary-grid {
    margin-bottom: 1.25rem;
}

.pf-users-admin .pf-sites-mono {
    font-family: ui-monospace, monospace;
    font-size: 0.875rem;
    color: rgba(232, 236, 241, 0.92);
}

/* Zones management toolbar (matches websites / user list admin chrome) */
.pf-users-admin .pf-zones-toolbar {
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.65rem;
}

.pf-users-admin .pf-zones-toolbar .pf-link-btn.dropdown-toggle::after {
    margin-left: 0.35rem;
}

.pf-users-admin .pf-zones-dropdown .dropdown-menu {
    background: rgba(24, 28, 36, 0.98);
    border: 1px solid #3c3c3c;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.pf-users-admin .pf-zones-dropdown .dropdown-item {
    color: #e2e8f0;
    font-size: 0.875rem;
}

.pf-users-admin .pf-zones-dropdown .dropdown-item:hover,
.pf-users-admin .pf-zones-dropdown .dropdown-item:focus {
    background: rgba(59, 130, 246, 0.2);
    color: #fff;
}

.pf-users-admin .pf-zones-dropdown .dropdown-divider {
    border-color: #3c3c3c;
}

.pf-users-admin .pf-zones-col-check {
    width: 2.5rem;
    text-align: center;
}

.pf-users-admin .pf-zones-col-check input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    cursor: pointer;
}

.pf-zones-results {
    margin-top: 0.25rem;
}

.pf-zones-results .pf-export-bar {
    margin-bottom: 1rem;
}

.pf-zones-table-panel {
    background: rgba(30, 30, 30, 0.82);
    border: 1px solid #3c3c3c;
    border-radius: 10px;
    padding: 1rem 1rem 0.5rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.pf-zones-results .pf-zones-dt-header {
    width: 100%;
    margin-bottom: 1rem;
    gap: 0.75rem 1.25rem;
}

.pf-zones-results .pf-zones-dt-header .dataTables_length,
.pf-zones-results .pf-zones-dt-header .dataTables_filter {
    margin: 0;
    float: none;
}

.pf-zones-results .pf-zones-dt-header .dataTables_length label,
.pf-zones-results .pf-zones-dt-header .dataTables_filter label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    color: #e2e8f0;
    font-weight: 600;
    font-size: 0.875rem;
}

.pf-zones-results .dataTables_scroll {
    margin-bottom: 0.5rem;
}

.pf-zones-results .dataTables_scrollBody {
    border-bottom: 1px solid #3c3c3c;
}

/* Hide duplicate length/filter blocks if a plugin injects extras */
.pf-zones-results .dataTables_wrapper .dataTables_length ~ .dataTables_length,
.pf-zones-results .dataTables_wrapper .dataTables_filter ~ .dataTables_filter {
    display: none !important;
}

.pf-zones-results .pf-users-datatable-wrap.is-visible {
    opacity: 1;
}

.pf-users-admin #pf-users-summary,
.pf-users-admin #pf-users-archive-summary {
    margin-bottom: 1.25rem;
}

.pf-users-admin #pf-users-summary[hidden],
.pf-users-admin #pf-users-archive-summary[hidden] {
    display: none !important;
}

.pf-users-datatable-wrap {
    margin-bottom: 1.5rem;
}

.pf-users-datatable-wrap table.dataTable,
.pf-users-datatable-wrap table.table.dataTable {
    width: 100% !important;
    border-collapse: collapse !important;
    background-color: rgba(30, 30, 30, 0.82) !important;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.pf-users-datatable-wrap table.dataTable thead th,
.pf-users-datatable-wrap table.dataTable tfoot th,
.pf-users-datatable-wrap table.table.dataTable thead th {
    color: #ecf0f1 !important;
    background: #2c2c2c !important;
    border-bottom: 1px solid #3c3c3c !important;
    font-weight: 700;
    padding: 10px;
    vertical-align: middle;
}

.pf-users-datatable-wrap table.dataTable tbody td,
.pf-users-datatable-wrap table.table.dataTable tbody td {
    color: #bdc3c7 !important;
    border-bottom: 1px solid #3c3c3c !important;
    padding: 10px;
    vertical-align: middle;
    background: transparent;
}

.pf-users-datatable-wrap table.dataTable tbody tr:hover td {
    background-color: #2a2d2e !important;
}

.pf-users-datatable-wrap table.dataTable tbody > tr.notify_active td {
    background-color: rgba(46, 204, 113, 0.18) !important;
}

.pf-users-datatable-wrap .dataTables_wrapper .dataTables_length,
.pf-users-datatable-wrap .dataTables_wrapper .dataTables_filter,
.pf-users-datatable-wrap .dataTables_wrapper .dataTables_info,
.pf-users-datatable-wrap .dataTables_wrapper .dataTables_paginate {
    color: #bdc3c7 !important;
}

.pf-users-datatable-wrap .dataTables_wrapper .dataTables_filter input,
.pf-users-datatable-wrap .dataTables_wrapper .dataTables_length select {
    background: #ffffff;
    color: #1f2937;
    border: 1px solid #bfd7e6;
    border-radius: 6px;
    padding: 6px 10px;
}

.pf-users-datatable-wrap .pf-users-dt-toolbar {
    width: 100%;
    margin-bottom: 1rem;
}

.pf-users-datatable-wrap .pf-users-dt-btn,
.pf-users-datatable-wrap .dt-buttons .btn {
    background-color: #34495e !important;
    border: none !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-weight: 600;
    font-size: 14px;
    margin-right: 0.35rem;
    margin-bottom: 0.35rem;
}

.pf-users-datatable-wrap .pf-users-dt-btn:hover,
.pf-users-datatable-wrap .dt-buttons .btn:hover {
    background-color: #2c3e50 !important;
    color: #fff !important;
}

/* Hide default DataTables pager when using stats-style custom pagination */
.pf-dt-has-stats-pagination .dataTables_paginate,
.pf-dt-has-stats-pagination .dataTables_info {
    display: none !important;
}

.pf-users-datatable-wrap .pf-pagination-custom a:hover {
    background-color: #3c3c3c;
    color: #fff;
    text-decoration: none;
}

.pf-users-datatable-wrap .pf-user-action-btn,
.pf-users-datatable-wrap .pf-user-role-col,
.pf-users-datatable-wrap .pf-user-role-cell {
    white-space: nowrap;
}

.pf-users-datatable-wrap .btn-primary {
    background-color: #3498db;
    border-color: #3498db;
}

.pf-users-datatable-wrap .btn-info {
    background-color: #3c8dbc;
    border-color: #3c8dbc;
}

.pf-users-datatable-wrap .btn-danger {
    background-color: #e74c3c;
    border-color: #e74c3c;
}

.pf-users-admin .modal-content {
    background: #1f2937;
    color: #fff;
    border: 1px solid #444;
}

.pf-users-admin .modal-header {
    border-bottom: 1px solid #444;
}

.pf-users-admin .modal-content .form-control,
.pf-users-admin .modal-content select.form-control {
    background: #ffffff !important;
    color: #1f2937 !important;
    border: 1px solid #bfd7e6 !important;
}

.pf-users-admin .modal-content .form-group label {
    font-weight: 600;
    color: #cbd5e1;
}

.pf-users-admin .modal-content .close {
    color: #fff;
    opacity: 0.85;
}

.pf-users-admin .select2-container--default.select2-container--open {
    z-index: 5000;
}

/* Select2 on blue filter bar — light field, dark chips */
.pf-users-admin .pf-filter-form .select2-container--default .select2-selection--multiple {
    background: #ffffff;
    border: 1px solid #bfd7e6;
    min-height: 38px;
    border-radius: 6px;
}

.pf-users-admin .pf-filter-form .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #1f2937;
}

.pf-users-admin .pf-filter-form .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #34495e;
    border: none;
    color: #fff;
    border-radius: 4px;
    padding: 2px 8px;
}

.pf-users-admin .pf-filter-form .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: rgba(255, 255, 255, 0.85);
    margin-right: 4px;
}

.pf-users-admin .pf-filter-form .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
    color: #64748b;
}

/* Select2 dark dropdown (appended to body — use dropdownCssClass: 'pf-select2-dark') */
.select2-dropdown.pf-select2-dark,
.pf-select2-dark.select2-dropdown {
    background-color: rgba(30, 30, 30, 0.98);
    border: 1px solid #3c3c3c;
    border-radius: 8px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
    color: #bdc3c7;
    z-index: 10060;
}

.pf-select2-dark .select2-search--dropdown {
    background: rgba(30, 30, 30, 0.98);
    padding: 8px;
}

.pf-select2-dark .select2-search__field {
    background: #2c2c2c !important;
    color: #ecf0f1 !important;
    border: 1px solid #3c3c3c !important;
    border-radius: 6px;
}

.pf-select2-dark .select2-results__options {
    background: rgba(30, 30, 30, 0.98);
}

.pf-select2-dark .select2-results__option {
    color: #bdc3c7 !important;
    background-color: transparent !important;
    padding: 8px 12px;
}

.pf-select2-dark .select2-results__option--highlighted[aria-selected] {
    background-color: #3498db !important;
    color: #fff !important;
}

.pf-select2-dark .select2-results__option[aria-selected="true"] {
    background-color: #2a3444 !important;
    color: #ecf0f1 !important;
}

.pf-select2-dark .select2-results__option--selected {
    background-color: #34495e !important;
    color: #fff !important;
}

.pf-select2-dark .select2-results__message {
    color: #7f8c8d;
    background: transparent;
}

/* Select2 in dark modals (user archive add) */
.pf-users-admin .modal-content .select2-container--default .select2-selection--multiple {
    background: #2c2c2c;
    border: 1px solid #3c3c3c;
    min-height: 38px;
    border-radius: 6px;
}

.pf-users-admin .modal-content .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #ecf0f1;
}

.pf-users-admin .modal-content .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #3498db;
    border: none;
    color: #fff;
}

.pf-users-admin .modal-content .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: rgba(255, 255, 255, 0.9);
}

.pf-users-admin .pf-users-search-input {
    min-width: min(320px, 100%);
    flex: 1;
    max-width: 420px;
}

.pf-access-request-message {
    max-width: 280px;
    white-space: pre-wrap;
    word-break: break-word;
}

.pf-access-request-review-form {
    min-width: 200px;
    max-width: 240px;
}

.pf-summary-grid--cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 900px) {
    .pf-summary-grid--cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

body .swal2-container {
    z-index: 9999;
}

.swal2-container .swal2-html-container {
    font-size: 0.9em;
}

/* --- Shared report/admin page components --- */
.pf-panel-card {
    background: rgba(24, 28, 36, 0.92);
    border: 1px solid #262b36;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

.pf-panel-card .card-header {
    border-bottom: 1px solid #262b36;
    background: rgba(24, 28, 36, 0.75);
}

.pf-toolbar {
    gap: 10px;
}

.pf-gap-sm {
    gap: 8px;
}

.pf-form-control-sm {
    max-width: 320px;
}

.pf-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.pf-summary-grid.pf-summary-grid--cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pf-summary-card {
    background: rgba(44, 44, 44, 0.88);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    border-left: 5px solid #3498db;
}

.pf-summary-card.pf-summary-card--green {
    border-left-color: #2ecc71;
}

.pf-summary-card.pf-summary-card--amber {
    border-left-color: #f39c12;
}

.pf-summary-label {
    color: #bdc3c7;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 6px;
}

.pf-summary-value {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
}

.pf-summary-value--green {
    color: #2ecc71;
}

.pf-summary-value--amber {
    color: #f39c12;
}

.pf-filter-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
    background: linear-gradient(180deg, #3c8dbc 0%, #2f7ba5 100%);
    padding: 16px;
    border-radius: 10px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.pf-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.pf-filter-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    padding-top: 12px;
}

.pf-filter-form span {
    font-weight: 600;
    color: #fff;
    margin-right: 4px;
}

.pf-filter-form input,
.pf-filter-form select {
    background: #ffffff;
    color: #1f2937;
    border: 1px solid #bfd7e6;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 14px;
}

.pf-date-input {
    width: 220px;
}

.pf-filter-form button,
.pf-link-btn {
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 6px 14px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.15s ease;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
}

.pf-filter-form button:hover,
.pf-link-btn:hover {
    transform: translateY(-1px);
    text-decoration: none;
}

.pf-btn-search {
    background-color: #34495e;
}

.pf-btn-search:hover {
    background-color: #2c3e50;
}

.pf-btn-refresh {
    background-color: #f39c12;
}

.pf-btn-refresh:hover {
    background-color: #dd8b0b;
}

.pf-btn-transfer {
    background-color: #27ae60;
}

.pf-btn-transfer:hover {
    background-color: #1f9350;
}

.pf-btn-reset {
    background-color: #e74c3c;
}

.pf-btn-reset:hover {
    background-color: #d44133;
}

/* Table export bar (stats / daily report pages) */
.pf-export-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin: 0 0 1rem;
    padding: 0.65rem 0.85rem;
    background: rgba(30, 41, 59, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 8px;
}

.pf-export-bar__label {
    color: #e2e8f0;
    font-weight: 600;
    font-size: 0.875rem;
    margin-right: 0.25rem;
}

.pf-export-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.25rem;
    padding: 0.35rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #e2e8f0;
    background: rgba(51, 65, 85, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pf-export-btn:hover:not(:disabled) {
    color: #fff;
    background: rgba(59, 130, 246, 0.85);
    border-color: #93c5fd;
}

.pf-export-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.pf-export-bar--busy {
    pointer-events: none;
    opacity: 0.85;
}

.pf-export-bar--busy .pf-export-btn[data-pf-export="pdf"] {
    opacity: 1;
    cursor: wait;
}

/* Stats reports: quick range label, buttons, and description on one row */
.pf-filter-form--stats {
    gap: 12px;
}

.pf-stats-quick-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.75rem 1rem;
    width: 100%;
    min-width: 0;
}

.pf-stats-quick-bar .pf-stats-period__label {
    flex: 0 0 auto;
    color: #fff;
    font-weight: 600;
    white-space: nowrap;
}

.pf-stats-quick-bar .pf-stats-period__toggle {
    flex: 0 0 auto;
}

.pf-stats-period__toggle {
    display: inline-flex;
    flex-wrap: nowrap;
    padding: 0.35rem;
    gap: 0.35rem;
    background: rgba(15, 23, 42, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 8px;
}

.pf-stats-period__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 5.5rem;
    padding: 0.4rem 0.85rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #e2e8f0;
    border-radius: 6px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: rgba(51, 65, 85, 0.9);
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pf-stats-period__btn:hover {
    color: #fff;
    background: rgba(71, 85, 105, 0.95);
    border-color: rgba(96, 165, 250, 0.65);
}

.pf-stats-period__btn.is-active {
    color: #fff;
    background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
    border-color: #93c5fd;
}

.pf-stats-quick-bar .pf-stats-range-description {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0.45rem 0.85rem;
    color: #f8fafc;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.35;
    background: rgba(15, 23, 42, 0.75);
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-left: 3px solid #60a5fa;
    border-radius: 6px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.25);
}

/* Table section headings inside panels (e.g. DO cost dashboard) */
.pf-panel > h3.pf-stat-label {
    font-size: 1.25rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 1.125rem;
    line-height: 1.35;
    letter-spacing: -0.02em;
}

/* Digital Ocean cost dashboard: gap below each data table (~empty row) */
.pf-do-dashboard .pf-table-shell {
    margin-bottom: 2.5rem;
}

/* --- Kubernetes (DOKS) monitoring: readable copy on dark chrome + chart wells --- */
.pf-k8s-dashboard {
    padding: 0.75rem 0 0 0.85rem;
}

.pf-k8s-dashboard > .pf-sites-lead {
    color: #e2e8f0;
    font-size: 0.95rem;
    line-height: 1.55;
    max-width: 58rem;
    margin-bottom: 1.25rem;
}

.pf-k8s-dashboard .pf-k8s-cluster-links {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    color: #cbd5e1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.6rem;
}

.pf-k8s-dashboard .pf-k8s-cluster-links__item {
    color: #f8fafc;
    text-decoration: none;
    border: 1px solid rgba(248, 250, 252, 0.24);
    background: rgba(30, 41, 59, 0.45);
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
}

.pf-k8s-dashboard .pf-k8s-cluster-links__item:hover {
    color: #ffffff;
    border-color: rgba(248, 250, 252, 0.6);
    background: rgba(71, 85, 105, 0.44);
}

.pf-k8s-dashboard .pf-k8s-cluster-links__item--normal {
    color: #f8fafc;
    border-color: rgba(248, 250, 252, 0.28);
}

.pf-k8s-dashboard .pf-k8s-cluster-links__item--warning {
    color: #facc15;
    border-color: rgba(250, 204, 21, 0.45);
    background: rgba(113, 63, 18, 0.28);
}

.pf-k8s-dashboard .pf-k8s-cluster-links__item--critical {
    color: #f87171;
    border-color: rgba(248, 113, 113, 0.52);
    background: rgba(127, 29, 29, 0.28);
}

.pf-k8s-dashboard {
    scroll-behavior: smooth;
}

.pf-k8s-dashboard .pf-k8s-back-to-top {
    position: fixed;
    right: 18px;
    bottom: 22px;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(147, 197, 253, 0.45);
    background: rgba(15, 23, 42, 0.78);
    color: #dbeafe;
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: 700;
    box-shadow: 0 6px 18px rgba(2, 6, 23, 0.28);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    z-index: 1100;
}

.pf-k8s-dashboard .pf-k8s-back-to-top:hover {
    color: #ffffff;
    border-color: rgba(191, 219, 254, 0.75);
    background: rgba(30, 58, 138, 0.75);
}

.pf-k8s-dashboard .pf-sites-mono {
    color: #f1f5f9;
    background: rgba(15, 23, 42, 0.45);
    padding: 0.1em 0.35em;
    border-radius: 4px;
    font-size: 0.88em;
}

.pf-k8s-dashboard .pf-k8s-chart-desc {
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-left: 4px solid rgba(96, 165, 250, 0.65);
}

.pf-k8s-dashboard .pf-k8s-chart-desc__body {
    margin: 0 0 0.65rem;
    color: #f1f5f9;
    font-size: 0.9rem;
    line-height: 1.6;
    font-weight: 400;
}

.pf-k8s-dashboard .pf-k8s-chart-desc__body:last-child {
    margin-bottom: 0;
}

.pf-k8s-dashboard .pf-k8s-chart-desc__secondary {
    margin: 0;
    color: #cbd5e1;
    font-size: 0.875rem;
    line-height: 1.55;
    font-weight: 400;
}

.pf-k8s-dashboard .pf-k8s-chart-desc__secondary strong {
    color: #f8fafc;
    font-weight: 700;
}

.pf-k8s-dashboard .pf-k8s-chart-wrap {
    position: relative;
    height: 300px;
    width: 100%;
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px 12px 8px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.pf-k8s-dashboard .pf-k8s-nodepool-empty {
    color: #94a3b8;
    font-style: italic;
}

.pf-k8s-muted-inline {
    color: #94a3b8;
}

.pf-k8s-cluster-panel {
    border-left: 4px solid rgba(96, 165, 250, 0.45);
    border: 1px solid rgba(226, 232, 240, 0.4);
    border-radius: 14px;
    background: rgba(15, 23, 42, 0.56);
    padding: 1.4rem 1.5rem;
    box-shadow: 0 6px 18px rgba(2, 6, 23, 0.28);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    scroll-margin-top: 132px;
}

.pf-k8s-dashboard .pf-k8s-cluster-panel:hover {
    border-color: rgba(191, 219, 254, 0.65);
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.34);
    transform: translateY(-1px);
}

.pf-k8s-dashboard .pf-k8s-cluster-panel + .pf-k8s-cluster-panel {
    margin-top: 1rem;
}

.pf-k8s-dashboard .pf-k8s-cluster-panel .pf-stat-label {
    line-height: 1.25;
    margin-bottom: 0.25rem;
}

.pf-k8s-dashboard .pf-k8s-cluster-panel .pf-k8s-subhead {
    line-height: 1.3;
}

.pf-k8s-subhead {
    font-size: 0.95rem;
    font-weight: 700;
    color: #f8fafc;
    margin: 0 0 0.5rem;
    letter-spacing: 0.02em;
}

.pf-k8s-dashboard .pf-k8s-section {
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.2);
    padding: 10px 12px;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.pf-k8s-dashboard .pf-k8s-section:hover {
    border-color: rgba(226, 232, 240, 0.32);
}

.pf-k8s-dashboard .pf-k8s-section--control {
    background: rgba(59, 130, 246, 0.12);
}

.pf-k8s-dashboard .pf-k8s-section--nodespods {
    background: rgba(16, 185, 129, 0.1);
}

.pf-k8s-dashboard .pf-k8s-section--events {
    background: rgba(245, 158, 11, 0.12);
    margin-top: 0.5rem;
}

@media (max-width: 991.98px) {
    .pf-k8s-dashboard {
        padding: 0.5rem 0 0 0.45rem;
    }

    .pf-k8s-cluster-panel {
        padding: 1rem 1rem;
        border-radius: 12px;
    }

    .pf-k8s-dashboard .pf-k8s-cluster-panel + .pf-k8s-cluster-panel {
        margin-top: 0.8rem;
    }

    .pf-k8s-dashboard .pf-k8s-section {
        padding: 0.7rem 0.8rem;
    }
}

@media (max-width: 575.98px) {
    .pf-k8s-dashboard {
        padding: 0.35rem 0 0 0.25rem;
    }

    .pf-k8s-cluster-panel {
        padding: 0.9rem 0.85rem;
    }

    .pf-k8s-dashboard .pf-k8s-subhead {
        font-size: 0.9rem;
    }

    .pf-table-shell.pf-table-shell--compact th,
    .pf-table-shell.pf-table-shell--compact td {
        padding: 5px 6px;
        font-size: 0.8rem;
    }

    .pf-k8s-dashboard .pf-k8s-back-to-top {
        right: 12px;
        bottom: 14px;
        width: 38px;
        height: 38px;
    }
}

.pf-k8s-badge {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pf-k8s-badge--ok {
    color: #022c22;
    background: #6ee7b7;
}

.pf-k8s-badge--bad {
    color: #fff7ed;
    background: #c2410c;
}

.pf-table-shell.pf-table-shell--compact th,
.pf-table-shell.pf-table-shell--compact td {
    padding: 6px 8px;
    font-size: 0.85rem;
    vertical-align: top;
}

/* Kubernetes events row coloring (white / yellow / red text on dark chrome) */
.pf-k8s-dashboard .pf-k8s-event.pf-k8s-event--normal td {
    color: #f8fafc;
}

.pf-k8s-dashboard .pf-k8s-event.pf-k8s-event--warning td {
    color: #facc15;
}

.pf-k8s-dashboard .pf-k8s-event.pf-k8s-event--critical td {
    color: #f87171;
}

.pf-k8s-dashboard .pf-k8s-event-legend {
    font-weight: 700;
}

.pf-k8s-dashboard .pf-k8s-event-legend--normal {
    color: #f8fafc;
}

.pf-k8s-dashboard .pf-k8s-event-legend--warning {
    color: #facc15;
}

.pf-k8s-dashboard .pf-k8s-event-legend--critical {
    color: #f87171;
}

.pf-table-shell {
    width: 100%;
    border-collapse: collapse;
    background-color: rgba(30, 30, 30, 0.82);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.pf-table-shell thead {
    background: #2c2c2c;
}

.pf-table-shell th {
    color: #ecf0f1;
    font-weight: 700;
    padding: 10px;
    border-bottom: 1px solid #3c3c3c;
    text-align: left;
}

.pf-table-shell td {
    padding: 10px;
    border-bottom: 1px solid #3c3c3c;
    color: #bdc3c7;
}

.pf-table-shell tbody tr:hover {
    background-color: #2a2d2e;
}

.pf-link-strong {
    color: #3498db;
    text-decoration: none;
    font-weight: 700;
}

.pf-link-strong:hover {
    color: #60a5fa;
}

.pf-muted-empty {
    text-align: center;
    color: #7f8c8d;
    padding: 16px;
    font-style: italic;
}

.pf-text-amber {
    color: #f39c12;
}

.pf-text-good {
    color: #2ecc71;
    font-weight: 700;
}

.pf-text-volume {
    color: #60a5fa;
    font-weight: 600;
}

.pf-text-ecpm-gross {
    color: #a78bfa;
    font-weight: 700;
}

.pf-text-ecpm-net {
    color: #22d3ee;
    font-weight: 700;
}

.pf-table-shell td.pf-text-volume,
.bidder-table td.pf-text-volume {
    color: #60a5fa !important;
}

.pf-table-shell td.pf-text-good,
.bidder-table td.pf-text-good {
    color: #2ecc71 !important;
}

.pf-table-shell td.pf-text-amber,
.bidder-table td.pf-text-amber {
    color: #f39c12 !important;
}

.pf-table-shell td.pf-text-ecpm-gross,
.bidder-table td.pf-text-ecpm-gross {
    color: #a78bfa !important;
}

.pf-table-shell td.pf-text-ecpm-net,
.bidder-table td.pf-text-ecpm-net {
    color: #22d3ee !important;
}

.site-trend-canvas {
    width: 120px !important;
    height: 34px !important;
    display: block;
}

.bidder-row {
    display: none;
    background-color: #161616;
}

.bidder-table {
    width: 95%;
    margin: 10px auto;
    border: 1px solid #333;
    background: #252525;
}

.bidder-table th {
    background: #333;
    font-size: 12px;
    padding: 8px;
}

.bidder-table td {
    font-size: 13px;
    padding: 8px;
    border-bottom: 1px solid #2a2a2a;
}

.toggle-icon {
    display: inline-block;
    width: 15px;
    transition: transform 0.2s;
    cursor: pointer;
    color: #3498db;
}

.sort-link {
    color: #ecf0f1;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

.sort-link:hover {
    color: #3498db;
}

.sort-indicator {
    font-size: 10px;
    opacity: 0.5;
}

.active-sort {
    color: #3498db !important;
}

.active-sort .sort-indicator {
    opacity: 1;
}

.pf-pagination {
    margin-top: 20px;
    text-align: center;
}

.pf-pagination a,
.pf-pagination span {
    display: inline-block;
    padding: 6px 12px;
    margin: 0 3px;
    border-radius: 4px;
    background-color: #2c2c2c;
    color: #f1eced;
    text-decoration: none;
    font-size: 14px;
}

.pf-pagination .active {
    background-color: #3498db;
    color: #fff;
    font-weight: 700;
}

.pf-footer-info {
    margin-top: 20px;
    font-size: 14px;
    color: #aeb8c6;
    text-align: center;
}

.pf-pill-btn {
    background-color: #3498db;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 6px 12px;
    min-height: 34px;
    min-width: 58px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.pf-pill-btn:hover {
    background-color: #2f86c8;
}

.pf-inline-form {
    margin: 0;
}

.pf-inline-space {
    margin-left: 20px;
}

.pf-inline-note {
    color: #edf2f7;
    font-size: 12px;
}

.btn {
    border-radius: 8px;
    font-weight: 600;
    min-height: 38px;
    line-height: 1.2;
    padding: 0.45rem 0.9rem;
}

.btn.btn-sm {
    min-height: 32px;
    padding: 0.3rem 0.65rem;
    border-radius: 7px;
}

.pf-api-message {
    margin-left: 15px;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    display: none;
}

.pf-reports-page .summary-card {
    height: 100%;
}

.pf-zone-config .form-group label,
.pf-zone-config .col-form-label {
    color: #ecf0f1;
}

.pf-zone-config .parameter-row {
    padding: 12px 0;
    border-bottom: 1px solid #2f3541;
}

.pf-zone-config .nav-tabs .nav-link {
    color: #cbd5e1;
}

.pf-zone-config .nav-tabs .nav-link.active {
    color: #fff;
    background: #2c2c2c;
    border-color: #444 #444 #2c2c2c;
}

.pf-zone-config .tab-content {
    background: rgba(30, 30, 30, 0.55);
    border: 1px solid #444;
    border-top: 0;
    padding: 20px;
    border-radius: 0 0 8px 8px;
}

.pf-zone-config .form-control,
.pf-zone-config .bootstrap-duallistbox-container select {
    background: #222 !important;
    color: #fff !important;
    border: 1px solid #555 !important;
}

.pf-zone-config .form-control::placeholder {
    color: #9aa0a6;
}

/* Select2 (e.g. Website Configuration category multi-select) */
.pf-zone-config .select2-container--default .select2-selection--multiple {
    background: #222 !important;
    border: 1px solid #555 !important;
    color: #fff !important;
}

.pf-zone-config .select2-dropdown {
    background: #222;
    color: #fff;
    border: 1px solid #555;
}

.pf-zone-config .select2-results__option {
    color: #fff;
}

.pf-zone-config .bootstrap-duallistbox-container .box1,
.pf-zone-config .bootstrap-duallistbox-container .box2 {
    color: #fff;
}

.pf-zone-config .hr-line-dashed {
    border-top: 1px dashed #555;
    margin: 20px 0;
}

.pf-zone-config .modal-content {
    background: #1f2937;
    color: #fff;
    border: 1px solid #444;
}

.pf-zone-config .modal-content .form-control {
    background: #111827 !important;
    color: #fff !important;
}

.pf-stats-skeleton {
    margin-bottom: 1rem;
}

.pf-stats-results-fade {
    opacity: 0;
    transform: translateY(3px);
    transition: opacity 170ms ease, transform 170ms ease;
}

.pf-stats-results-fade.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.pf-stats-skeleton-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}

.pf-stats-skeleton-cards--cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pf-openai-dashboard__content--loaded {
    animation: pf-stats-fade-in 0.25s ease-out;
}

.pf-stats-skeleton-card,
.pf-stats-skeleton-line {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    background-color: rgba(148, 163, 184, 0.12);
}

.pf-stats-skeleton-card::after,
.pf-stats-skeleton-line::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(148, 163, 184, 0.22) 45%,
        transparent 100%
    );
    transform: translateX(-100%);
    animation: pf-skeleton-shimmer-slide 1.1s linear infinite;
}

@keyframes pf-skeleton-shimmer-slide {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(100%);
    }
}

.pf-stats-skeleton-card {
    height: 86px;
}

.pf-stats-skeleton-table {
    padding: 16px;
    border-radius: 10px;
    background: rgba(24, 28, 36, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.pf-stats-skeleton-line {
    height: 18px;
    margin-bottom: 12px;
}

.pf-stats-skeleton-line:last-child {
    margin-bottom: 0;
    width: 78%;
}

.pf-websites-skeleton {
    padding: 12px 0 2px;
}

.pf-websites-skeleton-line {
    height: 18px;
    margin-bottom: 12px;
    border-radius: 8px;
    background: linear-gradient(
        90deg,
        rgba(148, 163, 184, 0.14) 0%,
        rgba(148, 163, 184, 0.3) 45%,
        rgba(148, 163, 184, 0.14) 100%
    );
    background-size: 200% 100%;
    animation: pf-skeleton-shimmer 1.1s linear infinite;
}

.pf-websites-skeleton-line:last-child {
    width: 72%;
}

@keyframes pf-skeleton-shimmer {
    from {
        background-position: 200% 0;
    }
    to {
        background-position: -200% 0;
    }
}

@keyframes pf-stats-fade-in {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 992px) {
    .pf-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .content .container-fluid {
        padding-left: 14px;
        padding-right: 14px;
    }

    .pf-filter-form {
        gap: 12px;
        padding: 14px;
    }

    .pf-filter-row {
        gap: 10px;
    }

    .pf-date-input {
        width: 100%;
        max-width: 240px;
    }

    .pf-table-shell th,
    .pf-table-shell td {
        padding: 9px 8px;
        font-size: 13px;
    }

    .pf-pagination a,
    .pf-pagination span {
        padding: 6px 10px;
        margin: 0 2px;
    }

    .pf-inline-space {
        margin-left: 0;
    }
}

@media (max-width: 576px) {
    .pf-summary-grid {
        grid-template-columns: 1fr;
    }

    .pf-stats-skeleton-cards {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .page-title {
        margin-bottom: 0.85rem;
        padding-bottom: 0.85rem;
    }

    .pf-dashboard .pf-panel {
        padding: 1rem 1rem;
    }

    .pf-dashboard .pf-stat-value {
        font-size: 1.3rem;
    }

    .pf-page-head {
        margin-bottom: 1rem;
    }

    .pf-page-lead {
        font-size: 0.92rem;
    }
}

/* --- Beta Feedback Hub (/dashboard/feedback) --- */
.pf-feedback-hub .pf-page-head {
    margin-bottom: 1.5rem;
}

.pf-feedback-hub .pf-page-lead {
    max-width: 42rem;
    line-height: 1.6;
}

.pf-feedback-hub__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 1200px) {
    .pf-feedback-hub__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: start;
        gap: 1.75rem;
    }
}

.pf-feedback-hub__submit {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.pf-feedback-hub__submit .pf-feedback-hub__panel {
    flex: 1;
}

.pf-feedback-hub__history {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0;
    overflow: visible;
    max-height: calc(100vh - 11rem);
}

.pf-feedback-hub--admin .pf-feedback-hub__history {
    min-height: 0;
}

.pf-feedback-hub__history-inner {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    padding: 1.35rem 1.5rem;
    overflow: hidden;
}

.pf-feedback-hub__section-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 0.5rem;
    line-height: 1.35;
}

.pf-feedback-hub__section-lead {
    margin: 0 0 1.25rem;
    color: var(--muted);
    font-size: 0.9375rem;
    line-height: 1.55;
    max-width: 36rem;
}

.pf-feedback-hub__category-label {
    margin: 0.35rem 0 0.85rem;
    color: var(--muted);
    font-size: 0.875rem;
    line-height: 1.45;
}

.pf-feedback-hub__report-text {
    color: #e2e8f0;
    font-size: 0.9375rem;
    line-height: 1.65;
    white-space: pre-wrap;
    word-break: break-word;
}

.pf-feedback-hub__admin-list {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.pf-feedback-hub__admin-ticket {
    background: rgba(12, 16, 24, 0.55);
}

.pf-feedback-hub__admin-ticket > summary {
    gap: 0.55rem 0.75rem;
}

.pf-feedback-hub__admin-id {
    font-size: 0.8125rem;
    color: #cbd5e1;
    flex-shrink: 0;
}

.pf-feedback-hub__admin-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.65rem;
    margin-bottom: 0.65rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.pf-feedback-hub__admin-meta-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}

.pf-feedback-hub__admin-user {
    font-size: 0.875rem;
    color: #e2e8f0;
    word-break: break-word;
}

.pf-feedback-hub__admin-ticket .pf-feedback-hub__category-label {
    margin-top: 0;
}

.pf-feedback-hub__admin-ticket-actions {
    margin-top: 1rem;
    padding-top: 0.85rem;
    padding-bottom: 0.15rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.pf-feedback-hub__item-title {
    display: block;
    color: #fff;
    font-weight: 600;
    line-height: 1.4;
    word-break: break-word;
}

.pf-feedback-hub__tabs {
    margin-bottom: 1rem;
}

.pf-feedback-hub__tabs .pf-feedback-tab {
    cursor: pointer;
    border: none;
    font-family: inherit;
}

.pf-feedback-hub__form-panel {
    padding: 1.35rem 1.5rem;
}

.pf-feedback-hub__form-panel .form-group label {
    color: #e8ecf1;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.4;
    margin-bottom: 0.4rem;
}

.pf-feedback-hub__form-panel .form-text {
    color: var(--muted);
    line-height: 1.5;
}

.pf-feedback-hub__form-panel .form-control {
    background: rgba(12, 16, 24, 0.65);
    border-color: var(--border);
    color: var(--text);
    font-size: 0.9375rem;
    line-height: 1.5;
    padding: 0.55rem 0.75rem;
}

.pf-feedback-hub__form-panel textarea.form-control {
    min-height: 9rem;
    line-height: 1.6;
}

.pf-feedback-hub__form-panel .form-control:focus {
    background: rgba(12, 16, 24, 0.85);
    border-color: rgba(96, 165, 250, 0.65);
    color: var(--text);
    box-shadow: var(--focus-ring);
}

.pf-feedback-hub__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.65rem;
}

.pf-feedback-hub__chip {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.3;
    color: #cbd5e1;
    background: rgba(51, 65, 85, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 999px;
    cursor: pointer;
    transition:
        color var(--transition-fast),
        background-color var(--transition-fast),
        border-color var(--transition-fast);
}

.pf-feedback-hub__chip:hover {
    color: #fff;
    border-color: rgba(96, 165, 250, 0.55);
}

.pf-feedback-hub__chip.is-active {
    color: #fff;
    background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
    border-color: #93c5fd;
}

.pf-feedback-hub__data-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem;
    padding: 0.85rem;
    margin-top: 0.5rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(243, 156, 18, 0.35);
    background: rgba(243, 156, 18, 0.08);
}

.pf-feedback-hub__data-fields.is-hidden {
    display: none;
}

.pf-feedback-hub__form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    padding-top: 0.85rem;
    margin-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.pf-feedback-hub__attachments .form-text kbd {
    display: inline-block;
    padding: 0.1rem 0.35rem;
    font-size: 0.75rem;
    border-radius: 0.2rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.06);
}

.pf-feedback-hub__attach-zone {
    border: 1px dashed rgba(255, 255, 255, 0.22);
    border-radius: var(--radius-md);
    padding: 1rem;
    background: rgba(255, 255, 255, 0.03);
    transition: border-color 0.15s ease, background 0.15s ease;
    outline: none;
}

.pf-feedback-hub__attach-zone:focus-visible {
    border-color: rgba(93, 173, 226, 0.75);
    box-shadow: 0 0 0 2px rgba(93, 173, 226, 0.25);
}

.pf-feedback-hub__attach-zone.is-dragover,
.pf-feedback-hub__attach-zone.has-files {
    border-color: rgba(93, 173, 226, 0.55);
    background: rgba(93, 173, 226, 0.08);
}

.pf-feedback-hub__attach-zone.has-error {
    border-color: rgba(220, 53, 69, 0.75);
    background: rgba(220, 53, 69, 0.08);
}

.pf-feedback-hub__attach-error {
    line-height: 1.4;
}

.pf-feedback-hub__attach-zone-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    text-align: center;
}

.pf-feedback-hub__attach-icon {
    font-size: 1.25rem;
    opacity: 0.65;
}

.pf-feedback-hub__attach-hint {
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.65);
}

.pf-feedback-hub__file-input.is-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pf-feedback-hub__attach-list {
    list-style: none;
    margin: 0.75rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.pf-feedback-hub__attach-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0.55rem;
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.pf-feedback-hub__attach-preview {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

.pf-feedback-hub__attach-file-icon {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    background: rgba(255, 255, 255, 0.06);
    flex-shrink: 0;
}

.pf-feedback-hub__attach-meta {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pf-feedback-hub__attach-remove {
    padding: 0;
    line-height: 1;
}

.pf-feedback-hub__attachments-display {
    margin-top: 0.85rem;
}

.pf-feedback-hub__attachments-list {
    list-style: none;
    margin: 0.45rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.pf-feedback-hub__attachment-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.pf-feedback-hub__attachment-thumb-link {
    display: block;
    flex-shrink: 0;
}

.pf-feedback-hub__attachment-thumb {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.pf-feedback-hub__attachment-thumb--missing {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    object-fit: none;
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted);
    font-size: 1.25rem;
}

.pf-feedback-hub__attachments-list--reply {
    margin-top: 0.5rem;
}

.pf-feedback-hub__attachment-file-icon {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    background: rgba(255, 255, 255, 0.06);
    flex-shrink: 0;
}

.pf-feedback-hub__attachment-link {
    font-size: 0.875rem;
    word-break: break-all;
}

.pf-feedback-hub__attachment-size {
    font-size: 0.75rem;
}

.pf-feedback-hub__panel.is-hidden {
    display: none;
}

.pf-feedback-hub__empty {
    padding: 2rem 1rem;
}

.pf-feedback-hub__history-list {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.35rem;
    padding-bottom: 0.35rem;
    overscroll-behavior: contain;
}

.pf-feedback-hub__ticket-body {
    padding: 0.85rem 1rem 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    overflow: visible;
}

.pf-feedback-hub__ticket-body .pf-feedback-hub__report-text {
    margin-bottom: 0;
}

.pf-feedback-hub__ticket {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: rgba(24, 28, 36, 0.72);
    overflow: visible;
    flex-shrink: 0;
}

.pf-feedback-hub__ticket:not([open]) {
    overflow: hidden;
}

.pf-feedback-hub__ticket > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem 0.75rem;
    padding: 0.85rem 1rem;
}

.pf-feedback-hub__ticket > summary::-webkit-details-marker {
    display: none;
}

.pf-feedback-hub__ticket > summary::after {
    content: '▸';
    margin-left: auto;
    color: var(--muted);
    transition: transform var(--transition-fast);
}

.pf-feedback-hub__ticket[open] > summary::after {
    transform: rotate(90deg);
}

.pf-feedback-hub__ticket-title {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    color: #fff;
}

.pf-feedback-hub__status-badge--under_review {
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, 0.45);
    background: rgba(51, 65, 85, 0.35);
}

.pf-feedback-hub__status-badge--in_progress {
    color: #bfdbfe;
    border-color: rgba(96, 165, 250, 0.45);
    background: rgba(59, 130, 246, 0.18);
}

.pf-feedback-hub__status-badge--resolved {
    color: #bbf7d0;
    border-color: rgba(34, 197, 94, 0.45);
    background: rgba(34, 197, 94, 0.16);
}

.pf-feedback-hub__type-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pf-feedback-hub__type-badge--bug {
    color: #fecaca;
    background: rgba(239, 68, 68, 0.18);
    border: 1px solid rgba(239, 68, 68, 0.35);
}

.pf-feedback-hub__type-badge--idea {
    color: #ddd6fe;
    background: rgba(139, 92, 246, 0.18);
    border: 1px solid rgba(139, 92, 246, 0.35);
}

.pf-feedback-hub__status-badge {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--muted);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
}

.pf-feedback-hub__ai-box {
    margin-top: 0;
    padding: 0.85rem 1rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(96, 165, 250, 0.4);
    background: rgba(15, 23, 42, 0.72);
}

.pf-feedback-hub__ticket-body .pf-feedback-hub__ai-box {
    margin-top: 0.85rem;
}

.pf-feedback-hub__ai-box-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.65rem;
    margin-bottom: 0.5rem;
}

.pf-feedback-hub__ai-box-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #93c5fd;
    margin-bottom: 0;
}

.pf-feedback-hub__ai-provider-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: none;
    color: #dbeafe;
    background: rgba(59, 130, 246, 0.25);
    border: 1px solid rgba(96, 165, 250, 0.45);
}

.pf-feedback-hub__ai-provider-badge--fallback {
    color: #cbd5e1;
    background: rgba(51, 65, 85, 0.45);
    border-color: rgba(148, 163, 184, 0.35);
}

.pf-feedback-hub__scope-filter {
    margin-bottom: 1rem;
}

.pf-feedback-hub__scope-filter .pf-dashboard-period__btn {
    text-decoration: none;
}

.pf-feedback-hub__scope-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.pf-feedback-hub__scope-badge--dashboard {
    color: #bbf7d0;
    background: rgba(34, 197, 94, 0.16);
    border: 1px solid rgba(34, 197, 94, 0.4);
}

.pf-feedback-hub__scope-badge--out {
    color: #fcd34d;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.35);
}

.pf-feedback-hub__ai-box--out-of-scope {
    border-color: rgba(245, 158, 11, 0.45);
    background: rgba(41, 32, 12, 0.55);
}

.pf-feedback-hub__ai-box-label::before {
    content: '◆';
    font-size: 0.5rem;
    opacity: 0.85;
}

.pf-feedback-hub__ai-box p {
    margin: 0;
    color: #f1f5f9;
    font-size: 0.9375rem;
    line-height: 1.65;
    white-space: pre-wrap;
    word-break: break-word;
}

.pf-feedback-hub__value-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
    margin-top: 0.85rem;
}

.pf-feedback-hub__value-card {
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: rgba(12, 16, 24, 0.45);
}

.pf-feedback-hub__value-card-label {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 0.25rem;
}

.pf-feedback-hub__value-card-value {
    color: var(--text);
    font-size: 0.875rem;
    word-break: break-word;
}

.pf-feedback-hub__reply-list {
    list-style: none;
    margin: 0.65rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    max-height: none;
    overflow: visible;
}

.pf-feedback-hub__reply-item {
    padding: 0.65rem 0.75rem;
    margin-top: 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: rgba(12, 16, 24, 0.45);
    flex-shrink: 0;
}

.pf-feedback-hub__reply-meta {
    font-size: 0.75rem;
    color: var(--muted);
    margin-bottom: 0.25rem;
}

.pf-feedback-hub__reply-text {
    color: var(--text);
    font-size: 0.875rem;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
}

.pf-feedback-hub__admin-form {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
}

.pf-feedback-hub__admin-stack {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pf-feedback-hub__admin-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.pf-feedback-hub__admin-message {
    width: 100%;
    min-height: 4.5rem;
    resize: vertical;
    line-height: 1.55;
}

.pf-feedback-hub__admin-submit {
    display: flex;
    justify-content: flex-end;
}

.pf-feedback-hub__admin-submit--split {
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.pf-feedback-hub__admin-submit--sticky {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin-top: 1rem;
    padding: 0.65rem 0;
    background: linear-gradient(
        to top,
        rgba(12, 16, 24, 0.98) 70%,
        rgba(12, 16, 24, 0.85) 100%
    );
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.pf-feedback-hub__admin-delete-form {
    margin: 0;
}

.pf-feedback-hub__admin-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    margin: 0;
}

.pf-feedback-hub__admin-control {
    background: rgba(12, 16, 24, 0.65);
    border-color: var(--border);
    color: var(--text);
    font-size: 0.875rem;
    line-height: 1.45;
}

.pf-feedback-hub__admin-control:focus {
    background: rgba(12, 16, 24, 0.85);
    border-color: rgba(96, 165, 250, 0.65);
    color: var(--text);
    box-shadow: var(--focus-ring);
}

.pf-feedback-hub__admin-actions {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.pf-feedback-hub__admin-actions .pf-feedback-hub__admin-control {
    flex: 1;
    min-width: 0;
    margin-bottom: 0;
}

.pf-feedback-hub__admin-actions .btn {
    flex-shrink: 0;
}

.pf-feedback-hub__admin-replies {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.8125rem;
    line-height: 1.55;
    color: #cbd5e1;
}

.pf-feedback-hub__admin-replies li {
    margin-top: 0.25rem;
}

@media (max-width: 768px) {
    .pf-feedback-hub__data-fields,
    .pf-feedback-hub__value-grid {
        grid-template-columns: 1fr;
    }
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__chip.is-active {
    background: #4b5563;
    border-color: #9ca3af;
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__ai-box {
    border-color: rgba(156, 163, 175, 0.45);
    background: rgba(17, 24, 39, 0.85);
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__ai-box-label {
    color: #d1d5db;
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__ai-box p {
    color: #f3f4f6;
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__admin-ticket {
    background: rgba(17, 24, 39, 0.72);
}

html[data-pf-theme="dark-mono"] .pf-feedback-hub__report-text {
    color: #e5e7eb;
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__form-panel .form-control {
    background: #fff;
    color: var(--text);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__admin-control {
    background: #fff;
    color: var(--text);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__admin-ticket {
    background: var(--card);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__report-text {
    color: var(--text);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__ai-box {
    border-color: rgba(59, 130, 246, 0.35);
    background: rgba(239, 246, 255, 0.95);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__ai-box-label {
    color: #1d4ed8;
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__ai-box p {
    color: #1e293b;
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__ticket {
    background: var(--card);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__section-title,
html[data-pf-theme="light-mono"] .pf-feedback-hub__ticket-title,
html[data-pf-theme="light-mono"] .pf-feedback-hub__item-title {
    color: var(--text);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__attach-zone {
    border-color: rgba(15, 23, 42, 0.18);
    background: rgba(248, 250, 252, 0.95);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__attach-zone.has-error {
    border-color: rgba(220, 53, 69, 0.55);
    background: rgba(220, 53, 69, 0.06);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__attach-hint {
    color: rgba(15, 23, 42, 0.65);
}

html[data-pf-theme="light-mono"] .pf-feedback-hub__attach-item {
    background: rgba(248, 250, 252, 0.95);
    border-color: rgba(15, 23, 42, 0.1);
}

/* --- HAL Unified Assistant (/admin/assistant) --- */
.pf-assistant-page .pf-sites-lead {
    max-width: 52rem;
    margin-bottom: 1.25rem;
}

.pf-assistant-page-head,
.pf-assistant-kb-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.pf-assistant-kb-head-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pf-assistant-kb-page .pf-rb-help-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid var(--pf-border, #2d3a4d);
    border-radius: 0.35rem;
    background: transparent;
    color: inherit;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.pf-assistant-kb-page .pf-rb-help-btn:hover {
    border-color: #4a9eff;
    color: #9eceff;
    text-decoration: none;
}

.pf-assistant-kb-page {
    max-width: 960px;
}

.pf-assistant-kb-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

.pf-assistant-kb-section {
    padding: 1rem;
}

.pf-assistant-kb-textarea {
    min-height: 12rem;
    font-family: Consolas, Monaco, monospace;
    font-size: 0.875rem;
}

.pf-assistant-kb-table {
    width: 100%;
    min-width: 36rem;
}

.pf-assistant-kb-excerpt {
    max-width: 24rem;
    font-size: 0.8125rem;
    color: var(--pf-muted, #9aa8bc);
}

.pf-assistant-kb-dir-note {
    padding: 1rem;
}

.pf-assistant-kb-dir-list {
    padding-left: 1.25rem;
    font-size: 0.875rem;
}

.pf-assistant-kb-dir-list li {
    margin-bottom: 0.35rem;
}

.pf-assistant-kb-path-tag {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.1rem 0.45rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    font-family: Consolas, Monaco, monospace;
    background: rgba(255, 255, 255, 0.06);
    color: var(--pf-muted, #9aa8bc);
}

.pf-assistant-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem);
    gap: 1.25rem;
    align-items: start;
}

@media (max-width: 992px) {
    .pf-assistant-layout {
        grid-template-columns: 1fr;
    }
}

.pf-assistant-question {
    min-height: 6rem;
    resize: vertical;
    font-size: 0.9375rem;
}

.pf-assistant-form-actions {
    display: flex;
    justify-content: flex-end;
}

.pf-assistant-answer {
    padding: 1rem 1.15rem;
    line-height: 1.55;
    font-size: 0.9375rem;
}

.pf-assistant-answer p:last-child,
.pf-assistant-answer-list:last-child {
    margin-bottom: 0;
}

.pf-assistant-answer-list {
    padding-left: 1.25rem;
}

.pf-assistant-heading {
    margin: 1rem 0 0.5rem;
    font-size: 0.9375rem;
    font-weight: 700;
}

.pf-assistant-inline-code {
    padding: 0.1rem 0.35rem;
    border-radius: 0.25rem;
    background: rgba(108, 92, 231, 0.15);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8125rem;
}

.pf-assistant-code-block {
    margin: 0.75rem 0 1rem;
    border: 1px solid var(--pf-border, #2d3a4d);
    border-radius: 0.5rem;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.25);
}

.pf-assistant-code-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.35rem 0.75rem;
    border-bottom: 1px solid var(--pf-border, #2d3a4d);
    background: rgba(255, 255, 255, 0.04);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pf-muted, #9aa8bc);
}

.pf-assistant-code {
    margin: 0;
    padding: 0.85rem 1rem;
    overflow-x: auto;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: #e8edf4;
    white-space: pre;
}

.pf-assistant-code-inner {
    display: block;
}

.pf-assistant-cite-ref {
    text-decoration: none;
    font-weight: 600;
}

.pf-assistant-page {
    --pf-assistant-field-label-height: calc(0.75rem * 1.35 + 6px);
}

.pf-assistant-sidebar {
    position: sticky;
    top: 1rem;
}

.pf-assistant-sidebar > h3.pf-stat-label {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #bdc3c7;
}

.pf-assistant-sidebar--has-sources > h3.pf-stat-label {
    padding-top: var(--pf-assistant-field-label-height);
}

.pf-assistant-sidebar:not(.pf-assistant-sidebar--has-sources) #pf-assistant-sources-empty {
    padding-top: var(--pf-assistant-field-label-height);
}

@media (max-width: 992px) {
    .pf-assistant-sidebar--has-sources > h3.pf-stat-label,
    .pf-assistant-sidebar:not(.pf-assistant-sidebar--has-sources) #pf-assistant-sources-empty {
        padding-top: 0;
    }
}

.pf-assistant-citations {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pf-assistant-citation {
    padding: 0.75rem 0.85rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(148, 163, 184, 0.22);
    background: rgba(24, 28, 36, 0.5);
}

.pf-assistant-citation--structured_report {
    border-left: 3px solid #4ade80;
}

.pf-assistant-citation--document {
    border-left: 3px solid #60a5fa;
}

.pf-assistant-citation-id {
    display: inline-block;
    font-weight: 700;
    font-size: 0.75rem;
    margin-right: 0.35rem;
    color: #94a3b8;
}

.pf-assistant-citation-title {
    font-weight: 600;
    font-size: 0.875rem;
    margin: 0.25rem 0;
}

.pf-assistant-citation-excerpt {
    margin-top: 0.35rem;
}

.pf-assistant-citation-type {
    margin-top: 0.5rem;
    font-size: 0.65rem;
    text-transform: uppercase;
}

.pf-assistant-pre {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.75rem;
    max-height: 12rem;
    overflow: auto;
}

.pf-assistant-visuals {
    margin-top: 1rem;
}

.pf-assistant-visual-block {
    padding: 1rem;
}

.pf-assistant-visual-head {
    margin-bottom: 0.75rem;
}

.pf-assistant-table-wrap {
    overflow-x: auto;
    margin-bottom: 0.5rem;
}

.pf-assistant-data-table {
    width: 100%;
    min-width: 32rem;
}

.pf-assistant-chart-block {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--pf-border, #2d3a4d);
}

.pf-assistant-chart-canvas-wrap {
    position: relative;
    height: 280px;
    max-width: 100%;
}

.pf-assistant-diagram-block {
    margin-bottom: 0.5rem;
}

.pf-assistant-diagram-wrap {
    overflow-x: auto;
    margin-top: 0.75rem;
    padding: 0.5rem;
    border: 1px solid var(--pf-border, #2d3a4d);
    border-radius: 8px;
    background: var(--pf-panel-bg, rgba(15, 23, 42, 0.35));
}

.pf-assistant-diagram-wrap svg {
    display: block;
    width: 100%;
    max-width: 920px;
    height: auto;
    min-width: 640px;
}

.pf-assistant-doc-body {
    white-space: pre-wrap;
    font-size: 0.875rem;
    line-height: 1.5;
}

html[data-pf-theme="light-mono"] .pf-assistant-citation {
    background: var(--card);
    border-color: var(--border);
}

html[data-pf-theme="light-mono"] .pf-assistant-code-block {
    background: #f4f6f9;
    border-color: var(--border);
}

html[data-pf-theme="light-mono"] .pf-assistant-code-head {
    background: #e8edf4;
    color: #475569;
    border-bottom-color: var(--border);
}

html[data-pf-theme="light-mono"] .pf-assistant-code {
    color: #1e293b;
}

html[data-pf-theme="light-mono"] .pf-assistant-inline-code {
    background: rgba(108, 92, 231, 0.12);
    color: #312e81;
}

/* Analytics Copilot help manual (/admin/stats-query/help) */
.pf-rb-help-page {
    --pf-rb-help-border: #2d3a4d;
    --pf-rb-help-panel: #1a2332;
    --pf-rb-help-input: #121a26;
    --pf-rb-help-text: #e8edf4;
    --pf-rb-help-muted: #9aa8bc;
    --pf-rb-help-th-bg: #121a26;
    --pf-rb-help-strong: #f8fafc;
    --pf-rb-help-subheading: #c5d0e0;
    --pf-rb-help-code-fg: #9eceff;
    --pf-rb-help-link: #6eb5ff;
    --pf-rb-help-link-hover: #9eceff;
    --pf-rb-help-row-alt: rgba(255, 255, 255, 0.03);
    max-width: 56rem;
    color: var(--pf-rb-help-text);
}

.pf-rb-help-back {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 1.25rem;
    font-size: 0.875rem;
    color: var(--pf-rb-help-link);
    text-decoration: none;
}

.pf-rb-help-back:hover {
    color: var(--pf-rb-help-link-hover);
    text-decoration: underline;
}

.pf-rb-help-body {
    background: var(--pf-rb-help-panel);
    border: 1px solid var(--pf-rb-help-border);
    border-radius: 0.5rem;
    padding: 1.25rem 1.5rem;
    overflow-x: auto;
}

.pf-rb-help-markdown {
    line-height: 1.55;
    font-size: 0.9375rem;
    min-width: 0;
}

.pf-rb-help-markdown > :first-child {
    margin-top: 0;
}

.pf-rb-help-markdown h1 {
    font-size: 1.35rem;
    margin: 0 0 1rem;
    color: var(--pf-rb-help-text);
}

.pf-rb-help-markdown h2 {
    font-size: 1.1rem;
    margin: 1.75rem 0 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--pf-rb-help-border);
    color: var(--pf-rb-help-text);
}

.pf-rb-help-markdown h2:first-child {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.pf-rb-help-markdown h3 {
    font-size: 1rem;
    margin: 1.25rem 0 0.5rem;
    color: var(--pf-rb-help-subheading);
}

.pf-rb-help-markdown p,
.pf-rb-help-markdown li {
    color: var(--pf-rb-help-text);
}

.pf-rb-help-markdown p {
    margin: 0 0 0.75rem;
}

.pf-rb-help-markdown ul,
.pf-rb-help-markdown ol {
    margin: 0 0 0.75rem;
    padding-left: 1.35rem;
}

.pf-rb-help-markdown li {
    margin-bottom: 0.35rem;
}

.pf-rb-help-markdown strong {
    color: var(--pf-rb-help-strong);
    font-weight: 700;
}

.pf-rb-help-markdown code {
    background: var(--pf-rb-help-input);
    padding: 0.12rem 0.35rem;
    border-radius: 0.25rem;
    font-size: 0.8125rem;
    color: var(--pf-rb-help-code-fg);
}

.pf-rb-help-markdown a {
    color: var(--pf-rb-help-link);
    text-decoration: underline;
}

.pf-rb-help-markdown hr {
    border: none;
    border-top: 1px solid var(--pf-rb-help-border);
    margin: 1.25rem 0;
}

.pf-rb-help-markdown table {
    display: table;
    width: 100%;
    min-width: 28rem;
    border-collapse: collapse;
    margin: 0.75rem 0 1rem;
    font-size: 0.8125rem;
    table-layout: auto;
}

.pf-rb-help-markdown thead {
    display: table-header-group;
}

.pf-rb-help-markdown tbody {
    display: table-row-group;
}

.pf-rb-help-markdown tr {
    display: table-row;
}

.pf-rb-help-markdown th,
.pf-rb-help-markdown td {
    display: table-cell;
    border: 1px solid var(--pf-rb-help-border);
    padding: 0.5rem 0.65rem;
    text-align: left;
    vertical-align: top;
    word-break: break-word;
    color: var(--pf-rb-help-text);
}

.pf-rb-help-markdown th {
    background: var(--pf-rb-help-th-bg);
    color: var(--pf-rb-help-subheading);
    font-weight: 600;
}

.pf-rb-help-markdown tbody tr:nth-child(even) td {
    background: var(--pf-rb-help-row-alt);
}

.pf-rb-help-empty {
    color: var(--pf-rb-help-muted);
    margin: 0;
}


/* --- Ad Tags (create/tag) --- */
.pf-create-tag {
    --pf-tag-code-bg: #111827;
    --pf-tag-code-fg: #e5e7eb;
    --pf-tag-code-border: #4b5563;
    --pf-tag-nav-bg: rgba(31, 41, 55, 0.55);
    --pf-tag-nav-active-bg: #374151;
    --pf-tag-nav-active-fg: #f9fafb;
    --pf-tag-nav-fg: #d1d5db;
    --pf-tag-surface: rgba(31, 41, 55, 0.4);
    --pf-tag-border: #4b5563;
    --pf-tag-muted: #9ca3af;
}

.pf-create-tag .ibox,
.pf-create-tag .ibox-title,
.pf-create-tag .ibox-content,
.pf-create-tag .ibox-footer {
    background: transparent !important;
    border: none !important;
    border-color: transparent !important;
    color: inherit;
    box-shadow: none !important;
}

.pf-create-tag .ibox-tools { display: none !important; }

.pf-create-tag__tabs > .nav-tabs {
    border-bottom: 1px solid var(--pf-tag-border);
    margin-bottom: 0;
}

.pf-create-tag__tabs > .nav-tabs .nav-link {
    color: var(--pf-tag-nav-fg);
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0.55rem 1rem;
    font-weight: 600;
}

.pf-create-tag__tabs > .nav-tabs .nav-link.active,
.pf-create-tag__tabs > .nav-tabs .nav-link:hover {
    color: var(--pf-tag-nav-active-fg);
    background: transparent;
    border-bottom-color: var(--pf-tag-nav-active-fg);
}

.pf-create-tag__panel { padding: 0 !important; }

.pf-create-tag__layout {
    display: flex;
    gap: 0;
    align-items: stretch;
    min-height: 28rem;
    border: 1px solid var(--pf-tag-border);
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--pf-tag-surface);
}

.pf-create-tag .tabs-container .tabs-left > .nav-tabs {
    float: none !important;
    width: auto !important;
    margin-right: 0 !important;
}

.pf-create-tag__zone-nav {
    display: block !important;
    flex: 0 0 15.5rem;
    max-width: 15.5rem;
    max-height: min(70vh, 40rem);
    overflow-y: auto;
    margin: 0 !important;
    padding: 0.5rem 0;
    border: 0 !important;
    border-right: 1px solid var(--pf-tag-border) !important;
    background: var(--pf-tag-nav-bg);
}

.pf-create-tag__zone-nav > li {
    float: none !important;
    display: block;
    width: 100%;
    margin: 0 !important;
}

.pf-create-tag__zone-nav .nav-link {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--pf-tag-nav-fg) !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    border-radius: 0 !important;
    padding: 0.55rem 0.85rem !important;
    font-size: 0.875rem;
    line-height: 1.35;
    text-decoration: none !important;
}

.pf-create-tag__zone-nav .nav-link:hover {
    color: var(--pf-tag-nav-active-fg) !important;
    background: rgba(255, 255, 255, 0.04) !important;
}

.pf-create-tag__zone-nav .nav-link.active,
.pf-create-tag__zone-nav a.active {
    color: var(--pf-tag-nav-active-fg) !important;
    background: var(--pf-tag-nav-active-bg) !important;
    border-left-color: #e5e7eb !important;
    font-weight: 600;
}

.pf-create-tag__detail {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    padding: 0;
}

.pf-create-tag__detail > .tab-pane > .panel-body {
    padding: 1rem 1.25rem 1.25rem !important;
}

.pf-create-tag__header {
    padding: 0 0 0.75rem !important;
    border-bottom: none !important;
    margin-bottom: 0.85rem;
}

.pf-create-tag__title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.pf-create-tag__zone-name {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 650;
    line-height: 1.3;
}

.pf-create-tag__site-name {
    margin-top: 0.2rem;
    color: var(--pf-tag-muted);
    font-size: 0.9rem;
}

.pf-create-tag__pix-id {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.55rem;
    border-radius: 0.35rem;
    border: 1px solid var(--pf-tag-border);
    background: rgba(0, 0, 0, 0.25);
    color: var(--pf-tag-muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    white-space: nowrap;
}

.pf-create-tag__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 0.85rem;
}

.pf-create-tag__label {
    margin: 0;
    color: var(--pf-tag-muted);
    font-size: 0.8rem;
    font-weight: 600;
}

.pf-create-tag__select,
.pf-create-tag select.ampSelect,
.pf-create-tag .ibox-footer select {
    min-width: 12rem;
    max-width: 100%;
    padding: 0.35rem 0.55rem;
    border-radius: 0.35rem;
    border: 1px solid var(--pf-tag-border);
    background: #111827;
    color: #f3f4f6;
}

.pf-create-tag__link,
.pf-create-tag .sample_link {
    margin-left: 0 !important;
    color: #e5e7eb !important;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
    font-weight: 500;
}

.pf-create-tag__link:hover,
.pf-create-tag .sample_link:hover {
    color: #ffffff !important;
}

.pf-create-tag__hint {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-top: 0.85rem;
    padding: 0.65rem 0.75rem;
    border-radius: 0.4rem;
    border: 1px solid var(--pf-tag-border);
    background: rgba(0, 0, 0, 0.2);
    color: var(--pf-tag-muted);
    font-size: 0.875rem;
    line-height: 1.4;
}

.pf-create-tag__hint .material-icons {
    font-size: 1.15rem;
    color: #d1d5db;
    margin-top: 0.05rem;
}

.pf-create-tag__hint code {
    color: #f3f4f6;
    background: rgba(255, 255, 255, 0.08);
    padding: 0.05rem 0.3rem;
    border-radius: 0.25rem;
    font-size: 0.8em;
}

.pf-create-tag__code-wrap {
    padding: 0 !important;
    border: 0 !important;
}

.pf-create-tag .tag_container { position: relative; }

.pf-create-tag .tags_textarea {
    background-color: var(--pf-tag-code-bg) !important;
    color: var(--pf-tag-code-fg) !important;
    border: 1px solid var(--pf-tag-code-border) !important;
    border-radius: 0.45rem;
    padding: 1rem 1.1rem;
    min-height: 11rem;
    max-height: 24rem;
    overflow: auto !important;
    resize: vertical;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    line-height: 1.45;
}

.pf-create-tag .copy_btns {
    position: absolute;
    top: 0.55rem;
    right: 0.65rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.55rem;
    border-radius: 0.35rem;
    border: 1px solid var(--pf-tag-border);
    background: rgba(17, 24, 39, 0.92);
    color: #e5e7eb;
    cursor: pointer;
}

.pf-create-tag .copy_btns:hover,
.pf-create-tag .copy_btns.copied_tag {
    color: #ffffff;
    border-color: #9ca3af;
}

.pf-create-tag .copy_btns .fa-copy { font-size: 1rem !important; }

.pf-create-tag .confirming_messages {
    font-size: 0.75rem;
    font-weight: 600;
}

.pf-create-tag__footer {
    margin-top: 1rem;
    padding-top: 0.85rem !important;
    border-top: 1px solid var(--pf-tag-border) !important;
}

.pf-create-tag__passback-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.pf-create-tag .passback_textarea {
    display: block;
    width: 100%;
    min-height: 6.5rem;
    margin: 0.5rem 0;
    padding: 0.65rem 0.75rem;
    border-radius: 0.4rem;
    border: 1px solid var(--pf-tag-code-border);
    background: var(--pf-tag-code-bg);
    color: var(--pf-tag-code-fg);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
}

.pf-create-tag .passback_form_display {
    display: block;
    width: 100%;
    max-width: 40rem;
}

@media (max-width: 900px) {
    .pf-create-tag__layout {
        flex-direction: column;
        min-height: 0;
    }
    .pf-create-tag__zone-nav {
        flex: 0 0 auto;
        max-width: none;
        max-height: 12rem;
        border-right: 0 !important;
        border-bottom: 1px solid var(--pf-tag-border) !important;
    }
    .pf-create-tag__title-row {
        flex-direction: column;
        align-items: flex-start;
    }
}


/* --- UserX (/userx) --- */
.pf-userx {
    --pf-userx-surface: #ffffff;
    --pf-userx-border: #d1d5db;
    --pf-userx-muted: #4b5563;
    --pf-userx-text: #111827;
    --pf-userx-head-bg: #f3f4f6;
    --pf-userx-code-bg: #ffffff;
    --pf-userx-code-fg: #111827;
    --pf-userx-control-bg: #ffffff;
    --pf-userx-link: #2563eb;
}

.pf-userx__card {
    background: var(--pf-userx-surface);
    border: 1px solid var(--pf-userx-border);
    border-radius: 0.35rem;
    padding: 1.15rem 1.35rem 1.5rem;
    color: var(--pf-userx-text);
}

.pf-userx__section-title {
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 650;
    color: var(--pf-userx-text);
}

.pf-userx__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(16rem, 0.85fr);
    gap: 1.25rem 1.75rem;
    align-items: center;
}

.pf-userx__lead {
    margin: 0 0 0.85rem;
    color: var(--pf-userx-muted);
    line-height: 1.55;
    font-size: 0.95rem;
}

.pf-userx__lead a {
    color: var(--pf-userx-link);
    text-decoration: none;
}

.pf-userx__lead a:hover {
    text-decoration: underline;
}

.pf-userx__list-title {
    margin: 0 0 0.4rem;
    font-size: 0.95rem;
    font-weight: 650;
    color: var(--pf-userx-text);
}

.pf-userx__benefits {
    margin: 0 0 1rem;
    padding-left: 1.2rem;
    color: var(--pf-userx-muted);
    font-size: 0.95rem;
}

.pf-userx__benefits li {
    margin-bottom: 0.3rem;
    line-height: 1.45;
}

.pf-userx__hint {
    margin: 0 0 0.85rem;
    color: var(--pf-userx-muted);
    font-size: 0.95rem;
    line-height: 1.45;
}

.pf-userx__hint code {
    color: var(--pf-userx-text);
    font-size: 0.9em;
}

.pf-userx__table {
    border: 1px solid var(--pf-userx-border);
    border-radius: 0.25rem;
    overflow: hidden;
    background: var(--pf-userx-surface);
}

.pf-userx__table-head,
.pf-userx__table-body {
    display: grid;
    grid-template-columns: minmax(10rem, 0.42fr) minmax(12rem, 0.58fr);
}

.pf-userx__table-head {
    background: var(--pf-userx-head-bg);
    border-bottom: 1px solid var(--pf-userx-border);
    font-size: 0.85rem;
    font-weight: 650;
    color: var(--pf-userx-text);
}

.pf-userx__table-head span {
    padding: 0.55rem 0.75rem;
    text-align: center;
}

.pf-userx__table-head span + span,
.pf-userx__cell + .pf-userx__cell {
    border-left: 1px solid var(--pf-userx-border);
}

.pf-userx__cell {
    padding: 0.65rem 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.pf-userx__cell--site .select2-container,
.pf-userx__site-select {
    width: 100% !important;
    max-width: 100%;
}

.pf-userx__code,
.pf-userx input.website_code {
    width: 100%;
    min-height: 2.35rem;
    padding: 0.4rem 0.55rem;
    border-radius: 0.3rem;
    border: 1px solid #aaa;
    background: var(--pf-userx-code-bg) !important;
    color: var(--pf-userx-code-fg) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
    line-height: 1.35;
    cursor: pointer;
}

.pf-userx__aside {
    display: flex;
    justify-content: center;
    align-items: center;
}

.pf-userx__diagram {
    width: 100%;
    max-width: 26rem;
    height: auto;
}

.pf-userx .select2-container--default .select2-selection--single {
    min-height: 2.35rem;
    background: var(--pf-userx-control-bg) !important;
    border: 1px solid #aaa !important;
    border-radius: 0.3rem !important;
}

.pf-userx .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--pf-userx-text) !important;
    line-height: 2.25rem;
    padding-left: 0.65rem;
}

.pf-userx .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #6b7280 !important;
}

.pf-userx .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 2.25rem;
}

.pf-userx .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 990px) {
    .pf-userx__layout {
        grid-template-columns: 1fr;
    }

    .pf-userx__aside {
        order: -1;
    }

    .pf-userx__diagram {
        max-width: 20rem;
    }
}

@media (max-width: 640px) {
    .pf-userx__table-head,
    .pf-userx__table-body {
        grid-template-columns: 1fr;
    }

    .pf-userx__table-head span + span,
    .pf-userx__cell + .pf-userx__cell {
        border-left: 0;
        border-top: 1px solid var(--pf-userx-border);
    }

    .pf-userx__aside {
        display: none;
    }
}


/* --- Ads.txt (/ads/txt) --- */
.pf-ads-txt {
    --pf-ads-surface: rgba(31, 41, 55, 0.45);
    --pf-ads-border: #4b5563;
    --pf-ads-muted: #9ca3af;
    --pf-ads-text: #f3f4f6;
    --pf-ads-code-bg: #0b1220;
    --pf-ads-code-fg: #e5e7eb;
    --pf-ads-mark-bg: #fbbf24;
    --pf-ads-mark-fg: #111827;
}

.pf-ads-txt__intro {
    margin-bottom: 1rem;
    padding: 0.9rem 1.05rem;
    border: 1px solid var(--pf-ads-border);
    border-radius: 0.5rem;
    background: var(--pf-ads-surface);
    color: var(--pf-ads-muted);
    line-height: 1.5;
}

.pf-ads-txt__intro p {
    margin: 0 0 0.55rem;
}

.pf-ads-txt__intro strong {
    color: var(--pf-ads-text);
}

.pf-ads-txt__hint {
    padding: 0.7rem 0.9rem;
    border-radius: 0.4rem;
    border: 1px solid var(--pf-ads-border);
    background: rgba(0, 0, 0, 0.18);
    color: var(--pf-ads-muted);
    font-size: 0.9rem;
}

.pf-ads-txt__hint a,
.pf-ads-txt__help a {
    color: #e5e7eb;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pf-ads-txt__hint code,
.pf-ads-txt code {
    color: var(--pf-ads-text);
    background: rgba(255, 255, 255, 0.08);
    padding: 0.05rem 0.3rem;
    border-radius: 0.25rem;
    font-size: 0.85em;
}

.pf-ads-txt__card {
    border: 1px solid var(--pf-ads-border);
    border-radius: 0.5rem;
    background: var(--pf-ads-surface);
    overflow: hidden;
}

.pf-ads-txt__card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem 1rem;
    padding: 0.95rem 1.1rem;
    border-bottom: 1px solid var(--pf-ads-border);
}

.pf-ads-txt__card-title {
    margin: 0 0 0.2rem;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--pf-ads-text);
}

.pf-ads-txt__card-sub {
    color: var(--pf-ads-muted);
    font-size: 0.875rem;
}

.pf-ads-txt__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pf-ads-txt__code {
    margin: 0;
    padding: 1rem 1.1rem;
    max-height: min(60vh, 36rem);
    overflow: auto;
    background: var(--pf-ads-code-bg) !important;
    color: var(--pf-ads-code-fg) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
    border: 0;
}

.pf-ads-txt__mark {
    background: var(--pf-ads-mark-bg);
    color: var(--pf-ads-mark-fg);
    border-radius: 0.2rem;
    padding: 0 0.2rem;
    font-weight: 700;
}

.pf-ads-txt__help {
    margin-top: 1rem;
    color: var(--pf-ads-muted);
    font-size: 0.9rem;
}

.pf-ads-txt__sep {
    margin: 0 0.35rem;
    opacity: 0.7;
}

@media (max-width: 640px) {
    .pf-ads-txt__card-head {
        flex-direction: column;
    }

    .pf-ads-txt__actions {
        width: 100%;
    }

    .pf-ads-txt__actions .btn {
        flex: 1 1 auto;
    }
}


/* --- Payment details (/payment/details) --- */
.pf-payment-details__card {
    background: var(--pf-pay-surface, rgba(31, 41, 55, 0.45));
    border: 1px solid var(--pf-pay-border, #4b5563);
    border-radius: 0.5rem;
    padding: 1.15rem 1.25rem 1.35rem;
}

.pf-payment-details__card-title {
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 650;
    color: var(--pf-pay-text, #f3f4f6);
}

.pf-payment-details__form .col-form-label {
    color: var(--pf-pay-muted, #9ca3af);
    font-size: 0.9rem;
}

.pf-payment-details__form .form-control {
    background: var(--pf-pay-input-bg, #111827);
    color: var(--pf-pay-text, #f3f4f6);
    border-color: var(--pf-pay-border, #4b5563);
}

.pf-payment-details__form .form-control:focus {
    border-color: #9ca3af;
    box-shadow: 0 0 0 0.15rem rgba(156, 163, 175, 0.25);
}

.pf-payment-details__usd-note {
    margin: 0.25rem 0 1rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.35rem;
    border: 1px solid var(--pf-pay-border, #4b5563);
    background: rgba(0, 0, 0, 0.15);
}

.pf-payment-details__dynamic .nav-tabs {
    border-bottom: 1px solid var(--pf-pay-border, #4b5563);
    margin-bottom: 0;
}

.pf-payment-details__dynamic .nav-tabs .nav-link {
    color: var(--pf-pay-muted, #9ca3af);
    border: 0;
    border-top: 2px solid transparent;
    border-radius: 0;
    padding: 0.65rem 0.9rem;
    font-weight: 600;
}

.pf-payment-details__dynamic .nav-tabs .nav-link.active {
    color: var(--pf-pay-text, #f3f4f6);
    background: transparent;
    border-top-color: #60a5fa;
}

.pf-payment-details__dynamic .tab-content {
    border: 1px solid var(--pf-pay-border, #4b5563);
    border-top: 0;
    border-radius: 0 0 0.4rem 0.4rem;
    padding: 1rem 0.75rem 0.5rem;
    background: rgba(0, 0, 0, 0.12);
}

.pf-payment-details__actions .btn {
    margin-right: 0.4rem;
}

.pf-payment-details label.error {
    color: #f87171;
    font-size: 0.8rem;
    display: block;
    margin-top: 0.25rem;
}

.pf-payment-details .form-control.error {
    border-color: #f87171;
}


/* --- Payments (/invoices) --- */
.pf-payments {
    --pf-pay-surface: rgba(31, 41, 55, 0.45);
    --pf-pay-border: #4b5563;
    --pf-pay-text: #f3f4f6;
    --pf-pay-muted: #9ca3af;
    --pf-pay-row: rgba(0, 0, 0, 0.12);
    max-width: 920px;
}

.pf-payments__list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pf-payments__card.ibox {
    margin: 0;
    background: var(--pf-pay-surface);
    border: 1px solid var(--pf-pay-border);
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: none;
}

.pf-payments__head.ibox-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 0;
    padding: 0.9rem 1.1rem;
    background: transparent;
    border: 0;
    min-height: 0;
    cursor: pointer;
    user-select: none;
}

.pf-payments__head-main {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.pf-payments__period {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--pf-pay-text);
    line-height: 1.2;
}

.pf-payments__status {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: capitalize;
    border: 1px solid transparent;
}

.pf-payments__status--paid {
    color: #166534;
    background: #dcfce7;
    border-color: #bbf7d0;
}

.pf-payments__status--pending {
    color: #92400e;
    background: #ffedd5;
    border-color: #fed7aa;
}

.pf-payments__head-aside {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-left: auto;
}

.pf-payments__head-aside .cprint {
    flex-shrink: 0;
}

.pf-payments__amount {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--pf-pay-text);
    white-space: nowrap;
}

.pf-payments__amount .fa-chevron-down {
    font-size: 0.75rem;
    color: var(--pf-pay-muted);
    transition: transform 0.2s ease;
}

.pf-payments__amount.invoice-closed .fa-chevron-down {
    transform: rotate(-90deg);
}

.pf-payments__body.ibox-content {
    display: none;
    margin: 0;
    padding: 0 1.1rem 1.15rem;
    background: transparent;
    border-top: 1px solid var(--pf-pay-border);
}

.pf-payments__meta {
    padding: 0.85rem 0 0.65rem;
    color: var(--pf-pay-text);
    font-size: 0.92rem;
}

.pf-payments__label {
    color: var(--pf-pay-muted);
    margin-right: 0.35rem;
    font-weight: 600;
}

.pf-payments__table {
    border: 1px solid var(--pf-pay-border);
    border-radius: 0.4rem;
    overflow: hidden;
}

.pf-payments__row {
    display: grid;
    grid-template-columns: 2.5rem 1fr auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.65rem 0.85rem;
    color: var(--pf-pay-text);
    font-size: 0.9rem;
    border-top: 1px solid var(--pf-pay-border);
}

.pf-payments__row:first-child {
    border-top: 0;
}

.pf-payments__row--head {
    background: var(--pf-pay-row);
    color: var(--pf-pay-muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pf-payments__row--adj {
    color: var(--pf-pay-muted);
}

.pf-payments__row > :last-child {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.pf-payments__footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 0.9rem;
    padding-top: 0.85rem;
    border-top: 1px dashed var(--pf-pay-border);
}

.pf-payments__note {
    flex: 1 1 220px;
    color: var(--pf-pay-muted);
    font-size: 0.88rem;
    line-height: 1.45;
}

.pf-payments__total {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    margin-left: auto;
}

.pf-payments__total span {
    color: var(--pf-pay-muted);
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pf-payments__total strong {
    color: var(--pf-pay-text);
    font-size: 1.25rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 576px) {
    .pf-payments__head.ibox-title {
        align-items: flex-start;
    }

    .pf-payments__head-aside {
        width: 100%;
        justify-content: space-between;
    }
}


/* --- Account balance (/balance) --- */
.pf-balance {
    --pf-bal-surface: rgba(31, 41, 55, 0.45);
    --pf-bal-border: #4b5563;
    --pf-bal-text: #f3f4f6;
    --pf-bal-muted: #9ca3af;
    --pf-bal-row: rgba(0, 0, 0, 0.12);
    --pf-bal-accent: #60a5fa;
    max-width: 920px;
}

.pf-balance__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.pf-balance__header .page-title {
    margin-bottom: 0.25rem;
}

.pf-balance__summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-bottom: 1.75rem;
}

.pf-balance__stat {
    background: var(--pf-bal-surface);
    border: 1px solid var(--pf-bal-border);
    border-radius: 0.5rem;
    padding: 1.1rem 1.2rem 1.2rem;
    border-left: 3px solid var(--pf-bal-accent);
}

.pf-balance__stat--hold {
    border-left-color: #f59e0b;
}

.pf-balance__stat-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--pf-bal-muted);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pf-balance__hint {
    color: var(--pf-bal-muted);
    cursor: help;
    font-size: 0.85rem;
}

.pf-balance__stat-value {
    display: block;
    margin-top: 0.35rem;
    color: var(--pf-bal-text);
    font-size: 1.75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.pf-balance__stat-note {
    display: block;
    margin-top: 0.35rem;
    color: var(--pf-bal-muted);
    font-size: 0.82rem;
}

.pf-balance__section-title {
    margin: 0 0 0.85rem;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--pf-bal-text);
}

.pf-balance__list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pf-balance__card.ibox {
    margin: 0;
    background: var(--pf-bal-surface);
    border: 1px solid var(--pf-bal-border);
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: none;
}

.pf-balance__head.ibox-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 0;
    padding: 0.9rem 1.1rem;
    background: transparent;
    border: 0;
    min-height: 0;
    cursor: pointer;
    user-select: none;
}

.pf-balance__head-main {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.pf-balance__date {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--pf-bal-text);
    line-height: 1.2;
}

.pf-balance__status {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: capitalize;
    border: 1px solid transparent;
}

.pf-balance__status--ok {
    color: #166534;
    background: #dcfce7;
    border-color: #bbf7d0;
}

.pf-balance__status--pending {
    color: #92400e;
    background: #ffedd5;
    border-color: #fed7aa;
}

.pf-balance__head-aside {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-left: auto;
}

.pf-balance__amount {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--pf-bal-text);
    white-space: nowrap;
}

.pf-balance__amount .fa-chevron-down {
    font-size: 0.75rem;
    color: var(--pf-bal-muted);
    transition: transform 0.2s ease;
}

.pf-balance__amount.invoice-closed .fa-chevron-down {
    transform: rotate(-90deg);
}

.pf-balance__body.ibox-content {
    display: none;
    margin: 0;
    padding: 0 1.1rem 1.15rem;
    background: transparent;
    border-top: 1px solid var(--pf-bal-border);
}

.pf-balance__table {
    margin-top: 0.85rem;
    border: 1px solid var(--pf-bal-border);
    border-radius: 0.4rem;
    overflow: hidden;
}

.pf-balance__row {
    display: grid;
    grid-template-columns: 2.5rem 1fr auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.65rem 0.85rem;
    color: var(--pf-bal-text);
    font-size: 0.9rem;
    border-top: 1px solid var(--pf-bal-border);
}

.pf-balance__row:first-child {
    border-top: 0;
}

.pf-balance__row--head {
    background: var(--pf-bal-row);
    color: var(--pf-bal-muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pf-balance__row > :last-child {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.pf-balance__footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 0.9rem;
    padding-top: 0.85rem;
    border-top: 1px dashed var(--pf-bal-border);
}

.pf-balance__note {
    flex: 1 1 220px;
    color: var(--pf-bal-muted);
    font-size: 0.88rem;
    line-height: 1.45;
}

.pf-balance__total {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    margin-left: auto;
}

.pf-balance__total span {
    color: var(--pf-bal-muted);
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pf-balance__total strong {
    color: var(--pf-bal-text);
    font-size: 1.25rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.pf-balance-modal .modal-content {
    border-radius: 0.5rem;
}

.pf-balance-modal__hint {
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 640px) {
    .pf-balance__summary {
        grid-template-columns: 1fr;
    }

    .pf-balance__head.ibox-title {
        align-items: flex-start;
    }

    .pf-balance__head-aside {
        width: 100%;
        justify-content: space-between;
    }
}
