/* =====================================================
   BELLEGRAVES · MOURNING VEIL V4
   Vollständiger Ersatz: illustrierte Karten & Foren
   Für das vorhandene index-Template mit mv-*-Klassen
   ===================================================== */

:root {
    --mv4-gold: #ca9e77;
    --mv4-text: #f0decb;
    --mv4-line: rgba(206, 150, 116, .58);
}

/* Begrüssung näher an den Benutzerbereich rücken */
.mv-welcome {
    width: 100%;
    max-width: 1210px;
    margin: 0 auto 26px;
    padding: 0;
}

.mv-welcome-heading {
    max-width: 790px;
    margin: 0 auto 24px;
    padding: 0 12px;
    text-align: center;
}

.mv-eyebrow {
    display: block;
    color: #d3ab87;
    font: 11px/1.5 Georgia, serif;
    letter-spacing: 3px;
}

.mv-welcome-heading h1 {
    margin: 7px 0 8px;
    color: var(--mv4-text);
    font: normal clamp(28px, 3.3vw, 40px)/1.25 Georgia, serif;
}

.mv-welcome-heading p {
    max-width: 660px;
    margin: 8px auto 0;
    color: #e0cbc0;
    font: 14px/1.75 Georgia, serif;
}

.mv-welcome-ornament {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 6px auto;
    color: var(--mv4-gold);
}

.mv-welcome-ornament::before,
.mv-welcome-ornament::after {
    content: "";
    width: 70px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(202, 158, 119, .65));
}

.mv-welcome-ornament::after { transform: rotate(180deg); }

/* Einheitliches, weiches Kartenraster */
.mv-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 17px;
}

.mv-feature {
    position: relative;
    isolation: isolate;
    min-width: 0;
    min-height: 320px;
    overflow: hidden;
    border: 1px solid var(--mv4-line);
    border-radius: 29px;
    background-color: #241821;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .34),
                inset 0 0 0 1px rgba(255, 222, 187, .08);
    transition: transform .25s ease, box-shadow .25s ease;
}

/* Keine zusätzliche Rahmenlinie: manche Bildmotive
   enthalten bereits dekorative Ränder. */
.mv-feature::before { content: none; display: none; }
.mv-feature::after { content: none; display: none; }

/* Bilder etwas vergrössern, damit ihre eingebrannten
   Aussenränder weniger sichtbar werden. Text bleibt HTML. */
.mv-feature-town {
    background-image:
        linear-gradient(90deg, rgba(22, 12, 19, .95) 0%,
                           rgba(35, 17, 25, .83) 58%,
                           rgba(24, 12, 19, .36) 100%),
        url(../../../images/mourning-veil/mv-town.jpg);
    background-size: cover, auto 120%;
    background-position: center, 56% center;
    background-repeat: no-repeat;
}

.mv-feature-chronicle {
    background-image:
        linear-gradient(90deg, rgba(24, 13, 17, .95) 0%,
                           rgba(40, 22, 22, .84) 58%,
                           rgba(27, 15, 18, .38) 100%),
        url(../../../images/mourning-veil/mv-chronicle.jpg);
    background-size: cover, auto 120%;
    background-position: center, 52% center;
    background-repeat: no-repeat;
}

.mv-feature-watch {
    background-image:
        linear-gradient(90deg, rgba(19, 12, 22, .96) 0%,
                           rgba(32, 17, 27, .85) 58%,
                           rgba(19, 10, 19, .38) 100%),
        url(../../../images/mourning-veil/mv-ninth-watch.jpg);
    background-size: cover, auto 120%;
    background-position: center, 50% center;
    background-repeat: no-repeat;
}

.mv-feature-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 320px;
    padding: 27px 24px 25px;
}

.mv-feature-number {
    color: #e0b58f;
    font: 11px/1.5 Georgia, serif;
    letter-spacing: 2.1px;
}

.mv-feature-content { flex: 1 1 auto; }

