/* ===================================================================
   Carousel base — theme 0002
   Controls caption defaults and arrow navigation for Bootstrap 3
   carousels. Section-specific overrides live in 02-home.css.
=================================================================== */

/* ---- Caption defaults ---- */
.carousel-caption {
    text-align: left;
    padding: 10px 14px;
}
.carousel-caption p  { margin: 0 0 4px; }
.carousel-caption h4 { margin: 0 0 4px; }

/* ---- Prev / Next arrow controls ---- */
.carousel-control {
    width: 48px;
    background: none !important;
    opacity: 1;
    transition: opacity .2s;
}
.carousel-control:hover,
.carousel-control:focus {
    opacity: .8;
}
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
    width: 36px;
    height: 36px;
    line-height: 36px;
    font-size: 16px;
    background: rgba(0, 0, 0, .45);
    border-radius: 50%;
    text-shadow: none;
    margin-top: -18px;  /* vertically center — half of height */
    margin-left: -18px;
}
.carousel-control.left  .glyphicon-chevron-left  { margin-left: 6px; }
.carousel-control.right .glyphicon-chevron-right { margin-right: 6px; }

/* ---- Hide arrows on very small screens ---- */
@media (max-width: 520px) {
    .carousel-control { display: none; }
}

/* ---- Hide-arrows utility (set via backoffice toggle) ---- */
.hide-arrows .carousel-control { display: none !important; }