/* am24 header-footer.css — Phase E. Uses css/am24/tokens.css variables only. Owner: builder A. */

/* ================= HEADER ================= */
header.page-header.am24-header {
    position: sticky;
    top: 0;
    z-index: 200;
    padding: 0;
    background: var(--am24-surface);
    border-bottom: 1px solid var(--am24-border);
}
/* Nova sticky menu class must not turn the header into something else */
header.page-header.am24-header.fixed-menu { position: sticky; }
.am24-header .page-header-mask { display: none; }

/* home hero sits below the bar (builder B's section) */
.am24-header > .horizontal-search { margin: 0; }

.am24-header__bar { background: var(--am24-surface); }
.am24-header__inner {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: var(--am24-s3);
    max-width: var(--am24-container);
    height: var(--am24-header-h);
    margin: 0 auto;
    padding: 0 var(--am24-gutter);
}

/* logo: SVG dog mark + outlined wordmark (accent on white; white on forest in the footer) */
#logo { margin: 0; flex: 0 0 auto; }
#logo a { display: flex; align-items: center; height: var(--am24-header-h); line-height: 0; }
.am24-logo { display: block; width: auto; height: 40px; margin: 0; }
.am24-footer__logo { display: inline-block; line-height: 0; margin-bottom: var(--am24-s3); }
.am24-footer__logo img { display: block; width: auto; height: 40px; }

/* nav */
.am24-header .main-menu { flex: 1 1 auto; min-width: 0; }
.am24-header .main-menu .menu {
    margin: 0;
    padding: 0;
    height: auto;
    display: block;
}
.am24-header .main-menu .menu > div { padding: 0; overflow: visible; }
.am24-nav__links { display: flex; align-items: center; gap: 4px; flex-wrap: nowrap; }
.am24-header .main-menu .menu a,
.am24-header .main-menu .menu a:link,
.am24-header .main-menu .menu a:visited {
    display: flex;
    align-items: center;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border-radius: var(--am24-radius-pill);
    color: var(--am24-text);
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    box-shadow: none;
}
.am24-header .main-menu .menu a:hover {
    color: var(--am24-accent);
    background: var(--am24-tint);
    box-shadow: none;
}
.am24-header .main-menu .menu a.active {
    color: var(--am24-accent);
    background: var(--am24-tint);
    box-shadow: none;
}

/* right area */
.am24-header__right {
    display: flex;
    align-items: center;
    gap: var(--am24-s1);
    flex: 0 0 auto;
    margin-left: auto;
    height: 100%;
}
.am24-header__right.user-navbar { flex: 0 0 auto; }

/* Log in: outline pill (Nova #user-navbar circle) */
.am24-header .user-navbar .circle {
    height: auto;
    z-index: 210;
    background: none;
    margin: 0;
}
.am24-header .user-navbar > span.circle:last-of-type { margin-right: 0; }
.am24-header #user-navbar > .default {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 44px;
    line-height: 1;
    padding: 0 20px;
    overflow: visible;
    border: 1px solid var(--am24-accent);
    border-radius: var(--am24-radius-pill);
    color: var(--am24-accent);
    font-size: 15px;
    font-weight: 600;
    text-transform: none;
    background: var(--am24-surface);
    transition: background .15s;
}
.am24-header #user-navbar > .default:hover { background: var(--am24-tint); }
.am24-header #user-navbar > .default:before { display: none; }
.am24-header #user-navbar > .default:after { display: none; }
.am24-header #user-navbar > .default > span { max-width: 110px; }
.am24-header .circle_opened { background: none; }
.am24-header .circle_opened > .default { color: var(--am24-accent); }
.am24-header .user-navbar .circle_opened > .content,
.am24-header .circle_opened > .content {
    margin-top: 8px;
    padding: var(--am24-s2);
    border-radius: var(--am24-radius);
    border: 1px solid var(--am24-border);
    box-shadow: var(--am24-shadow-hover);
    min-width: 280px;
    color: var(--am24-text);
}
#user-navbar span.content.a-menu { padding: var(--am24-s1) var(--am24-s2); min-width: 220px; }
#user-navbar ul > li > a { color: var(--am24-text); }
#user-navbar ul > li > a:hover { color: var(--am24-accent); }
.account-menu-content > li > a.logout { color: var(--am24-danger); }
.account-menu-content > li > a.logout:hover { color: var(--am24-danger); opacity: .85; }
#user-navbar a.counter, .account-menu-content a.counter { color: var(--am24-danger); }
.am24-header .user-navbar-container .remember-me { color: var(--am24-muted); }
.am24-header .lang-selector a { color: var(--am24-text); }
.am24-header #lang-selector > .default { color: var(--am24-text); height: 44px; line-height: 1; }