.mv-feature h2 {
    margin: 18px 0 7px;
    color: #f9e9da;
    font: normal clamp(24px, 2.35vw, 31px)/1.2 Georgia, serif;
    text-shadow: 0 3px 12px rgba(0, 0, 0, .8);
}

.mv-feature-subtitle {
    display: block;
    color: #e0b594;
    font: 11px/1.5 Georgia, serif;
    letter-spacing: 1.25px;
}

.mv-feature p {
    max-width: 330px;
    margin: 17px 0 20px;
    color: #f2e5dd;
    font: 14px/1.7 Georgia, serif;
    text-shadow: 0 1px 5px #10090e;
}

.mv-feature-link,
.mv-feature-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    gap: 12px;
    max-width: 100%;
    min-height: 37px;
    padding: 9px 16px;
    border: 1px solid rgba(215, 158, 123, .75);
    border-radius: 30px;
    background: rgba(67, 28, 42, .87);
    color: #f5e1cf !important;
    font: 11px/1.35 Georgia, serif;
    letter-spacing: .7px;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .23);
}

.mv-feature-link:hover,
.mv-feature-link:focus-visible {
    background: #8b4b60;
    color: #fff !important;
}

.mv-feature-placeholder {
    background: rgba(24, 16, 22, .82);
    color: #dbc1af !important;
    opacity: .9;
}

/* Ruhiger Übergang in die Foren */
.mv-welcome-end {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    margin: 23px 0 16px;
    color: #d2a780;
    font: italic 12px/1.6 Georgia, serif;
    letter-spacing: 1.7px;
    text-align: center;
}

.mv-welcome-end::before,
.mv-welcome-end::after {
    content: "";
    flex: 0 1 180px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(205, 151, 111, .6));
}

.mv-welcome-end::after { transform: rotate(180deg); }

.mv-forums-area,
.mv-stats-area {
    width: 100%;
    max-width: 1210px;
    margin-left: auto;
    margin-right: auto;
}

.mv-category {
    margin-bottom: 25px;
    overflow: hidden;
    border: 1px solid rgba(186, 117, 110, .45);
    border-radius: 27px;
    background: #211a21;
    box-shadow: 0 17px 37px rgba(0, 0, 0, .25);
}

.mv-category-table {
    width: 100%;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-collapse: separate;
    border-spacing: 0;
    box-shadow: none !important;
}

