body[data-theme="light"] {
	--bg-color:#fff5d8;
	--card-bg:#fff0c6;
	--text-color:#222222;
	--text-muted:#303030;
	--accent-color:#b8860b;
	--bg-color-hover:#b8860b;
	--menu-bg:#F7F7F7;
	--border-color:#b8860b;
	--input-bg:transparent;
	--pagination-dis-color:#3030305c;
	--pagination-dis-bg:#f7f7f700;
	--panel-bg:#e2ca8233;
	--home-bg-color:#f5e3a9;
	--home-accent-color:#d4af37;
	--home-text-color:#222222;
	--home-input-bg:transparent;
	--home-border-color:#b8860b;
	--input-bg-color:#ffecaf;
	--input-border-color:#b8860b;
}

body[data-theme="dark"] {
	--bg-color:#272b30;
	--card-bg:#1e1e1e;
	--text-color:#EAEAEA;
	--text-muted:#c4c4c4;
	--accent-color:#d4af37;
	--bg-color-hover:#b8860b;
	--menu-bg:#1a1a1a;
	--border-color:#333;
	--input-bg:#2a2a2a;
	--pagination-dis-color:#a0a0a0;
	--pagination-dis-bg:#1a1a1a;
	--panel-bg:#32323291;
	--home-bg-color:#272b30;
	--home-accent-color:#d4af37;
	--home-text-color:#222222;
	--home-input-bg:transparent;
	--home-border-color:#b8860b;
	--input-bg-color:#121212;
	--input-border-color:#d4af37;
}

* {box-sizing:border-box; margin:0; padding:0; transition:background-color 0.3s ease, color 0.3s ease}
body {background-color:var(--bg-color); color:var(--text-color); font-family:arial, 'Segoe UI', sans-serif; line-height: 1.2}

.fs-10{font-size:10px !important}
.fs-11{font-size:11px !important}
.fs-12{font-size:12px !important}
.fs-13{font-size:13px !important}
.fs-14{font-size:14px !important}
.fs-15{font-size:15px !important}
.fs-16{font-size:16px !important}
.fs-17{font-size:17px !important}
.fs-18{font-size:18px !important}
.fs-19{font-size:19px !important}
.fs-20{font-size:20px !important}

.pt-5 {padding-top:5px !important}
.pt-10 {padding-top:10px !important}

.mt-10 {margin-top:10px !important}
.mt-20 {margin-top:20px !important}
.fw-bold{font-weight:bold !important}
.mx-1 {margin-right:0.25rem !important; margin-left:0.25rem !important}

