/*
 *   License: MIT
 *   Aurora Theme - VEMC.PL Edition
 *   Kolory: Żółty / Czarny / Biały
 */

/* ─── ZMIENNE KOLORÓW ─── */
:root {
    --vemc-yellow: #FFD700;
    --vemc-yellow-dark: #e6c200;
    --vemc-yellow-light: #fff176;
    --vemc-black: #0f0f0f;
    --vemc-dark: #1a1a1a;
    --vemc-card: #222222;
    --vemc-border: #2e2e2e;
    --vemc-white: #ffffff;
    --vemc-grey: #b0b0b0;
}

/* ─── HTML & BODY ─── */
body {
    background-color: var(--vemc-black) !important;
    color: var(--vemc-white) !important;
}

.preloader {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: var(--vemc-black);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    z-index: 1000;
}

body.dark .preloader {
    background-color: var(--vemc-black);
}

#wrapper > .ui.container {
    margin-top: 3rem;
}

.ui.steps {
    border: none;
}

/* ─── NAVBAR ─── */
#navbar {
    background: var(--vemc-dark) !important;
    border-bottom: 2px solid var(--vemc-yellow) !important;
}

.ui.secondary.menu {
    background: var(--vemc-dark) !important;
}

.ui.secondary.menu .item,
.ui.secondary.menu .item:hover,
.ui.secondary.pointing.menu .item {
    color: var(--vemc-white) !important;
}

.ui.secondary.menu .item:hover,
.ui.secondary.pointing.menu .active.item {
    color: var(--vemc-yellow) !important;
    border-color: var(--vemc-yellow) !important;
}

.ui.secondary.pointing.menu .active.item {
    border-color: var(--vemc-yellow) !important;
}

/* Sidebar mobile menu */
.ui.vertical.inverted.sidebar.menu {
    background: var(--vemc-dark) !important;
    border-right: 2px solid var(--vemc-yellow) !important;
}

.ui.vertical.inverted.sidebar.menu .item {
    color: var(--vemc-white) !important;
}

.ui.vertical.inverted.sidebar.menu .item.active,
.ui.vertical.inverted.sidebar.menu .item:hover {
    color: var(--vemc-yellow) !important;
    background: rgba(255, 215, 0, 0.1) !important;
}

/* ─── PRZYCISKI ─── */
.ui.primary.button,
.ui.primary.buttons .button {
    background-color: var(--vemc-yellow) !important;
    color: var(--vemc-black) !important;
    font-weight: 700 !important;
}

.ui.primary.button:hover,
.ui.primary.buttons .button:hover {
    background-color: var(--vemc-yellow-dark) !important;
    color: var(--vemc-black) !important;
}

.ui.button {
    background-color: var(--vemc-card) !important;
    color: var(--vemc-white) !important;
    border: 1px solid var(--vemc-border) !important;
}

.ui.button:hover {
    background-color: #333 !important;
    color: var(--vemc-yellow) !important;
    border-color: var(--vemc-yellow) !important;
}

.ui.positive.button,
.ui.green.button {
    background-color: var(--vemc-yellow) !important;
    color: var(--vemc-black) !important;
}

/* ─── SEGMENTY / KARTY ─── */
.ui.segment {
    background: var(--vemc-card) !important;
    border: 1px solid var(--vemc-border) !important;
    border-radius: 10px !important;
    color: var(--vemc-white) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.5) !important;
}

.ui.card {
    background: var(--vemc-card) !important;
    border: 1px solid var(--vemc-border) !important;
    border-radius: 10px !important;
    color: var(--vemc-white) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.5) !important;
}

.ui.card .header,
.ui.card .meta,
.ui.card .description {
    color: var(--vemc-white) !important;
}

.ui.card .meta {
    color: var(--vemc-grey) !important;
}

/* ─── FORMULARZE ─── */
.ui.form .field > label {
    color: var(--vemc-white) !important;
}