.mv-category .thead {
    padding: 16px 21px !important;
    border-bottom: 1px solid #bd946f !important;
    background: linear-gradient(110deg, #733d50, #482837 65%, #292027) !important;
}

.mv-category-title {
    display: flex;
    align-items: center;
    gap: 15px;
}

.mv-category-symbol { color: #d8ae82; font-size: 22px; }

.mv-category-title strong a {
    color: #f2dfce !important;
    font: normal 23px Georgia, serif;
}

.mv-category-description {
    margin-top: 5px;
    color: #d0b3b7;
    font: 12px/1.6 Georgia, serif;
}

.mv-category .tcat { background: #30242c !important; color: #d5b8aa !important; }
.mv-category .trow1 { background: #251e26 !important; }
.mv-category .trow2 { background: #2b232b !important; }
.mv-category .trow1:hover,
.mv-category .trow2:hover { background: #382a34 !important; }

@media (hover: hover) {
    .mv-feature:hover {
        transform: translateY(-3px);
        box-shadow: 0 24px 46px rgba(0, 0, 0, .42);
    }
}

@media (max-width: 950px) {
    .mv-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mv-feature-watch { grid-column: 1 / -1; }
}

@media (max-width: 650px) {
    .mv-feature-grid { grid-template-columns: 1fr; gap: 13px; }
    .mv-feature-watch { grid-column: auto; }
    .mv-feature { min-height: 285px; border-radius: 22px; }
    .mv-feature-inner { min-height: 285px; padding: 22px 20px; }
    .mv-feature p { font-size: 13px; }
    .mv-welcome-heading { padding: 0 8px; margin-bottom: 20px; }
    .mv-welcome-heading p { font-size: 13px; }
    .mv-welcome-end { font-size: 10px; letter-spacing: .7px; }
    .mv-category { border-radius: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .mv-feature { transition: none; }
}


/* =====================================================
   V4.1 · FORENKATEGORIEN UND STATISTIKEN
   Ergänzung direkt innerhalb dieser vollständigen V4-Datei
   ===================================================== */

/* Weniger Raum zwischen Einstieg und Kategorien */
.mv-forums-area { margin-top: 8px; }
.mv-forums-area .mv-category { margin-bottom: 22px; }

/* Gleichmässige, organische Kategorieflächen */
.mv-forums-area .mv-category {
    border: 1px solid rgba(200,150,117,.52);
    border-radius: 28px;
    background: linear-gradient(145deg,#312029,#20191f 75%);
    box-shadow: 0 16px 38px rgba(0,0,0,.3), inset 0 1px 0 rgba(252,226,190,.09);
}
.mv-forums-area .mv-category-table { table-layout: auto; }
.mv-forums-area .mv-category .thead {
    position: relative;
    background: linear-gradient(105deg,#754050 0%,#542f3d 59%,#34242e 100%) !important;
    border-bottom: 1px solid rgba(212,169,126,.65) !important;
    padding: 16px 20px !important;
}
.mv-forums-area .mv-category .thead::after {
    content: "";
    display: block;
    position: absolute;
    height: 1px;
    left: 22px;
    right: 22px;
    bottom: 4px;
    background: linear-gradient(90deg,transparent,rgba(225,185,139,.36),transparent);
    pointer-events: none;
}
.mv-forums-area .mv-category-title { gap: 14px; }
.mv-forums-area .mv-category-symbol { color: #dab185; font-size: 22px; line-height: 1; }
.mv-forums-area .mv-category-title strong a { font-size: clamp(19px,2vw,24px); }
.mv-forums-area .mv-category-description { color: #e1c8c1; font-size: 13px; }
.mv-forums-area .mv-category .tcat {
    background: #34262f !important;
    border-bottom: 1px solid rgba(186,143,124,.38);
    color: #ead4c5 !important;
    font-size: 13px;
}
.mv-forums-area .mv-category .trow1,
.mv-forums-area .mv-category .trow2 {
    border-bottom-color: rgba(168,126,122,.2) !important;
    color: #ead8cc !important;
}
.mv-forums-area .mv-category .trow1 a,
.mv-forums-area .mv-category .trow2 a { color: #e8c4bd !important; }
.mv-forums-area .mv-category .smalltext { font-size: 13px; line-height: 1.55; }
.mv-forums-area .mv-category .expcolimage { margin-left: 10px; }
.mv-forums-area .mv-category .expcolimage img { opacity: .8; }

/* Statistiken optisch an Kategorien angleichen, ohne MyBB-Logik anzufassen */
.mv-stats-area > .tborder,
.mv-stats-area .tborder {
    width: 100%;
    border: 1px solid rgba(200,150,117,.45) !important;
    border-radius: 28px !important;
    background: #231b23 !important;
    box-shadow: 0 17px 35px rgba(0,0,0,.28) !important;
}
.mv-stats-area .thead {
    padding: 15px 21px !important;
    background: linear-gradient(105deg,#754050,#462b36 76%) !important;
    border-bottom: 1px solid rgba(207,165,126,.62) !important;
}
.mv-stats-area .tcat { background: #34262e !important; }
.mv-stats-area .trow1,
.mv-stats-area .trow2 { color: #e8d6cb !important; padding: 13px 16px !important; }
.mv-stats-area .smalltext { font-size: 13px; line-height: 1.7; }
.mv-stats-area a { color: #e9b8b6; }

/* Legende ordentlich ausrichten und lesbar halten */
#content .forum_legend {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px 12px;
    max-width: 1210px;
    margin: 26px auto 10px;
    padding: 12px 4px;
    color: #cdb8ae;
}
#content .forum_legend dt { float: none; margin: 0; }
#content .forum_legend dd { float: none; margin: 0 16px 0 0; }

/* Barrierefreiheit und schmale Bildschirme */
.mv-forums-area a:focus-visible,
.mv-stats-area a:focus-visible {
    outline: 2px solid #d9ad82;
    outline-offset: 3px;
}
@media (max-width: 650px) {
    .mv-forums-area .mv-category,
    .mv-stats-area .tborder { border-radius: 18px !important; }
    .mv-forums-area .mv-category .thead,
    .mv-stats-area .thead { padding: 13px 12px !important; }
    .mv-forums-area .mv-category-description { font-size: 12px; }
    #content .forum_legend { gap: 8px; }
}

/* =====================================================
   V4.2 · SOUTHERN GOTHIC ORNAMENTE UND FLIESSENDE DETAILS
   Kein weiteres Stylesheet und keine zusätzlichen Bilder nötig.
   ===================================================== */

/* Sanfte, ornamentale Trennung unter den Infokarten */
.mv-welcome-end {
    position: relative;
    margin: 23px auto 18px;
    max-width: 900px;
    padding: 15px 35px;
    color: #d4ad87;
    text-shadow: 0 2px 8px rgba(0,0,0,.55);
}
.mv-welcome-end::before,
.mv-welcome-end::after {
    width: min(18vw, 210px);
    background: linear-gradient(90deg, transparent, rgba(207,155,113,.72));
}

/* Kategorien bekommen eine eigene, ruhige botanische Textur aus CSS.
   Sie liegt nur in der Titelleiste, nie unter Lesetexten. */
.mv-forums-area .mv-category .thead {
    background-image:
        radial-gradient(ellipse at 92% 10%, rgba(215,161,135,.13), transparent 42%),
        radial-gradient(ellipse at 8% 105%, rgba(199,112,133,.15), transparent 44%),
        linear-gradient(105deg, #754050 0%, #542f3d 59%, #34242e 100%) !important;
}
.mv-forums-area .mv-category .thead::before {
    content: "❦";
    position: absolute;
    right: 52px;
    top: 50%;
    transform: translateY(-50%) rotate(-16deg);
    color: rgba(236,188,148,.2);
    font: normal 37px/1 Georgia,serif;
    pointer-events: none;
}

/* Ornament und Text bleiben räumlich getrennt */
.mv-forums-area .mv-category-title {
    position: relative;
    z-index: 1;
    padding-right: 20px;
}

/* Dezenter Schweif an der Unterseite der Kategorien */
.mv-forums-area .mv-category {
    position: relative;
    transition: box-shadow .25s ease, border-color .25s ease;
}
@media (hover:hover) {
    .mv-forums-area .mv-category:hover {
        border-color: rgba(222,173,134,.68);
        box-shadow: 0 20px 44px rgba(0,0,0,.34), 0 0 20px rgba(113,52,66,.11);
    }
}

/* Forenstatus, Links und Spalten: heller, ohne scharfe Trennlinien */
.mv-forums-area .mv-category .trow1,
.mv-forums-area .mv-category .trow2 {
    transition: background-color .2s ease;
}
.mv-forums-area .mv-category .trow1 a:hover,
.mv-forums-area .mv-category .trow2 a:hover {
    color: #fff0df !important;
}
.mv-forums-area .mv-category .tcat,
.mv-stats-area .tcat {
    letter-spacing: .065em;
}

/* Statistiken mit demselben floralen Echo statt zusätzlicher Bilddatei */
.mv-stats-area .thead {
    position: relative;
    background-image:
        radial-gradient(ellipse at 94% 0%, rgba(227,169,132,.13), transparent 38%),
        linear-gradient(105deg, #754050, #462b36 76%) !important;
}
.mv-stats-area .thead::after {
    content: "❦";
    position: absolute;
    right: 48px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(242,196,161,.17);
    font: 30px/1 Georgia,serif;
    pointer-events: none;
}

/* Echte MyBB-Tabellen bleiben lesbar und nicht künstlich gestaucht */
.mv-forums-area .tborder,
.mv-stats-area .tborder { max-width: 100%; }

@media (max-width:650px) {
    .mv-forums-area .mv-category .thead::before,
    .mv-stats-area .thead::after { display:none; }
    .mv-welcome-end { padding: 10px 0; }
}
@media (prefers-reduced-motion:reduce) {
    .mv-forums-area .mv-category,
    .mv-forums-area .mv-category .trow1,
    .mv-forums-area .mv-category .trow2 { transition:none; }
}

/* =====================================================
   V4.3 · FORENZEILEN & STATUS · BELLEGRAVES
   Ergänzt V4.2, ohne MyBB-Templates oder Variablen zu ändern.
   ===================================================== */

/* Forentabellen innerhalb der Kategorie ruhig und lesbar halten */
.mv-forums-area .mv-category {
    box-shadow: 0 19px 42px rgba(0,0,0,.27), inset 0 1px rgba(238,193,163,.06);
}
.mv-forums-area .mv-category-table {
    table-layout: auto;
    width: 100%;
}
.mv-forums-area .mv-category tbody .trow1,
.mv-forums-area .mv-category tbody .trow2 {
    padding: 15px 14px !important;
    vertical-align: middle;
    border-bottom: 1px solid rgba(187,133,115,.16) !important;
    background-image: linear-gradient(110deg,rgba(255,238,216,.025),transparent 70%) !important;
}
.mv-forums-area .mv-category tbody tr:last-child > td {
    border-bottom: 0 !important;
}
.mv-forums-area .mv-category tbody tr:hover > .trow1,
.mv-forums-area .mv-category tbody tr:hover > .trow2 {
    background-color: #382833 !important;
}

/* Titel/Untertitel: keine Fantasiedaten, MyBB-Inhalte bleiben erhalten */
.mv-forums-area .mv-category .trow1 a,
.mv-forums-area .mv-category .trow2 a {
    text-decoration: none !important;
    text-underline-offset: 3px;
}
.mv-forums-area .mv-category .trow1 > strong a,
.mv-forums-area .mv-category .trow2 > strong a,
.mv-forums-area .mv-category .trow1 .smalltext a,
.mv-forums-area .mv-category .trow2 .smalltext a {
    color: #eac7c4 !important;
}
.mv-forums-area .mv-category .trow1 .smalltext,
.mv-forums-area .mv-category .trow2 .smalltext {
    color: #c0ada5;
    font-size: 12px;
    line-height: 1.65;
}

/* Statusbilder von MyBB bleiben funktional; wir geben ihnen nur eine weiche Fassung */
.mv-forums-area .forum_status {
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(217,164,142,.22), 0 3px 12px rgba(0,0,0,.25);
    transition: filter .2s ease, box-shadow .2s ease;
}
.mv-forums-area .forum_status.forum_on {
    box-shadow: 0 0 0 1px rgba(231,179,142,.48), 0 0 12px rgba(183,101,106,.23);
}
.mv-forums-area .forum_status.forum_off {
    opacity: .9;
}

/* Letzter Beitrag und Zähler in ruhigerer Darstellung */
.mv-forums-area .mv-category tbody tr td:nth-last-child(-n+3) {
    color: #decac0;
    font-variant-numeric: tabular-nums;
}
.mv-forums-area .mv-category tbody tr td:last-child {
    line-height: 1.65;
}
.mv-forums-area .mv-category tbody tr td:last-child .smalltext {
    color: #c7b0a8;
}

/* Feiner Abschluss zu Legende und Statistiken */
.mv-forums-area + .mv-stats-area { margin-top: 12px; }
#content .forum_legend {
    padding: 14px 0 8px;
    border-top: 1px solid rgba(191,142,115,.19);
}

/* Auf kleinen Bildschirmen Zellen nicht breiter zwingen als MyBB erlaubt */
@media (max-width: 650px) {
    .mv-forums-area .mv-category tbody .trow1,
    .mv-forums-area .mv-category tbody .trow2 { padding: 10px 8px !important; }
    .mv-forums-area .mv-category .trow1 .smalltext,
    .mv-forums-area .mv-category .trow2 .smalltext { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
    .mv-forums-area .forum_status { transition: none; }
}
