/*
Theme Name: Blocksy Child
Theme URI: https://example.local/
Description: Minimal child theme for Blocksy — safe customizations.
Author: GitHub Copilot
Template: blocksy
Version: 1.0.0
Text Domain: blocksy-child
*/

/* Add your custom CSS below */

/* --------------------------------------------------
   Homepage carousel styles — green palette
   Targets Blocksy 'flexy' carousel to match theme colors
   -------------------------------------------------- */
body.home .flexy {
    position: relative;
    z-index: 0;
}

body.home .flexy .flexy-item {
    position: relative;
    overflow: hidden;
}

/* subtle green overlay on each slide for legibility */
body.home .flexy .flexy-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(43,138,62,0.22), rgba(43,138,62,0.36));
    pointer-events: none;
    z-index: 1;
}

/* captions and content should sit above overlay */
body.home .flexy .ct-slide .ct-content,
body.home .flexy .ct-caption {
    position: relative;
    z-index: 2;
    color: #fff;
    text-shadow: 0 6px 18px rgba(0,0,0,0.45);
}

/* caption box for better contrast */
body.home .flexy .ct-slide .ct-content {
    background: linear-gradient(180deg, rgba(0,0,0,0.28), rgba(0,0,0,0.12));
    padding: 20px;
    border-radius: 10px;
    max-width: 760px;
}

/* buttons inside carousel */
body.home .flexy .ct-button,
body.home .flexy a.ct-button,
body.home .flexy .ct-btn {
    background: var(--theme-button-background-initial-color, #2b8a3e) !important;
    color: var(--theme-button-text-initial-color, #ffffff) !important;
    padding: 10px 18px !important;
    border-radius: 6px !important;
    box-shadow: 0 10px 30px rgba(43,138,62,0.15) !important;
    border: none !important;
    transition: transform .15s ease, background .12s ease !important;
}
body.home .flexy .ct-button:hover,
body.home .flexy a.ct-button:hover,
body.home .flexy .ct-btn:hover {
    background: var(--theme-button-background-hover-color, #1d6b2c) !important;
    transform: translateY(-3px);
}

/* navigation arrows */
body.home .flexy .flexy-arrow {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--theme-palette-color-1, #2b8a3e);
    color: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: 0 12px 40px rgba(43,138,62,0.18);
    border: none;
    z-index: 3;
    transition: transform .18s ease, background .12s ease;
}
body.home .flexy .flexy-arrow:hover {
    background: var(--theme-palette-color-2, #1d6b2c);
    transform: translateY(-4px);
}

/* pagination dots / pills */
body.home .flexy .flexy-pills ol li button {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background: var(--theme-palette-color-3, #66b56a);
    opacity: 0.6;
    border: none;
    transition: transform .12s ease, opacity .12s ease;
}
body.home .flexy .flexy-pills ol li.ct-active button,
body.home .flexy .flexy-pills ol li button:focus {
    opacity: 1;
    transform: scale(1.25);
    box-shadow: 0 6px 18px rgba(43,138,62,0.22);
}

/* responsive tweaks */
@media (max-width: 689.98px) {
    body.home .flexy .ct-slide .ct-content {
        padding: 14px;
        border-radius: 8px;
        max-width: calc(100% - 30px);
        margin: 0 auto;
    }
    body.home .flexy .flexy-arrow {
        width: 40px;
        height: 40px;
    }
}

/* small visual polish */
body.home .flexy .flexy-item img,
body.home .flexy .flexy-item picture,
body.home .flexy .flexy-item video {
    display: block;
    width: 100%;
    height: auto;
}

/* Optional: align caption bottom-left on large screens */
@media (min-width: 990px) {
    body.home .flexy .ct-slide .ct-content { margin-left: 6%; margin-bottom: 6%; }
}

/* End carousel styles */