Template:SS organizations/styles.css

/* Light mode defaults – your gold theme */
.navbox-ss,
.navbox-ss .navbox-title,
.navbox-ss .navbox-group,
.navbox-ss .navbox-subgroup,
.navbox-ss th,
.navbox-ss td {
    background-color: #c48f2d;
    color: #000000;
    border-color: #a8741f;
}

/* Headers/groups slightly darker gold for contrast */
.navbox-ss .navbox-title,
.navbox-ss caption,
.navbox-ss th[scope="col"],
.navbox-ss .navbox-group,
.navbox-ss .navbox-abovebelow {
    background-color: #b37c28;
    color: #000000;
}

/* Nested subgroups inside your navbox */
.navbox-ss .navbox-subgroup .navbox-group,
.navbox-ss .navbox-subgroup td {
    background-color: #c48f2d;
    color: #000000;
}

/* Links readable on gold (dark colors) */
.navbox-ss a:link,
.navbox-ss a:visited {
    color: #001f3f;  /* very dark navy */
}
.navbox-ss a.new {
    color: #800000;  /* dark red */
}

/* Dark mode override – only applies when prefers-color-scheme: dark (Automatic/OS) */
@media (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .navbox-ss,
    html.skin-theme-clientpref-os .navbox-ss .navbox-title,
    html.skin-theme-clientpref-os .navbox-ss .navbox-group,
    html.skin-theme-clientpref-os .navbox-ss .navbox-subgroup,
    html.skin-theme-clientpref-os .navbox-ss th,
    html.skin-theme-clientpref-os .navbox-ss td,
    html.skin-theme-clientpref-os .navbox-ss table.navbox th,
    html.skin-theme-clientpref-os .navbox-ss table.navbox td {
        background-color: #c48f2d !important;
        color: #000000 !important;
        border-color: #a8741f !important;
    }

    html.skin-theme-clientpref-os .navbox-ss .navbox-title,
    html.skin-theme-clientpref-os .navbox-ss caption,
    html.skin-theme-clientpref-os .navbox-ss th[scope="col"],
    html.skin-theme-clientpref-os .navbox-ss .navbox-group {
        background-color: #b37c28 !important;
        color: #000000 !important;
    }

    html.skin-theme-clientpref-os .navbox-ss .navbox-subgroup .navbox-group {
        background-color: #c48f2d !important;
        color: #000000 !important;
    }

    /* Links stay dark-readable */
    html.skin-theme-clientpref-os .navbox-ss a:link,
    html.skin-theme-clientpref-os .navbox-ss a:visited {
        color: #001f3f !important;
    }
    html.skin-theme-clientpref-os .navbox-ss a.new {
        color: #800000 !important;
    }
}
/* Force dark gray body/content areas in dark mode (non-header cells/rows) */
@media (prefers-color-scheme: dark) {
    /* Main content cells – dark gray instead of white/light */
    html.skin-theme-clientpref-os .navbox-ss td,
    html.skin-theme-clientpref-os .navbox-ss th:not(.navbox-group):not(.navbox-title):not([scope="col"]) {
        background-color: #252525 !important;   /* dark gray – matches typical wiki dark navbox body */
        color: #e0e0e0 !important;             /* light gray text for readability */
    }

    /* Alternating rows – even darker or slightly different shade if desired */
    html.skin-theme-clientpref-os .navbox-ss .navbox-odd,
    html.skin-theme-clientpref-os .navbox-ss .navbox-even {
        background-color: #1e1e1e !important;   /* very dark gray/black for striping */
    }

    /* Nested subgroup content cells (inside your inner navboxes) */
    html.skin-theme-clientpref-os .navbox-ss .navbox-subgroup td,
    html.skin-theme-clientpref-os .navbox-ss .navbox-subgroup th {
        background-color: #252525 !important;
        color: #e0e0e0 !important;
    }

    /* Make sure subgroup headers stay gold, but their content is dark gray */
    html.skin-theme-clientpref-os .navbox-ss .navbox-subgroup .navbox-group {
        background-color: #c48f2d !important;
        color: #000000 !important;
    }

    /* Optional: slightly darker gold borders in dark mode for better separation */
    html.skin-theme-clientpref-os .navbox-ss,
    html.skin-theme-clientpref-os .navbox-ss th,
    html.skin-theme-clientpref-os .navbox-ss td {
        border-color: #8c6818 !important;   /* darker gold border */
    }
}