/* Post a free ad */
a.am24-btn-post, a.am24-btn-post:link, a.am24-btn-post:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 44px;
    padding: 0 20px;
    line-height: 1;
    overflow: visible;
    border-radius: var(--am24-radius-pill);
    background: var(--am24-accent);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    transition: background .15s;
}
a.am24-btn-post:hover { background: var(--am24-accent-hover); color: #fff; }
.am24-btn-post__plus { display: block; width: 14px; height: 14px; font-size: 0; position: relative; }
.am24-btn-post__plus:before, .am24-btn-post__plus:after { content: ''; position: absolute; background: currentColor; border-radius: 1px; }
.am24-btn-post__plus:before { left: 0; right: 0; top: 6px; height: 2px; }
.am24-btn-post__plus:after { top: 0; bottom: 0; left: 6px; width: 2px; }
.am24-btn-post__text { display: block; line-height: 1; }

/* mobile menu button (left of the logo, <= 991px only) */
.am24-menu-btn {
    display: none;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: var(--am24-tap);
    height: var(--am24-tap);
    margin: 0 0 0 -10px;
    padding: 0;
    border: 0;
    border-radius: var(--am24-radius-input);
    background: none;
    cursor: pointer;
}
.am24-menu-btn:hover { background: var(--am24-tint); }
.am24-menu-btn__icon, .am24-drawer__close span, .am24-btn-account__icon { display: block; background: var(--am24-text); }
.am24-menu-btn__icon {
    width: 24px; height: 24px;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.am24-btn-account { display: none; width: var(--am24-tap); height: var(--am24-tap); align-items: center; justify-content: center; border-radius: 50%; }
.am24-btn-account:hover { background: var(--am24-tint); }
.am24-btn-account__icon {
    width: 24px; height: 24px; background: var(--am24-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 100-8 4 4 0 000 8zm0 2c-3.3 0-8 1.7-8 5v1h16v-1c0-3.3-4.7-5-8-5z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 100-8 4 4 0 000 8zm0 2c-3.3 0-8 1.7-8 5v1h16v-1c0-3.3-4.7-5-8-5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.am24-user-desktop { display: contents; }

/* drawer (built for <= 991px; hidden otherwise) */
.am24-drawer, .am24-drawer-overlay { display: none; }
html.am24-drawer-open, html.am24-drawer-open body { overflow: hidden; }
.am24-drawer__head {
    display: flex; align-items: center; justify-content: space-between;
    height: 64px; padding: 0 var(--am24-s1) 0 var(--am24-s3);
    border-bottom: 1px solid var(--am24-border);
    flex: 0 0 auto;
}
.am24-drawer__title { font-weight: 700; font-size: 18px; color: var(--am24-text); }
.am24-drawer__close { width: var(--am24-tap); height: var(--am24-tap); border: 0; background: none; border-radius: var(--am24-radius-input); cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.am24-drawer__close:hover { background: var(--am24-tint); }
.am24-drawer__close span {
    width: 24px; height: 24px;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 5L5 6.4 10.6 12 5 17.6 6.4 19l5.6-5.6 5.6 5.6 1.4-1.4-5.6-5.6L19 6.4 17.6 5 12 10.6z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 5L5 6.4 10.6 12 5 17.6 6.4 19l5.6-5.6 5.6 5.6 1.4-1.4-5.6-5.6L19 6.4 17.6 5 12 10.6z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.am24-drawer__body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: var(--am24-s1) var(--am24-s2) var(--am24-s3); display: flex; flex-direction: column; }
.am24-drawer ul { margin: 0; padding: 0; list-style: none; }
.am24-drawer__links li a, .am24-drawer__account .account-menu-content li a,
.am24-drawer__links li a:link, .am24-drawer__links li a:visited {
    display: flex; align-items: center; min-height: var(--am24-tap);
    padding: 0 var(--am24-s2); border-radius: var(--am24-radius-input);
    color: var(--am24-text); font-size: 16px; font-weight: 600;
}
.am24-drawer__links li a:hover, .am24-drawer__account .account-menu-content li a:hover { background: var(--am24-tint); color: var(--am24-accent); }
.am24-drawer__sep { margin-top: var(--am24-s1); padding-top: var(--am24-s1); border-top: 1px solid var(--am24-border); }
.am24-drawer__account { margin-top: var(--am24-s1); padding-top: var(--am24-s1); border-top: 1px solid var(--am24-border); }
.am24-drawer__account .account-menu-content li { padding: 0 !important; height: auto; display: block; }
.am24-drawer__account .account-menu-content li a.logout { color: var(--am24-danger); }
a.am24-drawer__post, a.am24-drawer__post:link, a.am24-drawer__post:visited {
    display: flex; align-items: center; justify-content: center;
    min-height: 48px; margin-top: var(--am24-s3);
    border-radius: var(--am24-radius-pill);
    background: var(--am24-accent); color: #fff; font-weight: 700; font-size: 16px;
}
a.am24-drawer__post:hover { background: var(--am24-accent-hover); color: #fff; }

@media (max-width: 991px) {
    .am24-menu-btn { display: inline-flex; order: 0; }
    #logo { order: 1; }
    .am24-header .main-menu { display: none; }
    .am24-header__inner { gap: var(--am24-s1); }
    .am24-header__right { order: 3; margin-left: auto; gap: 4px; }
    .am24-logo { width: auto; height: 32px; }
    .am24-user-desktop { display: none !important; }
    .am24-btn-account { display: inline-flex; }
    a.am24-btn-post, a.am24-btn-post:link, a.am24-btn-post:visited { width: var(--am24-tap); padding: 0; gap: 0; }
    .am24-btn-post__text { display: none; }
    .am24-btn-post__plus { width: 18px; height: 18px; }
    .am24-btn-post__plus:before { top: 8px; }
    .am24-btn-post__plus:after { left: 8px; }

    .am24-drawer-overlay {
        display: block; position: fixed; inset: 0; z-index: 590;
        background: rgba(16, 24, 16, .5); opacity: 0; transition: opacity .2s ease;
    }
    .am24-drawer-overlay[hidden] { display: none; }
    .am24-drawer-overlay.is-open { opacity: 1; }
    .am24-drawer {
        display: flex; flex-direction: column;
        position: fixed; top: 0; left: 0; bottom: 0; z-index: 600;
        width: 85vw; max-width: 360px;
        background: var(--am24-surface);
        box-shadow: 0 0 40px rgba(0, 0, 0, .25);
        transform: translateX(-100%); transition: transform .22s ease;
        visibility: visible;
    }
    .am24-drawer[hidden] { display: none; }
    .am24-drawer.is-open { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .am24-drawer, .am24-drawer-overlay { transition: none; }
}
@media (max-width: 380px) {
    .am24-logo { width: auto; height: 28px; }
}

/* ================= FOOTER ================= */
footer.page-footer.am24-footer {
    background: var(--am24-forest);
    color: var(--am24-on-forest);
    margin-top: var(--am24-s6);
}
.page-footer > .am24-footer__inner {
    min-height: 0;
    box-sizing: border-box;
    max-width: var(--am24-container);
    margin: 0 auto;
    padding: var(--am24-s6) var(--am24-gutter) var(--am24-s3);
    font-size: var(--am24-fs-sm);
}
.am24-footer__cols {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--am24-s4);
}
.am24-footer__col ul, .am24-footer__popular ul { margin: 0 0 var(--am24-s2); padding: 0; list-style: none; }
.am24-footer .am24-footer__title {
    margin: 0 0 var(--am24-s2);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    white-space: normal;
}
.am24-footer .am24-footer__sub {
    margin: var(--am24-s2) 0 var(--am24-s1);
    color: #fff;
    font-size: var(--am24-fs-sm);
    font-weight: 600;
    text-transform: none;
}
.am24-footer .am24-footer__title a, .am24-footer .am24-footer__title a:link, .am24-footer .am24-footer__title a:visited,
.am24-footer .am24-footer__sub a, .am24-footer .am24-footer__sub a:link, .am24-footer .am24-footer__sub a:visited { color: #fff; font-size: inherit; font-weight: inherit; }
.am24-footer .am24-footer__title a:hover, .am24-footer .am24-footer__sub a:hover { text-decoration: underline; }
.am24-footer a, .am24-footer a:link, .am24-footer a:visited {
    color: var(--am24-on-forest);
    font-size: var(--am24-fs-sm);
}
.am24-footer a:hover { color: #fff; text-decoration: underline; }
.am24-footer__col li { padding: 3px 0; line-height: 1.4; }
.am24-footer .page-footer .footer-menu ul li a { white-space: normal; }
.am24-footer__count { color: rgba(207, 227, 200, .6); font-size: var(--am24-fs-xs); margin-left: 4px; }
.am24-footer__count--zero { opacity: .5; }
.am24-footer__col--cta p { margin: 0 0 var(--am24-s2); line-height: 1.5; }
.am24-footer a.am24-footer__btn, .am24-footer a.am24-footer__btn:link, .am24-footer a.am24-footer__btn:visited {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 20px;
    border-radius: var(--am24-radius-pill);
    background: #fff;
    color: var(--am24-forest);
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
}
.am24-footer a.am24-footer__btn:hover { background: var(--am24-tint); color: var(--am24-forest); text-decoration: none; }

.am24-footer__popular {
    margin-top: var(--am24-s4);
    padding-top: var(--am24-s3);
    border-top: 1px solid rgba(207, 227, 200, .18);
}
.am24-footer__popular ul { display: flex; flex-wrap: wrap; gap: var(--am24-s1); margin: 0; }
.am24-footer__popular li { padding: 0; }
.am24-footer .am24-footer__popular a, .am24-footer .am24-footer__popular a:link, .am24-footer .am24-footer__popular a:visited {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 4px 14px;
    border-radius: var(--am24-radius-pill);
    background: rgba(255, 255, 255, .07);
    font-size: var(--am24-fs-xs);
    text-decoration: none;
    white-space: normal;
}
.am24-footer .am24-footer__popular a:hover { background: rgba(255, 255, 255, .16); color: #fff; }

.am24-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--am24-s2);
    margin-top: var(--am24-s4);
    padding-top: var(--am24-s3);
    border-top: 1px solid rgba(207, 227, 200, .18);
    font-size: var(--am24-fs-xs);
}
.am24-footer__social { display: flex; gap: var(--am24-s1); }
.am24-footer__social a { display: inline-flex; margin: 0; }
.am24-footer__social a svg { width: 24px; height: 24px; fill: var(--am24-on-forest); }
.am24-footer__social a:hover svg { fill: #fff; }
.footer-data.am24-footer__bottom { margin-top: var(--am24-s4); }

/* iOS/Nova legacy: never show a 'powered by' link */
.am24-footer .footer-data a { text-decoration: none !important; color: var(--am24-on-forest) !important; }

@media (max-width: 1099px) {
    .am24-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    footer.page-footer.am24-footer { margin-top: var(--am24-s4); }
    .page-footer > .am24-footer__inner { padding-top: var(--am24-s4); padding-bottom: calc(24px + 56px + env(safe-area-inset-bottom, 0px)); }
    body.view-details-page .page-footer > .am24-footer__inner { padding-bottom: var(--am24-s3); }
    .am24-footer__cols { grid-template-columns: 1fr 1fr; gap: var(--am24-s3) var(--am24-s2); }
    .am24-footer__col:nth-child(1), .am24-footer__col:nth-child(2) { grid-column: 1 / -1; }
    .am24-footer__col:nth-child(1) ul, .am24-footer__col:nth-child(2) ul { columns: 2; column-gap: var(--am24-s2); }
    .am24-footer__col:nth-child(1) li, .am24-footer__col:nth-child(2) li { break-inside: avoid; }
    .am24-footer__col--cta { grid-column: 1 / -1; }
    .am24-footer__col li { padding: 0; }
    .am24-footer__col li a { display: inline-flex; align-items: center; min-height: var(--am24-tap); }
    .am24-footer__popular a { min-height: var(--am24-tap) !important; }
    .am24-footer__bottom { flex-direction: column-reverse; align-items: flex-start; }
    .am24-footer__social a { width: var(--am24-tap); height: var(--am24-tap); align-items: center; justify-content: center; }
}

/* beat Nova's `header.page-header > div > * > * { margin: 0 auto }` */
.am24-header .am24-header__inner > * { margin: 0; }
.am24-header .am24-header__inner > .am24-menu-btn { margin-left: -10px; }
.am24-header .am24-header__inner > .am24-header__right { margin-left: auto; }

/* ================= ACCOUNT AREA (round 6) ================= */
.am24-acct-nav { margin: 0 0 var(--am24-s3); background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius); padding: var(--am24-s2); }
.am24-acct-nav__hello { font-size: var(--am24-fs-sm); color: var(--am24-muted); margin-bottom: var(--am24-s1); }
.am24-acct-nav__hello strong { color: var(--am24-text); }
.am24-acct-nav ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; align-items: center; }
.am24-acct-nav li { display: block; padding: 0; height: auto; }
.am24-acct-nav a, .am24-acct-nav a:link, .am24-acct-nav a:visited {
    display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px;
    border-radius: var(--am24-radius-pill); font-size: 15px; font-weight: 600; color: var(--am24-text);
    background: var(--am24-surface-2); white-space: nowrap;
}
.am24-acct-nav a:hover { background: var(--am24-tint); color: var(--am24-accent); }
.am24-acct-nav a.active { background: var(--am24-accent); color: #fff; }
.am24-acct-nav__badge { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 6px; border-radius: 10px; background: var(--am24-danger); color: #fff; font-size: 12px; line-height: 20px; text-align: center; }
.am24-acct-nav__more a, .am24-acct-nav__more a:link, .am24-acct-nav__more a:visited { background: none; border: 1px solid var(--am24-border); font-weight: 500; font-size: 14px; min-height: 34px; color: var(--am24-muted); }
.am24-acct-nav__more a.active { background: var(--am24-tint); color: var(--am24-accent); border-color: var(--am24-accent); }
.am24-acct-nav__out { margin-left: auto; }
.am24-acct-nav .am24-acct-nav__out a, .am24-acct-nav .am24-acct-nav__out a:link, .am24-acct-nav .am24-acct-nav__out a:visited { background: none; color: var(--am24-danger); }
@media (max-width: 767px) {
    .am24-acct-nav { padding: var(--am24-s1) var(--am24-s2); }
    .am24-acct-nav ul { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
    .am24-acct-nav ul::-webkit-scrollbar { display: none; }
    .am24-acct-nav li { flex: 0 0 auto; }
    .am24-acct-nav a { min-height: var(--am24-tap); }
    .am24-acct-nav__out { margin-left: 0; }
}
mark, .ks-highlight { background: var(--am24-tint); color: var(--am24-text); padding: 0 2px; border-radius: 3px; }

/* My ads: cards (Nova my_listing.tpl section#listings.my-listings article.am24-ad) */
#listings.my-listings { display: grid; gap: var(--am24-s2); }
section#listings.my-listings article.am24-ad {
    display: block; position: relative; margin: 0; padding: var(--am24-s2);
    background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius);
    border-bottom: 1px solid var(--am24-border);
}
section#listings.my-listings article.am24-ad:hover { box-shadow: var(--am24-shadow-hover); }
section#listings.my-listings article.am24-ad .title { margin: 0 0 var(--am24-s1); padding: 0; }
section#listings.my-listings article.am24-ad .title a, section#listings.my-listings article.am24-ad .title a:link { font-size: 18px; font-weight: 700; color: var(--am24-text); }
section#listings.my-listings article.am24-ad .title a:hover { color: var(--am24-accent); }
section#listings.my-listings article.am24-ad .nav {
    display: grid; grid-template-columns: 220px minmax(0, 1fr); column-gap: var(--am24-s3); row-gap: var(--am24-s2);
    grid-template-areas: "pic stat" "pic actions";
    align-items: start; width: auto; float: none; padding: 0; min-height: 0;
}
section#listings.my-listings article.am24-ad .nav > .info { grid-area: pic; width: auto; float: none; margin: 0; padding: 0; }
section#listings.my-listings article.am24-ad .nav > .info .picture { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; background: var(--am24-surface-2); position: relative; margin: 0; }
section#listings.my-listings article.am24-ad .nav > .info .picture img { width: 100%; height: 100%; object-fit: cover; display: block; }
section#listings.my-listings article.am24-ad .nav > .info .picture > span { right: 8px; bottom: 8px; left: auto; }
section#listings.my-listings article.am24-ad .nav > .stat { grid-area: stat; float: none; width: auto; padding: 0; margin: 0; }
section#listings.my-listings article.am24-ad .nav > .stat ul { display: flex; flex-wrap: wrap; gap: 6px 24px; margin: 0; padding: 0; list-style: none; }
section#listings.my-listings article.am24-ad .nav > .stat li { padding: 0; margin: 0; font-size: 14px; color: var(--am24-text); line-height: 1.5; }
section#listings.my-listings article.am24-ad .nav > .stat li:first-child { flex: 0 0 100%; }
section#listings.my-listings article.am24-ad .stat .name { color: var(--am24-muted); margin-right: 4px; }
section#listings.my-listings article.am24-ad .statuses a, section#listings.my-listings article.am24-ad .statuses span {
    display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border-radius: var(--am24-radius-pill);
    font-size: 13px; font-weight: 700; background: var(--am24-surface-2); color: var(--am24-muted);
}
section#listings.my-listings article.am24-ad .statuses span:before, section#listings.my-listings article.am24-ad .statuses a:before { display: none; }
section#listings.my-listings article.am24-ad .statuses .active { background: var(--am24-tint); color: var(--am24-accent); }
section#listings.my-listings article.am24-ad .statuses .pending, section#listings.my-listings article.am24-ad .statuses .approval, section#listings.my-listings article.am24-ad .statuses .incomplete { background: #FFF4D6; color: #7A5200; }
section#listings.my-listings article.am24-ad .statuses .expired { background: #FDECEA; color: var(--am24-danger); }
section#listings.my-listings article.am24-ad .nav > .navigation { grid-area: actions; float: none; width: auto; padding: 0; margin: 0; align-self: end; }
section#listings.my-listings article.am24-ad .navigation ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
section#listings.my-listings article.am24-ad .navigation li { padding: 0; margin: 0; height: auto; }
section#listings.my-listings article.am24-ad .navigation li a, section#listings.my-listings article.am24-ad .navigation li a:link, section#listings.my-listings article.am24-ad .navigation li a:visited {
    display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; background-image: none !important;
    border: 1px solid var(--am24-border); border-radius: var(--am24-radius-pill);
    font-size: 14px; font-weight: 600; color: var(--am24-text); background-color: var(--am24-surface);
}
section#listings.my-listings article.am24-ad .navigation li a:before, section#listings.my-listings article.am24-ad .navigation li a:after { display: none; }
section#listings.my-listings article.am24-ad .navigation li a:hover { border-color: var(--am24-accent); color: var(--am24-accent); }
section#listings.my-listings article.am24-ad .navigation li a.edit { background-color: var(--am24-accent); border-color: var(--am24-accent); color: #fff; }
section#listings.my-listings article.am24-ad .navigation li a.edit:hover { background-color: var(--am24-accent-hover); color: #fff; }
section#listings.my-listings article.am24-ad .navigation li a.delete { color: var(--am24-danger); }
section#listings.my-listings article.am24-ad .navigation li a span { padding: 0; }
section#listings.my-listings article.am24-ad.featured { border-color: var(--am24-accent); }
.am24-ad-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 var(--am24-s2); }
.am24-ad-tabs button { min-height: 40px; padding: 0 16px; border: 1px solid var(--am24-border); background: var(--am24-surface); border-radius: var(--am24-radius-pill); font: 600 14px var(--am24-font); color: var(--am24-text); cursor: pointer; }
.am24-ad-tabs button[aria-pressed="true"] { background: var(--am24-accent); border-color: var(--am24-accent); color: #fff; }
@media (max-width: 767px) {
    section#listings.my-listings article.am24-ad .nav { grid-template-columns: 110px minmax(0, 1fr); column-gap: var(--am24-s2); grid-template-areas: "pic stat" "actions actions"; }
    section#listings.my-listings article.am24-ad .title a { font-size: 16px; }
    section#listings.my-listings article.am24-ad .navigation li a { min-height: var(--am24-tap); }
    section#listings.my-listings article.am24-ad .nav > .stat li:not(:first-child) { flex: 0 0 100%; }
}

section#listings.my-listings article.am24-ad { margin: 0 !important; }
section#listings.my-listings article.am24-ad .navigation li a span, section#listings.my-listings article.am24-ad .navigation li a > span { display: inline !important; }
section#listings.my-listings article.am24-ad .nav > .info .title, section#listings.my-listings article.am24-ad .nav > .stat { position: static; }
section#listings.my-listings article.am24-ad .nav > .navigation ul, section#listings.my-listings article.am24-ad .nav > .stat ul { padding: 0 !important; }
section#listings.my-listings article.am24-ad .navigation > ul > li, section#listings.my-listings article.am24-ad .navigation > ul > li.nav-icon { display: block; padding: 0 !important; width: auto; margin: 0; }
section#listings.my-listings article.am24-ad .navigation > ul > li a { padding: 0 16px; }
section#listings.my-listings article.am24-ad .nav > .stat ul > li { width: auto; margin-right: 0; display: block; }
section#listings.my-listings article.am24-ad .nav > .stat ul > li:first-child { width: 100%; }
section#listings.my-listings article.am24-ad .nav > div { margin-right: 0; }
section#listings.my-listings article.am24-ad .nav > .info { display: block; width: 100%; }
section#listings.my-listings article.am24-ad .nav > .navigation, section#listings.my-listings article.am24-ad .nav > .stat { display: block; width: auto; }
@media (max-width: 767px) {
    section#listings.my-listings article.am24-ad .nav > .stat ul > li:not(:first-child) { width: 100%; }
}
/* generic account cards: profile, settings, saved searches, messages */
body.my-profile-page #controller_area, body.saved-search-page #controller_area, body.my-messages-page #controller_area,
body.my-packages-page #controller_area, body.payment-history-page #controller_area {
    background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius); padding: var(--am24-s3);
}
body.my-profile-page #controller_area .content-padding, body.saved-search-page #controller_area .content-padding { padding: 0; }
body.my-profile-page #content > h1, body.saved-search-page #content > h1, body.my-messages-page #content > h1, body.my-favorites-page #content > h1 { margin-bottom: var(--am24-s2); }
body.my-profile-page #controller_area .submit-cell { max-width: 640px; }
body.my-profile-page #controller_area .fieldset > header { border-top: 1px solid var(--am24-border); margin-top: var(--am24-s3); padding-top: var(--am24-s2); text-transform: none; color: var(--am24-text); font-weight: 700; font-size: 16px; }
body.my-profile-page aside.left section.side_block { background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius); }
body.saved-search-page .list-table .row { background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius); margin-bottom: var(--am24-s1); }
body.saved-search-page .list-table .header { display: none; }
/* account pages: nav sits above the page heading inside #content */
body.my-listings-page #content > .am24-acct-nav, body.my-favorites-page #content > .am24-acct-nav { margin-top: 0; }

