/* ==========================================================================
   theme-modern.css
   Purpose: Safe visual override layer for AoWoW (load AFTER aowow.css)
   ========================================================================== */
   
   
/* ==========================================================================
   Hard background reset (fix accidental blue body)
   ========================================================================== */

html, body {
    background: #07090d !important;
}

body {
    background:
        radial-gradient(1200px 600px at 50% -200px, rgba(255, 209, 0, 0.08), rgba(0, 0, 0, 0) 60%),
        linear-gradient(180deg, #0e1319 0%, #07090d 100%) !important;
}
   

/* --- Page background (outside content) --- */
html, body {
    height: 100%;
}

body {
    background:
        radial-gradient(1200px 600px at 50% -200px, rgba(255, 209, 0, 0.08), rgba(0, 0, 0, 0) 60%),
        linear-gradient(180deg, #0e1319 0%, #07090d 100%);
    color: #cfcfcf;
}

/* Slightly soften default text rendering on dark backgrounds */
body, input, select, textarea, button {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- Main content panel ("the small grey window") --- */
.main-precontents {
    background: linear-gradient(180deg, #141a22 0%, #0f141b 100%);
    padding: 6px 10px;

    border-left: 1px solid rgba(255, 255, 255, 0.06);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.main-contents {
    padding: 12px;
    min-height: 550px;

    background:
        radial-gradient(900px 520px at 50% -140px, rgba(255, 209, 0, 0.10), rgba(0, 0, 0, 0) 62%),
        linear-gradient(180deg, #1b212a 0%, #11161d 100%);

    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);

    border-radius: 8px;
}

#main-contents .text {
    color: #d6d6d6;
}

/* --- Links (keep your WoWhead-like gold but improve hover) --- */
a {
    color: #ffd100;
}

a:hover {
    color: #ffffff;
    text-shadow: 0 0 10px rgba(255, 209, 0, 0.14);
}

/* --- Common boxes (announcement / notices) --- */
.notice-box,
div.announcement-pagetop div.announcement-inner,
div.announcement-contenttop div.announcement-inner {
    background: linear-gradient(180deg, #151b23 0%, #10151c 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    border-radius: 8px !important;
}

/* --- Quote blocks --- */
.entryc .quote, .comment-body .quote,
.text .quote, .text blockquote,
.quote-blizz, .quote-wh {
    background: linear-gradient(180deg, #171c24 0%, #0f141b 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* --- Listview: keep structure, just soften the heavy greys --- */
.listview {
    border-color: rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.listview-band-top, .listview-band-bottom,
.listview-mode-default, .listview-mode-div, .listview-mode-tiled, .listview-mode-calendar,
.listview-nodata {
    background: linear-gradient(180deg, #151a22 0%, #10151c 100%) !important;
    color: #d0d0d0 !important;
}

.listview-mode-default td {
    border-color: rgba(255, 255, 255, 0.10) !important;
    color: #dddddd !important;
}

.listview-mode-default tbody tr:hover,
.listview-mode-tiled td:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Table header links (sorting bar) */
.listview thead a {
    background: linear-gradient(180deg, #5b5f67 0%, #3f444c 100%) !important;
}

.listview th a:hover {
    background-color: #50555d !important;
}

/* --- Comments: reduce flat grey blocks --- */
.comment0, .comment1, .comment2,
.comment-markupdoc,
.comment-collapsed .comment {
    background: linear-gradient(180deg, #151a22 0%, #10151c 100%) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* --- Dialogs / overlays --- */
div.dialog,
div.mapviewer,
div.modelviewer {
    background: linear-gradient(180deg, #1a2028 0%, #12161d 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.55);
}

/* --- Tooltips (optional safe polish) --- */
.wowhead-tooltip {
    background: linear-gradient(180deg, rgba(22, 28, 36, 0.98) 0%, rgba(14, 18, 24, 0.98) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 14px 38px rgba(0, 0, 0, 0.65) !important;
}

.wowhead-tooltip, .wowhead-tooltip * {
    color: #e0e0e0;
}

/* --- Small polish: images in content --- */
img.border {
    border-color: rgba(255, 255, 255, 0.12) !important;
    background-color: #0b0f14 !important;
}

/* ======================================================================
   HOME LOGO – pulse + fade out/in cycle
   ====================================================================== */

#home-logo.home-logo {
    width: 660px !important;
    height: 330px !important;

    margin: 0 auto 20px !important;
    float: none !important;
    text-align: center !important;

    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;

    position: relative;

    animation:
        mwLogoPulse 10.8s ease-in-out infinite,
        mwLogoFade  10.8s ease-in-out infinite;
}

/* glow/pulse (nechávám, jak máš) */
@keyframes mwLogoPulse {
    0%   { filter: brightness(0.18) contrast(1.05) drop-shadow(0 0 14px rgba(0,160,255,0.16)); }
    50%  { filter: brightness(1.32) contrast(1.06) drop-shadow(0 0 26px rgba(0,190,255,0.28)); }
    100% { filter: brightness(1.12) contrast(1.05) drop-shadow(0 0 14px rgba(0,160,255,0.16)); }
}

/* fade + "teleport" scale */
@keyframes mwLogoFade {
    0%   { opacity: 1; transform: translateZ(0) scale(1); }
    70%  { opacity: 1; transform: translateZ(0) scale(1); }

    /* zmizení + lehké zmenšení */
    82%  { opacity: 0; transform: translateZ(0) scale(0.92); }

    /* pauza, pořád schované */
    88%  { opacity: 0; transform: translateZ(0) scale(0.92); }

    /* návrat: nejdřív lehce menší + pak do plna */
    100% { opacity: 1; transform: translateZ(0) scale(1); }
}

/* Aura (zeslabená) */
#home-logo.home-logo::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 660px;
    height: 330px;
    pointer-events: none;

    /* méně agresivní aura */
    background: radial-gradient(
        closest-side,
        rgba(0,150,255,0.06),
        rgba(0,0,0,0) 75%
    );

    filter: blur(0.6px);
    opacity: 0.25;

    animation:
        mwAura 6s ease-in-out infinite,
        mwAuraFade 10.8s ease-in-out infinite;
}

/* jemné dýchání aury */
@keyframes mwAura {
    0%,100% { opacity: 0.16; }
    50%     { opacity: 0.28; }
}

/* aura mizí spolu s logem */
@keyframes mwAuraFade {
    0%   { opacity: 1; }
    70%  { opacity: 1; }
    82%  { opacity: 0; }
    88%  { opacity: 0; }
    100% { opacity: 1; }
}


/* ==========================================================================
   Top bars (toptabs / topbar-buttons)
   ========================================================================== */

#toptabs.toptabs {
    background: linear-gradient(180deg, #141a22 0%, #0f141b 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
}

#toptabs.toptabs a,
#toptabs.toptabs a:link,
#toptabs.toptabs a:visited {
    color: #cfd6dd !important;
}

#toptabs.toptabs a:hover {
    color: #ffffff !important;
    text-shadow: 0 0 10px rgba(255, 209, 0, 0.14) !important;
}

#topbar-buttons.topbar-buttons {
    background: linear-gradient(180deg, #1a2029 0%, #121820 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#topbar-buttons.topbar-buttons a,
#topbar-buttons.topbar-buttons a:link,
#topbar-buttons.topbar-buttons a:visited {
    color: #d2d8df !important;
}

#topbar-buttons.topbar-buttons a:hover {
    color: #ffffff !important;
}

/* ==========================================================================
   Search / filter header blocks (old grey gradient)
   ========================================================================== */

.listview-filter,
.listview-filters,
.lv-filters,
.filter-options,
#fi, #fi2, #filters,
div[id^="fi_"],
div[id^="filter"],
div[id^="filters"] {
    background: linear-gradient(180deg, #151b23 0%, #10151c 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    border-radius: 8px !important;
}

.listview-filter input,
.listview-filter select,
.listview-filters input,
.listview-filters select {
    background-color: #0c1117 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #e0e0e0 !important;
}


/* ==========================================================================
   Top navigation dropdown menu (Browse / Utilities) – unified (NO duplicates)
   ========================================================================== */

/* containers (menu + submenus) */
#topbar-buttons .menu,
#topbar-buttons .menu ul {
    background: linear-gradient(180deg, #121821 0%, #0b1017 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.65) !important;
}

/* neutralize old list backgrounds */
#topbar-buttons .menu li,
#topbar-buttons .menu ul li {
    background: transparent !important;
}

/* links */
#topbar-buttons .menu a,
#topbar-buttons .menu a:link,
#topbar-buttons .menu a:visited {
    display: block !important;
    padding: 6px 12px !important;
    color: #d6dde6 !important;
    background: transparent !important;
    text-decoration: none !important;
}

#topbar-buttons .menu a:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    color: #ffffff !important;
}

/* active/checked/selected */
#topbar-buttons .menu .checked > a,
#topbar-buttons .menu .active > a,
#topbar-buttons .menu a.selected {
    background: rgba(255, 209, 0, 0.12) !important;
    color: #ffd100 !important;
}

/* section headers (Character / Pets / ...) */
#topbar-buttons .menu b,
#topbar-buttons .menu strong,
#topbar-buttons .menu .header,
#topbar-buttons .menu li strong {
    display: block !important;
    padding: 8px 12px 6px !important;
    margin-top: 2px !important;
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* separators */
#topbar-buttons .menu hr,
#topbar-buttons .menu .separator {
    border: 0 !important;
    height: 1px !important;
    margin: 6px 0 !important;
    background: rgba(255, 255, 255, 0.10) !important;
}

/* submenu arrows */
#topbar-buttons .menu li.has-submenu > a::after,
#topbar-buttons .menu li > a .arrow {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* ==========================================================================
   Filter UI (fi_*) – links like "Add another Filter" and criteria dropdown
   ========================================================================== */

a#fi_addcriteria,
a#fi_addcriteria:link,
a#fi_addcriteria:visited {
    color: #ffd100 !important;
    text-decoration: none !important;
    background: transparent !important;
    padding: 2px 4px !important;
    border-radius: 4px !important;
}

a#fi_addcriteria:hover {
    color: #ffffff !important;
    background: rgba(255, 209, 0, 0.10) !important;
    text-shadow: none !important;
}

#fi a,
#fi2 a,
div[id^="fi_"] a {
    color: #ffd100 !important;
    text-decoration: none !important;
    background: transparent !important;
    border-radius: 4px !important;
    padding: 2px 4px !important;
}

#fi a:hover,
#fi2 a:hover,
div[id^="fi_"] a:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.06) !important;
}

#fi, #fi2, div[id^="fi_"] {
    background: linear-gradient(180deg, #121821 0%, #0b1017 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.65) !important;
}

/* Quest browser: keep the common quest types visible without opening the
   full advanced filter form. */
.quest-zone-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    gap: 10px;
    margin: 10px 0 0;
    padding: 14px;
    background: linear-gradient(180deg, #151b23 0%, #10151c 100%);
    border: 1px solid rgba(255, 209, 0, 0.26);
    border-radius: 8px;
}

.quest-zone-picker__field {
    display: flex;
    align-items: center;
    gap: 10px;
}

.quest-zone-picker label {
    color: #ffd100;
    font-weight: bold;
    white-space: nowrap;
}

.quest-zone-picker select {
    width: min(520px, 100%);
    min-height: 34px;
}

.quest-step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: #1b1400;
    background: #ffd100;
    border-radius: 50%;
    font-weight: bold;
}

