/*
Theme Name: Dinamo Batumi
Theme URI: https://dinamobatumi.com
Description: Pixel-identical WordPress port of the FC Dinamo Batumi Joomla (Helix3 shaper_finance) site.
Author: migration
Version: 1.0
Text Domain: dinamo
*/
/* All visual styling is delivered by the ported Helix3 stylesheets enqueued in functions.php.
   This file only carries the required WordPress theme header plus a few WP-specific glue rules. */

/* Header color rules Helix3 generated inline from template params */
#sp-top-bar { background-color: #ffffff; color: #a3a3a3; }
#sp-logo-wrapper { color: #ffffff; }
/* The template hides the default logo on hi-DPI/retina screens (i.e. every phone)
   in favour of a separate retina logo we don't ship — force it to always show. */
#sp-logo-wrapper .sp-default-logo { display: inline-block !important; }
#sp-logo-wrapper .sp-retina-logo { display: none !important; }

/* Page background (matches original body.site fon.jpg) */
body.site {
    background-image: url('/images/fon.jpg');
    background-repeat: repeat;
    background-size: inherit;
    background-attachment: inherit;
    background-position: 50% 0;
}

/* Article/page content card sits on the fon.jpg background (matches original) */
body.site #sp-main-body .blog-details-content-wrap {
    background: #fff;
    box-shadow: 0 0 5px rgba(0,0,0,0.12);
}
#sp-main-body { padding: 25px 0 40px; }

/* content wrapper: block (original uses display:table which collapses grids) */
body.site #sp-main-body .blog-details-content-wrap { display:block; }

/* Hero slider: caption overlay + read-more button + nav arrows */
#slides .slide-link { display: block; position: relative; width: 100%; height: 100%; }
#slides .slide-link img { width: 100%; height: 100%; object-fit: cover; display: block; }
#slides .slide-caption {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 70px 30px 24px; text-align: left;
    background: linear-gradient(to top, rgba(10,24,66,.94), rgba(10,24,66,.5) 55%, rgba(10,24,66,0));
    color: #fff;
}
#slides .slide-caption .slide_title {
    display: block; font-size: 23px; line-height: 1.35; font-weight: 700; margin-bottom: 14px;
    text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
#slides .slide-more {
    display: inline-block; background: #1b57b0; color: #fff; padding: 9px 22px; border-radius: 3px;
    font-weight: 600; font-size: 14px; transition: background .2s, transform .2s;
}
#slides .slide-link:hover .slide-more { background: #123f86; transform: translateX(3px); }
#slides .slide-more .fa { margin-left: 6px; }
/* nav arrows */
#slides .slide-arrow {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
    width: 42px; height: 42px; border: none; border-radius: 50%; cursor: pointer;
    background: rgba(0,0,0,.4); color: #fff; font-size: 22px; line-height: 42px; text-align: center;
    transition: background .2s;
}
#slides .slide-arrow:hover { background: #1b57b0; }
#slides .slide-prev { left: 14px; }
#slides .slide-next { right: 14px; }

/* Team roster grid */
.roster-pos { color:#21418a; border-bottom:2px solid #eee; padding-bottom:8px; margin:25px 0 18px; font-size:20px; }
.roster-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:18px; margin-bottom:10px; }
.player-card { background:#fff; border:1px solid #eee; border-radius:4px; overflow:hidden; text-align:center; transition:box-shadow .2s; }
.player-card:hover { box-shadow:0 4px 14px rgba(0,0,0,.12); }
.player-photo img { width:100%; height:220px; object-fit:cover; display:block; }
.player-name { padding:10px 8px; font-weight:600; color:#222; font-size:15px; }

/* ===================== Responsive ===================== */
@media (max-width: 991px) {
    html, body { overflow-x: hidden; }
    /* show hamburger, turn megamenu into a toggled drawer */
    #offcanvas-toggler.visible-sm, #offcanvas-toggler.visible-xs { display: inline-block !important; font-size: 24px; color: #fff; padding: 8px 12px; }
    #sp-logo-wrapper { position: relative; }
    /* On mobile, drop the skewed white pseudo-shapes (they can cover the logo on iOS)
       and give the logo a plain, guaranteed white bar. */
    #sp-logo .logo_bg::before, #sp-logo .logo_bg::after { display: none !important; }
    #sp-logo, #sp-logo .sp-column.logo_bg { background: #fff !important; }
    #sp-logo .logo { position: relative; z-index: 3; padding: 6px 0; }
    #sp-logo .logo img { max-width: 210px; }
    .sp-megamenu-parent.hidden-sm.hidden-xs { display: none; }
    body.nav-open .sp-megamenu-parent {
        display: block !important; position: absolute; left: 0; right: 0; top: 100%;
        background: #21418a; z-index: 1000; padding: 6px 0; box-shadow: 0 8px 18px rgba(0,0,0,.25);
    }
    body.nav-open .sp-megamenu-parent > .sp-menu-item { display: block; width: 100%; float: none; border-top: 1px solid rgba(255,255,255,.08); }
    body.nav-open .sp-megamenu-parent > .sp-menu-item > a { display: block; padding: 12px 18px; color: #fff; }
    body.nav-open .sp-megamenu-parent .sp-dropdown,
    body.nav-open .sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
        position: static !important; width: 100% !important; display: block; box-shadow: none !important;
        background: #17306b !important; padding: 0 !important; border: none !important;
    }
    body.nav-open .sp-megamenu-parent .sp-dropdown-items .sp-menu-item a {
        color: #dbe6ff !important; padding: 11px 42px !important; display: block;
    }
    body.nav-open .sp-megamenu-parent .sp-dropdown-items .sp-menu-item a:hover {
        background: rgba(255,255,255,.08); color: #fff !important;
    }
}
@media (max-width: 767px) {
    /* hero: drop the fixed-width image panel, show the navigator as a full-width news list */
    #YJT_container { width: 100% !important; height: auto !important; }
    #slides { display: none !important; }
    #navigator_outer { width: 100% !important; height: auto !important; position: static !important; float: none !important; }
    #navigator { width: 100% !important; }
    #navigator .element { width: 100% !important; float: none !important; height: auto !important; }
    #navigator .element .inner { width: 100% !important; }
    /* header + sidebar */
    #sp-logo .logo img { max-width: 190px; height: auto; }
    #sp-top2 .customsocial { text-align: center; }
    #sp-page-title .sp-page-title { padding: 40px 0; }
    #sp-page-title h2 { font-size: 30px; }
    .blog-details-content-wrap .item .image { float: none !important; width: 100% !important; margin: 0 0 10px; }
    .blog-details-content-wrap .item .image img { width: 100%; height: auto; }
}

/* WP alignment / caption helpers so migrated post content behaves */
.alignleft{float:left;margin:0 15px 10px 0}
.alignright{float:right;margin:0 0 10px 15px}
.aligncenter{display:block;margin:0 auto 10px}
.wp-caption{max-width:100%}
.sp-column img{max-width:100%;height:auto}
#sp-component img{max-width:100%;height:auto}