/*
 *  [ HTML & BODY ]
 */

html,
body {
    background: #f3f6fa;
}

body.pushable>.pusher {
    background: #f3f6fa;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

#wrapper {
    margin-bottom: 1rem;
}

/*
   *  [ NAVIGATION BAR ]
   */

.ui.secondary.menu {
    background: #fff;
    padding: 10px;
    margin: 0;
}

.ui.secondary.menu .toc.item {
    display: none;
}

.ui.secondary.menu .toc.item i {
    margin: 0;
}

#navbar .item i {
    margin-right: 5px;
}

.ui.secondary.menu .ui.medium.label {
    padding: .68em 1em .5em .5em;
}

.ui.secondary.menu .ui.medium.label img {
    font-size: 1.09rem;
    margin: -.6em .5em -.6em -.5em;
}

.ui.secondary.inverted.menu .popup .list a.item {
    color: rgba(0, 0, 0, .87) !important;
}

@media only screen and (max-width: 768px) {

    .ui.secondary.menu .menu,
    .ui.secondary.menu .item {
        display: none;
    }

    .ui.secondary.menu .toc.item {
        display: block;
    }
}

.ui.secondary.menu .ui.popup {
    min-width: 200px;
}

.ui.secondary.menu .ui.popup a:not([href]) {
    cursor: default !important;
}

.ui.vertical.inverted.sidebar.menu.left .item .header span.icon {
    float: right;
}

/*
   *  [ HEADER ]
   */

.ui.masthead {
    background: linear-gradient(90deg, rgb(41, 117, 286) 0%, rgb(2, 117, 216) 100%);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 20px;
    padding: 4rem 0;
    border-radius: 0;
    color: #fff;
}

.ui.masthead .connect-server {
    background: rgba(255, 255, 255, .2);
    width: fit-content;
    padding: 1rem 1.5rem;
    margin-left: auto;
    border-radius: .4rem;
    text-align: center;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .1);
}

@media (max-width: 768px) {
    .ui.masthead .ui.grid .ui.row .column>* {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
}

.ui.masthead .connect-server .ui.header {
    margin: 0;
    color: #fff;
}

/*
   *  -[ SEGMENT ]-
   */

.ui.segment {
    background: #fff;
    border-radius: .28571429rem;
    border: none;
    -webkit-box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
    box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
}

.ui.segment .ui.list .list>.item .header,
.ui.segment .ui.list>.item .header {
    display: inline-block;
}

.ui.secondary.segment.segment.segment.segment.segment:not(.inverted) {
    border-top: none;
}

/*
   *  [ NEWS POST ]
   */

#news-post .badge,
#news-post .ui.label {
    position: absolute;
    margin: 0;
    padding: .75em 1em;
    width: auto;
    top: 0;
    right: 0;
    text-transform: uppercase;
    border-radius: 0 .21428571rem 0 .28571429rem;
}

/*
   *  [ FORUM NODE ]
   */

#forum-node #last-post {
    width: 250px;
}

#forum-node #last-post .avatar {
    margin: 2px 10px 0 0;
}

/*
   *  [ FORUM PAGE ]
   */

#sticky-threads tbody tr td:last-child:not(:first-child),
#normal-threads tbody tr td:last-child:not(:first-child) {
    text-align: right;
}

#sticky-threads tbody tr td:last-child .ui.image.header .image,
#normal-threads tbody tr td:last-child .ui.image.header .image {
    float: right;
    margin-left: 1rem;
    margin-top: .24rem;
}

#sticky-threads .badge,
#sticky-threads .ui.label,
#normal-threads .badge,
#normal-threads .ui.label {
    position: relative;
    top: -1.2px;
    padding: .3rem .5rem;
    font-size: .7rem;
    margin: 0;
    margin-bottom: .1rem;
    margin-right: .2rem;
}

/*
   *  [ TOPIC PAGE ]
   */

#topic-post #post-sidebar .ui.small.image,
#topic-reply #reply-sidebar .ui.small.image {
    width: 120px;
}

#topic-post #post-sidebar h3,
#topic-reply #reply-sidebar h3 {
    margin: 1rem 0;
}

@media (max-width: 768px) {

    #topic-post #post-sidebar .ui.list,
    #topic-reply #reply-sidebar .ui.list {
        display: none;
    }
}

#topic-post #post-meta [class*="res right floated"] {
    margin-top: -5px;
}

@media (max-width: 576px) {
    #topic-post #post-meta {
        text-align: center;
    }

    #topic-post #post-meta [class*="res right floated"] {
        margin-top: 0;
    }
}

@media only screen and (min-width: 768px) {

    #topic-post #post-sidebar,
    #topic-reply #reply-sidebar {
        border-right: solid 1px rgba(0, 0, 0, .1);
        margin-top: -1.5rem;
        margin-bottom: -1.5rem;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    #topic-post #post-sidebar:before,
    #topic-reply #reply-sidebar:before {
        content: "";
        height: 0;
        border: 8px solid transparent;
        border-right: 8px solid rgba(0, 0, 0, .2);
        position: absolute;
        top: 75px;
        right: 0;
    }

    #topic-post #post-sidebar:after,
    #topic-reply #reply-sidebar:after {
        content: "";
        height: 0;
        border: 8px solid transparent;
        border-right: 8px solid #fff;
        position: absolute;
        top: 75px;
        right: -1px;
    }
}

@media only screen and (max-width: 768px) {

    #topic-post #post-sidebar,
    #topic-reply #reply-sidebar {
        border-bottom: solid 1px rgba(0, 0, 0, .1);
    }
}

.ui.comments {
    max-width: none;
}

.ui.grid.segment.leaderboard_table {
    margin-top: 0;
}

.leaderboard_table .ui.list {
    margin-left: -10px;
}

.leaderboard_table .ui.list li a {
    display: block;
    height: 100%;
    width: 100%;
}

.leaderboard_table .middle.aligned.content {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;;
    white-space: nowrap;
}

.leaderboard_table ol li:before {
    display: none;
}

#reactions {
    margin-top: 1rem;
    padding: .7em 1.2em .7em 1.2em;
    min-height: 32.5px;
    font-size: 12px;
}

#topic-post #post-content {
    display: flex;
    flex-direction: column;
}

#topic-post #post-content {
    padding: .7em 1.2em .7em 1.2em;
    min-height: 32.5px;
}

#post-content #reactions {
    margin-top: auto;
}

.reaction-button, .reaction-button-selected {
    margin-left: 5px;
    margin-right: 5px;
}

.reaction-button {
    opacity: 50%;
}

.reaction-button:hover, .reaction-button-selected {
    opacity: 100%;
    cursor: pointer;
}

#modal-reactions .ui.menu {
    overflow-x: auto;
}

/** Reaction modal tab buttons display non-native emojis as 2.5em wide by default */
.ui.menu .item > img:not(.ui) {
    width: 1em;
}

#topic-post #post-meta {
    margin-right: 1.3em;
}

#topic-post #post-sidebar .groups {
    text-align: center;
}

.inline.fields.labels {
    flex-wrap: wrap;
}

.ui.form .inline.fields.labels .field {
    padding-bottom: 1em;
}

.blockquote {
    border-left: 2px solid #ccc;
    margin: 1.5em 10px;
    padding: 0.5em 10px;
}

/*
   *  [ ACCOUNT MESSAGES ]
   */

#view-message #message .header {
    font-size: 1.15rem;
    margin-top: 0.01rem;
}

#view-message #message .meta {
    line-height: 0.95rem;
}

@media (max-width: 768px) {
    #messages table thead tr th:first-child {
        width: 100%;
    }

    #messages table thead tr th:not(:first-child),
    #messages table tbody tr td:not(:first-child) {
        display: none;
    }
}

/*
   *  -[ 404 ERROR ]-
   */

#error-403 .ui.container,
#error-404 .ui.container,
#maintenance .ui.container {
    position: relative;
    min-height: 100vh;
}

#error-403 .ui.segment,
#error-404 .ui.segment,
#maintenance .ui.segment {
    position: absolute;
    transform: translate(-50%, -70%);
    top: 50%;
    left: 50%;
    width: 500px;
    text-align: center;
}

/*
   *  [ PROFILE PAGE ]
   */

#profile-header {
    background: #fff;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

#profile-header .ui.header {
    margin: 8px 0;
}

#profile-header .ui.label {
    margin: 0;
}

#profile-header .actions {
    position: absolute;
    right: 1rem;
}

#profile a.ui.circular.image.avatar img {
    max-height: 35px;
}

/* Fix avatar images in labels being a few px from touching the top */
.ui.image.label img {
    vertical-align: top !important;
}

/*
   *  [ FORUM SEARCH ]
   */

#forum-search-result h3.ui.header {
    margin-top: 0;
    margin-bottom: 1rem;
}

/*
   *  [ SERVER PAGE ]
   */

[id*="server"] #server-players a:not(:last-child) {
    margin-right: .3rem;
}

/*
   *  [ WIDGETS ]
   */

[id*="widget"] .item .content {
    width: calc(100% - 40px) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[id*="widget"] .item .content * {
    overflow: hidden;
    text-overflow: ellipsis;
}

[id*="widget"] .item .description {
    width: calc(100% - 120px) !important;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[id*="widget"] .item .description * {
    overflow: hidden;
}

#widget-online-users .content {
    padding-bottom: .5rem;
}

#widget-online-users .ui.image.label {
    margin-bottom: .5rem;
}

#widget-online-staff .ui.list .item {
    display: flex;
    align-items: center;
}

#widget-online-staff .ui.list .item .content {
    display: flex;
    align-items: center;
}

#widget-online-staff .ui.list .item .content .badge {
    margin-left: .35rem;
}

.fb-page {
    padding-bottom: 14px;
}

/*
   *  -[ FOOTER ]-
   */

.ui.footer.segment {
    position: relative;
    margin: auto 0 -.5rem 0;
    padding: 3em 0;
}

@media only screen and (max-width: 768px) {
    .ui.footer.segment {
        text-align: center;
    }
}

.ui.link.list.list .active.item {
    color: rgba(255, 255, 255, .5);
}

.ui.link.list.list .active.item a:not(.ui) {
    color: rgba(0, 0, 0, .87) !important;
}

.ui.link.list.list .active.item a:not(.ui):hover {
    background: rgba(0, 0, 0, .05) !important;
}

/*
   *  [ TABLE ]
   */

@media (max-width: 576px) {
    .ui.table.res thead tr th:first-child {
        width: 100%;
    }

    .ui.table.res thead tr th:not(:first-child),
    .ui.table.res tbody tr td:not(:first-child) {
        display: none;
    }
}

@media (max-width: 992px) {

    .ui.table.res thead tr th:first-child,
    .ui.table.res thead tr th:last-child {
        width: 50%;
    }

    .ui.table.res thead tr th:not(:first-child):not(:last-child),
    .ui.table.res tbody tr td:not(:first-child):not(:last-child) {
        display: none;
    }
}

/*
   *  -[ GRID ]-
   */

.ui.grid+.grid {
    margin-top: 0.3rem;
}

.ui.row+.row {
    padding-top: 0.3rem;
}

.ui.padded.grid:not(.vertically):not(.horizontally) {
    margin: 0 -1rem 0 -1rem !important;
}

@media only screen and (max-width: 768px) {
    .ui.padded.grid:not(.vertically):not(.horizontally) {
        margin: 0 !important;
    }
}

/*
   *  [ LINK LIST ]
   */

.ui.link.list.list .item a:not(.ui):hover,
.ui.link.list.list a.item:hover {
    background: none;
}

.ui.link.list.list .ui.divider {
    margin: 0.5rem 0;
}

/*
   *  [ USES POPUP ]
   */

#user-popup .header {
    text-align: center;
}

#user-popup .header .ui.header {
    padding: .5rem 0;
}

#user-popup .header .ui.image {
    margin: auto;
}

/*
   *  [ COOKIE NOTICE ]
   */

.cc-window.cc-floating {
    padding: 1rem 1.5rem;
    background-color: #fff !important;
    color: rgba(0, 0, 0, .68) !important;
    -webkit-box-shadow: 0 1px 3px 0 #bababb, 0 0 1px 1px #bababb;
    box-shadow: 0 1px 3px 0 #bababb, 0 0 1px 1px #bababb;
    border: none;
    border-radius: .28571429rem;
    cursor: default;
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 18px;
    opacity: 1;
    transition: .5s all ease;
}

.cc-window.cc-floating .cc-highlight .cc-btn:first-child {
    color: rgba(0, 0, 0, .68);
}

.cc-window.cc-floating .cc-highlight .cc-btn.cc-allow {
    -webkit-box-shadow: 0 0 0 0 rgb(34 36 38 / 15%) inset;
    box-shadow: 0 0 0 0 rgb(34 36 38 / 15%) inset;
    background-color: #2185d0;
    border-color: #fff;
    border-radius: 5px;
    color: #fff;
}

.cc-revoke.cc-bottom.cc-right {
    color: #fff;
}

/*
   *  [ SPOILER ]
   */