.quest-quick-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0 14px;
    padding: 12px 14px;
    background: linear-gradient(180deg, #151b23 0%, #10151c 100%);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.quest-quick-filters__label {
    margin-right: 2px;
    color: #aeb7c2;
    font-weight: bold;
}

.quest-filter-chip,
.quest-filter-chip:link,
.quest-filter-chip:visited {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    color: #d8dee7;
    background: #0b1016;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    text-decoration: none;
}

.quest-filter-chip:hover {
    color: #fff;
    background: #202934;
    border-color: rgba(255, 209, 0, 0.45);
}

.quest-filter-chip.is-active {
    color: #1b1400;
    background: #ffd100;
    border-color: #ffd100;
    font-weight: bold;
}

.quest-quick-filters__advanced,
.quest-quick-filters__advanced:link,
.quest-quick-filters__advanced:visited {
    margin-left: auto;
    color: #ffd100;
    text-decoration: none;
}

.quest-quick-filters__advanced:hover {
    color: #fff;
}

.quest-selection-empty {
    margin: 16px 0;
    padding: 30px 20px;
    color: #c9d0d9;
    background: #0e141b;
    border: 1px dashed rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    text-align: center;
    font-size: 15px;
}

@media (max-width: 720px) {
    .quest-zone-picker {
        grid-template-columns: 1fr;
    }

    .quest-zone-picker__field {
        align-items: stretch;
        flex-direction: column;
    }

    .quest-quick-filters__advanced {
        width: 100%;
        margin-left: 0;
        padding-top: 4px;
    }
}