.ui.form input,
.ui.form textarea,
.ui.form select,
.ui.input > input {
    background: #181818 !important;
    border: 1px solid var(--vemc-border) !important;
    color: var(--vemc-white) !important;
    border-radius: 6px !important;
}

.ui.form input:focus,
.ui.form textarea:focus {
    border-color: var(--vemc-yellow) !important;
    box-shadow: 0 0 0 2px rgba(255,215,0,0.2) !important;
}

.ui.dropdown {
    background: #181818 !important;
    color: var(--vemc-white) !important;
    border-color: var(--vemc-border) !important;
}

.ui.dropdown .menu {
    background: var(--vemc-dark) !important;
    border-color: var(--vemc-yellow) !important;
}

.ui.dropdown .menu .item {
    color: var(--vemc-white) !important;
    border-color: var(--vemc-border) !important;
}

.ui.dropdown .menu .item:hover {
    background: rgba(255,215,0,0.1) !important;
    color: var(--vemc-yellow) !important;
}

/* ─── NAGŁÓWKI ─── */
h1, h2, h3, h4, h5, h6,
.ui.header {
    color: var(--vemc-white) !important;
}

.ui.header .sub.header {
    color: var(--vemc-grey) !important;
}

/* ─── LINKI ─── */
a {
    color: var(--vemc-yellow) !important;
}

a:hover {
    color: var(--vemc-yellow-light) !important;
}

/* ─── WIADOMOŚCI / ALERTY ─── */
.ui.message {
    background: var(--vemc-card) !important;
    border: 1px solid var(--vemc-border) !important;
    color: var(--vemc-white) !important;
}

.ui.info.message {
    background: rgba(255, 215, 0, 0.08) !important;
    border: 1px solid var(--vemc-yellow) !important;
    color: var(--vemc-white) !important;
}

.ui.negative.message,
.ui.error.message {
    background: rgba(220, 50, 50, 0.15) !important;
    border-color: #dc3232 !important;
}

.ui.success.message,
.ui.positive.message {
    background: rgba(255, 215, 0, 0.1) !important;
    border-color: var(--vemc-yellow) !important;
    color: var(--vemc-white) !important;
}

.ui.warning.message {
    background: rgba(255, 165, 0, 0.12) !important;
    border-color: orange !important;
    color: var(--vemc-white) !important;
}

/* ─── TABELE ─── */
.ui.table {
    background: var(--vemc-card) !important;
    color: var(--vemc-white) !important;
    border: 1px solid var(--vemc-border) !important;
}

.ui.table thead th {
    background: #181818 !important;
    color: var(--vemc-yellow) !important;
    border-color: var(--vemc-border) !important;
}

.ui.table td {
    border-color: var(--vemc-border) !important;
    color: var(--vemc-white) !important;
}

.ui.table tr:hover td {
    background: rgba(255, 215, 0, 0.05) !important;
}

/* ─── MENU ZAKŁADEK ─── */
.ui.menu {
    background: var(--vemc-dark) !important;
    border-color: var(--vemc-border) !important;
}

.ui.menu .item {
    color: var(--vemc-grey) !important;
}

.ui.menu .active.item,
.ui.menu .item:hover {
    color: var(--vemc-yellow) !important;
    background: rgba(255,215,0,0.08) !important;
}

.ui.tabular.menu {
    border-bottom-color: var(--vemc-yellow) !important;
}

.ui.tabular.menu .active.item {
    border-color: var(--vemc-yellow) !important;
    background: var(--vemc-card) !important;
    color: var(--vemc-yellow) !important;
}

.ui.attached.segment {
    background: var(--vemc-card) !important;
    border-color: var(--vemc-border) !important;
    color: var(--vemc-white) !important;
}

/* ─── LABEL ─── */
.ui.label {
    background: #181818 !important;
    color: var(--vemc-white) !important;
    border-color: var(--vemc-border) !important;
}

.ui.label.yellow,
.ui.yellow.label {
    background: var(--vemc-yellow) !important;
    color: var(--vemc-black) !important;
}