#tinymce .spoiler,
.spoiler {
    color: rgba(0, 0, 0, .87);
    border-radius: .28571429rem;
    -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, .22) inset, 0 0 0 0 transparent;
    box-shadow: 0 0 0 1px rgba(34, 36, 38, .22) inset, 0 0 0 0 transparent;
    border: none;
}

#tinymce .spoiler-toggle,
.spoiler-toggle {
    color: rgba(0, 0, 0, .87);
}

#tinymce .spoiler-text,
.spoiler-text {
    color: rgba(0, 0, 0, .87);
}

/*
   *  [ MESSAGE ]
   */

.ui.message>.close.icon {
    right: .8em;
}

/*
   *  [ UPDATE MESSAGE ]
   */

#update-message {
    margin-bottom: 1rem;
}

#update-message>a {
    color: inherit;
    transition: all .2s ease;
}

#update-message>a:hover {
    filter: contrast(2);
}

#update-message>a>.icon {
    margin-right: .5em;
}

#update-message>a>.icon:not(.close) {
    display: block;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    line-height: 1;
    font-size: 3em;
    opacity: .8;
}

/*
   *  [ PAGINATION ]
   */

.ui.mini.pagination.menu .item:first-child,
.ui.mini.pagination.menu .item:last-child {
    padding-top: .5rem;
}

/*
   *  -[ ALIGNMENTS ]-
   */

[class*="left aligned"] {
    text-align: left;
}

[class*="center aligned"] {
    text-align: center;
}

[class*="right aligned"] {
    text-align: right;
}

/*
   *  [ FLOATS ]
   */

[class*="left floated"],
[class*="res left floated"] {
    float: left;
}

[class*="right floated"],
[class*="res right floated"] {
    float: right;
}

[class*="right floated"]+.ui.segment,
[class*="res right floated"]+.ui.segment {
    margin-top: 1rem;
}

@media only screen and (max-width: 576px) {

    [class*="res right floated"],
    [class*="res left floated"] {
        margin-top: 1rem;
        float: none;
    }

    [class*="res right floated"] .button:not(.mini),
    [class*="res left floated"] .button:not(.mini) {
        width: 100%;
        text-align: center;
    }

    [class*="res right floated"] .button:not(:first-child),
    [class*="res left floated"] .button:not(:first-child) {
        margin-top: 0.5rem;
    }
}

/*
   *  [ DISPLAY ]
   */

[display="block"] {
    display: block !important;
}

[display="inline"] {
    display: inline !important;
}

[display="inline block"] {
    display: inline-block !important;
}

/*
   *  [ VISIBILITY ]
   */

@media only screen and (max-width: 576px) {

    [class*="mobile hidden"],
    [class*="tablet only"]:not(.mobile),
    [class*="computer only"]:not(.mobile),
    [class*="large screen only"]:not(.mobile),
    [class*="widescreen only"]:not(.mobile),
    [class*="or lower hidden"] {
        display: none !important;
    }
}

@media only screen and (min-width: 576px) and (max-width: 768px) {

    [class*="mobile only"]:not(.tablet),
    [class*="tablet hidden"],
    [class*="computer only"]:not(.tablet),
    [class*="large screen only"]:not(.tablet),
    [class*="widescreen only"]:not(.tablet),
    [class*="or lower hidden"]:not(.mobile) {
        display: none !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 992px) {

    [class*="mobile only"]:not(.computer),
    [class*="tablet only"]:not(.computer),
    [class*="computer hidden"],
    [class*="large screen only"]:not(.computer),
    [class*="widescreen only"]:not(.computer),
    [class*="or lower hidden"]:not(.tablet):not(.mobile) {
        display: none !important;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1280px) {

    [class*="mobile only"]:not([class*="large screen"]),
    [class*="tablet only"]:not([class*="large screen"]),
    [class*="computer only"]:not([class*="large screen"]),
    [class*="large screen hidden"],
    [class*="widescreen only"]:not([class*="large screen"]),
    [class*="or lower hidden"]:not(.computer):not(.tablet):not(.mobile) {
        display: none !important;
    }
}

@media only screen and (min-width: 1280px) {

    [class*="mobile only"]:not([class*="widescreen"]),
    [class*="tablet only"]:not([class*="widescreen"]),
    [class*="computer only"]:not([class*="widescreen"]),
    [class*="large screen only"]:not([class*="widescreen"]),
    [class*="widescreen hidden"],
    [class*="widescreen or lower hidden"] {
        display: none !important;
    }
}

/*
   *  [ USER BADGES ]
   */

.badge {
    display: inline-block;
    line-height: 1;
    vertical-align: baseline;
    margin: 0 .14285714em;
    background-color: #e8e8e8;
    background-image: none;
    padding: 0.3em .3em;
    color: rgba(0, 0, 0, .6);
    text-transform: none;
    font-size: .85714286rem;
    font-weight: 700;
    border: 0 solid transparent;
    border-radius: .28571429rem;
    -webkit-transition: background .1s ease;
    transition: background .1s ease;
}

a.badge:hover,
a.badge:focus {
    text-decoration: none;
}

.badge:empty {
    display: none;
}

.badge-primary {
    color: #fff;
    background-color: #007bff;
}

a.badge-primary:hover,
a.badge-primary:focus {
    color: #fff;
    background-color: #0062cc;
}

.badge-secondary {
    color: #fff;
    background-color: #6c757d;
}

a.badge-secondary:hover,
a.badge-secondary:focus {
    color: #fff;
    background-color: #545b62;
}

.badge-success {
    color: #fff;
    background-color: #28a745;
}

a.badge-success:hover,
a.badge-success:focus {
    color: #fff;
    background-color: #1e7e34;
}

.badge-info {
    color: #fff;
    background-color: #17a2b8;
}

a.badge-info:hover,
a.badge-info:focus {
    color: #fff;
    background-color: #117a8b;
}

.badge-warning {
    color: #212529;
    background-color: #ffc107;
}

a.badge-warning:hover,
a.badge-warning:focus {
    color: #212529;
    background-color: #d39e00;
}

.badge-danger {
    color: #fff;
    background-color: #dc3545;
}

a.badge-danger:hover,
a.badge-danger:focus {
    color: #fff;
    background-color: #bd2130;
}

.badge-light {
    color: #212529;
    background-color: #f8f9fa;
}

a.badge-light:hover,
a.badge-light:focus {
    color: #212529;
    background-color: #dae0e5;
}

.badge-dark {
    color: #fff;
    background-color: #343a40;
}

a.badge-dark:hover,
a.badge-dark:focus {
    color: #fff;
    background-color: #1d2124;
}

/*
   *  [ OTHER ]
   */

select {
    font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size: 0.9rem;
    padding: 10px !important;
}

.ui.popup {
    z-index: 99999;
    text-align: left;
}

.ui.popup .ui.header {
    margin: 0;
}

.ui.message {
    margin: 0.5em 0;
}

.tox-tinymce {
    min-height: 300px;
}

.forum_post {
    word-wrap: break-word;
}

.forum_post img {
    overflow: auto;
    max-width: 100%;
    height: auto;
}

#post-content .forum_post {
    margin-bottom: 1rem;
}

.ui.checkbox .box:before {
    margin-top: 4px;
}

.ui.checkbox input:checked~.box:after {
    margin-top: 4px;
}

.ui.header .topic.title .label,
.ui.header .topic.title .badge {
    margin-top: -4px;
    vertical-align: middle;
}

#ie-message {
    display: none;
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    #ie-message {
        display: initial;
    }
}

#darkmode {
    display: inline-block;
}

.darkmode-toggle {
    opacity: 0;
    position: absolute;
}

.darkmode-toggle:checked+.darkmode-toggle-label .darkmode-ball {
    transform: translateX(24px);
}

.darkmode-toggle-label {
    background-color: #111;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 50px;
    position: relative;
    padding: 5px;
    height: 26px;
    width: 50px;
    cursor: pointer;
}

.darkmode-ball {
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    height: 22px;
    width: 22px;
    transition: transform 0.2s linear;
}

.fa-moon {
    color: #f1c400;
}

.fa-sun {
    color: #f39c00;
}

/*
 Member list search images
 */
.ui.search>.results .result .image {
    border-radius: 0;
}

/*
 Make new members grid avatars fit nicer
 */
#new-members-grid {
    padding: 0.5em;
}

#new-members-grid .column {
    padding: 0.5em;
}

/*
 *  [ EMOJI SIZING ]
 */

.joypixels,
.twemoji {
    height: 1em;
    width: 1em;
    vertical-align: middle;
}

/*
   *  [ DARK MODE ]
   */

body.dark,
body.dark>.pusher,
body.dark .ui.pointing.dropdown>.menu:after {
    background: #222;
}

body.dark .ui.secondary.menu:not(.inverted) {
    background: #303030;
    color: #fff;
}

body.dark .ui.secondary.menu .item.active {
    color: #fff;
}

body.dark .ui.top.attached.menu:not(.inverted) {
    background: #282828;
    border: 1px solid #282828;
}

body.dark .ui.top.attached.menu:not(.inverted) .item {
    color: #fff;
}

body.dark .ui.form input:not(.button) {
    background-color: #303030 !important;
}

body.dark .ui.modal {
    background-color: #303030;
    border: none;
}