/* ==========================================================================
   Gloss overlay for AoWoW buttons / button-like links
   ========================================================================== */

/* common button selectors used in AoWoW */
a.button,
a.btn,
input[type="submit"],
input[type="button"],
button {
    position: relative;
    overflow: hidden;
}

/* glossy shine */
a.button::before,
a.btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 55%;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.22) 0%,
        rgba(255, 255, 255, 0.08) 35%,
        rgba(255, 255, 255, 0.00) 100%
    );
    pointer-events: none;
}


/* ==========================================================================
   Item list rows (listview) – WoWhead-like glossy highlight
   ========================================================================== */

/* the cell that contains item icon + text */
.listview-mode-default td,
.listview-mode-div td,
.listview td {
    position: relative;
    overflow: hidden;
}

/* glossy shine layer */
.listview-mode-default td::before,
.listview-mode-div td::before,
.listview td::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;

    height: 45%;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.14) 0%,
        rgba(255, 255, 255, 0.05) 35%,
        rgba(255, 255, 255, 0.00) 100%
    );

    pointer-events: none;
    opacity: 0.75;
}

/* subtle inner depth */
.listview-mode-default td {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(0, 0, 0, 0.35);
}

/* hover enhancement */
.listview-mode-default tbody tr:hover td {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

.listview-mode-default tbody tr:hover td::before {
    opacity: 1;
}

/* ==========================================================================
   Small tabs under tooltip/model (Criteria / See also / Same model ...)
   ========================================================================== */

/* base style for the clickable tab blocks */
div.tab,
div.tab-off,
div.tab-on,
div.tabbed,
div.tabs a,
div.tabs div {
    position: relative;
    overflow: hidden;
    border-radius: 6px !important;

    background: linear-gradient(180deg, #2a313a 0%, #171c22 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 6px 16px rgba(0, 0, 0, 0.45) !important;

    color: #e6e6e6 !important;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.75);
}

/* glossy shine */
div.tab::before,
div.tab-off::before,
div.tab-on::before,
div.tabbed::before,
div.tabs a::before,
div.tabs div::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 55%;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.22) 0%,
        rgba(255, 255, 255, 0.08) 35%,
        rgba(255, 255, 255, 0.00) 100%
    );
    pointer-events: none;
}

/* hover */
div.tab:hover,
div.tab-off:hover,
div.tabs a:hover,
div.tabs div:hover {
    background: linear-gradient(180deg, #353f4b 0%, #1a2028 100%) !important;
    border-color: rgba(255, 209, 0, 0.35) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 10px 24px rgba(0, 0, 0, 0.55),
        0 0 16px rgba(255, 209, 0, 0.10) !important;
    color: #ffffff !important;
}

/* active/on tab */
div.tab-on {
    border-color: rgba(255, 209, 0, 0.45) !important;
    color: #ffd100 !important;
}

/* Related content tabs: recognizable icons and touch-friendly sizing. */
#tabs-generic .tabs-container {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(157, 255, 74, .42) rgba(4, 9, 6, .85);
}

#tabs-generic ul.tabs {
    display: flex;
    width: max-content;
    min-width: 100%;
    align-items: stretch;
}

#tabs-generic .tabs li {
    float: none;
    height: 42px;
}

#tabs-generic .tabs a {
    height: 40px;
    border-radius: 5px 5px 0 0;
}

#tabs-generic .tabs a div,
#tabs-generic .tabs a b {
    box-sizing: border-box;
    display: flex;
    height: 40px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 9px;
    line-height: normal;
}

#tabs-generic .related-tab-icon {
    display: inline-block;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    padding: 0 !important;
    border: 1px solid rgba(215, 238, 196, .42);
    border-radius: 4px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .72);
}

#tabs-generic .tabs a.selected .related-tab-icon {
    border-color: rgba(255, 222, 81, .78);
    box-shadow: 0 0 10px rgba(255, 209, 0, .22), 0 2px 5px rgba(0, 0, 0, .72);
}

.masterwow-report-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 3px 0 12px;
}