.am24-acct-more { position: relative; }
.am24-acct-more summary { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid var(--am24-border); border-radius: var(--am24-radius-pill); font-size: 14px; font-weight: 600; color: var(--am24-muted); cursor: pointer; list-style: none; }
.am24-acct-more summary::-webkit-details-marker { display: none; }
.am24-acct-more summary:after { content: ''; width: 6px; height: 6px; margin-left: 8px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); }
.am24-acct-more[open] summary:after { transform: rotate(-135deg); }
.am24-acct-more__list { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; min-width: 220px; display: flex; flex-direction: column; gap: 2px; padding: 8px; background: var(--am24-surface); border: 1px solid var(--am24-border); border-radius: var(--am24-radius); box-shadow: var(--am24-shadow-hover); }
.am24-acct-nav .am24-acct-more__list a, .am24-acct-nav .am24-acct-more__list a:link, .am24-acct-nav .am24-acct-more__list a:visited { background: none; border: 0; border-radius: 8px; font-weight: 500; font-size: 14px; justify-content: flex-start; color: var(--am24-text); }
.am24-acct-nav .am24-acct-more__list a:hover, .am24-acct-nav .am24-acct-more__list a.active { background: var(--am24-tint); color: var(--am24-accent); }
@media (max-width: 767px) { .am24-acct-more__list { position: fixed; left: var(--am24-s2); right: var(--am24-s2); top: auto; } .am24-acct-more summary { min-height: var(--am24-tap); } .am24-acct-nav ul { overflow: visible; flex-wrap: wrap; } }
.am24-acct-nav__more { margin-left: 0; }
aside span[style*="ff8c00"], #controller_area span[style*="ff8c00"] { background-color: var(--am24-tint) !important; color: var(--am24-text) !important; }
aside span[style*="color:#ffffff"], aside span[style*="color: #ffffff"] { color: inherit !important; }
article.am24-ad .navigation li a span { color: inherit; }
body.my-profile-page #controller_area .fieldset > header { width: auto; }