/* ─── POPUP / POPOVER ─── */
.ui.popup {
    background: var(--vemc-dark) !important;
    border: 1px solid var(--vemc-yellow) !important;
    color: var(--vemc-white) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.7) !important;
}

.ui.popup::before {
    background: var(--vemc-dark) !important;
    box-shadow: -1px -1px 0 1px var(--vemc-yellow) !important;
}

/* ─── PASEK BOCZNY W NAVBAR ─── */
.ui.secondary.segment {
    background: #141414 !important;
    border-top: 1px solid var(--vemc-border) !important;
}

/* ─── BANER (STYL 1) ─── */
.ui.stackable.three.column.grid[style*="background-image"] {
    border-bottom: 3px solid var(--vemc-yellow) !important;
}

/* ─── PROFILE ─── */
#profile-header {
    background-color: var(--vemc-dark) !important;
    border-bottom: 2px solid var(--vemc-yellow) !important;
}

/* ─── KOMENTARZE ─── */
.ui.comments .comment .content .author {
    color: var(--vemc-yellow) !important;
}

.ui.comments .comment .content .text {
    color: var(--vemc-white) !important;
}

/* ─── DIVIDER ─── */
.ui.divider {
    border-color: var(--vemc-border) !important;
}

.ui.horizontal.divider {
    color: var(--vemc-grey) !important;
}

.ui.horizontal.divider::before,
.ui.horizontal.divider::after {
    background-color: var(--vemc-border) !important;
}

/* ─── CHECKBOX ─── */
.ui.checkbox label {
    color: var(--vemc-white) !important;
}

.ui.checkbox input:checked ~ .box::after,
.ui.checkbox input:checked ~ label::after {
    color: var(--vemc-yellow) !important;
}

.ui.checkbox input:checked ~ .box::before,
.ui.checkbox input:checked ~ label::before {
    border-color: var(--vemc-yellow) !important;
    background-color: var(--vemc-yellow) !important;
}

/* ─── MODUŁ GHOST/NEWSY ─── */
.latest-news-image {
    height: 50px;
    width: 50px;
    overflow: hidden;
    border-radius: 0.25rem;
    margin-top: 0.3rem;
}

.latest-news-image img {
    height: 100%;
    max-width: none;
}

.latest-news-name {
    font-weight: 600;
    color: var(--vemc-white) !important;
}

.latest-news-date,
.latest-news-readtime {
    color: var(--vemc-grey) !important;
}

.ghost-list {
    padding-top: 1rem;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: 1.5rem;
}

.post-card-large {
    grid-area: span 1 / span 6;
    display: flex;
    flex-direction: row;
    background-color: var(--vemc-card) !important;
    border-radius: 0.5rem;
    border: 1px solid var(--vemc-border);
}

.post-card-large .ghost-card-img {
    flex: 1 1 60%;
    overflow: hidden;
    position: relative;
}

.post-card-large .ghost-card-img img {
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
    position: absolute;
    width: 100%; height: 100%;
    object-fit: cover;
}

.post-card-large .ghost-card-body {
    flex: 1 1 40%;
    padding: 2.5rem;
}

.post-card-large .ghost-card-title {
    font-weight: 600;
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    color: var(--vemc-white) !important;
}

.post-card-large .ghost-card-footer {
    display: flex;
    margin-top: 1.5rem;
}

.post-card-medium {
    grid-area: span 1 / span 3;
    background-color: var(--vemc-card) !important;
    border-radius: 0.5rem;
    border: 1px solid var(--vemc-border);
}

.post-card-medium .ghost-card-img {
    height: 250px;
    position: relative;
}

.post-card-medium .ghost-card-img img {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    position: absolute;
    width: 100%; height: 100%;
    object-fit: cover;
}

.post-card-medium .ghost-card-body {
    padding: 1.5rem 2rem;
}

.post-card-medium .ghost-card-title {
    font-weight: 600;
    font-size: 1.4rem;
    margin-bottom: 1rem;
    color: var(--vemc-white) !important;
}