.masterwow-report-entity {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    padding: 7px 11px;
    color: #ffd99a !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    border: 1px solid rgba(255, 177, 67, .46);
    border-radius: 5px;
    background: linear-gradient(180deg, rgba(91, 49, 16, .88), rgba(42, 23, 9, .94));
    box-shadow: 0 5px 14px rgba(0, 0, 0, .38);
}

.masterwow-report-entity:hover,
.masterwow-report-entity:focus-visible {
    color: #fff3d9 !important;
    border-color: rgba(255, 199, 100, .82);
    background: linear-gradient(180deg, rgba(126, 69, 22, .94), rgba(55, 29, 10, .98));
    outline: none;
}

.masterwow-report-status {
    align-items: center;
    border: 1px solid;
    border-radius: 5px;
    display: inline-flex;
    font-weight: 700;
    gap: 7px;
    margin: 0;
    padding: 8px 12px;
    text-decoration: none;
}
.masterwow-report-status--reported { background: rgba(132,31,31,.25); border-color: #b54d4d; color: #ff9c9c; }
.masterwow-report-status--verified { background: rgba(33,105,62,.25); border-color: #4fa36e; color: #9ee5b4; }
.masterwow-report-status:hover { filter: brightness(1.15); }

/* ==========================================================================
   INFOBOX (Quick Facts) – modern + aligned (SAFE, no full-width)
   ========================================================================== */

/* Outer card */
table.infobox{
    width: auto !important;
    max-width: 300px !important;      /* 280–340 dle chuti */
    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: linear-gradient(180deg, rgba(14,18,26,0.96) 0%, rgba(8,10,14,0.96) 100%) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-radius: 12px !important;
    overflow: hidden !important;

    box-shadow:
        0 14px 38px rgba(0,0,0,0.55),
        inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

/* Reset cell styling */
table.infobox td,
table.infobox th{
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

/* Default inner padding inside the box */
table.infobox td {
    padding: 12px 14px !important;
    color: #e8eef7 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
}

/* Main header “Quick Facts” */
table.infobox th{
    text-align: center !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;

    padding: 12px 14px !important;
    color: #ffffff !important;

    background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%) !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

/* Section headers inside (Series / Closes Quests / Screenshots) */
table.infobox th[id^="infobox-"]{
    text-align: center !important;
    font-weight: 700 !important;
    padding: 10px 12px !important;
    color: #ffffff !important;

    background: rgba(255,255,255,0.04) !important;
    border-top: 1px solid rgba(255,255,255,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* Links */
table.infobox a,
table.infobox a:link,
table.infobox a:visited{
    color: #ffd100 !important;
    text-decoration: none !important;
}
table.infobox a:hover{
    color: #ffffff !important;
}

/* ===============================
   INFOBOX quest lists: Series / Opens / Closes
   (fix padding + number alignment)
   =============================== */

/* zruš globální padding pro vnitřní řádky těchto tabulek */
table#infobox-series td > div,
table#infobox-series th > div,
table#infobox-opens td > div,
table#infobox-opens th > div,
table#infobox-closes td > div,
table#infobox-closes th > div {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* někdy tam AoWoW cpe spacer div – ten nechceme “nafukovat” */
table#infobox-series .infobox-spacer,
table#infobox-opens  .infobox-spacer,
table#infobox-closes .infobox-spacer {
    padding: 0 !important;
    height: 0 !important;
    line-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

/* tabulka: mezery mezi řádky řeš jen spacingem */
table#infobox-series,
table#infobox-opens,
table#infobox-closes {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 8px !important; /* mezera mezi řádky */
}

/* ČÍSLA: tady nastavíš odsazení */
table#infobox-series th.rowheader,
table#infobox-opens  th.rowheader,
table#infobox-closes th.rowheader {
    width: 34px !important;
    min-width: 34px !important;

    padding: 0 10px 0 0 !important;   /* ← odsazení čísel doprava */
    text-align: right !important;
    vertical-align: middle !important;

    color: rgba(232,238,247,0.75) !important;
    font-weight: 700 !important;
}

/* buňka s odkazem */
table#infobox-series td,
table#infobox-opens  td,
table#infobox-closes td {
    padding: 0 !important;
    vertical-align: middle !important;
}

/* “button” link – pěkně zarovnaný v rámci boxu */
table#infobox-series td a,
table#infobox-opens  td a,
table#infobox-closes td a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;

    padding: 10px 12px !important;
    border-radius: 10px !important;

    background: linear-gradient(180deg, rgba(20,26,36,0.95) 0%, rgba(10,14,20,0.95) 100%) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06) !important;

    text-decoration: none !important;
    color: #ffd100 !important;
}

table#infobox-series td a:hover,
table#infobox-opens  td a:hover,
table#infobox-closes td a:hover {
    border-color: rgba(255,209,0,0.30) !important;
    color: #ffffff !important;
}

/* ========================================================================== 
   MasterWoW Legion identity
   ========================================================================== */

:root {
    --mw-fel: #9dff4a;
    --mw-fel-soft: #63c936;
    --mw-arcane: #a77bff;
    --mw-panel: #101713;
    --mw-panel-deep: #080d0b;
    --mw-line: rgba(157, 255, 74, .18);
}

html, body {
    min-height: 100%;
    background: #050806 !important;
}

body {
    min-height: 100vh;
}

body, input, select, textarea, button {
    font-family: "Trebuchet MS", Arial, sans-serif;
}

.header {
    height: 220px !important;
    background: #050806 !important;
    border-bottom: 1px solid rgba(157, 255, 74, .25);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .55);
}

.header-logo {
    background-image: url("../images/logos/legion-header.jpg") !important;
    background-position: center 48% !important;
    background-size: cover !important;
    filter: saturate(1.06) contrast(1.04);
}

