/* Portal Layout — Design Tokens, Structure, Fonts */

/* ── Google Fonts ───────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* ── Tokens ─────────────────────────────────────────────── */
:root {
    --portal-topbar-h:    64px;
    --portal-sidebar-w:   264px;
    --portal-footer-h:    44px;

    --portal-bg:          #ffffff;
    --portal-text:        #1e1e1e;
    --portal-muted:       #6b7280;
    --portal-accent:      #2563eb;
    --portal-accent-rgb:  37 99 235;
    --portal-accent-bg:   #eff6ff;
    --portal-accent-dark: #1d4ed8;

    --portal-surface:     #f8f9fb;
    --portal-border:      #e5e7eb;
    --portal-shadow-sm:   0 1px 4px rgba(0,0,0,.07);
    --portal-shadow-md:   0 4px 20px rgba(0,0,0,.10);

    --portal-radius:      6px;
    --portal-ease:        .2s ease;
    --portal-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── Base fonts ─────────────────────────────────────────── */
body.tbp-portal-layout {
    margin: 0;
    overflow: hidden;
    background: var(--portal-bg);
    color: var(--portal-text);
    font-family: 'DM Sans', sans-serif;
    font-size: 15px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

body.tbp-portal-layout h1,
body.tbp-portal-layout h2,
body.tbp-portal-layout h3,
body.tbp-portal-layout h4,
body.tbp-portal-layout h5,
body.tbp-portal-layout h6 {
    font-family: 'Playfair Display', serif;
    line-height: 1.25;
}

/* ── Microanimations ─────────────────────────────────────── */
@keyframes tbp-dropdown-in {
    from { opacity: 0; transform: translateY(-6px) scale(.97); }
    to   { opacity: 1; transform: translateY(0)    scale(1);   }
}
@keyframes tbp-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Topbar ─────────────────────────────────────────────── */
.tbp-topbar {
    position: fixed;
    inset: 0 0 auto 0;
    height: var(--portal-topbar-h);
    background: var(--portal-bg);
    border-bottom: 1px solid var(--portal-border);
    box-shadow: var(--portal-shadow-sm);
    display: flex;
    align-items: center;
    padding: 0 20px;
    gap: 12px;
    z-index: 200;
    overflow: visible;
}

/* Sidebar toggle */
.tbp-topbar__sidebar-toggle,
.tbp-topbar__sidebar-toggle:hover,
.tbp-topbar__sidebar-toggle:focus,
.tbp-topbar__sidebar-toggle:active {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    flex: 0 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent !important;
    color: var(--portal-muted) !important;
    border-radius: var(--portal-radius);
    cursor: pointer;
    padding: 0;
}
.tbp-topbar__sidebar-toggle:hover { background: var(--portal-surface) !important; color: var(--portal-text) !important; }
.tbp-topbar__sidebar-toggle:focus-visible { outline: 2px solid var(--portal-accent) !important; outline-offset: 2px; }

/* Icon swap animation */
.tbp-topbar__sidebar-toggle .tbp-icon-menu,
.tbp-topbar__sidebar-toggle .tbp-icon-close {
    position: absolute;
    width: 20px;
    height: 20px;
    transition: opacity var(--portal-ease), transform var(--portal-ease);
}
.tbp-topbar__sidebar-toggle .tbp-icon-close {
    opacity: 0;
    transform: rotate(-45deg) scale(.7);
}
body.tbp-sidebar-open .tbp-topbar__sidebar-toggle .tbp-icon-menu {
    opacity: 0;
    transform: rotate(45deg) scale(.7);
}
body.tbp-sidebar-open .tbp-topbar__sidebar-toggle .tbp-icon-close {
    opacity: 1;
    transform: rotate(0) scale(1);
}

/* Logo */
.tbp-topbar__logo { flex: 0 0 auto; display: flex; align-items: center; }
.tbp-topbar__logo a { display: flex; align-items: center; text-decoration: none; }
.tbp-topbar__logo img { height: 38px; width: auto; display: block; }
.tbp-topbar__site-name { font-family: 'Playfair Display', serif; font-size: 17px; font-weight: 600; color: var(--portal-text); }

/* Search */
.tbp-topbar__search { flex: 1; max-width: 500px; margin: 0 auto; }
.tbp-topbar__search .tbp-search { width: 100%; }
.tbp-topbar__search .tbp-search__field-wrap { position: relative; width: 100%; }
.tbp-topbar__search .tbp-search__input {
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    width: 100%;
    height: 38px;
    padding: 0 60px 0 14px;
    border: 1px solid var(--portal-border);
    border-radius: var(--portal-radius);
    background: var(--portal-surface);
    color: var(--portal-text);
    outline: none;
    transition: border-color var(--portal-ease), background var(--portal-ease), box-shadow var(--portal-ease);
}
.tbp-topbar__search .tbp-search__kbd {
    font-family: 'DM Sans', sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: var(--portal-muted);
    background: var(--portal-bg);
    border: 1px solid var(--portal-border);
    border-radius: 4px;
    padding: 2px 6px;
    pointer-events: none;
    white-space: nowrap;
    line-height: 1.4;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}
.tbp-topbar__search .tbp-search__input:focus {
    border-color: var(--portal-accent);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.tbp-topbar__search .tbp-search__results {
    position: absolute;
    top: calc(100% + 6px);
    left: 0; right: 0;
    background: #fff;
    border: 1px solid var(--portal-border);
    border-radius: var(--portal-radius);
    box-shadow: var(--portal-shadow-md);
    z-index: 400;
    max-height: 360px;
    overflow-y: auto;
    animation: tbp-dropdown-in .15s ease;
}

/* Mobile search toggle button (visible only on mobile) */
.tbp-search-mobile-toggle {
    display: none;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: none;
    color: var(--portal-muted);
    cursor: pointer;
    border-radius: var(--portal-radius);
    padding: 0;
    transition: color var(--portal-ease), background var(--portal-ease);
}
.tbp-search-mobile-toggle:hover { color: var(--portal-text); background: var(--portal-surface); }
.tbp-search-mobile-toggle svg { width: 20px; height: 20px; display: block; }

/* Clear button (inside input, absolute) — hidden on desktop */
.tbp-search__clear-btn {
    display: none;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    border: none;
    background: none;
    color: var(--portal-muted);
    cursor: pointer;
    padding: 0;
    border-radius: 50%;
    transition: color var(--portal-ease), background var(--portal-ease);
}
.tbp-search__clear-btn svg { width: 14px; height: 14px; display: block; }
.tbp-search__clear-btn:hover { color: var(--portal-text); background: var(--portal-surface); }

/* Close button (collapses search back to icon) — hidden on desktop */
.tbp-search__close-btn {
    display: none;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: none;
    color: var(--portal-muted);
    cursor: pointer;
    padding: 0;
    border-radius: var(--portal-radius);
    transition: color var(--portal-ease), background var(--portal-ease);
}
.tbp-search__close-btn svg { width: 20px; height: 20px; display: block; }
.tbp-search__close-btn:hover { color: var(--portal-text); background: var(--portal-surface); }

/* ── Profile ────────────────────────────────────────────── */
.tbp-topbar__profile {
    flex: 0 0 auto;
    margin-left: auto;
    position: relative;
    z-index: 300;
}

.tbp-profile-toggle,
.tbp-profile-toggle:hover,
.tbp-profile-toggle:focus,
.tbp-profile-toggle:active {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--portal-text) !important;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 8px;
    margin: 0;
    border-radius: var(--portal-radius);
    cursor: pointer;
    white-space: nowrap;
    text-align: left;
    transition: background var(--portal-ease) !important;
}
.tbp-profile-toggle:hover { background: var(--portal-surface) !important; }
.tbp-profile-toggle:focus-visible { outline: 2px solid var(--portal-accent) !important; outline-offset: 2px; }

.tbp-profile-avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 2px solid var(--portal-border);
    transition: border-color var(--portal-ease);
}
.tbp-profile-toggle:hover .tbp-profile-avatar { border-color: var(--portal-accent); }

.tbp-profile-info { line-height: 1.3; }
.tbp-profile-info__name { font-size: 13px; font-weight: 600; }
.tbp-profile-info__role { font-size: 11px; font-weight: 400; color: var(--portal-muted); }

.tbp-profile-toggle__arrow {
    width: 14px; height: 14px;
    color: var(--portal-muted);
    transition: transform var(--portal-ease);
    flex-shrink: 0;
}
.tbp-profile-toggle.is-open .tbp-profile-toggle__arrow { transform: rotate(180deg); }

/* ── Profile Dropdown ───────────────────────────────────── */
.tbp-profile-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 200px;
    background: #fff;
    border: 1px solid var(--portal-border);
    border-radius: var(--portal-radius);
    box-shadow: var(--portal-shadow-md);
    overflow: hidden;
    transform-origin: top right;
}
.tbp-profile-dropdown.is-open {
    display: block;
    animation: tbp-dropdown-in .18s var(--portal-ease-spring);
}
.tbp-profile-dropdown ul { list-style: none; margin: 0 !important; padding: 6px 0; }
.tbp-profile-dropdown li { margin: 0 !important; }
.tbp-profile-dropdown ul li a {
    display: block;
    padding: 9px 16px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: var(--portal-text);
    text-decoration: none;
    transition: background var(--portal-ease), color var(--portal-ease);
}
.tbp-profile-dropdown ul li a:hover { background: var(--portal-surface); }

