/* Sleek Horizontal Banner Styles */
    .rct-weather-banner {
        width: 100%;
        background: #1a1e24; /* Change to match your site's dark mode or nav background */
        color: #f3f4f6;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        font-size: 0.85rem;
        padding: 8px 16px;
        box-sizing: border-box;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        overflow: hidden;
    }

    .rct-weather-container {
        max-width: 1200px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 12px;
    }

    .rct-badge {
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #38bdf8; /* Highlight colour for RCT */
    }

    .rct-divider {
        color: rgba(255, 255, 255, 0.2);
    }

    .rct-text {
        font-weight: 500;
        color: #e5e7eb;
    }

    .rct-temp {
        font-weight: 700;
        color: #fbbf24; /* Warm yellow/amber tone for temps */
    }

    .rct-detail {
        color: #9ca3af;
    }

    .rct-detail strong {
        color: #e5e7eb;
    }

    /* Keep it clean and readable on small mobile screens */
@media (max-width: 600px) {
    .rct-weather-container {
        justify-content: center;
        gap: 8px;
    }

    .rct-divider {
        display: none;
    }

    .rct-detail {
        display: inline;
    }

    /* Hide only humidity on small screens */
    .rct-detail:nth-of-type(2) {
        display: none;
    }
}