.header::before {
    background:
        linear-gradient(90deg, rgba(2, 5, 3, .1), rgba(2, 5, 3, .66) 47%, rgba(2, 5, 3, .22)),
        linear-gradient(180deg, transparent 30%, rgba(2, 5, 3, .94) 100%) !important;
}

.header::after {
    background:
        radial-gradient(circle at 20% 48%, rgba(144, 255, 69, .15), transparent 35%),
        radial-gradient(circle at 86% 52%, rgba(151, 104, 255, .13), transparent 38%) !important;
}

.legion-brand {
    position: absolute;
    z-index: 5;
    left: 50%;
    top: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translate(-50%, -42%);
    pointer-events: none;
    text-transform: uppercase;
    text-shadow: 0 3px 14px #000, 0 0 30px rgba(120, 255, 55, .28);
}

.legion-brand strong,
.home-legion-brand strong {
    color: #f3ead0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(34px, 5vw, 62px);
    line-height: .92;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.legion-brand small,
.home-legion-brand small {
    margin-top: 11px;
    color: var(--mw-fel);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .32em;
    white-space: nowrap;
}

.legion-brand b,
.home-legion-brand b {
    color: #cab8ff;
    font-weight: 700;
}

.main-precontents,
.main-contents,
.listview-band-top,
.listview-band-bottom,
.listview-mode-default,
.listview-mode-div,
.listview-mode-tiled,
.listview-mode-calendar,
.listview-nodata {
    background: linear-gradient(180deg, rgba(16, 24, 19, .98), rgba(8, 13, 10, .98)) !important;
}

.main-contents {
    border-color: var(--mw-line) !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .5), inset 0 1px rgba(255, 255, 255, .035) !important;
}

a, table.infobox a, table.infobox a:link, table.infobox a:visited {
    color: #b8f36f !important;
}

a:hover, table.infobox a:hover {
    color: #e8ffd0 !important;
    text-shadow: 0 0 12px rgba(140, 255, 68, .25);
}

#toptabs.toptabs,
#topbar.topbar {
    background: linear-gradient(180deg, #152019, #0a100c) !important;
    border-color: var(--mw-line) !important;
}

.topbar-search input {
    color: #e9f4e8 !important;
    background: rgba(3, 8, 5, .9) !important;
    border-color: rgba(157, 255, 74, .34) !important;
    box-shadow: inset 0 1px 8px rgba(0, 0, 0, .7), 0 0 0 1px rgba(157, 255, 74, .04);
}

.listview thead a,
div.tab-on {
    border-color: rgba(157, 255, 74, .32) !important;
}

body.home .home-wrapper {
    padding-top: 28px;
}

#home-logo.home-logo {
    width: min(920px, calc(100vw - 36px)) !important;
    height: 270px !important;
    margin: 0 auto 24px !important;
    overflow: hidden;
    border: 1px solid rgba(157, 255, 74, .42);
    border-radius: 12px;
    background: url("../images/logos/legion-header.jpg") center / cover no-repeat !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, .78), 0 0 48px rgba(95, 206, 43, .18), inset 0 0 38px rgba(0, 0, 0, .62);
    animation: none !important;
}

#home-logo.home-logo::before {
    inset: 0;
    left: 0;
    width: auto;
    height: auto;
    transform: none;
    opacity: 1;
    filter: none;
    z-index: 0;
    background:
        radial-gradient(circle at 50% 52%, rgba(134, 255, 63, .16), transparent 34%),
        linear-gradient(90deg, rgba(1, 4, 2, .42), rgba(2, 5, 3, .76) 48%, rgba(1, 3, 2, .38));
    animation: none;
}

#home-logo.home-logo::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background:
        linear-gradient(180deg, rgba(197, 255, 139, .14), transparent 18%, transparent 76%, rgba(0, 0, 0, .64)),
        radial-gradient(ellipse at center, transparent 32%, rgba(0, 0, 0, .56) 100%);
    box-shadow: inset 0 0 0 1px rgba(205, 255, 160, .08), inset 0 -34px 52px rgba(0, 0, 0, .35);
}

.home-legion-brand,
.home-legion-brand:link,
.home-legion-brand:visited {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    text-decoration: none;
    text-indent: 0 !important;
    cursor: pointer !important;
    text-shadow: 0 4px 7px #000, 0 0 22px rgba(0, 0, 0, .96), 0 0 42px rgba(120, 255, 55, .38);
}

.home-legion-brand strong {
    font-size: clamp(48px, 6.4vw, 76px);
    letter-spacing: .075em;
    color: #f1dfad;
    -webkit-text-stroke: 1px rgba(77, 54, 23, .82);
    text-shadow: 0 2px 0 #70552b, 0 5px 4px #000, 0 0 22px rgba(0, 0, 0, .98), 0 0 34px rgba(157, 255, 75, .24);
}

.home-legion-brand small {
    margin-top: 16px;
    padding: 7px 18px 6px;
    color: #bfff77;
    letter-spacing: .42em;
    border-top: 1px solid rgba(166, 255, 91, .46);
    border-bottom: 1px solid rgba(166, 255, 91, .2);
    background: linear-gradient(90deg, transparent, rgba(5, 14, 7, .78) 20%, rgba(5, 14, 7, .78) 80%, transparent);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .34);
}

.home-legion-brand b {
    color: #d5c5ff;
    text-shadow: 0 0 13px rgba(158, 118, 255, .72);
}

.home-search input {
    box-sizing: border-box;
    min-height: 42px;
    padding: 8px 42px 8px 14px;
    color: #edf8e9;
    background: #07100a;
    border: 1px solid rgba(157, 255, 74, .42);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .4), inset 0 1px 8px rgba(0, 0, 0, .7);
}