/* ======================= E3 header: New ad outlined, Sign in filled, messages badge, avatar ======================= */
a.am24-btn-post, a.am24-btn-post:link, a.am24-btn-post:visited { background: var(--am24-surface); color: var(--am24-accent); border: 1px solid var(--am24-accent); }
a.am24-btn-post:hover { background: var(--am24-tint); color: var(--am24-accent); }
.am24-header #user-navbar:not(.logged-in) > .default { background: var(--am24-accent); color: #fff; border-color: var(--am24-accent); }
.am24-header #user-navbar:not(.logged-in) > .default:hover { background: var(--am24-accent-hover); }
.am24-header #user-navbar:not(.logged-in) > .default > span { color: #fff; }
.am24-header #user-navbar.logged-in > .am24-avatar-btn { padding: 0 4px; border: 0; background: none; gap: 2px; height: 44px; min-width: 44px; }
.am24-avatar { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--am24-accent); color: #fff; font-size: 16px; font-weight: 700; line-height: 1; }
.am24-avatar-chev { fill: none; stroke: var(--am24-text); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.am24-account-menu__sep { height: 1px; background: var(--am24-border); margin: 6px 0; padding: 0 !important; list-style: none; }
.am24-account-menu > li > a { display: block; padding: 10px 4px; }
.am24-msg-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--am24-accent); color: var(--am24-accent); background: var(--am24-surface); }
.am24-msg-btn svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.am24-msg-btn:hover { background: var(--am24-tint); }
.am24-msg-btn__badge { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--am24-danger); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
/* Flynax system messages (printMessage) as a Pets4homes-style toast: white card, top centre, coloured border + icon.
   Notices fade after 5s; errors/warnings stay until closed (Flynax removes them after 20s). On the login + post-ad pages errors/warnings stay inline next to the form (pages.css); notices are toasts everywhere. */