body.dark .ui.modal>.content {
    background-color: #303030;
    border: 1px solid rgba(0, 0, 0, 0.125);
    color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

body.dark .ui.modal>.actions,
body.dark .ui.modal>.header {
    color: rgba(255, 255, 255, 0.6);
    background-color: #444;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

body.dark .ui.popup,
body.dark .ui.secondary.menu .ui.popup,
body.dark .ui.menu .dropdown.item .menu,
body.dark .ui.dropdown .menu {
    background-color: #222;
    border: 1px solid #444;
    color: rgba(255, 255, 255, 0.6);
}

body.dark .ui.default.button,
body.dark .ui.mini.icon.button,
body.dark .ui.top.right.attached.label {
    background-color: #282828;
    color: rgba(255, 255, 255, 0.6);
}

body.dark .ui.button.red {
    background-color: #db2828;
    color: #fff;
}

body.dark .ui.image.label,
body.dark .ui.selection.dropdown,
body.dark .ui.selection.visible.dropdown>.text:not(.default) {
    background-color: #282828;
    color: #fff;
}

body.dark .ui.selection.dropdown .ui.label {
    background-color: #303030;
    color: #fff;
}

body.dark .ui.form .ui.selection.dropdown input:not(.button) {
    background-color: #282828 !important;
}

body.dark .ui.form .field .ui.selection.active.dropdown .menu {
    border: 1px solid #282828;
}

body.dark .ui.form .field .ui.dropdown .menu .item {
    background-color: #282828;
    border-top: 1px solid #303030;
    color: #fff;
}

body.dark .ui.form .ui.text input:not(.button) {
    background-color: #282828 !important;
}

body.dark .ui.form .field input {
    background-color: #282828 !important;
}

body.dark .ui.card,
body.dark .ui.segment,
body.dark .ui.segment.attached:not(.basic),
body.dark .ui.vertical.menu {
    background-color: #303030;
    border: 1px solid rgba(0, 0, 0, 0.125);
    -webkit-box-shadow: none;
    box-shadow: none;
}

body.dark .ui.vertical.menu .active.item {
    background-color: #464646;
}

body.dark .ui.vertical.pointing.menu .active.item:after {
    background-color: #464646;
    border-top: 1px solid #464646;
    border-right: 1px solid #464646;
}

body.dark .ui.segment#profile-header {
    border: none;
}

body.dark .ui.attached.tabular.menu {
    border-bottom: none;
}

body.dark .ui.attached.tabular.menu .item.active {
    background-color: #303030;
    border-color: transparent;
}

body.dark .ui.card .content.header {
    background-color: #444;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

body.dark .ui.card>.content>.description,
body.dark .ui.cards>.card>.content>.description,
body.dark .ui.card>.content>.description .list .right.floated,
body.dark .ui.card>.content>.header a,
body.dark .ui.segment a,
body.dark .ui.checkbox label,
body.dark .ui.checkbox+label,
body.dark .ui.list .list>.item .description,
body.dark .ui.list>.item .description,
body.dark .ui.vertical.menu .item.active,
body.dark .ui.vertical.menu .item:hover,
body.dark #user-popup .description,
body.dark .ui.search.dropdown.active>input.search,
body.dark .ui.search.selection.dropdown>input.search,
body.dark .ui.selection.dropdown .menu>.message,
body.dark .ui.attached.tabular.menu .item.active,
body.dark .ui.threaded.comments .comment .text {
    color: #fff;
}

body.dark .ui.segment .forum_post a,
body.dark .ui.comments .comment .forum_post a {
    color: #62b6f7;
}

body.dark .ui.card .meta,
.ui.cards>.card .meta,
body.dark .ui.header,
body.dark .ui.header .sub.header,
body.dark .ui.card>.content>.header,
body.dark .ui.cards>.card>.content>.header,
body.dark .ui.secondary.menu .item:not(.active),
body.dark .ui.card>.content>.description .list .item .text,
body.dark .ui.card>.extra,
body.dark .ui.cards>.card>.extra,
body.dark .ui.pointing.dropdown>.menu>.header,
body.dark .ui.dropdown .menu>.item,
body.dark .ui.breadcrumb .icon.divider,
body.dark .ui.vertical.menu .item,
body.dark .ui.segment,
body.dark .ui.form .field>label,
body.dark .ui.list .list>.item .header,
body.dark .ui.list>.item .header,
body.dark .ui.attached.tabular.menu .item,
body.dark .ui.comments .comment .metadata,
body.dark .ui.comments .comment .actions a,
body.dark .ui.card>.extra a:not(.ui),
body.dark .ui.cards>.card>.extra a:not(.ui),
body.dark .ui.relaxed.list .item .content,
body.dark .ui.horizontal.divider,
body.dark .ui.dropdown .menu>.header:not(.ui),
body.dark .ui.link.list.list .active.item,
body.dark .ui.link.list.list .active.item a:not(.ui) {
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark .ui.menu .ui.dropdown .menu>.item:hover {
    background-color: rgba(0, 0, 0, .05) !important;
}

body.dark .ui.secondary.inverted.menu .popup .list a.item,
body.dark .ui.pointing.dropdown>.menu>.item {
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark .ui.menu .ui.dropdown .menu>.item:hover,
body.dark .ui.dropdown .menu>.item:hover,
body.dark .ui.menu .ui.dropdown .menu>.item.active,
body.dark .ui.list>.item a.header,
body.dark .ui.link.list.list .active.item a:not(.ui):hover {
    color: #fff !important;
}

body.dark .ui.top.left.popup:before {
    background: #222;
    -webkit-box-shadow: 1px 1px 0 0 #444;
    box-shadow: 1px 1px 0 0 #444;
}

body.dark .ui.right.center.popup:before {
    background: #222;
    -webkit-box-shadow: -1px 1px 0 0 #444;
    box-shadow: -1px 1px 0 0 #444;
}

body.dark .ui.left.center.popup:before {
    background: #222;
    -webkit-box-shadow: 1px -1px 0 0 #444;
    box-shadow: 1px -1px 0 0 #444;
}

body.dark .ui.bottom.left.popup:before {
    background: #222;
    -webkit-box-shadow: 1px 1px 0 0 #222;
    box-shadow: 1px 1px 0 0 #222;
}

body.dark .ui.form textarea {
    background-color: #303030;
    border: 2px solid #282828;
    color: #fff;
}

body.dark .ui.form input:not([type]),
body.dark .ui.form input[type=date],
body.dark .ui.form input[type=datetime-local],
body.dark .ui.form input[type=email],
body.dark .ui.form input[type=file],
body.dark .ui.form input[type=number],
body.dark .ui.form input[type=password],
body.dark .ui.form input[type=search],
body.dark .ui.form input[type=tel],
body.dark .ui.form input[type=text],
body.dark .ui.form input[type=time],
body.dark .ui.form input[type=url] {
    color: #fff;
}

body.dark .ui.mini.message,
body.dark .ui.mini.info.message {
    background-color: #282828;
    box-shadow: 0 0 0 1px #282828 inset, 0 0 0 0 transparent;
    -webkit-box-shadow: 0 0 0 1px #282828 inset, 0 0 0 0 transparent;
}

body.dark .ui.pagination {
    background-color: #303030;
}

body.dark .ui.pagination.menu .item {
    color: #fff;
}

body.dark .ui.pagination.menu .item.active {
    background-color: #282828;
}

body.dark .ui.pagination .disabled.item {
    background-color: rgba(0, 0, 0, .05) !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark .ui.table {
    background: #303030;
    color: rgba(255, 255, 255, 0.6);
}

body.dark .ui.table thead th {
    background-color: #282828;
    color: rgba(255, 255, 255, 0.6);
}

body.dark .ui.top.attached.header {
    background-color: #282828;
    border-color: #282828;
    color: rgba(255, 255, 255, 0.6);
}

body.dark .ui.table a {
    color: #fff;
}

body.dark .ui.selectable.table tbody tr:hover,
body.dark .ui.table tbody tr td.selectable:hover {
    color: rgba(255, 255, 255, 0.6) !important;
}

@media only screen and (min-width: 768px) {

    body.dark #topic-post #post-sidebar:after,
    #topic-reply #reply-sidebar:after {
        border-right: none;
    }
}

body.dark .forum_post,
body.dark .ui.comments .forum_post.text {
    color: #fff;
}

body.dark .ui.comments .comment .author {
    color: #fff;
}

body.dark .tox .tox-toolbar {
    background-color: #222;
}

body.dark .tox .tox-tbtn {
    color: #fff;
}

body.dark .tox .tox-tbtn:hover,
body.dark .tox .tox-tbtn--enabled,
body.dark .tox .tox-split-button:focus,
body.dark .tox .tox-edit-area__iframe {
    color: #fff;
}

body.dark .tox .tox-tbtn svg {
    fill: #fff;
}

/* Override TinyMCE blue-ish dark theme with neutral dark theme */

body.dark .tox .tox-menu,
body.dark .tox .tox-statusbar,
body.dark .tox .tox-menubar,
body.dark .tox .tox-toolbar,
body.dark .tox .tox-toolbar__overflow,
body.dark .tox .tox-toolbar__primary,
body.dark .tox .tox-dialog,
body.dark .tox .tox-dialog__header,
body.dark .tox .tox-dialog__footer,
body.dark .tox .tox-listboxfield .tox-listbox--select,
body.dark .tox .tox-textarea,
body.dark .tox .tox-textfield,
body.dark .tox .tox-toolbar-textfield,
body.dark .tox .tox-selectfield select {
    background-color: #222;
}

body.dark .tox .tox-dialog-wrap__backdrop {
    background-color: rgba(34, 34, 34, 0.7);
}

body.dark .tox .tox-collection--list .tox-collection__item--enabled {
    background-color: #444;
}

body.dark .tox .tox-collection--list .tox-collection__item--active {
    background-color: #666;
}

body.dark .ui.cards>.green.card,
body.dark .ui.green.card,
body.dark .ui.green.cards>.card {
    -webkit-box-shadow: 0 0 0 1px #d4d4d5, 0 5px 0 0 #178f2b, 0 1px 3px 0 #d4d4d5;
    box-shadow: 0 0 0 1px #d4d4d5, 0 5px 0 0 #178f2b, 0 1px 3px 0 #d4d4d5;
}

body.dark .ui.cards>.red.card,
body.dark .ui.red.card,
body.dark .ui.red.cards>.card {
    -webkit-box-shadow: 0 0 0 1px #d4d4d5, 0 5px 0 0 #db2828, 0 1px 3px 0 #d4d4d5;
    box-shadow: 0 0 0 1px #d4d4d5, 0 5px 0 0 #db2828, 0 1px 3px 0 #d4d4d5;
}

body.dark .ui.tabular.menu {
    border-color: #282828;
}

body.dark .ui.tabular.menu .item {
    color: #fff;
}

body.dark .ui.tabular.menu .active.item {
    background-color: #282828;
    border-color: #282828;
}

body.dark .cc-window.cc-floating {
    -webkit-box-shadow: 0 1px 3px 0 #444, 0 0 1px 1px #444;
    box-shadow: 0 1px 3px 0 #444, 0 0 1px 1px #444;
    background-color: #303030 !important;
    border: 1px solid rgba(0, 0, 0, 0.125);
    color: #fff !important;
}

body.dark .cc-window.cc-floating .cc-highlight .cc-btn:first-child,
body.dark .cc-window.cc-floating .cc-link {
    color: rgba(255, 255, 255, 0.6);
}

body.dark .cc-window.cc-floating .cc-highlight .cc-btn.cc-allow {
    background-color: #282828;
    border-color: transparent;
}

body.dark #reactions.ui.mini.message span {
    color: #fff;
}

body.dark #modal-reactions .ui.menu {
    background-color: #282828;
}

body.dark #modal-reactions .ui.menu .item {
    color: #fff;
}

body.dark #modal-reactions .ui.menu .item.active {
    background-color: #222;
}

body.dark #modal-reactions .ui.large.selection.divided.list.middle.aligned .item .content {
    color: #fff;
}

body.dark ::-webkit-scrollbar-corner {
    background-color: transparent;
}

/*
 * Colours
 */

body.dark .white {
    color: #fff;
}

/*
 * Accessiblity
 */

.screenreader-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}    
/* Bannière principale Skylium */
.ui.masthead {
    height: clamp(160px, 16.6vw, 320px) !important;
    min-height: 160px !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
/* ==================================================
   SKYLIUM — BASE VISUELLE DU THÈME
   ================================================== */

:root {
    --skylium-navy: #071426;
    --skylium-deep-blue: #0c2340;
    --skylium-blue: #1677bd;
    --skylium-cyan: #22d3ee;
    --skylium-aqua: #67e8f9;
    --skylium-surface: #f4faff;
    --skylium-card: #ffffff;
    --skylium-border: #d5eaf5;
    --skylium-text: #10243a;
}

/* Arrière-plan général en mode clair */
body:not(.dark) {
    background:
        radial-gradient(
            circle at 15% 0%,
            rgba(34, 211, 238, 0.12),
            transparent 32rem
        ),
        linear-gradient(
            180deg,
            #f5fbff 0%,
            #edf6fb 100%
        );
    color: var(--skylium-text);
}

/* Cartes et blocs du site */
body:not(.dark) .ui.segment,
body:not(.dark) .ui.card {
    background: var(--skylium-card) !important;
    border: 1px solid var(--skylium-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 32px rgba(7, 20, 38, 0.08) !important;
}

/* Liens */
body:not(.dark) a {
    color: var(--skylium-blue);
}

body:not(.dark) a:hover {
    color: #0b5e9b;
}
/* ==================================================
   SKYLIUM — BLOCS ET TABLEAUX DU FORUM
   ================================================== */

body:not(.dark) .ui.table {
    background: #ffffff !important;
    border: 1px solid var(--skylium-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 32px rgba(7, 20, 38, 0.08) !important;
    overflow: hidden;
}

/* En-têtes des catégories */
body:not(.dark) .ui.table thead th {
    background: linear-gradient(
        90deg,
        rgba(22, 119, 189, 0.11),
        rgba(34, 211, 238, 0.07)
    ) !important;
    color: var(--skylium-deep-blue) !important;
    border-bottom: 1px solid var(--skylium-border) !important;
    font-weight: 700 !important;
}

/* Lignes du forum */
body:not(.dark) .ui.table tbody td {
    border-top-color: #e6f1f7 !important;
}

/* Effet au passage de la souris */
body:not(.dark) .ui.selectable.table tbody tr:hover {
    background: rgba(34, 211, 238, 0.06) !important;
}

/* Titres des catégories */
body:not(.dark) .ui.table .ui.header,
body:not(.dark) .ui.table h3,
body:not(.dark) .ui.table h4 {
    color: var(--skylium-blue) !important;
}
/* ==================================================
   SKYLIUM — BOUTONS ET CHAMPS
   ================================================== */

/* Boutons principaux */
body:not(.dark) .ui.primary.button,
body:not(.dark) .ui.blue.button,
body:not(.dark) button.ui.primary,
body:not(.dark) button.ui.blue {
    background: linear-gradient(
        135deg,
        var(--skylium-blue),
        #0ea5c6
    ) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 11px !important;
    box-shadow: 0 8px 20px rgba(22, 119, 189, 0.22) !important;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        filter 0.18s ease !important;
}

body:not(.dark) .ui.primary.button:hover,
body:not(.dark) .ui.blue.button:hover,
body:not(.dark) button.ui.primary:hover,
body:not(.dark) button.ui.blue:hover {
    transform: translateY(-1px);
    filter: brightness(1.06);
    box-shadow: 0 11px 24px rgba(22, 119, 189, 0.28) !important;
}

/* Champs de saisie */
body:not(.dark) .ui.input > input,
body:not(.dark) .ui.form input:not([type="checkbox"]):not([type="radio"]),
body:not(.dark) .ui.form textarea,
body:not(.dark) .ui.form select {
    background: #ffffff !important;
    color: var(--skylium-text) !important;
    border: 1px solid var(--skylium-border) !important;
    border-radius: 11px !important;
    box-shadow: inset 0 1px 2px rgba(7, 20, 38, 0.03) !important;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease !important;
}

/* Champs sélectionnés */
body:not(.dark) .ui.input > input:focus,
body:not(.dark) .ui.form input:focus,
body:not(.dark) .ui.form textarea:focus,
body:not(.dark) .ui.form select:focus {
    border-color: var(--skylium-cyan) !important;
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.14) !important;
}

/* Barre de recherche avec bouton attaché */
body:not(.dark) .ui.action.input > input {
    border-radius: 11px 0 0 11px !important;
}

body:not(.dark) .ui.action.input > .button {
    border-radius: 0 11px 11px 0 !important;
}
/* ==================================================
   SKYLIUM — BARRE DE NAVIGATION PRINCIPALE
   ================================================== */

body:not(.dark) #navbar {
    min-height: 64px;
    margin: 0 !important;
    padding: 0 18px;
    background: linear-gradient(
        90deg,
        var(--skylium-navy) 0%,
        var(--skylium-deep-blue) 55%,
        #0b3554 100%
    ) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: 0 8px 24px rgba(7, 20, 38, 0.18) !important;
}

/* Liens principaux */
body:not(.dark) #navbar > .ui.container > .item,
body:not(.dark) #navbar > .ui.container > .right.menu > .item {
    position: relative;
    display: flex;
    align-items: center;
    color: #eafaff !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
    transition:
        background 0.18s ease,
        color 0.18s ease !important;
}