@media (max-width: 700px) {
    .header { height: 170px !important; }
    .legion-brand strong, .home-legion-brand strong { font-size: 34px; }
    .legion-brand small, .home-legion-brand small { font-size: 11px; letter-spacing: .18em; }
    #home-logo.home-logo { height: 190px !important; }
    .home-search form { width: min(425px, calc(100vw - 42px)); }
}

@media (prefers-reduced-motion: reduce) {
    #home-logo.home-logo, #home-logo.home-logo::before { animation: none !important; }
}

/* Keep the database usable below the legacy 980px desktop breakpoint. */
@media (max-width: 980px) {
    .layout {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .layout-inner {
        box-sizing: border-box;
        padding: 0 8px;
    }

    .wrapper,
    .layout.nosidebar .wrapper {
        margin-right: 0;
    }

    .main-contents {
        box-sizing: border-box;
        overflow-x: auto;
    }

    #toptabs.toptabs,
    #topbar.topbar {
        box-sizing: border-box;
        max-width: 100%;
    }

    #toptabs.toptabs {
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }
}

@media (max-width: 700px) {
    .header { height: 145px !important; }
    .legion-brand { transform: translate(-50%, -46%); }
    .main-contents { padding: 9px; border-radius: 5px; }
}

.mw-search-loader {
    position: fixed;
    z-index: 999999;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at center, rgba(44, 91, 29, .2), transparent 42%),
        rgba(1, 4, 2, .94);
    transition: opacity .16s ease, visibility 0s linear .16s;
}

.mw-search-loader.is-active {
    visibility: visible;
    opacity: 1;
    pointer-events: all;
    transition-delay: 0s;
}

.mw-search-loader__card {
    min-width: 250px;
    padding: 28px 34px 30px;
    text-align: center;
    color: #dce9da;
    border: 1px solid rgba(157, 255, 74, .3);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(13, 24, 16, .98), rgba(4, 9, 6, .98));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .75), 0 0 40px rgba(105, 231, 50, .08);
}

.mw-search-loader__card strong,
.mw-search-loader__card > span:last-child {
    display: block;
}

.mw-search-loader__card strong {
    margin-top: 20px;
    color: #f4fff1;
    font-size: 21px;
    letter-spacing: .025em;
    text-shadow: 0 0 16px rgba(157, 255, 74, .28);
}

.mw-search-loader__card > [data-mw-loader-message] {
    margin-top: 7px;
    color: #9faf9c;
    font-size: 14px;
}

.mw-search-loader__emblem {
    position: relative;
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
}

.mw-search-loader__emblem::before {
    position: absolute;
    inset: -7px;
    content: '';
    border: 2px solid rgba(157, 255, 74, .18);
    border-top-color: #9dff4a;
    border-radius: 50%;
    box-shadow: 0 0 18px rgba(157, 255, 74, .2);
    animation: mw-search-spin .85s linear infinite;
}

.mw-search-loader__emblem::after {
    width: 15px;
    height: 23px;
    content: '';
    border: solid #9dff4a;
    border-width: 0 4px 4px 0;
    transform: rotate(45deg) translate(-2px, -2px);
    filter: drop-shadow(0 0 7px rgba(157, 255, 74, .7));
}

.mw-search-loader__brand {
    display: block;
    margin-top: 16px;
    color: #f3fff0;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    text-shadow: 0 2px 3px #000, 0 0 15px rgba(157, 255, 74, .38);
}

.mw-search-loader__brand span {
    color: #9dff4a;
}

.mw-search-loader__edition {
    display: block;
    margin-top: 7px;
    color: #a8bca3;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
}

@keyframes mw-search-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .mw-search-loader,
    .mw-search-loader__emblem::before {
        transition: none;
        animation: none;
    }
}

