/* Scam alert banner — sits above the fixed header on every frontend layout.
 * --scam-h is kept in sync with the banner's real height by scam-alert.blade.php
 * (it wraps to 2-3 lines on small screens) and is set to 0px once dismissed. */
:root {
    --scam-h: 84px;
}

.scam-alert {
    background: #FFC20E;
    color: #1a1a1a;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1060;
}

/* Static block that reserves the banner's height at the top of the document,
 * so page content (which clears the fixed header via its own margin-top) is
 * pushed down without having to touch every per-page clearance rule. */
.scam-alert-spacer {
    height: var(--scam-h);
}

/*
 * .pre-header, .top-header and .navbar are all position:fixed (pinned to the
 * viewport), so they have to be shifted down by the banner height themselves.
 * The -in variants are the India layout, which has no .pre-header.
 */
.pre-header {
    top: var(--scam-h);
}

.top-header {
    top: calc(65px + var(--scam-h));
}

.top-header-in.top-header {
    top: calc(-3px + var(--scam-h));
}

.navbar,
.navbar.sticky {
    top: calc(110px + var(--scam-h));
}

.navbar-in.navbar,
.navbar-in.navbar.sticky {
    top: calc(42px + var(--scam-h));
}

/* Blog sidebar sticks just below the header */
.sticky-block {
    top: calc(110px + var(--scam-h));
}

.scam-alert.is-flashing .scam-alert-text {
    animation: boxman-scam-flash 1s ease-in-out 3;
}

.scam-alert.is-hidden {
    display: none;
}

.scam-alert-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    position: relative;
}

.scam-alert-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.scam-alert-text {
    margin: 0;
    max-width: 860px;
    font-size: 15px;
    line-height: 1.4;
    text-align: center;
}

.scam-alert-text strong {
    font-weight: 700;
}

.scam-alert-text a {
    color: #1a1a1a;
    font-weight: 700;
    text-decoration: underline;
}

.scam-alert-close {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.3);
    color: #1a1a1a;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.scam-alert-close:hover {
    background: rgba(255, 255, 255, 0.5);
}

@keyframes boxman-scam-flash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

@media (max-width: 767px) {
    .scam-alert-inner {
        padding: 10px 14px;
        gap: 10px;
    }

    .scam-alert-text {
        font-size: 13px;
        text-align: left;
    }
}