/* Icônes */
body:not(.dark) #navbar > .ui.container > .item i.icon,
body:not(.dark) #navbar > .ui.container > .right.menu > .item i.icon {
    color: var(--skylium-cyan) !important;
}

/* Survol */
body:not(.dark) #navbar > .ui.container > .item:hover,
body:not(.dark) #navbar > .ui.container > .right.menu > .item:hover {
    background: rgba(34, 211, 238, 0.11) !important;
    color: #ffffff !important;
}

/* Page actuellement sélectionnée */
body:not(.dark) #navbar > .ui.container > .active.item {
    background: rgba(34, 211, 238, 0.15) !important;
    color: #ffffff !important;
}

body:not(.dark) #navbar > .ui.container > .active.item::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 6px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(
        90deg,
        var(--skylium-cyan),
        var(--skylium-aqua)
    );
}

/* Menus déroulants : conservation d’un fond clair */
body:not(.dark) #navbar .dropdown .menu {
    background: #ffffff !important;
    border: 1px solid var(--skylium-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 34px rgba(7, 20, 38, 0.16) !important;
}

body:not(.dark) #navbar .dropdown .menu .item {
    color: var(--skylium-text) !important;
}
/* ==================================================
   SKYLIUM — COMPTE ET ACTIONS DE LA NAVIGATION
   ================================================== */

body:not(.dark) #navbar .right.menu {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Boutons messagerie, signalements, paramètres et compte */
body:not(.dark) #navbar .right.menu > .item {
    min-height: 44px;
    margin: 8px 0 !important;
    padding: 10px 13px !important;
    background: rgba(255, 255, 255, 0.07) !important;
    color: #ffffff !important;
    border: 1px solid rgba(103, 232, 249, 0.14) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body:not(.dark) #navbar .right.menu > .item:hover {
    background: rgba(34, 211, 238, 0.15) !important;
    border-color: rgba(103, 232, 249, 0.3) !important;
}

/* Icônes de droite */
body:not(.dark) #navbar .right.menu > .item i.icon {
    color: var(--skylium-cyan) !important;
}

/* Avatar du compte */
body:not(.dark) #navbar .right.menu .ui.avatar.image {
    border: 2px solid rgba(103, 232, 249, 0.55);
    border-radius: 8px;
}

/* Nom du joueur */
body:not(.dark) #navbar .right.menu .item,
body:not(.dark) #navbar .right.menu .item a {
    color: #ffffff !important;
}
/* ==================================================
   SKYLIUM — CORRECTION DES BOUTONS À DROITE
   ================================================== */

/* Tous les boutons et le compte dans la zone droite */
body:not(.dark) #navbar .right.menu > a.ui.button,
body:not(.dark) #navbar .right.menu > a.ui.label {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    margin: 8px 3px !important;
    padding: 10px 13px !important;

    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;

    border: 1px solid rgba(103, 232, 249, 0.18) !important;
    border-radius: 10px !important;
    box-shadow: none !important;

    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease !important;
}

/* Suppression des anciennes couleurs rouge, blanche et cyan */
body:not(.dark) #navbar .right.menu > a.ui.primary.button,
body:not(.dark) #navbar .right.menu > a.ui.default.button,
body:not(.dark) #navbar .right.menu > a.ui.red.button,
body:not(.dark) #navbar .right.menu > a.ui.negative.button,
body:not(.dark) #navbar .right.menu > a.ui.blue.button,
body:not(.dark) #navbar .right.menu > a.ui.teal.button {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

/* Survol */
body:not(.dark) #navbar .right.menu > a.ui.button:hover,
body:not(.dark) #navbar .right.menu > a.ui.label:hover {
    background: rgba(34, 211, 238, 0.17) !important;
    border-color: rgba(103, 232, 249, 0.38) !important;
    transform: translateY(-1px);
}

/* Couleur des icônes */
body:not(.dark) #navbar .right.menu > a.ui.button i.icon,
body:not(.dark) #navbar .right.menu > a.ui.label i.icon {
    color: var(--skylium-cyan) !important;
}

/* Compte du joueur */
body:not(.dark) #navbar .right.menu > a.ui.image.label {
    padding-left: 46px !important;
}

body:not(.dark) #navbar .right.menu > a.ui.image.label img {
    border-radius: 8px 0 0 8px !important;
    border-right: 1px solid rgba(103, 232, 249, 0.22) !important;
}
/* ==================================================
   SKYLIUM — CENTRAGE DU COMPTE DANS LA NAVIGATION
   ================================================== */

body:not(.dark) #navbar .right.menu > a.ui.image.label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    width: auto !important;
    min-width: 0 !important;
    padding: 8px 14px !important;
}

/* Avatar replacé normalement à côté du pseudo */
body:not(.dark) #navbar .right.menu > a.ui.image.label img {
    position: static !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;

    object-fit: cover !important;
    border: 1px solid rgba(103, 232, 249, 0.45) !important;
    border-radius: 8px !important;
}
/* ==================================================
   SKYLIUM — TEXTE DES MENUS DÉROULANTS
   ================================================== */

body:not(.dark) #navbar .right.menu .ui.popup {
    background: #ffffff !important;
    color: var(--skylium-text) !important;
    border: 1px solid var(--skylium-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 34px rgba(7, 20, 38, 0.18) !important;
}

/* Titres et textes des fenêtres */
body:not(.dark) #navbar .right.menu .ui.popup .header,
body:not(.dark) #navbar .right.menu .ui.popup .item,
body:not(.dark) #navbar .right.menu .ui.popup .content,
body:not(.dark) #navbar .right.menu .ui.popup .description,
body:not(.dark) #navbar .right.menu .ui.popup .meta {
    color: var(--skylium-text) !important;
}

/* Liens présents dans les fenêtres */
body:not(.dark) #navbar .right.menu .ui.popup a,
body:not(.dark) #navbar .right.menu .ui.popup .item a {
    color: var(--skylium-blue) !important;
}

/* Survol d’un élément */
body:not(.dark) #navbar .right.menu .ui.popup .item:hover {
    background: rgba(34, 211, 238, 0.08) !important;
    color: var(--skylium-deep-blue) !important;
}
/* ==================================================
   SKYLIUM — MENU MOBILE
   ================================================== */

@media only screen and (max-width: 767px) {

    #toc.ui.sidebar {
        background: linear-gradient(
            180deg,
            var(--skylium-navy) 0%,
            var(--skylium-deep-blue) 100%
        ) !important;
        border-right: 1px solid rgba(103, 232, 249, 0.22) !important;
        box-shadow: 12px 0 32px rgba(7, 20, 38, 0.35) !important;
    }

    /* Nom Skylium en haut */
    #toc.ui.sidebar > .item:first-child {
        color: #ffffff !important;
        font-weight: 700 !important;
        font-size: 1.35rem !important;
        background: rgba(34, 211, 238, 0.07) !important;
        border-bottom: 1px solid rgba(103, 232, 249, 0.16) !important;
    }

    /* Liens du menu */
    #toc.ui.sidebar .item {
        color: #eafaff !important;
        border-bottom: 1px solid rgba(103, 232, 249, 0.10) !important;
        transition:
            background 0.18s ease,
            color 0.18s ease,
            padding-left 0.18s ease !important;
    }

    /* Icônes */
    #toc.ui.sidebar .item i.icon {
        color: var(--skylium-cyan) !important;
    }

    /* Survol et toucher */
    #toc.ui.sidebar .item:hover {
        background: rgba(34, 211, 238, 0.11) !important;
        color: #ffffff !important;
        padding-left: 1.35em !important;
    }

    /* Page active */
    #toc.ui.sidebar .active.item {
        background: linear-gradient(
            90deg,
            rgba(34, 211, 238, 0.22),
            rgba(34, 211, 238, 0.07)
        ) !important;
        color: #ffffff !important;
        border-left: 4px solid var(--skylium-cyan) !important;
    }
}
/* ==================================================
   SKYLIUM — CORRECTION DU MENU MOBILE
   ================================================== */

@media only screen and (max-width: 991px) {

    body #toc.ui.vertical.inverted.sidebar.menu {
        background: linear-gradient(
            180deg,
            #071426 0%,
            #0c2340 100%
        ) !important;
        border-right: 1px solid rgba(103, 232, 249, 0.25) !important;
        box-shadow: 12px 0 32px rgba(7, 20, 38, 0.45) !important;
    }

    /* Titre Skylium */
    body #toc.ui.sidebar.menu > .item:first-child {
        background: rgba(34, 211, 238, 0.08) !important;
        color: #ffffff !important;
        border-bottom: 1px solid rgba(103, 232, 249, 0.18) !important;
    }

    /* Tous les liens */
    body #toc.ui.sidebar.menu .item {
        background: transparent !important;
        color: #eafaff !important;
        border-bottom: 1px solid rgba(103, 232, 249, 0.11) !important;
    }

    /* Icônes */
    body #toc.ui.sidebar.menu .item i.icon {
        color: #22d3ee !important;
    }

    /* Page active */
    body #toc.ui.sidebar.menu .active.item {
        background: linear-gradient(
            90deg,
            rgba(34, 211, 238, 0.24),
            rgba(34, 211, 238, 0.06)
        ) !important;
        color: #ffffff !important;
        border-left: 4px solid #22d3ee !important;
    }

    /* Bouton du menu */
    body #navbar .toc.item,
    body .toc.item {
        color: #1677bd !important;
        border-radius: 10px !important;
    }
}
/* ==================================================
   SKYLIUM — FORÇAGE DU MENU LATÉRAL MOBILE
   ================================================== */

html body #toc {
    background: linear-gradient(
        180deg,
        #06182d 0%,
        #0a2d4d 100%
    ) !important;
    border-right: 1px solid rgba(34, 211, 238, 0.35) !important;
    box-shadow: 12px 0 32px rgba(0, 0, 0, 0.45) !important;
}

/* Titre Skylium */
html body #toc.ui.menu > .item:first-child {
    background: #08213b !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(34, 211, 238, 0.25) !important;
}

/* Tous les liens */
html body #toc.ui.menu .item {
    background: transparent !important;
    color: #eafaff !important;
    border-bottom: 1px solid rgba(103, 232, 249, 0.12) !important;
}

/* Icônes */
html body #toc.ui.menu .item i.icon,
html body #toc.ui.menu .item .icon {
    color: #22d3ee !important;
}

/* Page active */
html body #toc.ui.menu .active.item {
    background: linear-gradient(
        90deg,
        rgba(34, 211, 238, 0.30),
        rgba(34, 211, 238, 0.08)
    ) !important;
    color: #ffffff !important;
    border-left: 4px solid #22d3ee !important;
}

/* Survol */
html body #toc.ui.menu .item:hover {
    background: rgba(34, 211, 238, 0.14) !important;
    color: #ffffff !important;
}
/* ==================================================
   SKYLIUM — RESTAURATION DE LA NAVIGATION MOBILE
   ================================================== */

@media only screen and (max-width: 767px) {

    /* Masquer uniquement les liens de navigation ordinateur */
    body:not(.dark) #navbar > .ui.container > .item:not(.toc) {
        display: none !important;
    }

    /* Réafficher le bouton hamburger */
    body:not(.dark) #navbar > .ui.container > .toc.item {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 48px !important;
        color: var(--skylium-cyan) !important;
    }

    /* Conserver les boutons de connexion ou le compte à droite */
    body:not(.dark) #navbar > .ui.container > .right.menu {
        display: flex !important;
        align-items: center !important;
        margin-left: auto !important;
    }
}
/* ==================================================
   SKYLIUM — WIDGETS LATÉRAUX DE L’ACCUEIL
   ================================================== */

/* Cartes des widgets de gauche et de droite */
body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.segment,

body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.card {

    position: relative;
    overflow: hidden;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f5fbff 100%
    ) !important;

    border: 1px solid rgba(34, 211, 238, 0.22) !important;
    border-radius: 16px !important;

    box-shadow:
        0 10px 28px rgba(7, 20, 38, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;

    margin-bottom: 18px !important;
}

/* Petite ligne cyan au-dessus de chaque widget */
body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.segment::before,

body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.card::before {

    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    height: 4px;

    background: linear-gradient(
        90deg,
        #1677bd,
        #22d3ee,
        #67e8f9
    );
}

/* Titres des widgets */
body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.header,

body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.card .header {

    color: #0b4f7c !important;
    font-weight: 700 !important;
}