/* Borderless gameplay slideshow with copy kept outside the brand link. */
#home-logo.home-logo {
    position: relative;
    width: min(1680px, calc(100vw - 16px)) !important;
    height: clamp(360px, calc((100vw - 16px) * .36905), 620px) !important;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none;
    isolation: isolate;
}
#home-logo.home-logo::before { display: none; }
#home-logo.home-logo::after {
    z-index: 1;
    box-shadow: none;
    background: linear-gradient(180deg, rgba(3,9,5,.28), transparent 38%, rgba(3,9,5,.55) 70%, #050b07 100%), linear-gradient(90deg, rgba(3,9,5,.5), transparent 58%);
}
.home-scenes {
    position:absolute; inset:0; overflow:hidden;
    mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 10%,#000 70%,transparent);
    mask-composite:intersect;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 10%,#000 70%,transparent);
    -webkit-mask-composite:source-in;
}
.home-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 48%; opacity:0; transition:opacity 1.1s ease; }
.home-scene.is-active { opacity:1; }
#home-logo .home-legion-brand { inset:42px 0 auto; height:160px; }
#home-logo .home-legion-brand strong { font-size:clamp(40px,6vw,70px); }
#home-logo .home-legion-brand small { margin-top:8px; border:0; background:none; box-shadow:none; letter-spacing:.3em; }
.home-scene-caption { position:absolute; z-index:3; left:42px; right:180px; bottom:52px; text-align:left; text-shadow:0 2px 8px #000; }
.home-scene-caption span { display:block; color:#bded80; font-size:11px; font-weight:bold; letter-spacing:.22em; text-transform:uppercase; margin-bottom:8px; }
#home-logo .home-scene-caption a { display:inline; text-indent:0; color:#f5e7c1; font:600 clamp(22px,3vw,34px)/1.2 Georgia,serif; text-decoration:none; }
.home-scene-caption p { color:#e0e8df; font-size:14px; line-height:1.6; margin:10px 0 0; max-width:580px; }
.home-scene-controls { position:absolute; z-index:4; right:34px; bottom:54px; display:flex; gap:9px; align-items:center; }
.home-scene-controls button { border:0; padding:4px; color:#e2edda; background:transparent; cursor:pointer; font-size:22px; line-height:1; }
.home-scene-controls button:focus-visible { outline:2px solid #bfff77; outline-offset:4px; }
.home-scene-dots { display:flex; gap:7px; }
.home-scene-dots button { width:7px; height:7px; padding:0; border-radius:50%; background:#8d9e8b; }
.home-scene-dots button[aria-pressed="true"] { background:#c5ff87; box-shadow:0 0 10px #80ac49; }
.home-scene-controls .home-scene-pause { font-size:11px; margin-left:3px; }
@media(max-width:700px) {
    #home-logo.home-logo { height:360px !important; width:100% !important; }
    #home-logo .home-legion-brand { top:25px; height:95px; }
    #home-logo .home-legion-brand small { font-size:10px; letter-spacing:.18em; padding:4px 0; }
    .home-scene-caption { left:24px; right:24px; bottom:63px; }
    .home-scene-caption p { font-size:12px; }
    .home-scene-controls { left:24px; right:auto; bottom:25px; }
}
@media(prefers-reduced-motion:reduce) { .home-scene { transition:none; } }

@font-face {
    font-family: 'Legion Cinzel';
    src: url('../fonts/CinzelDecorative-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
#home-logo .home-legion-brand strong {
    font-family: 'Legion Cinzel', 'Palatino Linotype', serif;
    font-weight: 400;
    font-size: clamp(40px, 6.6vw, 88px);
    letter-spacing: .04em;
    -webkit-text-stroke: 0;
}
#home-logo .home-legion-brand small {
    font-family: 'Legion Cinzel', 'Palatino Linotype', serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: .18em;
    color: #d5e6be;
}
.home-legion-brand .brand-letter {
    display: inline-block;
    transform-origin: 50% 80%;
}
.home-legion-brand.brand-assembling .brand-letter {
    animation: legion-letter-assemble 2400ms cubic-bezier(.16, 1, .3, 1) both;
    animation-delay: var(--letter-delay);
}
.home-legion-brand .brand-version { color: #d5c5ff; }
.breadcrumb{background:none!important;padding-left:0!important;display:flex;align-items:center;gap:5px;min-height:28px}
.breadcrumb:before{content:"";display:inline-block;flex:0 0 17px;width:17px;height:17px;margin-right:5px;background:#b9dc89;mask:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath d="M3 10.5 12 3l9 7.5V21h-6v-7H9v7H3Z" fill="none" stroke="black" stroke-width="1.7" stroke-linejoin="round"/%3E%3C/svg%3E') center/contain no-repeat}
.masterhead-author{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;color:#b5c0b2!important}
.masterhead-author img{width:24px;height:24px;border-radius:0;border:0;object-fit:contain}
.masterhead-author:hover{color:#e7cf91!important;text-decoration:none}
@keyframes legion-letter-assemble {
    0% { opacity: 0; filter: blur(8px); transform: translate(var(--letter-x), -26px) rotate(var(--letter-turn)) scale(.82); }
    55% { opacity: .75; filter: blur(2px); }
    100% { opacity: 1; filter: blur(0); transform: translate(0, 0) rotate(0) scale(1); }
}
@media(max-width:700px) {
    #home-logo .home-legion-brand strong { font-size: clamp(26px, 7.8vw, 40px); }
    #home-logo .home-legion-brand small { font-size: clamp(8px, 2.4vw, 12px); letter-spacing: .12em; }
}
.site-footer{clear:both;text-align:center;margin:48px auto 0;padding:35px 16px 40px;color:#87948d;font:12px/1.8 Arial,sans-serif}
.site-footer .footer-links{margin-bottom:14px}.site-footer .footer-links>a{margin:0 10px}.site-footer .footer-copy{line-height:2}
.site-footer .home-update-status{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-top:12px;color:#afc0b4}
.site-footer .home-update-status strong{color:#b8ef77}.site-footer .home-update-dot{display:inline-block;flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:#79da4a;box-shadow:0 0 10px #79da4a}
/* Crisp search action, replacing the legacy bitmap magnifier. */
#home-search form{position:relative}
#home-search input{padding-right:52px!important;min-height:44px}
#home-search form>a{display:grid;place-items:center;right:3px;top:3px;width:38px;height:38px;border:1px solid #94b66355;border-radius:6px;background:linear-gradient(145deg,#304528,#132218);box-shadow:inset 0 1px #d5efad18;transition:background .18s,border-color .18s,box-shadow .18s}
#home-search form>a:before{content:"";display:block;width:21px;height:21px;background:#cfeda8;mask:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Ccircle cx="10.5" cy="10.5" r="6.5" fill="none" stroke="black" stroke-width="1.8"/%3E%3Cpath d="m15.5 15.5 5 5" stroke="black" stroke-width="1.8" stroke-linecap="round"/%3E%3C/svg%3E') center/contain no-repeat}
#home-search form>a:hover,#home-search form>a:focus-visible{border-color:#bbec83;background:linear-gradient(145deg,#405f2d,#1d3220);box-shadow:0 0 14px #91d95033;outline:2px solid #c5ed8b;outline-offset:2px}
/* Navigation dropdowns: quieter sections and clear, spacious actions. */
.menu.legion-dropdown{padding:6px;border:1px solid #69794a;border-radius:10px;background:linear-gradient(140deg,#18271af5,#080f0df5);box-shadow:0 16px 45px #000a,0 0 24px #80ab2920,inset 0 1px #d6eb9520;backdrop-filter:blur(16px);scrollbar-width:thin;scrollbar-color:#6b8151 #0c160f;box-sizing:border-box;min-width:240px}
.menu.legion-dropdown .menu-outer{border:0;box-shadow:none;float:none;background:transparent}
.menu.legion-dropdown .menu-inner{border:0;background:transparent}
.menu.legion-dropdown a{position:relative;min-height:34px;box-sizing:border-box;padding:8px 13px 8px 17px;margin:2px 0;border:1px solid transparent;border-radius:5px;background:transparent;color:#cedac5;font:13px/1.3 Arial,sans-serif;transition:background .15s,border-color .15s,color .15s}
.menu.legion-dropdown a span{background:transparent!important;padding-right:24px}
.menu.legion-dropdown a span.hassubmenu{background:none;position:relative}
.menu.legion-dropdown a span.hassubmenu:after{content:"";position:absolute;right:3px;top:50%;width:5px;height:5px;border-top:1.5px solid #a7be8c;border-right:1.5px solid #a7be8c;transform:translateY(-50%) rotate(45deg)}
.menu.legion-dropdown a:hover,.menu.legion-dropdown a.open,.menu.legion-dropdown a:focus-visible{background:linear-gradient(90deg,#759c4033,#a1b96d0d);border-color:#91b05c66;color:#e7ffbc;outline:none;box-shadow:inset 2px 0 #b4d978}
.menu.legion-dropdown a.separator,.menu.legion-dropdown a.separator:hover{min-height:0;margin:12px 5px 5px;padding:6px 7px;border:0;border-bottom:1px solid #a3b67a26;border-radius:0;background:transparent;color:#cfb978;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;text-decoration:none;box-shadow:none;cursor:default}
.menu.legion-dropdown a.separator:first-child{margin-top:2px}
@media(prefers-reduced-motion:reduce){.menu.legion-dropdown a{transition:none}}
/* Inline class icons must not inherit the panel background repeat. */
.menu.legion-dropdown a.icon,.menu.legion-dropdown a.tinyicon{background-repeat:no-repeat!important;background-position:12px center!important;background-size:22px 22px;padding-left:43px;min-height:38px}
.menu.legion-dropdown a.tinyicon{background-size:16px 16px}
.menu.legion-dropdown a.icon:hover,.menu.legion-dropdown a.icon.open,.menu.legion-dropdown a.tinyicon:hover,.menu.legion-dropdown a.tinyicon.open{background-color:#86aa4326}
.menu.legion-dropdown.legion-menu-expanded>div:not(.menu-outer){display:flex;align-items:flex-start;gap:12px}
.menu.legion-dropdown.legion-menu-expanded .menu-outer{flex:1;min-width:200px}
.menu.legion-dropdown.legion-menu-expanded{max-width:calc(100vw - 24px)}
@media(max-width:650px){.menu.legion-dropdown.legion-menu-expanded>div:not(.menu-outer){flex-wrap:wrap}.menu.legion-dropdown.legion-menu-expanded .menu-outer{min-width:160px}}
/* Shared navigation styling on database detail and list pages. */
#toptabs{display:flex;flex-wrap:wrap;gap:7px;padding:12px;background:linear-gradient(120deg,#142016,#0b130f);border:1px solid #35482d;border-radius:8px 8px 0 0}
#toptabs dl,#toptabs dt{margin:0;padding:0;float:none;background:none;border:0}
#toptabs a{display:flex;align-items:center;gap:9px;min-height:40px;padding:0 15px;border:1px solid #3f5134;border-left:3px solid #a7e46b;border-radius:5px;background:linear-gradient(115deg,#1c2b1c,#101a13);color:#d9e6cc;text-decoration:none;font:600 12px Arial,sans-serif;transition:background .15s,border-color .15s}
#toptabs a ins{background:none;padding:0;color:inherit;text-decoration:none}
#toptabs dt:nth-child(3) a{border-left-color:#e4bd56}#toptabs dt:nth-child(4) a{border-left-color:#67cddd}#toptabs dt:nth-child(5) a{border-left-color:#c397ef}
#toptabs a:hover,#toptabs a.open,#toptabs a.active{background:linear-gradient(115deg,#2b4126,#17271b);border-color:#8ca766;color:#efffdb}
#topbar{border:1px solid #35482d;border-top:0;background:linear-gradient(100deg,#111e15,#0b130f);border-radius:0 0 7px 7px;min-height:35px}
#topbar .menu-buttons>a,#topbar-browse>a{color:#c8d8bd;padding:6px 9px;border-radius:4px}#topbar .menu-buttons>a:hover,#topbar-browse>a:hover{background:#80a64926;color:#e4ffc2}
/* The tabs live inside one dl: it, rather than its container, owns the row. */
#toptabs{height:auto;min-height:0;display:block;box-sizing:border-box}
#toptabs>dl{display:flex;flex-wrap:wrap;align-items:center;gap:7px;width:100%;height:auto;min-height:0;float:none;position:static}
#toptabs>dl>dt{display:block;float:none;flex:0 0 auto;position:relative;margin:0;padding:0;height:auto}
#toptabs>dl>dt>a{height:auto;min-height:40px;box-sizing:border-box;position:relative;top:0;line-height:1.2;overflow:visible}
#toptabs>dl>dt>a>span{display:none;background:none}
#toptabs big{font:inherit}
#topbar{clear:both;position:relative}
/* Selected navigation must remain distinct from green hover states. */
#toptabs>dl>dt>a.active,#toptabs>dl>dt>a.active:hover{background:linear-gradient(135deg,#655024,#342a16)!important;border:1px solid #e5c16b;border-left:3px solid #ffe29a;color:#fff0c1!important;box-shadow:inset 0 -3px #efca76,inset 0 1px #fff2bc26,0 0 14px #d9af4626;text-shadow:0 1px 3px #0008}
#toptabs>dl>dt>a.active ins{color:#fff0c1!important}