.tbp-profile-dropdown__logout,
.tbp-profile-dropdown__logout:hover,
.tbp-profile-dropdown__logout:focus,
.tbp-profile-dropdown__logout:active {
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    border-top: 1px solid var(--portal-border) !important;
    display: block;
    width: 100%;
    padding: 9px 16px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 500;
    text-align: left;
    background: transparent !important;
    color: #b91c1c !important;
    cursor: pointer;
    text-decoration: none;
    transition: background var(--portal-ease) !important;
}
.tbp-profile-dropdown__logout:hover { background: #fef2f2 !important; }

/* ── Sidebar ────────────────────────────────────────────── */
.tbp-sidebar {
    position: fixed;
    top: var(--portal-topbar-h);
    left: 0;
    width: var(--portal-sidebar-w);
    bottom: var(--portal-footer-h);
    background: var(--portal-surface);
    border-right: 1px solid var(--portal-border);
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: transform var(--portal-ease);
    overflow: hidden;
}

/* Desktop collapse */
body.tbp-sidebar-collapsed .tbp-sidebar {
    transform: translateX(calc(-1 * var(--portal-sidebar-w)));
}

.tbp-sidebar__nav {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
    scrollbar-width: thin;
    scrollbar-color: var(--portal-border) transparent;
}
.tbp-sidebar__nav::-webkit-scrollbar { width: 4px; }
.tbp-sidebar__nav::-webkit-scrollbar-thumb { background: var(--portal-border); border-radius: 4px; }

/* ── Sidebar menu items ──────────────────────────────────── */
.tbp-sidebar-menu {
    list-style: none;
    margin: 0 !important;
    padding: 0;
}

.tbp-menu-item { margin: 0 !important; }

.tbp-menu-row {
    display: flex;
    align-items: center;
    position: relative;
}

.tbp-menu-row > a {
    flex: 1;
    display: block;
    padding: 10px 16px;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--portal-text);
    text-decoration: none;
    transition: color var(--portal-ease);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tbp-menu-row:hover > a { color: var(--portal-accent); }

/* Active item */
.tbp-menu-item.is-active > .tbp-menu-row > a {
    color: var(--portal-accent);
    font-weight: 600;
}
.tbp-menu-item.is-active > .tbp-menu-row::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--portal-accent);
    border-radius: 0 2px 2px 0;
    animation: tbp-fade-in .2s ease;
}

