/* ========================================================================
   Zoja customizations — loaded after elengine base styles
   Portované zo starého elengine 1.7 style.min.css (zoja 3.13 produkcia)
   ======================================================================== */

/* === 1. Brand farby ===
   Korálovočervená #fc655f namiesto purpurovej #743CFD */
:root {
    --main-link: #fc655f;
    --main-btn: #fc655f;
    --plyr-color-main: #fc655f;
}

/* === 2. Self-hosted Roboto fonty (cdn.zoja.sk) — GDPR-friendly === */
@font-face {
    font-family: 'Roboto'; font-style: normal; font-weight: 300;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-300.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-300.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: italic; font-weight: 300;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-300italic.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-300italic.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: normal; font-weight: 400;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-regular.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-regular.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: italic; font-weight: 400;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-italic.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-italic.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: normal; font-weight: 500;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-500.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-500.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: italic; font-weight: 500;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-500italic.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-500italic.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: normal; font-weight: 700;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-700.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-700.woff') format('woff');
}
@font-face {
    font-family: 'Roboto'; font-style: italic; font-weight: 700;
    src: local(''),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-700italic.woff2') format('woff2'),
         url('https://cdn.zoja.sk/fonts/roboto-v30-latin-ext_latin-700italic.woff') format('woff');
}