body:not(.login-page):not(.add-listing-page) div.notification, div.notification.notice {
    position: fixed !important; top: 12px !important; left: 50%; right: auto; margin: 0 !important; transform: translateX(-50%);
    width: 380px; max-width: calc(100vw - 32px); min-height: 0; z-index: 3000;
    animation: am24-toast-in .25s ease-out backwards;
}
body:not(.login-page):not(.add-listing-page) div.notification.notice, div.notification.notice { animation: am24-toast-in .25s ease-out backwards, am24-toast-out .3s ease-in 5s forwards; }
body:not(.login-page):not(.add-listing-page) div.notification > div, div.notification.notice > div {
    width: auto; max-width: none; min-height: 0; margin: 0; padding: 0; background: var(--am24-surface); color: var(--am24-text);
    border: 1px solid var(--am24-accent); border-radius: var(--am24-radius-input); box-shadow: 0 6px 20px rgba(16, 24, 16, .12);
    font-size: var(--am24-fs-sm); font-weight: 500;
}
body:not(.login-page):not(.add-listing-page) div.notification > div > div.message, div.notification.notice > div > div.message { position: relative; background: none; color: var(--am24-text); padding: 12px 40px 12px 44px; line-height: 1.45; }
body:not(.login-page):not(.add-listing-page) div.notification > div > div.message::before, div.notification.notice > div > div.message::before {
    content: ''; position: absolute; left: 16px; top: 13px; width: 18px; height: 18px; background: var(--am24-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
body:not(.login-page):not(.add-listing-page) div.notification.error > div { border-color: var(--am24-danger); }
body:not(.login-page):not(.add-listing-page) div.notification.warning > div { border-color: #B54708; }
body:not(.login-page):not(.add-listing-page) div.notification.error > div > div.message::before, body:not(.login-page):not(.add-listing-page) div.notification.warning > div > div.message::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E");
}
body:not(.login-page):not(.add-listing-page) div.notification.error > div > div.message::before { background: var(--am24-danger); }
body:not(.login-page):not(.add-listing-page) div.notification.warning > div > div.message::before { background: #B54708; }
body:not(.login-page):not(.add-listing-page) div.notification ul, div.notification.notice ul { margin: 0; padding: 0 0 0 18px; }
body:not(.login-page):not(.add-listing-page) div.notification ul > li, div.notification.notice ul > li { list-style: disc; }
body:not(.login-page):not(.add-listing-page) div.notification div.close-black, div.notification.notice div.close-black { top: 50%; right: 6px; width: 32px; height: 32px; margin-top: -16px; }
body:not(.login-page):not(.add-listing-page) div.notification div.close-black::before, div.notification.notice div.close-black::before {
    top: 10px; right: 10px; width: 12px; height: 12px; opacity: 1; background: var(--am24-muted);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
}
@keyframes am24-toast-in { from { opacity: 0; transform: translate(-50%, -8px); } }
@keyframes am24-toast-out { to { opacity: 0; visibility: hidden; transform: translate(-50%, -8px); } }
@media (prefers-reduced-motion: reduce) {
    body:not(.login-page):not(.add-listing-page) div.notification, div.notification.notice, body:not(.login-page):not(.add-listing-page) div.notification.notice { animation-name: none; }
    body:not(.login-page):not(.add-listing-page) div.notification.notice, div.notification.notice { animation: am24-toast-fade .3s linear 5s forwards; }
    @keyframes am24-toast-fade { to { opacity: 0; visibility: hidden; } }
}
@media (max-width: 991px) {
    a.am24-btn-post, a.am24-btn-post:link, a.am24-btn-post:visited { background: var(--am24-surface); color: var(--am24-accent); }
    .am24-msg-btn { width: 40px; height: 40px; }
}
.am24-header #user-navbar.logged-in > .am24-avatar-btn:before, .am24-header #user-navbar.logged-in > .am24-avatar-btn:after { display: none !important; content: none !important; }
.am24-header #user-navbar.logged-in > .am24-avatar-btn > .am24-avatar { display: inline-flex; width: 36px; height: 36px; max-width: none; align-items: center; justify-content: center; color: #fff; }
.am24-header #user-navbar.logged-in.notify .am24-avatar { box-shadow: 0 0 0 2px var(--am24-surface), 0 0 0 4px var(--am24-accent); }

/* E3 fix 1: logo 32px high at <=575px; popular-search chips smaller so 2-3 fit per row */
@media (max-width: 575px) {
    .am24-logo { height: 32px; }
    .am24-footer .am24-footer__popular a, .am24-footer .am24-footer__popular a:link, .am24-footer .am24-footer__popular a:visited { font-size: 13px; padding: 6px 12px; }
}
.am24-header #user-navbar.logged-in.notify .am24-avatar { box-shadow: none; }
.am24-header #user-navbar.logged-in > .am24-avatar-btn { gap: 6px; padding: 0 6px; }

/* account dropdown, P4H-like (2026-10-12): roomier rows, real 1px divider (stock `.circle ul > li {height:28px}` turned the separator into a grey block) */
.am24-account-menu > li.am24-account-menu__sep { height: 1px !important; min-height: 0; line-height: 0; margin: 8px 16px !important; padding: 0 !important; background: var(--am24-border); }
#user-navbar .a-menu { padding: 8px 0; border-radius: var(--am24-radius); }
#user-navbar ul.am24-account-menu { display: block; min-width: 248px; }
#user-navbar ul.am24-account-menu > li { display: block; height: auto; line-height: 1.3; padding: 0; font-size: 15px; }
#user-navbar ul.am24-account-menu > li > a { display: block; padding: 11px 20px; color: var(--am24-text); text-decoration: none; }
#user-navbar ul.am24-account-menu > li > a:hover { background: var(--am24-bg); color: var(--am24-accent); }
#user-navbar ul.am24-account-menu > li > a.active { color: var(--am24-accent); font-weight: 600; }
#user-navbar ul.am24-account-menu > li > a.logout { color: var(--am24-danger); }