/* Hover bg */
.tbp-menu-row:hover { background: rgba(37,99,235,.05); }
.tbp-menu-item.is-active > .tbp-menu-row { background: var(--portal-accent-bg); }

/* Submenu toggle button */
.tbp-submenu-toggle,
.tbp-submenu-toggle:hover,
.tbp-submenu-toggle:focus,
.tbp-submenu-toggle:active {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--portal-muted) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 38px;
    flex-shrink: 0;
    cursor: pointer;
    padding: 0;
    transition: color var(--portal-ease) !important;
}
.tbp-submenu-toggle:hover { color: var(--portal-accent) !important; }
.tbp-submenu-toggle svg {
    width: 14px; height: 14px;
    transition: transform .25s var(--portal-ease-spring);
}
.tbp-menu-item.submenu-open > .tbp-menu-row .tbp-submenu-toggle svg {
    transform: rotate(180deg);
}

/* ── Accordion submenu ───────────────────────────────────── */
.tbp-submenu {
    list-style: none;
    margin: 0 !important;
    padding: 0;
    height: 0;
    overflow: hidden;
    transition: height .28s cubic-bezier(0.4, 0, 0.2, 1);
}

.tbp-submenu .tbp-menu-row > a {
    padding-left: 28px;
    font-size: 13px;
    font-weight: 400;
    color: var(--portal-muted);
}
.tbp-submenu .tbp-menu-row:hover > a { color: var(--portal-accent); }
.tbp-submenu .tbp-menu-item.is-active > .tbp-menu-row > a { color: var(--portal-accent); font-weight: 500; }

