/* ============================================
   LIGHT MODE - JASNA SKÓRA FOTOFERIA
   ============================================ */

/* Główne tło strony */
body.ff-light-mode {
    background-color: #ffffff !important;
    color: #333 !important;
}

body.ff-light-mode #bodyWrapper {
    background-color: #ffffff !important;
}

body.ff-light-mode #page {
    background-color: #ffffff !important;
    width: 1031px !important;
    margin: 0 auto !important;
    padding-top: 50px !important;
}

body.ff-light-mode #bd {
    background-color: #ffffff !important;
    color: #333 !important;
    padding: 20px 0 40px 0 !important;
}

/* Banner główny - jasna skóra */
body.ff-light-mode #banner {
    background: transparent url('/themes/default/skins/white/img/banner.jpg') no-repeat left center !important;
    height: 111px !important;
    position: relative !important;
    margin-bottom: 15px !important;
    z-index: 3 !important;
    width: 1031px !important;
}

body.ff-light-mode #banner[lang="en"],
body.ff-light-mode #banner[lang="ru"],
body.ff-light-mode #banner[lang="de"] {
    background-image: url('/themes/default/skins/white/img/banner_en.jpg') !important;
}

/* Logo w jasnej skórze - jeśli jest w bannerze */
body.ff-light-mode #banner img {
    /* Logo jest częścią bannera */
}

/* Online list - jasna skóra */
body.ff-light-mode #onlineList {
    color: #ffffff !important;
    text-shadow: 0px 0px 5px #000000 !important;
}

body.ff-light-mode #onlineList #onlineD {
    color: #000000 !important;
    text-shadow: none !important;
    background-color: white !important;
    box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.1) !important;
}

/* Top bar - light mode */
body.ff-light-mode #usermenu.ff-topbar {
    background-color: #f5f5f5 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
}

body.ff-light-mode #usermenu.ff-topbar .menulink {
    color: #333 !important;
}

body.ff-light-mode #usermenu.ff-topbar .menulink:hover {
    color: #000 !important;
}

/* Przycisk Publikuj zdjęcie - light mode */
body.ff-light-mode .ff-btn-publish {
    background: #e0e0e0 !important;
    color: #333 !important;
    border-color: #ccc !important;
}

body.ff-light-mode .ff-btn-publish:hover {
    background: #d0d0d0 !important;
    border-color: #bbb !important;
}

/* Ikony - light mode */
body.ff-light-mode .ff-top-icon .menulink {
    color: #666 !important;
}

body.ff-light-mode .ff-top-icon .menulink:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #333 !important;
}

/* Statystyki - light mode */
body.ff-light-mode .ff-top-stats-inner {
    color: #666 !important;
}

body.ff-light-mode .ff-stat-ranking {
    color: #d4a017 !important;
}

body.ff-light-mode .ff-stat-month {
    color: #555 !important;
}

body.ff-light-mode .ff-stat-photos {
    color: #555 !important;
}

/* Dropdown menu - light mode */
body.ff-light-mode #menuitem-user .menucontainer,
body.ff-light-mode #menuitem-messages .menucontainer {
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid #ddd !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
}

body.ff-light-mode #menuitem-user .menucontainer a,
body.ff-light-mode #menuitem-messages .menucontainer a {
    color: #333 !important;
}

body.ff-light-mode #menuitem-user .menucontainer a:hover,
body.ff-light-mode #menuitem-messages .menucontainer a:hover {
    background: #f0f0f0 !important;
    color: #000 !important;
}

body.ff-light-mode #menuitem-user .menucontainer li,
body.ff-light-mode #menuitem-messages .menucontainer li {
    border-bottom: 1px solid #e0e0e0 !important;
}

/* Tooltips - light mode */
body.ff-light-mode .ff-top-icon .menulink[title]:hover::after,
body.ff-light-mode .ff-stat-ranking[title]:hover::after,
body.ff-light-mode .ff-stat-month[title]:hover::after,
body.ff-light-mode .ff-stat-photos[title]:hover::after {
    background: rgba(0, 0, 0, 0.9) !important;
    color: #fff !important;
}

/* Wskaźniki powiadomień - light mode */
body.ff-light-mode .ff-dot {
    border-color: #f5f5f5 !important;
}

/* Menu główne - light mode */
body.ff-light-mode #mainmenu {
    background-color: #ffffff !important;
    border-bottom: 1px dotted #999999 !important;
    font-size: 16px !important;
}

body.ff-light-mode #mainmenu a {
    color: #000000 !important;
}

body.ff-light-mode #mainmenu a:hover {
    color: #A32B40 !important;
}

body.ff-light-mode #mainmenu > ul > li > a {
    border-left: 1px dotted #999999 !important;
}

body.ff-light-mode #mainmenu > ul > li:first-child > a {
    border-left: none !important;
}

/* Breadcrumbs - light mode */
body.ff-light-mode #sciezka_okruszkow {
    color: #000000 !important;
    padding: 10px 0 0 0 !important;
}

body.ff-light-mode #sciezka_okruszkow span {
    color: #000000 !important;
}

body.ff-light-mode #sciezka_okruszkow a {
    color: #A32B40 !important;
}

body.ff-light-mode #sciezka_okruszkow a:hover {
    color: #000000 !important;
}

/* Tło głównej zawartości - light mode */
body.ff-light-mode .content-wrapper,
body.ff-light-mode .gallery,
body.ff-light-mode .newgallery {
    background-color: #ffffff !important;
}

/* Karty zdjęć - light mode */
body.ff-light-mode .ff-gallery-card,
body.ff-light-mode .photo-card {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

body.ff-light-mode .ff-gallery-card:hover,
body.ff-light-mode .photo-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Statystyki pod zdjęciami - light mode */
body.ff-light-mode .ff-card__stats {
    background: #f8f8f8 !important;
    border-top: 1px solid #e0e0e0 !important;
    color: #666 !important;
}

/* Footer - light mode */
body.ff-light-mode #ft {
    border-top: 1px dotted #999999 !important;
    padding-top: 15px !important;
    font-family: tahoma, verdana, 'Trebuchet MS' !important;
}

body.ff-light-mode #footer {
    background-color: #ffffff !important;
    color: #000000 !important;
}

body.ff-light-mode #footermenu a {
    color: #000000 !important;
    border-left: 1px solid #999999 !important;
}

body.ff-light-mode #footermenu a:hover {
    color: #A32B40 !important;
}

/* Responsywność - light mode */
@media (max-width: 768px) {
    body.ff-light-mode #usermenu.ff-topbar {
        background-color: #f5f5f5 !important;
    }
}