/* Updated styles: removed heading display, added both navs and ensured visibility on mobile */

/* Keep wrapper padding */
.sps-wrapper {
    position: relative;
    padding: 30px 0;
    background: transparent;
}

/* Heading removed (if still present by theme) hide */
.sps-heading { display: none !important; }

/* Slide spacing */
.sps-slider .sps-slide {
    padding: 0 18px;
    box-sizing: border-box;
}
.sps-image-wrap {
    display: block;
    background: #f7f7f7;
    border: 1px solid #eee;
    overflow: hidden;
}
.sps-image-wrap img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block;
}
.sps-body {
    padding: 18px 0;
}
.sps-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.sps-title {
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    color: #222;
}
.sps-title a { color: inherit; text-decoration: none; }
.sps-price {
    text-align: right;
    font-size: 15px;
    color: #777;
}
.sps-price strong {
    color: #a87c00; /* gold-ish */
    font-weight: 700;
}
.sps-location {
    margin-top: 8px;
    color: #666;
    font-size: 14px;
}
.sps-meta-row {
    margin-top: 12px;
    display: flex;
    gap: 14px;
    color: #555;
    font-size: 13px;
}

/* Custom navigation buttons (both sides) */
.sps-prev-arrow,
.sps-next-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #c9a52f;
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 4px;
    cursor: pointer;
    z-index: 20;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.sps-prev-arrow { left: 16px; }
.sps-next-arrow { right: 16px; }

.sps-prev-arrow:focus,
.sps-next-arrow:focus { outline: none; }

/* Remove slick default arrows if any */
.sps-slider .slick-arrow { display: none !important; }

/* Slight negative margin so slides align nicely */
.slick-list { margin: 0 -8px; }
.slick-slide { padding: 0 8px; }

/* Responsive sizes */
@media (max-width: 1200px) {
    .sps-image-wrap img { height: 280px; }
}
@media (max-width: 768px) {
    .sps-image-wrap img { height: 200px; }
    .sps-title { font-size: 16px; }
    /* Make nav buttons slightly smaller on mobile */
    .sps-prev-arrow, .sps-next-arrow { width: 40px; height: 40px; font-size: 20px; }
}
@media (max-width: 480px) {
    .sps-image-wrap img { height: 160px; }
    .sps-prev-arrow, .sps-next-arrow { width: 36px; height: 36px; font-size: 18px; }
}