/* ── Sidebar footer logout ───────────────────────────────── */
.tbp-sidebar__footer {
    flex-shrink: 0;
    border-top: 1px solid var(--portal-border);
}

.tbp-sidebar__logout {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 13px 16px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: #b91c1c;
    text-decoration: none;
    background: transparent;
    transition: background var(--portal-ease);
}
.tbp-sidebar__logout:hover { background: #fef2f2; }
.tbp-sidebar__logout svg { width: 15px; height: 15px; flex-shrink: 0; }

/* ── Backdrop (mobile) ──────────────────────────────────── */
.tbp-sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.4);
    z-index: 99;
    animation: tbp-fade-in .2s ease;
}
body.tbp-sidebar-open .tbp-sidebar-backdrop { display: block; }

/* ── Content ────────────────────────────────────────────── */
.tbp-content {
    margin-left: var(--portal-sidebar-w);
    margin-top: var(--portal-topbar-h);
    margin-bottom: var(--portal-footer-h);
    height: calc(100vh - var(--portal-topbar-h) - var(--portal-footer-h));
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--portal-bg);
    transition: margin-left var(--portal-ease);
    padding-bottom: calc(var(--portal-footer-h) + 28px);
    scroll-padding-top: 24px;
}
body.tbp-sidebar-collapsed .tbp-content { margin-left: 0; }

/* ── Content body (padded area below breadcrumb) ────────── */

.tbp-content-body {
    padding: 24px 32px 56px;
}

@media (max-width: 768px) {
    .tbp-content-body { padding: 16px 16px 56px; }
}

/* ── Breadcrumb ─────────────────────────────────────────── */
.tbp-breadcrumb {
    padding: 9px 24px;
    background: var(--portal-surface);
    border-bottom: 1px solid var(--portal-border);
    font-size: 12px;
}
.tbp-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.tbp-breadcrumb li { display: flex; align-items: center; gap: 4px; }
.tbp-breadcrumb li:not(:last-child)::after { content: '/'; color: var(--portal-border); }
.tbp-breadcrumb a { color: var(--portal-accent); text-decoration: none; font-weight: 500; }
.tbp-breadcrumb a:hover { text-decoration: underline; }
.tbp-breadcrumb span { color: var(--portal-muted); }
.tbp-breadcrumb .rank-math-breadcrumb p,
.tbp-breadcrumb .yoast-breadcrumb { margin: 0; }

/* ── Footer ─────────────────────────────────────────────── */
.tbp-footer {
    position: fixed;
    inset: auto 0 0 0;
    height: var(--portal-footer-h);
    background: var(--portal-bg);
    border-top: 1px solid var(--portal-border);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 200;
}
.tbp-footer__copy { font-size: 12px; color: var(--portal-muted); margin: 0; }
.tbp-footer__copy b { font-weight: 600; color: var(--portal-text); }

/* ── Search results page ────────────────────────────────── */
.tbp-search-page {
    padding: 28px 32px;
    max-width: 900px;
}

.tbp-search-page__header { margin-bottom: 28px; }

.tbp-search-page__title {
    font-family: 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 6px;
    color: var(--portal-text);
}
.tbp-search-page__title span { color: var(--portal-accent); }

.tbp-search-page__count {
    font-size: 13px;
    color: var(--portal-muted);
    margin: 0;
}

.tbp-search-page__groups {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.tbp-search-group__label {
    font-family: 'DM Sans', sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--portal-muted);
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--portal-border);
}

.tbp-search-group__list {
    list-style: none;
    margin: 0 !important;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tbp-search-result {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    border-radius: var(--portal-radius);
    transition: background var(--portal-ease);
}
.tbp-search-result:hover { background: var(--portal-surface); }

.tbp-search-result__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 2px solid var(--portal-border);
    margin-top: 2px;
}

.tbp-search-result__body { flex: 1; min-width: 0; }

.tbp-search-result__title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--portal-text);
    text-decoration: none;
    margin-bottom: 3px;
    transition: color var(--portal-ease);
}
.tbp-search-result__title:hover { color: var(--portal-accent); }