/* === 3. Linky === */
a { color: var(--body-color); }
a:hover { text-decoration: underline; }
body.night-mode a { color: #aad2ef; }
body.night-mode a:hover { text-decoration: underline; }

/* === 4. Border-radius globálne 10px (namiesto 12px) === */
.ele_content,
.payment-plan,
.post,
.forum-breadcrumb,
.ele_forum_section,
.ele_forum_section .sub_forum,
.ele_forum_stats,
.ele_forum_threads,
.forum-thread,
.forum-result,
.directory-card,
.btn_send_gift,
.ele_events_list .img img,
.ele_create_state,
.tag_page_rate,
.side-nav > li.active > a {
    border-radius: 10px;
}
.ele_paid_post:before { border-radius: 10px; }
.ele_scroll::-webkit-scrollbar-thumb { border-radius: 10px; }
.ele_movie_scroll::-webkit-scrollbar-thumb { border-radius: 10px; }

/* Cover wrappery a product images: 10px 12px 0 0 */
.profile-header.group .profile-cover-wrapper,
.profile-header.group .profile-cover-wrapper img,
.product-image img {
    border-radius: 10px 12px 0 0;
}

/* === Profile / Page cover height — proporcne k wider container ===
   Pri zväčšení container width (memory: feedback_wider_container) bol pôvodný
   cover (~360px) opticky príliš nízky. Zvýšime na 440px (desktop) / 280px (mobile)
   a force-použijeme object-fit:cover + object-position:center na image
   (default `js_position-cover-full` má width:100%/height:auto → presahuje
   wrapper pri vyšším). Tento override platí pre profile, page aj group covers. */
.profile-cover-wrapper {
    height: 480px;
}
.profile-cover-wrapper img,
.profile-cover-wrapper img.js_position-cover-cropped,
.profile-cover-wrapper img.js_position-cover-full {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
}
@media (max-width: 991px) {
    .profile-cover-wrapper { height: 360px; }
}
@media (max-width: 575px) {
    .profile-cover-wrapper { height: 250px; }
}

/* === 5. Navbar a header rozmery === */
.ele_navbar_top { height: 62px; }
.ele_hdr_droptoggle svg { width: 32px; height: 32px; }

/* === 6. Skryté prvky === */
.ele_prem { display: none; }
.pro-badge { display: none; }

/* === 6a. Sidebar aktívna položka + blog/sekcia headers — tlmená sivá ===
   Default elengine farbí všetky aktívne stavy a sekciové nadpisy brand farbou
   (kríková coral pilulka v sidebari, korálové h1/h2 v blog/forum/event detail
   stránkach). Pre Zoja chceme decentnú sivú — brand sa prejaví len v reálnych
   tlačidlách a linkách, nie v každom nadpise. (Pôvodne v sngine 3.13 bolo
   takto, 4.3 default je príliš pestrý.)

   "Trochu menej sedy" tone: #2d3439 v light mode — tmavšia ako default
   --body-color (#52595f), čistá ale stále nie čierna; v night mode #d8dde0. */
.ele_sidebar_left .sidebar_innr > .btn.active,
.side-nav > li.active > a,
.ele_blog_h h1, .ele_blog_h h2,
.ele_read_blog_content > h1,
.page-header h1,
.section-header h1, .section-header h2,
.ele_section_h h1, .ele_section_h h2 {
    color: #2d3439;
}
body.night-mode .ele_sidebar_left .sidebar_innr > .btn.active,
body.night-mode .side-nav > li.active > a,
body.night-mode .ele_blog_h h1, body.night-mode .ele_blog_h h2,
body.night-mode .ele_read_blog_content > h1,
body.night-mode .page-header h1,
body.night-mode .section-header h1, body.night-mode .section-header h2,
body.night-mode .ele_section_h h1, body.night-mode .ele_section_h h2 {
    color: #d8dde0;
}

/* === 6b. Topbar header — jemne sivá namiesto sterilnej bielej === */
.ele_navbar_top { background: #f7f7f7; }
body.night-mode .ele_navbar_top { background: #1a1a1a; }

/* === 7. Daytime greeting — všetky 3 fázy v brand farbe === */
.daytime_message.morning h3,
.daytime_message.noon h3,
.daytime_message.evening h3 {
    color: #fc655f;
}

/* === 8. Reactions a typografia === */
.reaction-btn .reaction-btn-name { text-transform: none; }

/* === 9. Ads — väčšie písmo === */
.ads-title { font-size: 18px; }
.ads-descrition { font-size: 14px; }
.card-body.js_ads-click-campaign { padding: 0px 0px 5px 0px; }
.card-body.js_ads-click-campaign img { width: 100%; }

/* === 10. Page wrapper farby === */
.pg_wrapper a { background-color: #ffffff; }
body.night-mode .pg_wrapper a { background-color: #212121; }
.pg_1x img { max-height: 770px; }

/* === 11. Typeahead === */
.typeahead { padding-left: 15px; }

/* === 12. Brand orámovanie tlačidiel (was #ffa412) === */
.payment-plan.active,
.payment-plan:hover {
    box-shadow: inset 0 0px 0px 1px #fc655f, 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px 0 rgb(0 0 0 / 6%);
    border: 1px solid #fc655f;
    color: #fc655f;
}

/* === 13. Tlmený text — tmavšia šedá === */
.text-muted-custom { color: #585858; }

/* === 14. Reels offsety === */
.reels-wrapper { bottom: 45px; }
.reel-container { padding-bottom: 45px; }
.reel-video-wrapper .reel-video-container .plyr--video { height: calc(100dvh - 101px); }
.reel-comments-wrapper .lightbox-post { height: calc(100% - 45px); }

/* === 15. Vlastné — z pôvodného „/*Pridané*/" bloku === */
.mt-n1, .my-n1 { font-size: 1.8rem !important; }

/* Širší stredný stĺpec (newsfeed) progresívne podľa rozlíšenia.
   Default elengine 1050px je úzky — využijeme priestor na FullHD+ monitoroch.
   Profile widget (.ele_prof_cont_wide) ostáva 1326px nedotknutý. */
@media (min-width: 1200px) {
    body .container { max-width: 1140px; }
}
@media (min-width: 1400px) {
    body .container { max-width: 1240px; }
}
@media (min-width: 1600px) {
    body .container { max-width: 1300px; }
}
@media (min-width: 1800px) {
    body .container { max-width: 1360px; }
}

/* === 16. Mobile (max-width 768px) === */
@media (max-width: 768px) {
    .ele_navbar_top_right {
        height: 55px;
    }
    .mt-n1, .my-n1 { font-size: 1.45rem !important; }
}

/* === 17. Blog content — `.intro` lead odstavec krotší ===
   (Pôvodný override z v1.1.0 patchu, ponechaný.) */
.blog-content p.intro,
.blog-content .intro,
.ele_read_blog_content p.intro,
.ele_read_blog_content .intro,
.post-text p.intro,
.post-text .intro {
    font-size: 1.15rem;
    line-height: 1.6;
    font-weight: 500;
    color: inherit;
    margin-bottom: 1em;
    letter-spacing: normal;
}

/* === 18. SVG logo dimensions + rounded corners ===
   SVG logá nemajú intrinsic veľkosť, bez explicit CSS sa renderujú s 0×0.
   Border-radius je aj na .logo-wrapper (s !important) lebo pri transparentnom
   SVG by zaoblenie len IMG-u nebolo vizuálne viditeľné — wrapper má
   overflow:hidden v elengine style.min.css:618, takže clipne IMG bez ohľadu
   na obsah SVG, vrátane mobilu. */
.logo-wrapper img.logo-light,
.logo-wrapper img.logo-dark {
    width: 150px !important;
    height: 40px !important;
}
.main-header .logo-wrapper,
.ele_welcome_top .logo-wrapper {
    border-radius: 20px !important;
}
.main-header .logo-wrapper img, .ele_welcome_top .logo-wrapper img {
    height: 40px;
    border-radius: 20px;
}

/* === 19. Trial countdown banner ===
   Persistent top-bar on every page when user_subscription_source='trial'.
   Uses .top-bar slot from sngine elengine for consistent layout. */
.zoja-trial-bar {
    background: linear-gradient(90deg, #d97706 0%, #ea580c 100%);
    color: #fff;
    padding: 16px 0;
    font-size: 14px;
    border-bottom: 2px solid rgba(0,0,0,0.1);
    min-height: 72px;
    display: flex;
    align-items: center;
}
.zoja-trial-bar > .container {
    width: 100%;
}
.zoja-trial-bar .row {
    width: 100%;
    margin: 0;
}
.zoja-trial-bar a.btn-light {
    background: #fff;
    color: #c2410c;
    font-weight: 600;
    border: none;
}
.zoja-trial-bar a.btn-light:hover {
    background: #fef3c7;
    color: #92400e;
}
.zoja-trial-bar-urgent {
    background: linear-gradient(90deg, #dc2626 0%, #b91c1c 100%);
    animation: zoja-trial-pulse 2s ease-in-out infinite;
}
@keyframes zoja-trial-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.92; }
}
@media (max-width: 575px) {
    .zoja-trial-bar { padding: 12px 0; font-size: 13px; min-height: 0; display: block; }
    .zoja-trial-bar .btn-sm { width: 100%; }
}

/* Trial banner dismiss button */
.zoja-trial-bar .zoja-trial-dismiss {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.4);
    color: #fff;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    opacity: 0.85;
    transition: opacity 0.15s, background 0.15s;
}
.zoja-trial-bar .zoja-trial-dismiss:hover {
    opacity: 1;
    background: rgba(255,255,255,0.15);
}
@media (max-width: 575px) {
    .zoja-trial-bar .zoja-trial-dismiss { width: 24px; height: 24px; font-size: 11px; }
}
