/**
 * 2012 - 2024 HiPresta
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License 3.0 (AFL-3.0).
 * It is also available through the world-wide-web at this URL: https://opensource.org/licenses/AFL-3.0
 *
 * @author    HiPresta <support@hipresta.com>
 * @copyright HiPresta 2024
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0
 *
 * @website   https://hipresta.com
 *
 * Styles for the built-in lightweight slider (replaces FlexSlider).
 */

/* ---- List reset (previously provided by flexslider.css) ---- */
.hi-blog-post-slider .hiblog-slides,
.hi-blog-slider .hiblog-slides {
    margin: 0;
    padding: 0;
    list-style: none;
}
.hi-blog-post-slider .hiblog-slides img,
.hi-blog-slider .hiblog-slides img {
    display: block;
    max-width: 100%;
}

/* ---- Root / viewport ---- */
.hi-blog-post-slider,
.hi-blog-slider {
    position: relative;
}
.hiblog-slider__viewport {
    position: relative;
    overflow: hidden;
}

/* ---- Pre-init fallback: only show the first slide until JS runs ---- */
.hi-blog-post-slider:not(.hiblog-slider) .hiblog-slides > li ~ li,
.hi-blog-slider:not(.hiblog-slider) .hiblog-slides > li ~ li {
    display: none;
}

/* ---- Fade mode (post image galleries) ---- */
.hiblog-slider--fade .hiblog-slides {
    position: relative;
}
/* position uses !important to win over the ID-scoped `.hiblog-slides > li { position: relative }`
   rules in blogpost.css / blogposition.css, otherwise inactive slides stay in flow and stack. */
.hiblog-slider--fade .hiblog-slides > li {
    display: block;
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease;
}
.hiblog-slider--fade .hiblog-slides > li.is-active {
    position: relative !important;
    opacity: 1;
    visibility: visible;
    z-index: 1;
}

/* ---- Slide mode (blog hero) ---- */
.hiblog-slider--slide .hiblog-slides {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.6s ease;
    will-change: transform;
}
.hiblog-slider--slide .hiblog-slides > li {
    flex: 0 0 100%;
    max-width: 100%;
    min-width: 0;
}

/* ---- Navigation arrows (reuse module chevron icons) ---- */
.hiblog-slider__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    color: #222;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    transition: opacity 0.3s ease, background 0.2s ease, color 0.2s ease;
}
.hiblog-slider__nav svg {
    width: 1em;
    height: 1em;
    display: block;
}
.hiblog-slider__nav--prev {
    left: 10px;
}
.hiblog-slider__nav--next {
    right: 10px;
}
.hiblog-slider:hover .hiblog-slider__nav {
    opacity: 0.85;
}
.hiblog-slider .hiblog-slider__nav:hover {
    opacity: 1;
    background: #fff;
    color: var(--hiblog-c-accent, #2563eb);
}
.hiblog-slider__nav:focus {
    outline: 0;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.5);
}

/* Touch/smaller screens: keep arrows visible (parity with old behavior). */
@media screen and (max-width: 860px) {
    .hiblog-slider .hiblog-slider__nav {
        opacity: 0.9;
    }
}