.post-card-small {
    grid-area: span 1 / span 2;
    background-color: var(--vemc-card) !important;
    border-radius: 0.5rem;
    border: 1px solid var(--vemc-border);
    margin-bottom: 1rem;
}

@media only screen and (max-width: 767px) {
    .post-card-small { grid-area: span 1 / span 6; }
    .post-card-medium { grid-area: span 1 / span 6; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .post-card-small { grid-area: span 1 / span 3; }
    .post-card-medium { grid-area: span 1 / span 6; }
}

.post-card-small .ghost-card-img {
    height: 200px;
    position: relative;
}

.post-card-small .ghost-card-img img {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    position: absolute;
    width: 100%; height: 100%;
    object-fit: cover;
}

.post-card-small .ghost-card-body,
.post-card-medium .ghost-card-body {
    padding: 1.5rem 2rem;
}

.post-card-small .ghost-card-title {
    font-weight: 600;
    font-size: 1.4rem;
    margin-bottom: 1rem;
    color: var(--vemc-white) !important;
}

.ghost-readtime, .readtime {
    margin: auto 0;
    background: rgba(255, 215, 0, 0.08) !important;
    color: var(--vemc-white) !important;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    font-weight: 500;
}

.ghost-list .ghost-card-img { overflow: hidden; }
.ghost-list .ghost-card-img img,
.ghost-card-title { transition: .25s; }
.ghost-list .ghost-card-img img:hover {
    transform: scale(1.1) rotate(2deg);
}

.ghost-card-content,
.cf-full-post-content,
.cf-more-posts {
    color: var(--vemc-white) !important;
}

.cf-full-post-title {
    font-weight: 600;
    font-size: 2rem;
    color: var(--vemc-white) !important;
}

.cf-home-title {
    color: var(--vemc-white) !important;
}

.post-card-large,
.post-card-medium,
.post-card-small,
.cf-full-post {
    background: var(--vemc-card) !important;
}

.cf-full-post-img {
    height: 300px;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 1rem;
}

.cf-full-post-body {
    padding: 2rem 5%;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

.cf-full-post-content { overflow-wrap: break-word; }
.cf-full-post-img img { width: 100%; height: auto; }

/* ─── FOOTER ─── */
.outside-footer {
    padding: 1.5rem 2rem;
    position: absolute;
    bottom: 0;
    width: 100%;
}

/* ─── RESPONSYWNOŚĆ ─── */
@media (max-width: 767px) {
    .ui.grid .column { width: 100% !important; }
}

@media only screen and (max-width: 768px) {
    #mobnavbar { display: block !important; }
    #pcnavbar { display: none; }
}

/* ─── PRZYCISKI ANIMOWANE ─── */
.ui.vertical.animated.button,
.ui.aurora.navbar.button {
    background: none !important;
    border: none !important;
    color: var(--vemc-white) !important;
    cursor: pointer;
    padding: 5px;
    text-align: center;
}

.ui.vertical.animated.button:hover,
.ui.aurora.navbar.button:hover {
    color: var(--vemc-yellow) !important;
}

/* ─── POINTING MENU DARK FIX ─── */
body.dark .ui.fluid.centered.label {
    background: var(--vemc-card);
    border-color: var(--vemc-border);
    color: var(--vemc-white);
    cursor: default;
}

body.dark .ui.pointing.menu:not(.inverted) .item {
    color: var(--vemc-white);
}

body.dark .ui.pointing.menu {
    background: var(--vemc-dark);
    border: 1px solid var(--vemc-border);
}

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--vemc-dark); }
::-webkit-scrollbar-thumb {
    background: var(--vemc-yellow);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: var(--vemc-yellow-dark); }

/* ─── SELEKCJA TEKSTU ─── */
::selection {
    background: var(--vemc-yellow);
    color: var(--vemc-black);
}

/* ─── VEMC BRAND AKCENT ─── */
.vemc-accent { color: var(--vemc-yellow) !important; }
.vemc-badge {
    display: inline-block;
    background: var(--vemc-yellow);
    color: var(--vemc-black);
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.85em;
}