/* Séparations internes */
body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.segment .divider,

body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
.ui.card .content {

    border-color: rgba(22, 119, 189, 0.12) !important;
}

/* Widget Discord */
body:not(.dark)
.ui.stackable.grid
> .ui.centered.row
> .ui.six.wide.tablet.four.wide.computer.column
iframe {

    display: block;
    width: 100% !important;

    border: 1px solid rgba(34, 211, 238, 0.22) !important;
    border-radius: 16px !important;

    box-shadow: 0 10px 28px rgba(7, 20, 38, 0.09) !important;
}
/* ==================================================
   SKYLIUM — ARTICLE PRINCIPAL DE L’ACCUEIL
   ================================================== */

body:not(.dark) #news-post.ui.card {
    position: relative;
    overflow: hidden;

    width: 100% !important;
    margin-bottom: 22px !important;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f6fbff 100%
    ) !important;

    border: 1px solid rgba(34, 211, 238, 0.24) !important;
    border-radius: 18px !important;

    box-shadow:
        0 14px 34px rgba(7, 20, 38, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

/* Ligne décorative supérieure */
body:not(.dark) #news-post.ui.card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    height: 5px;

    background: linear-gradient(
        90deg,
        #1677bd,
        #22d3ee,
        #67e8f9
    );
}

/* Contenu */
body:not(.dark) #news-post > .content {
    padding: 24px !important;
}

/* Titre cliquable situé au-dessus de l’article */
body:not(.dark) #news-post > .content > .header > a,
body:not(.dark) #news-post > .content > .header {
    color: #1677bd !important;
    font-weight: 700 !important;
}

/* Titre principal placé dans le texte */
body:not(.dark) #news-post .description h1,
body:not(.dark) #news-post .description h2,
body:not(.dark) #news-post .description h3 {
    color: #123d5a !important;
}

/* Pied de la carte */
body:not(.dark) #news-post > .extra.content {
    padding: 16px 24px !important;

    background: rgba(234, 248, 255, 0.55) !important;
    border-top: 1px solid rgba(22, 119, 189, 0.12) !important;
}

/* Bouton Lire en entier */
body:not(.dark) #news-post .ui.primary.button {
    background: linear-gradient(
        90deg,
        #1677bd,
        #22b8d6
    ) !important;

    color: #ffffff !important;
    border: 1px solid rgba(103, 232, 249, 0.45) !important;
    border-radius: 10px !important;

    box-shadow: 0 6px 16px rgba(22, 119, 189, 0.20) !important;
}

/* Avatar de l’auteur */
body:not(.dark) #news-post .ui.avatar.image {
    border: 2px solid rgba(34, 211, 238, 0.38) !important;
}

/* Ajustements téléphone */
@media only screen and (max-width: 767px) {
    body:not(.dark) #news-post > .content {
        padding: 24px !important;
    }

    body:not(.dark) #news-post > .extra.content {
        padding: 16px 24px !important;
    }
}
/* ==================================================
   SKYLIUM — PIED DE PAGE
   ================================================== */

body #footer.ui.inverted.vertical.footer.segment {
    position: relative;
    margin-top: 0 !important;
    padding: 42px 0 34px !important;

    background: linear-gradient(
        135deg,
        #06182d 0%,
        #0a2947 55%,
        #0c3b5e 100%
    ) !important;

    color: #dff7ff !important;

    border-top: 3px solid #22d3ee !important;

    box-shadow:
        0 -12px 32px rgba(7, 20, 38, 0.14),
        inset 0 1px 0 rgba(103, 232, 249, 0.15) !important;
}

/* Lueur décorative supérieure */
body #footer.ui.inverted.vertical.footer.segment::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 0;
    right: 0;

    height: 3px;

    background: linear-gradient(
        90deg,
        #1677bd,
        #22d3ee,
        #67e8f9,
        #22d3ee,
        #1677bd
    );
}

/* Titres des colonnes */
body #footer .ui.inverted.header {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Textes et éléments */
body #footer .ui.inverted.link.list .item,
body #footer .ui.inverted.link.list a.item,
body #footer span.item {
    color: #cdeaf4 !important;
    opacity: 1 !important;
}

/* Liens */
body #footer a {
    color: #67e8f9 !important;
    transition:
        color 0.18s ease,
        transform 0.18s ease !important;
}

body #footer a:hover {
    color: #ffffff !important;
}

/* Icônes sociales */
body #footer .ui.inverted.link.list i.icon {
    color: #22d3ee !important;
}

/* Séparations entre les colonnes */
body #footer .ui.divided.grid > .column:not(.row) {
    border-color: rgba(103, 232, 249, 0.16) !important;
}

/* Bouton du mode sombre */
body #footer #darkmode {
    display: inline-block !important;
    margin-top: 12px !important;
}

/* Version téléphone */
@media only screen and (max-width: 767px) {

    body #footer.ui.inverted.vertical.footer.segment {
        padding: 34px 22px 30px !important;
        text-align: center !important;
    }

    body #footer .ui.stackable.grid > .column {
        padding-top: 18px !important;
        padding-bottom: 18px !important;
    }

    body #footer .ui.inverted.link.list {
        text-align: center !important;
    }
}
/* Espace de sécurité sous le footer sur téléphone */
@media only screen and (max-width: 767px) {
    body #footer.ui.inverted.vertical.footer.segment {
        padding-bottom: 120px !important;
    }
}
/* ==================================================
   SKYLIUM — HAUTEUR DU WIDGET DISCORD SUR ORDINATEUR
   ================================================== */

@media only screen and (min-width: 992px) {
    body:not(.dark)
    .ui.stackable.grid
    > .ui.centered.row
    > .ui.six.wide.tablet.four.wide.computer.column
    iframe {
        height: 430px !important;
        min-height: 430px !important;
        max-height: 430px !important;
    }
}
/* ==================================================
   SKYLIUM — GRANDES CATÉGORIES DU FORUM
   ================================================== */

body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] {
    position: relative;
    overflow: hidden;

    margin-bottom: 22px !important;
    padding: 24px !important;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f5fbff 100%
    ) !important;

    border: 1px solid rgba(34, 211, 238, 0.24) !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 30px rgba(7, 20, 38, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

/* Ligne décorative supérieure */
body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    height: 5px;

    background: linear-gradient(
        90deg,
        #1677bd,
        #22d3ee,
        #67e8f9
    );
}

/* Titre de la catégorie */
body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] > h3.ui.header {
    margin-top: 2px !important;
    margin-bottom: 16px !important;

    color: #0b4f7c !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
}

/* Lien du titre */
body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] > h3.ui.header a {
    color: #0b4f7c !important;
}

/* Séparation sous le titre */
body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] > .ui.divider {
    margin: 0 0 12px !important;
    border-color: rgba(22, 119, 189, 0.14) !important;
}

/* Ajustement téléphone */
@media only screen and (max-width: 767px) {
    body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] {
        padding: 22px 18px !important;
        border-radius: 16px !important;
    }

    body:not(.dark) #forum-index .ui.padded.segment[id="forum-node"] > h3.ui.header {
        font-size: 1.15rem !important;
    }
}
/* ==================================================
   SKYLIUM — LISTE DES SUJETS DANS UNE SECTION
   ================================================== */

/* Conteneurs des sujets épinglés et ordinaires */
body:not(.dark) #sticky-threads,
body:not(.dark) #normal-threads {
    width: 100% !important;
    margin-bottom: 22px !important;

    border-collapse: separate !important;
    border-spacing: 0 !important;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f5fbff 100%
    ) !important;

    border: 1px solid rgba(34, 211, 238, 0.24) !important;
    border-radius: 16px !important;

    overflow: hidden !important;

    box-shadow:
        0 10px 28px rgba(7, 20, 38, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

/* En-tête des tableaux */
body:not(.dark) #sticky-threads thead th,
body:not(.dark) #normal-threads thead th {
    padding: 16px 18px !important;

    background: linear-gradient(
        90deg,
        rgba(22, 119, 189, 0.12),
        rgba(34, 211, 238, 0.10)
    ) !important;

    color: #0b4f7c !important;
    font-weight: 700 !important;

    border-bottom: 2px solid rgba(34, 211, 238, 0.28) !important;
}

/* Lignes des sujets */
body:not(.dark) #sticky-threads tbody tr,
body:not(.dark) #normal-threads tbody tr {
    background: rgba(255, 255, 255, 0.74) !important;
    transition:
        background-color 0.18s ease,
        transform 0.18s ease !important;
}

/* Survol ordinateur */
body:not(.dark) #sticky-threads tbody tr:hover,
body:not(.dark) #normal-threads tbody tr:hover {
    background: rgba(225, 247, 255, 0.85) !important;
}

/* Cellules */
body:not(.dark) #sticky-threads tbody td,
body:not(.dark) #normal-threads tbody td {
    padding: 17px 18px !important;

    border-top: 1px solid rgba(22, 119, 189, 0.10) !important;
}

/* Retirer la première séparation */
body:not(.dark) #sticky-threads tbody tr:first-child td,
body:not(.dark) #normal-threads tbody tr:first-child td {
    border-top: none !important;
}

/* Titres des sujets */
body:not(.dark) #sticky-threads h4.ui.header,
body:not(.dark) #normal-threads h4.ui.header,
body:not(.dark) #sticky-threads h5.ui.header,
body:not(.dark) #normal-threads h5.ui.header {
    color: #123d5a !important;
    font-weight: 700 !important;
}

/* Liens */
body:not(.dark) #sticky-threads a,
body:not(.dark) #normal-threads a {
    color: #1677bd !important;
}

body:not(.dark) #sticky-threads a:hover,
body:not(.dark) #normal-threads a:hover {
    color: #0b4f7c !important;
}

/* Icône de sujet */
body:not(.dark) #sticky-threads .comment.icon,
body:not(.dark) #normal-threads .comment.icon {
    color: #22b8d6 !important;
}

/* Sujets épinglés légèrement différenciés */
body:not(.dark) #sticky-threads {
    border-color: rgba(34, 211, 238, 0.42) !important;
}

body:not(.dark) #sticky-threads thead th {
    background: linear-gradient(
        90deg,
        rgba(22, 119, 189, 0.18),
        rgba(34, 211, 238, 0.16)
    ) !important;
}

/* Version téléphone */
@media only screen and (max-width: 767px) {
    body:not(.dark) #sticky-threads,
    body:not(.dark) #normal-threads {
        border-radius: 14px !important;
    }

    body:not(.dark) #sticky-threads thead th,
    body:not(.dark) #normal-threads thead th {
        padding: 14px !important;
    }

    body:not(.dark) #sticky-threads tbody td,
    body:not(.dark) #normal-threads tbody td {
        padding: 15px 12px !important;
    }

    body:not(.dark) #sticky-threads h4.ui.header,
    body:not(.dark) #normal-threads h4.ui.header,
    body:not(.dark) #sticky-threads h5.ui.header,
    body:not(.dark) #normal-threads h5.ui.header {
        font-size: 1rem !important;
    }
}
/* ==================================================
   SKYLIUM — CORRECTION DU BAS DE PAGE
   ================================================== */

#footer.ui.vertical.footer.segment {
    margin-bottom: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

body {
    padding-bottom: 0 !important;
}
/* Supprimer tous les coins arrondis du footer */
#footer,
#footer.ui.segment,
.ui.inverted.vertical.footer.segment#footer {
    border-radius: 0 !important;
}
/* ==================================================
   SKYLIUM — MESSAGES DANS LES SUJETS DU FORUM
   ================================================== */

/* Carte complète d'un message */
body:not(.dark) [id="topic-post"].ui.segments {
    margin: 0 0 24px !important;
    overflow: hidden !important;

    background: #ffffff !important;

    border: 1px solid rgba(34, 211, 238, 0.28) !important;
    border-radius: 18px !important;

    box-shadow:
        0 12px 32px rgba(7, 30, 55, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
}

/* Segment intérieur */
body:not(.dark) [id="topic-post"] > .ui.attached.padded.segment {
    margin: 0 !important;
    padding: 0 !important;

    background: #ffffff !important;

    border: 0 !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 0 !important;
}

/* Retirer les marges internes de la grille */
body:not(.dark) [id="topic-post"] .ui.stackable.grid {
    margin: 0 !important;
}

body:not(.dark) [id="topic-post"] .ui.row {
    padding: 0 !important;
}

/* Colonne du joueur */
body:not(.dark) [id="post-sidebar"] {
    padding: 26px 20px !important;

    background: linear-gradient(
        160deg,
        #f4fbff 0%,
        #eaf8ff 100%
    ) !important;

    border-right: 1px solid rgba(22, 119, 189, 0.16) !important;
}

/* Avatar */
body:not(.dark) [id="post-sidebar"] img.ui.circular.image {
    width: 86px !important;
    height: 86px !important;

    margin: 0 auto 12px !important;

    border: 3px solid rgba(34, 211, 238, 0.45) !important;

    box-shadow:
        0 7px 18px rgba(7, 52, 82, 0.16) !important;
}

/* Pseudo */
body:not(.dark) [id="post-sidebar"] h3.ui.header {
    margin-top: 6px !important;
    margin-bottom: 10px !important;

    color: #123d5a !important;
    text-align: center !important;
}

/* Grade du joueur */
body:not(.dark) [id="post-sidebar"] .groups {
    margin: 8px 0 14px !important;
    text-align: center !important;
}

/* Informations du profil */
body:not(.dark) [id="post-sidebar"] .ui.list {
    margin-top: 15px !important;
}

body:not(.dark) [id="post-sidebar"] .ui.list > .item {
    padding: 8px 0 !important;

    color: #526878 !important;

    border-bottom: 1px solid rgba(22, 119, 189, 0.09) !important;
}

body:not(.dark) [id="post-sidebar"] .ui.list > .item:last-child {
    border-bottom: 0 !important;
}

/* Colonne contenant le message */
body:not(.dark) [id="post-content"] {
    min-height: 220px !important;
    padding: 28px 30px !important;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #fbfdff 100%
    ) !important;
}