.tbp-search-result__excerpt {
    font-size: 13px;
    color: var(--portal-muted);
    margin: 0 0 4px;
    line-height: 1.5;
}

.tbp-search-result__meta {
    display: flex;
    gap: 12px;
    font-size: 11px;
    color: var(--portal-muted);
}

.tbp-search-page__empty {
    padding: 48px 0;
    text-align: center;
    color: var(--portal-muted);
    font-size: 14px;
}

/* ── Mobile ─────────────────────────────────────────────── */
@media (max-width: 768px) {

    .tbp-sidebar {
        transform: translateX(calc(-1 * var(--portal-sidebar-w)));
        z-index: 300;
        box-shadow: none;
        transition: transform .28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .28s ease;
    }
    body.tbp-sidebar-open .tbp-sidebar {
        transform: translateX(0);
        box-shadow: 4px 0 24px rgba(0,0,0,.12);
    }

    /* Content always full-width on mobile */
    .tbp-content { margin-left: 0 !important; }

    /* Topbar adjustments */
    .tbp-topbar { padding: 0 12px; gap: 8px; }
    .tbp-topbar__search { max-width: none; }

    /* Hide profile info text on small screens, keep avatar */
    .tbp-profile-info,
    .tbp-profile-toggle__arrow { display: none; }

    /* Collapsed state has no effect on mobile — sidebar is overlay */
    body.tbp-sidebar-collapsed .tbp-sidebar { transform: translateX(calc(-1 * var(--portal-sidebar-w))); }
    body.tbp-sidebar-collapsed .tbp-content { margin-left: 0; }
}

@media (max-width: 480px) {
    :root { --portal-sidebar-w: 80vw; }

    /* Search hidden until toggled */
    .tbp-topbar__search { display: none; }

    /* Show the icon toggle; steal the auto margin from profile */
    .tbp-search-mobile-toggle { display: flex; margin-left: auto; }
    .tbp-topbar__profile { margin-left: 0; }

    /* Expanded state — absolute overlay centred in the fixed topbar */
    .tbp-topbar.tbp-search-open .tbp-topbar__search {
        display: flex;
        align-items: center;
        gap: 6px;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 95%;
        z-index: 20;
        background: var(--portal-bg);
    }
    .tbp-topbar.tbp-search-open .tbp-search { flex: 1; min-width: 0; }
    .tbp-topbar.tbp-search-open .tbp-search__close-btn { display: flex; }
    .tbp-topbar.tbp-search-open .tbp-search__clear-btn { display: flex; }

    /* Hide kbd badge, adjust padding for clear button */
    .tbp-topbar.tbp-search-open .tbp-search__kbd { display: none !important; }
    .tbp-topbar.tbp-search-open .tbp-search__input { padding-right: 36px; }
}

/* ── Admin bar offset ────────────────────────────────────── */
/*
 * WordPress adds html.wp-toolbar { padding-top: 32px } for the admin bar.
 * That already shifts static/relative content down correctly via body offset.
 * Only position:fixed elements (topbar, sidebar) need explicit top adjustment.
 * The content margin-top must NOT be changed — html padding handles it.
 */

@media screen and (min-width: 601px) {
    body.admin-bar .tbp-topbar  { top: 32px; }
    body.admin-bar .tbp-sidebar { top: calc(var(--portal-topbar-h) + 32px); }
    body.admin-bar .tbp-content {
        margin-top: calc(var(--portal-topbar-h) + 32px);
        height: calc(100vh - var(--portal-topbar-h) - var(--portal-footer-h) - 32px);
    }
}

@media screen and (max-width: 600px) {
    body.admin-bar .tbp-topbar  { top: 46px; }
    body.admin-bar .tbp-sidebar { top: calc(var(--portal-topbar-h) + 46px); }
    body.admin-bar .tbp-content {
        margin-top: calc(var(--portal-topbar-h) + 46px);
        height: calc(100vh - var(--portal-topbar-h) - var(--portal-footer-h) - 46px);
    }
}

/* ── Shared card ─────────────────────────────────────────── */

.tbp-card {
    background: #ffffff;
    border: 1px solid var(--portal-border);
    border-radius: 10px;
    padding: 14px 16px;
}

/* ── Author archive ──────────────────────────────────────── */
/* Styles moved to assets/css/author.css */

/* ── Subject single ──────────────────────────────────────── */
/* Styles moved to assets/css/subject.css */