textarea:focus, input:focus, select:focus {outline:none; border-color:#EABB00; box-shadow:0px 0px 9px 0px rgba(191, 98, 62, 0.29)}

::placeholder {color:var(--text-muted); font-style:italic; font-family:'Courier New', Courier, monospace; font-size:13px}
::-webkit-input-placeholder {color:var(--text-muted); font-style:italic; font-family:'Courier New', Courier, monospace; font-size:13px}
::-moz-placeholder {color:var(--text-muted); font-style:italic; font-family:'Courier New', Courier, monospace; font-size:13px}
:-ms-input-placeholder {color:var(--text-muted); font-style:italic; font-family:'Courier New', Courier, monospace; font-size:13px}

.avatar_small{width:32px; height:32px; max-width:32px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; object-fit: cover; display: block}
.avatar_large{width:40px;height:40px;max-width:40px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;}
.avatar_shadow:hover{-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;-ms-transition: 0.3s;transition: 0.3s;-webkit-box-shadow: 0px 0px 7px 5px rgba(103, 153, 227, 1);-moz-box-shadow: 0px 0px 7px 5px rgba(103, 153, 227, 1);box-shadow: 0px 0px 7px 5px rgba(103, 153, 227, 1);}

#page_loading_bar {position:fixed; top:0; left:0; right:0; height:3px; background:transparent; z-index:99999; pointer-events none}
#loading_bar_bg {width:70%; height:100%; background:#D80707; box-shadow:0 0 10px rgba(255, 0, 0, 0.7); transition:width 0.4s ease-out, opacity 0.4s ease-in-out; opacity:1}
#page_loading_bar.hide #loading_bar_bg {opacity:0}

.container {max-width:900px; margin:20px auto 0 auto; padding:0 1rem}

.logo-img {max-width:120px; height:auto; display:block}
.show-mobile-only {display:none !important}
.show-mobile-only i {color: var(--text-color); font-size:21px; padding:4px}

.box-hashtag {margin-bottom:1rem; font-size:14px; margin-bottom:0.7rem}
.box-hashtag .box-hashtag-link {color: var(--accent-color); text-decoration:none; font-weight: bold; padding-right:6px;}
.box-hashtag .box-hashtag-link:hover {text-decoration:underline;}



/* ikony usstepnij */
ul.share-list {display:block; list-style-type:none}
ul.share-list li {margin:4px 0}
ul.share-list li a {display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-align-items:center; -ms-flex-align:center; align-items:center; transition:all .3s; text-decoration:none}
.share-icon {width:32px; height:30px; border: 1px solid var(--accent-color); display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; text-align:center; color: var(--text-color); border-radius:4px}
.share-icon:hover {background-color:var(--bg-color-hover); color:#fff}
ul.share-slide {display:-webkit-flex; display:-ms-flexbox; display:flex; position:relative; z-index:3; margin:0}
ul.share-slide li a {display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-align-items:center; -ms-flex-align:center; align-items:center; width:32px; overflow:hidden; margin:0 2px; transition:all .3s}
ul.share-slide li a>*{-webkit-flex:0 0 auto; -ms-flex:0 0 auto; flex:0 0 auto}
ul.share-slide .share-text {margin-left:10px; text-transform:uppercase; line-height:1; font-size:12px; color: var(--accent-color);}
ul.share-slide li a:hover {width:120px}


.header-cat-menu {max-width:1200px; margin:0 auto; padding:10px 1rem 0 1rem}
.category-horizontal-menu {display:flex; justify-content:center; gap:1px; list-style:none; margin:1.5rem 0 2.5rem 0; padding:0; width:100%; border-bottom:3px solid #ffecb58a}
.category-horizontal-menu li {padding-bottom:8px; padding-left:0; padding-right:0}
.category-horizontal-menu a {position:relative; display:inline-block; padding-left:15px; padding-right:15px; text-decoration:none; font-size:15px; font-weight:bold; color:var(--text-muted); transition:color 0.3s ease;}
.category-horizontal-menu a:hover, .category-horizontal-menu li.active a {color:var(--accent-color)}
.category-horizontal-menu a::after {content: ''; position:absolute; bottom: -11px; left:50%; width:0; height:3px; background-color:var(--accent-color); transition:width 0.3s ease, left 0.3s ease;}
.category-horizontal-menu a:hover::after {width:100%; left:0}
.category-horizontal-menu li.active a::after {width:100%; left:0}

/* Belka menu */
.menu-container {width:100%; height:80px; display:flex; align-items:center; justify-content:space-between; padding:0 20px}
.banner-container {width:100%; height:360px; background-image:url('https://wkadrze.com/assets/img/backgroung_top.png'); background-size:100% 100%; background-position:center; background-repeat:no-repeat}
.banner-title {float:right; padding-right:70px; padding-top:80px; color:#531313; text-shadow:2px 2px 2px rgba(255,255,255,0.97); font-family:Georgia, "Times New Roman", serif; font-size:11px; text-transform:uppercase}
.menu-logo {font-weight:bold; color:var(--text-color); text-decoration:none; font-size:1.2rem}
.menu-links .theme-btn {text-decoration:none; background:transparent; border:1px solid var(--accent-color); color:var(--text-color); padding:0.5rem 1rem; border-radius:5px; cursor:pointer; font-weight:bold; text-transform:uppercase}
.menu-links .theme-btn:hover {background-color:var(--bg-color-hover); color:#fff}
.theme-btn {background:transparent; border:1px solid var(--accent-color); color:var(--text-color); padding:0.5rem 1rem; border-radius:5px; cursor:pointer; font-weight:bold}
.theme-btn:hover {background-color:var(--bg-color-hover); color:#fff}
.theme-toggler-btn {padding:4px 6px; display:flex; align-items:center; justify-content:center}
.theme-svg-icon {width:28px; height:28px; display:block; pointer-events:none; transition:filter 0.2s ease}
.theme-toggler-btn:hover .theme-svg-icon {filter:invert(1)}
#gallery-type-toggler i {font-size: 23px; padding: 3px;}


.has-tooltip {position:relative !important}
.custom-tooltip {
    position:absolute;
    top:calc(100% + 10px);
    left:50%;
    transform:translateX(-50%) translateY(-5px);
    background-color:var(--bg-color);
    color:var(--text-color);
    border:1px solid var(--home-border-color);
    padding:6px 12px;
    border-radius:6px;
    font-size:14px;
    font-weight:normal;
    white-space:nowrap;
    box-shadow:0 4px 15px rgba(0, 0, 0, 0.3);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    z-index:1001;
}
.custom-tooltip::before {
    content: '';
    position:absolute;
    bottom:100%;
    left:50%;
    transform:translateX(-50%);
    border-width:6px;
    border-style:solid;
    border-color:transparent transparent var(--home-border-color, rgba(255, 255, 255, 0.15)) transparent;
}
.custom-tooltip::after {
    content: '';
    position:absolute;
    bottom:100%;
    left:50%;
    transform:translateX(-50%);
    border-width:5px;
    border-style:solid;
    border-color:transparent transparent var(--home-input-bg, #1e1e1e) transparent;
}
.has-tooltip:hover .custom-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}
@media (max-width: 768px) {
    .custom-tooltip {
        display: none !important;
    }
}


.menu-links {display:flex; gap:10px; align-items:center}
.gallery-dropdown-wrapper {position:relative; display:inline-block}
.gallery-dropdown-wrapper > .theme-btn {display:inline-flex; align-items:center; gap:6px}
.gallery-submenu {position:absolute; top:calc(100% + 8px); left:0; background-color:var(--card-bg); min-width:200px; box-shadow:0 4px 12px rgba(0,0,0,0.15); border-radius:6px; padding:6px 0; z-index:1000; border:1px solid var(--border-color); opacity:0; visibility:hidden; transform:translateY(-10px); pointer-events:none;transition:opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;}
.gallery-submenu::before {content: ''; position:absolute; top: -10px; left:0; width:100%; height:10px; background:transparent}
.gallery-submenu a {display:block; padding:10px 16px; color:var(--text-color); text-decoration:none; font-size:14px; font-weight: 500; transition: background-color 0.2s ease;}
.gallery-submenu a:hover {background-color: rgba(0, 0, 0, 0.05); color: var(--accent-color);}
.gallery-dropdown-wrapper:hover .gallery-submenu {opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto}


.admin-menu-btn {width:40px; height:40px; border-radius:50%; background-color:#2ecc71; color:#ffffff !important; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-size:16px; transition:background-color 0.2s ease, transform 0.2s ease; box-shadow:0 2px 5px rgba(0,0,0,0.2)}
.admin-menu-btn:hover {background-color:#27ae60; transform:scale(1.05)}

.menu-user-avatar {width:40px; height:40px; border-radius:50%; object-fit:cover; border:1px solid var(--border-color, #444); transition:border-color 0.2s ease}
.user-menu-btn:hover .menu-user-avatar {border-color:#ffca28}

.menu-actions-right {display:flex; align-items:center; gap:15px}
.login-btn{text-decoration:none}
.user-dropdown-wrapper {position:relative; display:inline-block}
.user-menu-btn {background-color:var(--card-bg); color:var(--text-color); border:1px solid var(--border-color); padding:0 10px 0 0; border-radius:20px; cursor:pointer; font-weight:600; font-size:14px; display:flex; align-items:center; gap:8px; transition:all 0.2s ease}
.user-menu-btn .icon-dropdown-menu {color: var(--text-color)}
.user-dropdown-menu {display:none; position:absolute; right:0; top:calc(100% + 8px); background-color:var(--card-bg); border:1px solid var(--border-color); border-radius:8px; min-width:200px; box-shadow:0 4px 15px rgba(0,0,0,0.25); z-index:1000; overflow:hidden}
.user-dropdown-menu.show {display:block}
.dropdown-user-info {padding:8px 8px; display:flex; gap:10px; font-size:15px; color:var(--text-color); align-items: center;}
.user-role-badge {font-size:11px; color:var(--accent-color); text-transform:uppercase; font-weight:bold; letter-spacing:0.5px}
.dropdown-divider {height:1px; background-color:var(--border-color); margin:4px 0}
.dropdown-item {display:flex; align-items:center; gap:10px; padding:10px 16px; color:var(--text-color); text-decoration:none; font-size:14px; transition:background 0.2s ease}
body[data-theme="light"] .dropdown-item:hover {background-color:var(--border-color); color:var(--menu-bg)}
body[data-theme="dark"] .dropdown-item:hover {background-color:var(--border-color); color:var(--accent-color)}

.dropdown-item.logout-item:hover {color:#ff4d4d}
@media (max-width: 576px) {.username-text {display: none;}}

.header-title-home{text-align:center; margin:0 0 1.5rem 0}
.header-title{text-align:center; margin:2rem 0 3rem 0}
.header-title-home h1, .header-title h1 {font-size:20px; font-family:'Courier New', Courier, monospace;}
.title-details{font-size:13px; color:var(--text-color)}

/* --- INDEX + SEARCH ---*/
.gallery-grid {column-count:3; column-gap:1.5rem}
.gallery-grid-home {max-width:1200px; margin:0 auto;padding:0 1rem}
@media (max-width: 900px) {.gallery-grid {column-count:2;}}
@media (max-width: 550px) {.gallery-grid {column-count:1;}}
.photo-card {position:relative; display:block; margin-bottom:1.5rem; break-inside:avoid; background-color:var(--card-bg); border-radius:8px; overflow:hidden; box-shadow:0 4px 15px rgba(0,0,0,0.15); text-decoration:none; color:#fff; transition:transform 0.3s ease}
body[data-theme="dark"] .photo-card {box-shadow:0 4px 15px rgba(0,0,0,0.5)}
.photo-card:hover {transform:translateY(-5px); transition:transform 0.3s ease}
.photo-card img {width:100%; height:auto; display:block; transition:transform 0.5s ease}
.photo-card:hover img {transform:scale(1.03)}
.photo-info {position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0.4) 100%); padding:1.5rem; display: flex;flex-direction:column;justify-content:space-between;opacity:0;transition:opacity 0.3s ease; z-index:2; pointer-events:none}
.photo-card:hover .photo-info {opacity: 1}
.photo-meta {display:flex; justify-content:space-between; font-size:0.85rem; color:var(--accent-color); font-weight:600}
.photo-meta-details{text-shadow:1px 0px 8px rgba(0, 0, 0, 1); color:#fff}
.photo-title {font-size:1.2rem; margin-bottom:0.3rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff}
.photo-excerpt {font-size:0.85rem; color:#e0e0e0; display: -webkit-box;-webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

/* --- PHOTO ---*/
.main-image-container {background-color:#0a0a0a; text-align:center; padding:1rem}
.main-image-container img {max-width:100%; max-height:100%; object-fit:contain}

/* --- VIDEO ---*/
.main-video-container {background-color:#0a0a0a; width:100%; max-width:100%; overflow:hidden}
.main-video-container video, .main-video-container iframe {position:absolute; top:0; left:0; width:100%; height:100%; border:0}
.video-js .vjs-play-progress, .video-js .vjs-volume-level {background-color:var(--accent-color) !important}
.video-js .vjs-big-play-button {border-color:var(--accent-color) !important}

/* --- VIDEOS ---*/
.video-grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:2rem}
.video-grid-home {max-width:1200px; margin:0 auto; padding:0 1rem}
@media (max-width: 900px) {.video-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }}
@media (max-width: 580px) {.video-grid { grid-template-columns: 1fr; gap: 1.5rem; }}
.video-card {display:flex; flex-direction:column; background-color:var(--card-bg); border-radius:8px; overflow:hidden; box-shadow:0 4px 15px rgba(0,0,0,0.12); text-decoration:none; color:var(--text-color); transition:transform 0.3s ease, box-shadow 0.3s ease}
body[data-theme="dark"] .video-card {box-shadow: 0 4px 15px rgba(0,0,0,0.4)}
.video-card:hover {transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.22)}
body[data-theme="dark"] .video-card:hover {box-shadow: 0 8px 25px rgba(0,0,0,0.6)}
.video-thumbnail-wrapper {position:relative; width:100%; padding-bottom:56.25%; background-color:#000; overflow:hidden}
.video-thumbnail-wrapper img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease}
.video-card:hover .video-thumbnail-wrapper img {transform:scale(1.04)}
.video-play-overlay {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.2); display:flex; justify-content:center; align-items:center; transition:background 0.3s ease; z-index:2}
.video-card:hover .video-play-overlay {background:rgba(0, 0, 0, 0.4)}
.video-play-icon {width:48px; height:48px; background-color:rgba(255, 255, 255, 0.9); color:#111; border-radius:50%; display:flex; justify-content:center; align-items:center; font-size:1.2rem; box-shadow:0 4px 10px rgba(0,0,0,0.3); transition:transform 0.3s ease, background-color 0.3s ease, color 0.3s ease}
.video-card:hover .video-play-icon {transform:scale(1.15); background-color:var(--accent-color); color:#fff}
.video-info-box {padding:1.25rem; display:flex; flex-direction:column; flex-grow:1}
.video-meta-box {display:flex; justify-content:space-between; font-size:0.8rem; color:var(--accent-color); font-weight:600; margin-bottom:0.5rem}
.video-card-title {font-size:1.1rem; margin:0 0 0.5rem 0; font-weight:600; color:var(--text-color); display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis}
.video-card-grid-title {font-size:0.9rem; color:var(--text-muted)}
.video-card-excerpt {font-size:0.85rem; color:var(--text-muted); line-height:1.4; margin:0; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

/* PAGES */
.page-container {display:flex; justify-content:center; align-items:center; padding:10px 20px 40px 20px; background-color:var(--home-bg-color)}
.page-card {background-color:var(--panel-bg); border:1px solid var(--border-color); border-radius:8px; padding:30px; width:100%; max-width:900px; box-shadow:0 4px 15px rgba(0, 0, 0, 0.2)}
.page-title {color:var(--accent-color); margin-top:0; margin-bottom:10px; font-size:24px}
.page-subtitle {color:var(--text-muted); font-size:14px; margin-bottom:25px}
.page-wrap {}
.page-text h2 {font-size:18px}
.page-text ul {margin-left:20px; padding-top:10px}


/* KONTAKT */
.contact-card {max-width:600px !important}
.contact-input-group {margin-bottom:20px; text-align:left}
.contact-input-group label {display:block; font-weight:bold; color:var(--text-color); margin-bottom:6px; font-size:14px}
.contact-input-group input, .contact-input-group textarea {width:100%; box-sizing:border-box; background-color:var(--input-bg-color); border:1px solid var(--input-border-color); color:var(--text-color); padding:10px 12px; border-radius:4px; font-size:14px; outline:none; transition:border-color 0.2s}
.contact-submit-btn {background-color:transparent; border:1px solid var(--accent-color); color:var(--accent-color); padding:12px 24px; font-size:14px; font-weight:bold; border-radius:4px; cursor:pointer; width:100%; transition:all 0.2s}
.contact-submit-btn:hover:not(:disabled) {background-color:var(--accent-color); color:var(--bg-color)}
.contact-submit-btn:disabled {opacity:0.6; cursor:not-allowed; border-color:var(--border-color); color:var(--text-muted)}
.contact-input-field {display:none !important; position:absolute; left: -9999px; text-indent: -9999px; opacity:0}
.contact-captcha-input {padding: 6px !important;}
.contact-captcha-wrapper {display:flex; align-items:center; gap:15px; margin-top:5px}
.contact-captcha-input {max-width:100px; text-align:center}


/* --- SEARCH ---*/
.search-container {max-width:1200px; margin:0 auto; padding:20px}
.search-header-info {margin-bottom:30px; text-align:center}
.search-section-title {font-size:1.6rem; margin:3rem 0 1.5rem 0; padding-bottom:0.5rem; border-bottom:2px solid var(--border-color); color:var(--text-color)}
.search-section-title span {color:var(--accent-color); font-weight:bold}
.no-results-box {background-color:var(--card-bg); padding:2rem; border-radius:8px; text-align:center; color:var(--text-muted); border:1px solid var(--border-color); margin-bottom:2rem}
.search-tabs {display:flex; gap:15px; margin-bottom:25px; border-bottom:2px solid rgba(0,0,0,0.05)}
.tab-btn {padding:10px 20px; font-size:16px; border:none; background:none; cursor:pointer; font-weight:bold; color:#888; transition:all 0.2s}
.tab-btn span {background:rgba(0,0,0,0.05); padding:2px 8px; border-radius:10px; font-size:13px; margin-left:5px; color:#666}
.tab-btn.active {color:var(--accent-color); border-bottom:3px solid var(--accent-color)}
.tab-btn.active span {background:var(--accent-color); color:#fff}
.tab-content {min-height:200px; position:relative}
.loading-overlay {display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,0.7); justify-content:center; align-items:center; z-index:10; font-size:1.5rem; color:var(--accent-color)}

/* Kontener wyszukiwarki */
.search-wrapper {position:relative; margin:0 1.5rem; flex-grow:1; max-width:400px}
.search-input-group {display:flex; align-items:center; background-color:var(--input-bg); border:1px solid var(--border-color); border-radius:20px; padding:2px 6px 2px 14px; transition:border-color 0.3s ease, box-shadow 0.3s ease}
.search-input-group:focus-within {border-color:var(--accent-color); box-shadow:0 0 0 2px rgba(72, 199, 225, 0.2)}
#search-input {width:100%; background:none; border:none; outline:none; padding:6px 0; color:var(--text-color); font-size:0.9rem}
.search-submit-btn {background:none; border:none; color:var(--text-muted); cursor:pointer; padding:6px 10px; font-size:0.95rem; transition:color 0.2s}
.search-submit-btn:hover {color:var(--accent-color)}
/* Wysuwany panel z kategoriami */
.search-dropdown {position:absolute; top:calc(100% + 8px); left:0; width:100%; background-color:var(--card-bg); border:1px solid var(--border-color); border-radius:8px; box-shadow:0 8px 25px rgba(0,0,0,0.2); padding:1rem; z-index:999; box-sizing:border-box; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;}
/* Pokazywanie panelu: gdy najedziemy na wrapper LUB gdy input jest aktywny */
.search-wrapper:hover .search-dropdown,
#search-input:focus ~ .search-dropdown,
.search-dropdown:focus-within {opacity:1; visibility:visible; transform:translateY(0)}
.search-dropdown .dropdown-label {cursor: pointer; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;}
.search-dropdown .search-dropdown-wrapper {display: flex; gap: 15px; padding: 5px 12px 12px 12px; border-bottom: 1px solid var(--border-color); margin-bottom: 8px;}

.dropdown-title {font-size:0.8rem; font-weight:bold; color:var(--text-muted); text-transform:uppercase; margin-bottom:0.6rem; border-bottom:1px solid var(--border-color); padding-bottom:0.4rem}
.categories-list {display:grid; grid-template-columns:repeat(2, 1fr); gap:0.5rem; max-height:180px; overflow-y:auto}
.category-item {display:flex; align-items:center; gap:8px; font-size:0.85rem; color:var(--text-color); cursor:pointer; padding:4px; border-radius:4px; transition:background 0.2s;}
.category-item:hover {background-color:rgba(255, 255, 255, 0.05)}
body[data-theme="light"] .category-item:hover {background-color: rgba(0, 0, 0, 0.03)}
.category-item input[type="checkbox"] {accent-color:var(--accent-color); cursor:pointer}
@media (max-width: 768px) {
    .menu-container {flex-wrap:wrap}
    .search-wrapper {order:3; max-width:100%; margin:0.75rem 0 0 0; width:100%}
}

/* STYLE DLA PANELU KOMENTARZY */
.comments-section {margin-top:4rem}
.comments-section h3 {font-size:1.5rem; margin-bottom:1.5rem; border-left:3px solid var(--accent-color); padding-left:0.75rem}
.card {background-color:var(--card-bg); border:1px solid var(--border-color); border-radius:8px; margin-bottom:1.5rem; overflow:hidden;}
.card-header {padding:0.75rem 1.25rem; border-bottom:1px solid var(--border-color); font-weight:600; display:flex; justify-content:space-between; align-items:center}
.form-group {margin-bottom:1rem; padding:0 1.25rem}
.form-group label {display:block; margin-bottom:0.4rem; color:var(--text-muted); font-size:0.9rem}
.form-control {width:100%; background-color:var(--input-bg); border:1px solid var(--input-border-color); border-radius:4px; padding:0.75rem 1rem; color:var(--text-color); font-family:inherit; box-sizing:border-box}
.show_button {padding:0.5rem 1.25rem 1.25rem 1.25rem; display:flex; align-items:center; justify-content:space-between}
.btn-submit-box {display:flex; gap:10px; justify-content:flex-end; width:100%}
.btn-comment-success {background-color:#2e7d32; color:#fff; border:none; border-radius:4px; padding:0.5rem 1.5rem; font-weight:600; cursor:pointer}
.btn-comment-danger {background-color:#c62828; color:#fff; border:none; border-radius:4px; padding:0.5rem 1.5rem; font-weight:600; cursor:pointer}
.errors {color:#ff5252; font-weight:bold; font-size:0.9rem; padding:0.5rem 1.25rem; display:block}
.success-msg {color:#69f0ae; font-weight:bold; font-size:0.9rem; padding:0.5rem 1.25rem; display:block}

/* DRZEWO KOMENTARZY */
.comment-node {background-color:var(--card-bg); border-radius:8px; border:1px solid var(--border-color); margin-bottom:1rem; overflow:hidden; box-shadow:0 2px 6px rgba(0,0,0,0.05); transition: background 0.3s ease;}
.comment-node-header {padding:0.4rem 1rem; background:rgba(0,0,0,0.15); display:flex; justify-content:space-between; align-items:center; font-size:0.85rem; border-bottom:1px solid var(--border-color)}
body[data-theme="light"] .comment-node-header {background:rgba(0,0,0,0.03)}
.comment-node-author {color:var(--accent-color); display:flex; align-items:center; gap:10px; font-weight:bold; font-size:14px}
.comment-node-date {color:var(--text-muted); font-size:12px; margin-left:auto}
.comment-node-body {padding:1rem; color:var(--text-color); font-size:14px; line-height:1.5; white-space:pre-line}
.comment-node-footer {padding:0.4rem 1rem; background:rgba(0,0,0,0.08); border-top:1px solid var(--border-color); display:flex; gap:15px; justify-content:flex-end}
body[data-theme="light"] .comment-node-footer {background:rgba(0,0,0,0.01)}
.btn-link-action {background:none; border:none; color:var(--accent-color); cursor:pointer; font-size:12px; font-weight:600; padding:0; display:inline-flex; align-items: center; gap:4px; text-decoration:none}
.btn-link-action.text-danger {color: #ff5252}
.btn-link-action:hover {opacity: 0.8}
.no-comments {text-align:center; color:var(--text-muted); padding:2rem}

/* PAGINACJA */
.pagination-container {max-width:1200px; margin:4rem auto 2rem auto; display:flex; justify-content:center; gap:0.5rem; font-size:12px; font-weight:bold}
.pagination-link {display:inline-block; padding:8px 14px; background-color:var(--card-bg); color:var(--text-color); text-decoration:none; border-radius:4px; border:1px solid var(--accent-color); cursor:pointer}
.pagination-link:hover, .pagination-link.active {background-color:var(--accent-color); color:#fff; border-color:var(--accent-color)}
body[data-theme="dark"] .pagination-link.active {color:#121212}
.pagination-link.disabled {background-color:var(--pagination-dis-bg); color:var(--pagination-dis-color); cursor:not-allowed}

.back-link {display:inline-block; color:var(--text-muted); text-decoration:none; margin-bottom:1rem; font-weight:bold; cursor:pointer}
.back-link:hover {color:var(--accent-color)}

#scrollTopBtn {display:none; position:fixed; bottom:30px; right:30px; z-index:9999; width:50px; height:50px; border:none; border-radius:50%; background:#333; color:#fff; font-size:24px; cursor:pointer; box-shadow:0 2px 10px rgba(0,0,0,0.3); transition: all 0.3s ease}
#scrollTopBtn:hover {background:#555; transform: scale(1.1)}



.btn {display:inline-block; font-weight:400; text-align:center; white-space:nowrap; vertical-align:middle; user-select:none; border:1px solid transparent; padding:0.375rem 0.75rem; font-size:1rem; line-height:1.5; border-radius:0.25rem; transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; cursor:pointer; text-decoration:none}
.btn-outline-success {color:#198754; border-color:#198754; background-color:transparent}
.btn-outline-success:hover {color:#fff; background-color:#198754; border-color:#198754}
.btn-outline-success:active {color:#fff; background-color:#157347; border-color:#146c43}
.btn-outline-success:disabled {color:#198754; background-color:transparent; opacity:0.65}
.btn-outline-danger {color:#dc3545; border-color:#dc3545; background-color:transparent}
.btn-outline-danger:hover {color:#fff; background-color:#dc3545; border-color:#dc3545}
.btn-outline-danger:active {color:#fff; background-color:#bb2d3b; border-color:#b02a37}
.btn-outline-danger:disabled {color:#dc3545; background-color:transparent; opacity:0.65}

.swal2-styled.swal2-confirm {border:1px solid #62c462 !important; background:transparent !important}
.swal2-popup {-webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; -webkit-box-shadow:8px 8px 24px 0px rgba(66, 68, 90, 1); -moz-box-shadow:8px 8px 24px 0px rgba(66, 68, 90, 1); box-shadow:8px 8px 24px 0px rgba(66, 68, 90, 1)}
.swal2-popup { background:var(--bg-color) !important; color:var(--text-color) !important}
.customClassDelete {border:8px solid #CE0606 !important}
.customClassDelete .swal2-warning {font-size:11px; border-color:#ff2727 !important; color:#ff2727 !important}
body[data-theme="dark"] .customClassDelete .swal2-title {font-size:19px; color:#fff !important}
body[data-theme="light"] .customClassDelete .swal2-title {font-size:19px; color:#000 !important}
body[data-theme="dark"] .customClassSuccess {background:#23272C !important; color:#fff !important}
body[data-theme="light"] .customClassSuccess {background:#fff5d8 !important; color:#000 !important}
body[data-theme="dark"] .customClassErrors {background:#23272C !important; color:#fff !important}
body[data-theme="light"] .customClassErrors {background:#fff5d8 !important; color:#000 !important}

.container_ban{position:fixed;z-index:999999999999;top:0px;width:100%;height:100%;border:5px solid red}
.container_info_ban{width:100%;height:100%;background:linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3))}
.box_info_ban{position:fixed;top:30px;margin-left:auto;margin-right:auto;width:100%;margin-top:30px;text-align:center;padding:10px;z-index:9999999999}
.counterban{padding-top:10px}
.infoban{padding-top:5px;padding-bottom:5px}
.time_info_ban{font-size:16px;color:#ffffff;background:#de0c17;margin-left:auto;margin-right:auto;width:50%;border-radius:5px;clear:both;margin-top:20px}
.counterban{padding-bottom:10px}
@media (max-width: 768.98px){.time_info_ban {width:100%}}

/* PASEK COOKIES */
.cookie-banner {position:fixed;bottom:0;left:0;width:100%;background-color:var(--card-bg); color:var(--text-color); box-shadow:0 -4px 20px rgba(0, 0, 0, 0.15); z-index:99999; padding:1.2rem 2rem; box-sizing:border-box; border-top:1px solid var(--border-color); transform:translateY(100%); transition:transform 0.5s cubic-bezier(0.25, 1, 0.5, 1)}
.cookie-banner.show {transform:translateY(0)}
.cookie-content {max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:1.5rem}
.cookie-icon {font-size:1.8rem; color:var(--accent-color)}
.cookie-content p {margin:0; font-size:15px; line-height:1.5; flex:1}
.cookie-btn {background-color:var(--accent-color); color:#fff; border:none; padding:0.6rem 1.5rem; font-size:13px; font-weight:bold; border-radius:4px; cursor:pointer; white-space:nowrap; transition:background-color 0.2s ease, transform 0.1s ease; text-decoration:none}
.cookie-btn:hover {opacity:0.9}
.cookie-btn:active {transform:scale(0.98)}
@media (max-width: 768px) {.cookie-content {flex-direction:column; text-align:center; gap:1rem} .cookie-banner {padding:1.5rem} .cookie-btn {width:100%}}


.site-footer {background-color:#1a1a1a; color:#e0e0e0; padding:60px 20px 20px 20px; font-family:system-ui, -apple-system, sans-serif; font-size:15px; clear:both; margin-top:40px}
.footer-container {max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px}
.footer-column {flex: 1 1 200px}
.footer-column h3, .footer-column h4 {color:#ffffff; margin-top:0; margin-bottom:20px}
.footer-column h3 {font-size:24px}
.footer-column h4 {font-size:16px; text-transform:uppercase; letter-spacing:1px}
.footer-column p {line-height:1.6; color:#a0a0a0}
.footer-column ul {list-style:none; padding:0; margin:0}
.footer-column ul li {margin-bottom:12px}
.footer-column ul li a {color:#a0a0a0; text-decoration:none; transition:color 0.2s ease}
.footer-column ul li a:hover {color:#f5e3a9}
.social-icons {display:flex; gap:15px; margin-top:20px}
.social-icons a {color:#ffffff; text-decoration:none; font-size:18px; opacity:0.7; transition:opacity 0.2s;}
.social-icons a:hover {opacity:1}
.newsletter-form {display:flex; margin-top:15px}
.newsletter-form input {flex:1; padding:10px 15px; border:1px solid #333; border-radius:4px 0 0 4px; background-color:#262626; color:#fff; font-size:14px}
.newsletter-form button {background-color:#dab744; color:#1a1a1a; border:none; padding:10px 20px; border-radius:0 4px 4px 0; font-weight:bold; cursor:pointer; transition:background-color 0.2s;}
.newsletter-form button:hover {background-color:#f5e3a9}
.footer-bottom {
  max-width:1200px;
  margin:40px auto 0 auto;
  padding-top:20px;
  border-top:1px solid #333;
  text-align:center;
  font-size:13px;
  color:#9B9B9B;
}
.footer-bottom a {color:#C4C4C4; text-decoration:none; transition:color 0.2s ease}
.footer-bottom a:hover {color:#f5e3a9}

/* Responsive grid optimization for narrow viewports */
@media (max-width: 768px) {
  .footer-container {
    flex-direction: column;
    gap: 30px;
  }
}



@media (max-width: 767.8px) {
	.banner-container {
		height:220px !important;
	}
}
@media (max-width: 768px) {
	.banner-container {
		height:auto !important;
      aspect-ratio: 16 / 9 !important;
	}
   .top-menu {
   	position:relative;
	}
	.menu-container {
		height:70px !important;
      padding:0 15px !important;
      display:flex !important;
      align-items:center !important;
      justify-content:space-between !important;
	}
   .hide-mobile, .dropdown-trigger-text {/* Ukrywamy klasyczne menu tekstowe i napis MENU na przycisku */
   	display:none !important;
	}
   .show-mobile-only {
   	display:flex !important;
	}
   .menu-actions-right {
   	gap:8px !important;
	}
   .user-menu-btn {
   	padding:8px 10px !important;
	}
   .search-wrapper {
   	position:absolute !important;
      top:70px !important;
      left:0 !important;
      width:100% !important;
      max-width:100% !important;
      margin:0 !important;
      padding:10px 15px !important;
      background-color:var(--menu-bg) !important;
      border-bottom:1px solid var(--border-color) !important;
      box-shadow:0 4px 12px rgba(0,0,0,0.15) !important;
      z-index:998 !important;
      transform:translateY(-20px) !important;
      opacity:0 !important;
      visibility:hidden !important;
      transition:transform 0.3s ease, opacity 0.3s ease, visibility 0.3s !important;
	}
   .search-wrapper.open {
   	transform:translateY(0) !important;
      opacity:1 !important;
      visibility:visible !important;
	}
   .search-input-group {
   	background:var(--card-bg) !important;
      color:var(--text-color) !important;
      width:100% !important;
      border:1px solid var(--border-color) !important;
   }
   .search-dropdown {
   	width:calc(100% - 30px) !important;
      left:15px !important;
   }
   .user-dropdown-menu {
   	position:fixed !important;
      top:0 !important;
      right: -100% !important;
      width:280px !important;
      /*   height: 100vh !important; */
      max-height:100vh !important;
      margin:0 !important;
      border-radius:0 !important;
      border:none !important;
      border-left:1px solid var(--border-color) !important;
      z-index:999999 !important;
      box-shadow: -5px 0 25px rgba(0,0,0,0.3) !important;
      display:block !important;
      opacity:0;
      visibility:hidden;
      transition:right 0.4s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.3s ease, visibility 0.3s !important;
      overflow-y:auto;
      padding-bottom:10px;
   }
   .user-dropdown-menu.show {
   	right:0 !important;
      opacity:1 !important;
      visibility:visible !important;
   }
   .dropdown-item {
   	padding:14px 20px !important;
      font-size:15px !important;
	}

   .dropdown-user-info {
   	padding:20px !important;
      background:rgba(0,0,0,0.05);
	}
}
@media (max-width: 480px) {
	.gallery-grid {
   	column-count: 1 !important;
   }
   .header-title h1 {
   	font-size:16px !important;
      padding:0 10px;
	}
}