/* Texte publié */
body:not(.dark) [id="post-content"] .forum_post {
    color: #293f4f !important;

    font-size: 1.02rem !important;
    line-height: 1.75 !important;

    overflow-wrap: anywhere !important;
    word-break: normal !important;
}

/* Liens présents dans les messages */
body:not(.dark) [id="post-content"] .forum_post a {
    color: #1677bd !important;
    font-weight: 600 !important;
}

body:not(.dark) [id="post-content"] .forum_post a:hover {
    color: #0b4f7c !important;
}

/* Images publiées */
body:not(.dark) [id="post-content"] .forum_post img {
    max-width: 100% !important;
    height: auto !important;

    border-radius: 10px !important;
}

/* Signature */
body:not(.dark) [id="post-content"] .ui.divider + div {
    color: #728391 !important;
}

/* ==================================================
   VERSION TÉLÉPHONE
   ================================================== */

@media only screen and (max-width: 767px) {

    body:not(.dark) [id="topic-post"].ui.segments {
        margin-bottom: 20px !important;
        border-radius: 16px !important;
    }

    body:not(.dark) [id="topic-post"] > .ui.attached.padded.segment {
        border-top-width: 3px !important;
    }

    /* Profil au-dessus du message */
    body:not(.dark) [id="post-sidebar"] {
        width: 100% !important;
        padding: 20px 18px !important;

        border-right: 0 !important;
        border-bottom: 1px solid rgba(22, 119, 189, 0.16) !important;
    }

    body:not(.dark) [id="post-sidebar"] img.ui.circular.image {
        width: 72px !important;
        height: 72px !important;
    }

    body:not(.dark) [id="post-sidebar"] .ui.list {
        max-width: 320px !important;
        margin: 14px auto 0 !important;
        text-align: left !important;
    }

    /* Message sous le profil */
    body:not(.dark) [id="post-content"] {
        width: 100% !important;
        min-height: 0 !important;

        padding: 22px 20px !important;
    }

    body:not(.dark) [id="post-content"] .forum_post {
        font-size: 1rem !important;
        line-height: 1.65 !important;
    }
}
/* ==================================================
   SKYLIUM — PROFIL COMPACT DANS LES SUJETS SUR MOBILE
   ================================================== */

@media only screen and (max-width: 767px) {

    body:not(.dark) [id="post-sidebar"] {
        min-height: 0 !important;
        height: auto !important;
        padding: 14px 16px 12px !important;
    }

    body:not(.dark) [id="post-sidebar"] center {
        margin: 0 !important;
        padding: 0 !important;
    }

    body:not(.dark) [id="post-sidebar"] img.ui.circular.image {
        width: 62px !important;
        height: 62px !important;
        margin: 0 auto 6px !important;
        border-width: 2px !important;
    }

    body:not(.dark) [id="post-sidebar"] h3.ui.header {
        margin: 2px 0 5px !important;
        font-size: 1.35rem !important;
        line-height: 1.2 !important;
    }

    body:not(.dark) [id="post-sidebar"] .groups {
        margin: 4px 0 0 !important;
    }

    body:not(.dark) [id="post-sidebar"] .groups .ui.label {
        margin: 0 !important;
    }
}
/* ==================================================
   SKYLIUM — CRÉATION D’UN NOUVEAU SUJET
   ================================================== */

/* Carte principale */
body:not(.dark) #new-topic.ui.padded.segment {
    position: relative !important;
    overflow: hidden !important;

    max-width: 1050px !important;
    margin: 24px auto 35px !important;
    padding: 34px 38px !important;

    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f8fcff 100%
    ) !important;

    border: 1px solid rgba(34, 211, 238, 0.32) !important;
    border-radius: 20px !important;

    box-shadow:
        0 14px 36px rgba(7, 30, 55, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

/* Ligne cyan supérieure */
body:not(.dark) #new-topic.ui.padded.segment::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 5px !important;

    background: linear-gradient(
        90deg,
        #168bc6,
        #22d3ee
    ) !important;
}

/* Retirer les marges inutiles de la grille */
body:not(.dark) #new-topic .ui.stackable.grid {
    margin: 0 !important;
}

body:not(.dark) #new-topic .ui.centered.row,
body:not(.dark) #new-topic .ui.column {
    width: 100% !important;
    padding: 0 !important;
}

/* Espacement entre les champs */
body:not(.dark) #form-new-topic .field {
    margin-bottom: 24px !important;
}

/* Titres des champs */
body:not(.dark) #form-new-topic label {
    display: block !important;

    margin-bottom: 9px !important;

    color: #164765 !important;

    font-size: 1.05rem !important;
    font-weight: 700 !important;
}

/* Champ du titre */
body:not(.dark) #form-new-topic #title {
    width: 100% !important;
    min-height: 52px !important;

    padding: 14px 17px !important;

    color: #263f50 !important;
    background: #ffffff !important;

    border: 1px solid rgba(22, 119, 189, 0.24) !important;
    border-radius: 12px !important;

    box-shadow: inset 0 1px 3px rgba(7, 30, 55, 0.05) !important;

    font-size: 1rem !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease !important;
}

body:not(.dark) #form-new-topic #title:focus {
    border-color: #22d3ee !important;

    box-shadow:
        0 0 0 3px rgba(34, 211, 238, 0.15),
        inset 0 1px 3px rgba(7, 30, 55, 0.04) !important;

    outline: none !important;
}

/* Zone de rédaction avant le chargement de l’éditeur */
body:not(.dark) #form-new-topic #reply {
    width: 100% !important;
    min-height: 280px !important;

    padding: 16px !important;

    color: #263f50 !important;
    background: #ffffff !important;

    border: 1px solid rgba(22, 119, 189, 0.24) !important;
    border-radius: 12px !important;

    font-size: 1rem !important;
    line-height: 1.6 !important;

    resize: vertical !important;
}

/* Éditeur de texte une fois chargé */
body:not(.dark) #form-new-topic .sceditor-container,
body:not(.dark) #form-new-topic .tox-tinymce,
body:not(.dark) #form-new-topic .cke {
    overflow: hidden !important;

    border: 1px solid rgba(22, 119, 189, 0.24) !important;
    border-radius: 12px !important;

    box-shadow: inset 0 1px 3px rgba(7, 30, 55, 0.04) !important;
}

/* Labels éventuels du sujet */
body:not(.dark) #form-new-topic .inline.fields.labels {
    padding: 14px 16px !important;

    background: rgba(225, 247, 255, 0.55) !important;

    border: 1px solid rgba(34, 211, 238, 0.20) !important;
    border-radius: 12px !important;
}

/* Bouton de publication */
body:not(.dark) #form-new-topic input.ui.primary.button {
    min-height: 46px !important;
    padding: 12px 25px !important;

    background: linear-gradient(
        135deg,
        #168bc6,
        #14b8d4
    ) !important;

    border: 0 !important;
    border-radius: 11px !important;

    box-shadow: 0 7px 18px rgba(22, 139, 198, 0.23) !important;

    font-size: 1rem !important;
    font-weight: 700 !important;
}

/* Bouton d’annulation */
body:not(.dark) #form-new-topic a.ui.negative.button {
    min-height: 46px !important;
    margin-left: 9px !important;
    padding: 12px 25px !important;

    border-radius: 11px !important;

    font-size: 1rem !important;
    font-weight: 700 !important;
}

/* ==================================================
   VERSION TÉLÉPHONE
   ================================================== */

@media only screen and (max-width: 767px) {

    body:not(.dark) #new-topic.ui.padded.segment {
        margin: 18px 25px 28px !important;
        padding: 26px 20px 22px !important;

        border-radius: 17px !important;
    }

    body:not(.dark) #form-new-topic .field {
        margin-bottom: 20px !important;
    }

    body:not(.dark) #form-new-topic #title {
        min-height: 50px !important;
        font-size: 16px !important;
    }

    body:not(.dark) #form-new-topic #reply {
        min-height: 240px !important;
        font-size: 16px !important;
    }

    body:not(.dark) #form-new-topic input.ui.primary.button,
    body:not(.dark) #form-new-topic a.ui.negative.button {
        display: block !important;

        width: 100% !important;
        margin: 10px 0 0 !important;

        text-align: center !important;
    }
}
/* Menus déroulants des actions des sujets */
body .ui.top.right.pointing.dropdown.small.primary.button {
    position: relative !important;
}

body .ui.top.right.pointing.dropdown.small.primary.button.active,
body .ui.top.right.pointing.dropdown.small.primary.button.visible {
    z-index: 9999 !important;
}

body .ui.top.right.pointing.dropdown.small.primary.button > .menu {
    position: absolute !important;
    z-index: 10000 !important;
}
/* =========================================================
   SKYLIUM — PAGE ÉDITER UN MESSAGE
   ========================================================= */

#post-edit {
    width: 100% !important;
    margin: 25px auto 35px !important;
    padding: 30px !important;

    background: rgba(255, 255, 255, 0.97) !important;
    border: 1px solid rgba(35, 205, 230, 0.45) !important;
    border-top: 5px solid #20cfe5 !important;
    border-radius: 22px !important;

    box-shadow:
        0 12px 30px rgba(4, 31, 58, 0.10),
        0 0 18px rgba(32, 207, 229, 0.10) !important;

    overflow: hidden !important;
}

/* Occuper toute la largeur disponible */
#post-edit .ui.stackable.grid,
#post-edit .ui.centered.row,
#post-edit .ui.column {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* Titres des champs */
#post-edit .field > label {
    color: #164b68 !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

/* Champ du titre */
#post-edit input[type="text"] {
    width: 100% !important;
    padding: 15px 17px !important;

    background: #ffffff !important;
    border: 1px solid rgba(22, 92, 125, 0.25) !important;
    border-radius: 13px !important;

    font-size: 1rem !important;
    color: #18394b !important;

    box-shadow: inset 0 1px 3px rgba(4, 31, 58, 0.04) !important;
}

#post-edit input[type="text"]:focus {
    border-color: #20cfe5 !important;
    box-shadow: 0 0 0 3px rgba(32, 207, 229, 0.15) !important;
}

/* Éditeur de texte */
#post-edit .tox-tinymce {
    border: 1px solid rgba(22, 92, 125, 0.25) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

/* Bouton Soumettre */
#post-edit .ui.primary.button {
    min-width: 135px !important;
    padding: 13px 24px !important;

    background: linear-gradient(135deg, #168fc8, #20c8df) !important;
    color: #ffffff !important;

    border: 0 !important;
    border-radius: 12px !important;

    font-weight: 700 !important;
    box-shadow: 0 6px 14px rgba(20, 154, 201, 0.20) !important;
}

/* Bouton Annuler */
#post-edit .ui.negative.button {
    min-width: 135px !important;
    padding: 13px 24px !important;
    margin-left: 8px !important;

    background: #e5252a !important;
    color: #ffffff !important;

    border: 0 !important;
    border-radius: 12px !important;

    font-weight: 700 !important;
}

/* Version mobile */
@media only screen and (max-width: 767px) {
    #post-edit {
        width: calc(100% - 28px) !important;
        margin: 20px 14px 30px !important;
        padding: 22px 16px !important;
        border-radius: 20px !important;
    }

    #post-edit .ui.primary.button,
    #post-edit .ui.negative.button {
        display: block !important;
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 15px !important;
    }

    #post-edit input[type="text"] {
        padding: 14px !important;
    }
}
/* ==================================================
   SKYLIUM — PAGE DE RECHERCHE DU FORUM
   ================================================== */

#forum-search.skylium-search-card {
    width: calc(100% - 32px);
    max-width: 850px;
    margin: 30px auto 45px !important;
    padding: 32px !important;

    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(36, 199, 224, 0.45) !important;
    border-top: 5px solid #25c9df !important;
    border-radius: 24px !important;

    box-shadow: 0 14px 35px rgba(13, 62, 98, 0.13) !important;
}

#forum-search .field > label {
    display: block;
    margin-bottom: 14px;

    color: #174867 !important;
    font-size: 1.15rem;
    font-weight: 700;
}

#forum-search .ui.action.input {
    width: 100%;
    overflow: hidden;

    border-radius: 16px !important;
    box-shadow: 0 6px 18px rgba(13, 62, 98, 0.08);
}

#forum-search input[type="text"] {
    min-height: 58px;
    padding: 0 20px !important;

    color: #203746 !important;
    font-size: 1.05rem !important;

    background: #ffffff !important;
    border: 1px solid #cbdce7 !important;
    border-right: 0 !important;
    border-radius: 16px 0 0 16px !important;
}

#forum-search input[type="text"]:focus {
    border-color: #25c9df !important;
    box-shadow: inset 0 0 0 1px #25c9df !important;
}

#forum-search .ui.primary.icon.button {
    width: 66px;
    min-width: 66px;

    background: linear-gradient(135deg, #178fd0, #22c8dc) !important;
    border-radius: 0 16px 16px 0 !important;
}

#forum-search .ui.primary.icon.button:hover {
    background: linear-gradient(135deg, #117ebd, #18b8ce) !important;
}

#forum-search .ui.primary.icon.button .icon {
    color: #ffffff !important;
    font-size: 1.25rem;
}

/* Version téléphone */
@media only screen and (max-width: 767px) {
    #forum-search.skylium-search-card {
        width: calc(100% - 50px);
        margin: 25px auto 35px !important;
        padding: 26px 22px !important;
        border-radius: 22px !important;
    }

    #forum-search .field > label {
        font-size: 1.1rem;
    }

    #forum-search input[type="text"] {
        min-height: 58px;
        padding: 0 16px !important;
        font-size: 16px !important;
    }

    #forum-search .ui.primary.icon.button {
        width: 60px;
        min-width: 60px;
    }
}
/* =====================================================
   SKYLIUM — PAGE DES RÉSULTATS DE RECHERCHE
   ===================================================== */

.skylium-search-results-page {
    width: 100%;
}

.skylium-search-results-title {
    color: #123e5a !important;
    margin-bottom: 18px !important;
}

/* Bouton Nouvelle recherche */
.skylium-new-search-button {
    background: linear-gradient(135deg, #168fc8, #18c5d8) !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 16px rgba(17, 164, 207, 0.22) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Carte contenant un résultat */
.skylium-search-result-card {
    position: relative;
    margin-top: 24px !important;
    border: 1px solid rgba(27, 195, 218, 0.35) !important;
    border-top: 5px solid #22cde0 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow: 0 12px 30px rgba(15, 77, 112, 0.10) !important;
}

/* Partie supérieure de la carte */
.skylium-search-result-card > .segment:first-child {
    border: none !important;
    padding: 25px 28px !important;
}

/* Titre du résultat */
.skylium-search-result-card h3.ui.header {
    color: #197caf !important;
    font-size: 1.45rem !important;
    margin-bottom: 6px !important;
}

/* Aperçu limité du message */
.skylium-search-result-preview {
    position: relative;
    height: 330px;
    overflow: hidden;
    margin-top: 20px;
    line-height: 1.65;
}

/* Fondu en bas de l’aperçu */
.skylium-search-result-preview::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 85px;
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 0.98)
    );
}

/* Partie basse et bouton Lire le sujet */
.skylium-search-result-footer {
    border: none !important;
    border-top: 1px solid rgba(24, 181, 211, 0.18) !important;
    background: rgba(233, 249, 253, 0.72) !important;
    padding: 18px 24px !important;
}

.skylium-read-result-button {
    background: linear-gradient(135deg, #168fc8, #18c5d8) !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
    box-shadow: 0 5px 14px rgba(17, 164, 207, 0.20) !important;
}

/* Version téléphone */
@media only screen and (max-width: 767px) {
    .skylium-search-results-title {
        display: block !important;
        font-size: 1.8rem !important;
    }

    .skylium-search-new {
        float: none !important;
        width: 100%;
        margin: 12px 0 20px !important;
    }

    .skylium-new-search-button {
        display: block !important;
        width: 100%;
        text-align: center;
        padding: 15px !important;
    }

    .skylium-search-result-card {
        border-radius: 18px !important;
    }

    .skylium-search-result-card > .segment:first-child {
        padding: 22px 20px !important;
    }

    .skylium-search-result-card h3.ui.header {
        font-size: 1.3rem !important;
    }

    .skylium-search-result-preview {
        height: 280px;
        font-size: 0.97rem;
    }

    .skylium-read-result-button {
        display: block !important;
        width: 100%;
        text-align: center;
        padding: 14px !important;
    }
}
/* Pagination des résultats de recherche */
.skylium-search-pagination {
    width: 100%;
    display: flex;
    justify-content: center;
    clear: both;
    margin: 22px 0;
}

.skylium-search-pagination .ui.pagination.menu {
    display: inline-flex;
    margin: 0;
    padding: 5px;
    gap: 4px;
    border: 1px solid rgba(37, 199, 228, 0.4);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 8px 22px rgba(5, 65, 100, 0.1);
}

.skylium-search-pagination .ui.pagination.menu .item {
    min-width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 12px;
    border: none;
    border-radius: 10px;
    color: #17658a;
    font-weight: 700;
    transition: 0.2s ease;
}

.skylium-search-pagination .ui.pagination.menu .item:hover {
    color: #ffffff;
    background: linear-gradient(135deg, #168ec1, #23c6dd);
}

.skylium-search-pagination .ui.pagination.menu .active.item {
    color: #ffffff;
    background: linear-gradient(135deg, #137eae, #25c9df);
    box-shadow: 0 5px 13px rgba(20, 164, 200, 0.3);
}

.skylium-search-pagination .ui.pagination.menu .disabled.item {
    opacity: 0.4;
    pointer-events: none;
}

@media only screen and (max-width: 767px) {
    .skylium-search-pagination {
        margin: 18px 0;
    }

    .skylium-search-pagination .ui.pagination.menu .item {
        min-width: 38px;
        height: 38px;
        padding: 0 10px;
    }
}
/* Centrage des flèches de pagination */
.skylium-search-pagination .ui.pagination.menu .icon.item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    text-align: center !important;
}

.skylium-search-pagination .ui.pagination.menu .icon.item i.icon {
    margin: 0 !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}
/* Pagination : cases régulières et flèches centrées */
.skylium-search-pagination .ui.pagination.menu {
    width: fit-content !important;
    display: inline-flex !important;
    justify-content: center !important;
}

.skylium-search-pagination .ui.pagination.menu > .item {
    flex: 0 0 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

/* Masquer uniquement le contenu d’origine des cases fléchées */
.skylium-search-pagination .ui.pagination.menu > .item:first-child,
.skylium-search-pagination .ui.pagination.menu > .item:last-child {
    position: relative !important;
    font-size: 0 !important;
    color: transparent !important;
}

/* Utilisation de ::after pour éviter le conflit avec Semantic UI */
.skylium-search-pagination .ui.pagination.menu > .item:first-child::after,
.skylium-search-pagination .ui.pagination.menu > .item:last-child::after {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: #17658a !important;
}

.skylium-search-pagination .ui.pagination.menu > .item:first-child::after {
    content: "‹" !important;
}

.skylium-search-pagination .ui.pagination.menu > .item:last-child::after {
    content: "›" !important;
}

/* Flèche désactivée */
.skylium-search-pagination .ui.pagination.menu > .disabled.item::after {
    color: #9ab9c7 !important;
    opacity: 0.75 !important;
}

/* Survol d’une flèche active */
.skylium-search-pagination .ui.pagination.menu > .item:first-child:not(.disabled):hover::after,
.skylium-search-pagination .ui.pagination.menu > .item:last-child:not(.disabled):hover::after {
    color: #ffffff !important;
}
/* Correction définitive de la largeur des résultats sur téléphone */
@media only screen and (max-width: 767px) {

    body .skylium-search-result-card.ui.segments {
        display: block !important;
        float: none !important;
        clear: both !important;

        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px) !important;
        min-width: 0 !important;

        margin: 22px auto !important;
        padding: 0 !important;

        left: auto !important;
        right: auto !important;
        transform: none !important;

        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    body .skylium-search-result-card > .segment {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body .skylium-search-result-preview {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    body .skylium-search-result-preview img,
    body .skylium-search-result-preview iframe,
    body .skylium-search-result-preview table {
        max-width: 100% !important;
        height: auto !important;
    }
}
/* =========================================
   SKYLIUM - SECTION DE FORUM SANS SUJET
   ========================================= */

.skylium-empty-forum-page {
    width: 100% !important;
    max-width: 1100px !important;
    margin: 24px auto 32px !important;
}

.skylium-empty-forum-page > .row,
.skylium-empty-forum-page > .row > .column {
    width: 100% !important;
}

.skylium-empty-forum {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 22px !important;

    box-shadow:
        0 12px 32px rgba(15, 45, 75, 0.08),
        0 0 18px rgba(34, 211, 238, 0.08) !important;
}

.skylium-empty-forum thead {
    display: none !important;
}

.skylium-empty-forum tbody,
.skylium-empty-forum tbody tr {
    display: table !important;
    width: 100% !important;
}

.skylium-empty-forum tbody tr td {
    width: 100% !important;
    padding: 55px 25px !important;
    text-align: center !important;

    color: #607080 !important;
    font-size: 18px !important;
    line-height: 1.6 !important;
}

.skylium-empty-forum tbody tr td::before {
    content: "☁";
    display: block;
    margin-bottom: 12px;

    color: #22d3ee;
    font-size: 48px;
    line-height: 1;
}

@media only screen and (max-width: 767px) {
    .skylium-empty-forum-page {
        width: calc(100% - 24px) !important;
        margin: 18px auto 28px !important;
        padding: 0 !important;
    }

    .skylium-empty-forum tbody tr td {
        padding: 42px 20px !important;
        font-size: 16px !important;
    }

    .skylium-empty-forum tbody tr td::before {
        font-size: 42px;
    }
}
/* =========================================
   SKYLIUM - CONFIRMATION DE REDIRECTION
   ========================================= */

.skylium-forum-redirect {
    position: relative;
    width: calc(100% - 32px) !important;
    max-width: 900px !important;
    margin: 32px auto 42px !important;
    padding: 48px 34px 38px !important;

    background: #ffffff !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 22px !important;

    box-shadow:
        0 12px 32px rgba(15, 45, 75, 0.09),
        0 0 18px rgba(34, 211, 238, 0.08) !important;
}

.skylium-forum-redirect::before {
    content: "↗";
    display: flex;
    align-items: center;
    justify-content: center;

    width: 62px;
    height: 62px;
    margin: -82px auto 20px;

    color: #ffffff;
    font-size: 30px;
    font-weight: 700;

    background: linear-gradient(135deg, #168ac3, #22d3ee);
    border: 5px solid #ffffff;
    border-radius: 50%;

    box-shadow: 0 8px 20px rgba(20, 150, 200, 0.25);
}

.skylium-forum-redirect-content {
    width: 100% !important;
    text-align: center !important;
}

.skylium-forum-redirect-title {
    margin: 8px 0 22px !important;
    color: #123b5a !important;
    font-size: 25px !important;
    line-height: 1.4 !important;
}

.skylium-forum-redirect .ui.divider {
    margin: 22px auto 28px !important;
    border-top-color: rgba(30, 105, 145, 0.2) !important;
}

.skylium-forum-redirect-buttons {
    display: flex !important;
    justify-content: center !important;
    gap: 14px !important;
    box-shadow: none !important;
}

.skylium-forum-redirect-buttons .or {
    display: none !important;
}

.skylium-forum-redirect-buttons .button {
    min-width: 150px !important;
    margin: 0 !important;
    padding: 14px 24px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
}

.skylium-redirect-cancel {
    background: #ef2028 !important;
    color: #ffffff !important;
}

.skylium-redirect-cancel:hover {
    background: #cf161d !important;
}

.skylium-redirect-confirm {
    background: #22a968 !important;
    color: #ffffff !important;
}

.skylium-redirect-confirm:hover {
    background: #188b54 !important;
}

@media only screen and (max-width: 767px) {
    .skylium-forum-redirect {
        width: calc(100% - 24px) !important;
        margin: 38px auto 30px !important;
        padding: 42px 22px 26px !important;
    }

    .skylium-forum-redirect::before {
        width: 56px;
        height: 56px;
        margin-top: -73px;
        font-size: 27px;
    }

    .skylium-forum-redirect-title {
        font-size: 21px !important;
    }

    .skylium-forum-redirect-buttons {
        flex-direction: column !important;
        width: 100% !important;
    }

    .skylium-forum-redirect-buttons .button {
        width: 100% !important;
        min-width: 0 !important;
    }
}
/* =========================================
   SKYLIUM - DÉPLACEMENT D'UN SUJET
   ========================================= */

.skylium-move-topic-page-title {
    width: calc(100% - 32px) !important;
    max-width: 900px !important;
    margin: 28px auto 20px !important;
    color: #123b5a !important;
}

.skylium-move-topic-card {
    position: relative !important;
    width: calc(100% - 32px) !important;
    max-width: 900px !important;
    margin: 30px auto 42px !important;
    padding: 48px 34px 36px !important;

    background: #ffffff !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 22px !important;

    box-shadow:
        0 12px 32px rgba(15, 45, 75, 0.09),
        0 0 18px rgba(34, 211, 238, 0.08) !important;

    overflow: visible !important;
}

.skylium-move-topic-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 62px;
    height: 62px;
    margin: -82px auto 24px;

    color: #ffffff;
    font-size: 32px;
    font-weight: 700;

    background: linear-gradient(135deg, #168ac3, #22d3ee);
    border: 5px solid #ffffff;
    border-radius: 50%;

    box-shadow: 0 8px 20px rgba(20, 150, 200, 0.25);
}

.skylium-move-topic-content {
    width: 100% !important;
}

.skylium-move-topic-form {
    width: 100% !important;
}

.skylium-move-topic-label {
    margin-bottom: 12px !important;
    color: #123b5a !important;
    font-size: 18px !important;
    font-weight: 700 !important;
}

.skylium-move-topic-dropdown {
    min-height: 54px !important;
    padding: 17px 45px 17px 18px !important;

    background: #ffffff !important;
    border: 1px solid rgba(35, 110, 150, 0.28) !important;
    border-radius: 14px !important;

    color: #243746 !important;
    font-size: 16px !important;

    box-shadow: 0 5px 16px rgba(15, 45, 75, 0.05) !important;
}

.skylium-move-topic-dropdown:hover,
.skylium-move-topic-dropdown.active {
    border-color: #22d3ee !important;
}

.skylium-move-topic-dropdown .menu {
    z-index: 9999 !important;
    max-height: 300px !important;
    overflow-y: auto !important;

    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-radius: 12px !important;
}

.skylium-move-topic-dropdown .menu .header {
    color: #123b5a !important;
    font-weight: 700 !important;
}

.skylium-move-topic-dropdown .menu .item:hover {
    background: rgba(34, 211, 238, 0.1) !important;
}

.skylium-move-topic-actions {
    display: flex !important;
    justify-content: center !important;
    gap: 14px !important;
    margin-top: 28px !important;
}

.skylium-move-topic-actions .button {
    min-width: 170px !important;
    margin: 0 !important;
    padding: 14px 26px !important;
    border-radius: 12px !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}

.skylium-move-topic-submit {
    color: #ffffff !important;
    background: linear-gradient(135deg, #168ac3, #22d3ee) !important;
}

.skylium-move-topic-submit:hover {
    filter: brightness(0.94);
}

.skylium-move-topic-cancel {
    color: #ffffff !important;
    background: #ef2028 !important;
}

.skylium-move-topic-cancel:hover {
    background: #cf161d !important;
}

@media only screen and (max-width: 767px) {
    .skylium-move-topic-page-title {
        width: calc(100% - 32px) !important;
        margin-top: 24px !important;
        font-size: 30px !important;
    }

    .skylium-move-topic-card {
        width: calc(100% - 24px) !important;
        margin: 38px auto 30px !important;
        padding: 42px 20px 24px !important;
    }

    .skylium-move-topic-icon {
        width: 56px;
        height: 56px;
        margin-top: -73px;
        font-size: 28px;
    }

    .skylium-move-topic-actions {
        flex-direction: column !important;
        width: 100% !important;
    }

    .skylium-move-topic-actions .button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-width: 0 !important;
        min-height: 54px !important;
    }
}
/* Correction définitive du bouton Soumettre */
#move-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button,
#move-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button:not(:hover) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 170px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 14px 26px !important;

    color: #ffffff !important;
    background: linear-gradient(135deg, #168ac3 0%, #22d3ee 100%) !important;
    background-color: #168ac3 !important;

    border: 0 !important;
    border-radius: 12px !important;

    box-shadow: 0 7px 18px rgba(22, 138, 195, 0.22) !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-align: center !important;

    opacity: 1 !important;
    visibility: visible !important;
    cursor: pointer !important;

    appearance: none !important;
    -webkit-appearance: none !important;
}

#move-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #1179ad 0%, #17bcd5 100%) !important;
    background-color: #1179ad !important;
}
/* =========================================
   SKYLIUM - FUSION DE SUJETS
   ========================================= */

.skylium-merge-topic-icon {
    font-size: 30px !important;
}

.skylium-merge-topic-select {
    display: block !important;
    width: 100% !important;
    min-height: 54px !important;
    padding: 0 18px !important;

    color: #243746 !important;
    background: #ffffff !important;

    border: 1px solid rgba(35, 110, 150, 0.28) !important;
    border-radius: 14px !important;

    box-shadow: 0 5px 16px rgba(15, 45, 75, 0.05) !important;

    font-size: 16px !important;
    cursor: pointer !important;
}

.skylium-merge-topic-select:hover,
.skylium-merge-topic-select:focus {
    border-color: #22d3ee !important;
    outline: none !important;

    box-shadow:
        0 5px 16px rgba(15, 45, 75, 0.05),
        0 0 0 3px rgba(34, 211, 238, 0.12) !important;
}

/* Bouton Soumettre de la page de fusion */
#merge-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button,
#merge-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button:not(:hover) {
    color: #ffffff !important;

    background-color: #168ac3 !important;
    background-image:
        linear-gradient(135deg, #168ac3 0%, #22d3ee 100%) !important;

    border: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

#merge-topic .skylium-move-topic-actions
input.skylium-move-topic-submit.ui.primary.button:hover {
    color: #ffffff !important;

    background-color: #1179ad !important;
    background-image:
        linear-gradient(135deg, #1179ad 0%, #17bcd5 100%) !important;
}

@media only screen and (max-width: 767px) {
    .skylium-merge-topic-select {
        min-height: 56px !important;
        font-size: 16px !important;
    }
}
/* =========================================
   SKYLIUM - SUJETS SUIVIS
   ========================================= */

.skylium-following-page-title {
    width: calc(100% - 32px) !important;
    max-width: 1180px !important;
    margin: 28px auto 20px !important;

    color: #123b5a !important;
    font-size: 30px !important;
    font-weight: 700 !important;
}

.skylium-following-page {
    width: calc(100% - 32px) !important;
    max-width: 1180px !important;
    margin: 0 auto 42px !important;
}

/* Carte principale */
.skylium-following-card {
    position: relative !important;
    padding: 30px !important;

    background: #ffffff !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 22px !important;

    box-shadow:
        0 12px 32px rgba(15, 45, 75, 0.09),
        0 0 18px rgba(34, 211, 238, 0.08) !important;

    overflow: visible !important;
}

.skylium-following-card > .ui.header {
    margin-bottom: 24px !important;

    color: #123b5a !important;
    font-size: 26px !important;
    font-weight: 700 !important;
}

/* Bouton Tout désabonner */
.skylium-following-card .ui.negative.button {
    padding: 11px 18px !important;

    color: #ffffff !important;
    background: #ef2028 !important;

    border: none !important;
    border-radius: 11px !important;

    font-weight: 700 !important;
}

.skylium-following-card .ui.negative.button:hover {
    background: #cf161d !important;
}

/* Message de confirmation */
.skylium-following-card .ui.success.message {
    margin: 18px 0 24px !important;
    padding: 16px 18px !important;

    background: rgba(34, 197, 94, 0.08) !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
    border-radius: 12px !important;

    box-shadow: none !important;
}

/* Tableau */
.skylium-following-table {
    width: 100% !important;
    margin: 0 !important;

    background: transparent !important;
    border: none !important;
    border-collapse: separate !important;
    border-spacing: 0 14px !important;

    box-shadow: none !important;
}

.skylium-following-table tbody tr {
    background: #ffffff !important;

    border: 1px solid rgba(34, 211, 238, 0.28) !important;
    border-radius: 16px !important;

    box-shadow: 0 7px 20px rgba(15, 45, 75, 0.06) !important;

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        border-color 0.18s ease;
}

.skylium-following-table tbody tr:hover {
    transform: translateY(-2px);

    border-color: rgba(34, 211, 238, 0.65) !important;

    box-shadow:
        0 10px 25px rgba(15, 45, 75, 0.1),
        0 0 14px rgba(34, 211, 238, 0.08) !important;
}

.skylium-following-table tbody td {
    padding: 18px !important;

    background: transparent !important;
    border-top: 1px solid rgba(34, 211, 238, 0.22) !important;
    border-bottom: 1px solid rgba(34, 211, 238, 0.22) !important;
}

.skylium-following-table tbody td:first-child {
    border-left: 1px solid rgba(34, 211, 238, 0.22) !important;
    border-radius: 16px 0 0 16px !important;
}

.skylium-following-table tbody td:last-child {
    border-right: 1px solid rgba(34, 211, 238, 0.22) !important;
    border-radius: 0 16px 16px 0 !important;
}

/* Titre du sujet */
.skylium-following-table strong {
    color: #168ac3 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}

/* Avatar du dernier auteur */
.skylium-following-table .ui.mini.circular.image {
    width: 38px !important;
    height: 38px !important;

    border: 2px solid rgba(34, 211, 238, 0.45) !important;
}

/* Bouton Ne plus suivre */
.skylium-following-table .ui.mini.red.button {
    padding: 10px 14px !important;

    color: #ffffff !important;
    background: #ef2028 !important;

    border: none !important;
    border-radius: 10px !important;

    font-weight: 700 !important;
}

.skylium-following-table .ui.mini.red.button:hover {
    background: #cf161d !important;
}

/* Message lorsqu'aucun sujet n'est suivi */
.skylium-following-card .ui.info.message {
    padding: 20px !important;

    color: #123b5a !important;
    background: rgba(34, 211, 238, 0.07) !important;

    border: 1px solid rgba(34, 211, 238, 0.3) !important;
    border-radius: 14px !important;

    box-shadow: none !important;
}

/* Fenêtre de confirmation */
.skylium-following-modal {
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    border-top: 4px solid #22d3ee !important;
    border-radius: 20px !important;

    box-shadow: 0 18px 45px rgba(15, 45, 75, 0.2) !important;
}

.skylium-following-modal > .header {
    color: #123b5a !important;
    background: #ffffff !important;

    font-size: 23px !important;
    font-weight: 700 !important;
}

.skylium-following-modal > .content {
    color: #34495a !important;
    background: #ffffff !important;

    font-size: 16px !important;
}

.skylium-following-modal > .actions {
    background: #f7fbfd !important;
    border-top: 1px solid rgba(34, 211, 238, 0.25) !important;
}

.skylium-following-modal .ui.green.button {
    color: #ffffff !important;
    background: #22a45a !important;

    border-radius: 10px !important;
}

.skylium-following-modal .ui.green.button:hover {
    background: #188747 !important;
}

/* =========================================
   VERSION MOBILE
   ========================================= */

@media only screen and (max-width: 767px) {
    .skylium-following-page-title {
        width: calc(100% - 32px) !important;
        margin: 24px auto 18px !important;

        font-size: 30px !important;
    }

    .skylium-following-page {
        width: calc(100% - 24px) !important;
        margin-bottom: 30px !important;
    }

    .skylium-following-card {
        width: 100% !important;
        margin: 0 !important;
        padding: 24px 18px !important;

        border-radius: 20px !important;
    }

    .skylium-following-card > .ui.header {
        font-size: 25px !important;
    }

    .skylium-following-card > .ui.header .res.right.floated {
        float: none !important;
        display: block !important;
        width: 100% !important;
        margin: 18px 0 0 !important;
    }

    .skylium-following-card > .ui.header .button {
        width: 100% !important;
        margin: 0 !important;
        text-align: center !important;
    }

    /* Chaque ligne devient une carte indépendante */
    .skylium-following-table,
    .skylium-following-table tbody {
        display: block !important;
        width: 100% !important;
    }

    .skylium-following-table tbody tr {
        display: block !important;
        width: 100% !important;
        margin-bottom: 16px !important;

        border: 1px solid rgba(34, 211, 238, 0.3) !important;
        border-radius: 16px !important;

        overflow: hidden !important;
    }

    .skylium-following-table tbody td {
        display: block !important;
        width: 100% !important;
        padding: 18px !important;

        border: none !important;
        border-radius: 0 !important;
    }

    .skylium-following-table tbody td:first-child,
    .skylium-following-table tbody td:last-child {
        border: none !important;
        border-radius: 0 !important;
    }

    .skylium-following-table .ui.stackable.grid {
        width: 100% !important;
        margin: 0 !important;
    }

    .skylium-following-table .ui.stackable.grid > .column {
        width: 100% !important;
        padding: 8px 0 !important;
        text-align: left !important;
    }

    .skylium-following-table .ui.mini.red.button {
        display: block !important;
        width: 100% !important;
        min-height: 48px !important;
        margin: 8px 0 0 !important;

        font-size: 15px !important;
    }

    .skylium-following-modal {
        width: calc(100% - 28px) !important;
        margin: 0 auto !important;
    }

    .skylium-following-modal > .actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .skylium-following-modal > .actions .button,
    .skylium-following-modal > .actions form,
    .skylium-following-modal > .actions input {
        width: 100% !important;
        margin: 0 !important;
    }
}