/* World Web Directory dynamic additions */

/* WordPress admin bar (header is absolute, then fixed once sticky) */
.admin-bar .header.is-sticky { top: 32px; }
@media (max-width: 782px) { .admin-bar .header.is-sticky { top: 46px; } }
@media (max-width: 600px) { .admin-bar .header.is-sticky { top: 0; } }

/* Listing images: website screenshots fill the design's logo tiles */
.ww-shot { position: relative; padding: 0 !important; overflow: hidden; }
.ww-shot > img { width: 100%; height: 100%; max-height: none !important; object-fit: cover !important; object-position: top center; }
.listing-row__logo.ww-shot { min-height: 190px; }
.listing-head__logo.ww-shot { height: 190px; }
.service-box__logo.ww-shot { height: 170px; }
.service4-box__icon.ww-shot { width: 84px; height: 84px; border-radius: 50%; border: 3px solid var(--accent-soft); }

/* Initials when a listing has no website or both screenshot services fail */
.ww-initials {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--dark-2) 0%, var(--blue-dark) 100%);
    color: var(--white);
    font-weight: 700;
    font-size: clamp(30px, 3.4vw, 46px);
    letter-spacing: -0.02em;
}
.service4-box__icon .ww-initials { font-size: 22px; }

/* Business name links keep the heading colour */
.listing-row h3 a, .service4-box h4 a, .service-box h4 a, .listing-head h2 a { color: inherit; }
.listing-row h3 a:hover, .service4-box h4 a:hover, .service-box h4 a:hover { color: var(--accent); }
.listing-head .ww-sub { margin: -4px 0 12px; color: var(--muted); }

/* Category photos in place of the design's icons */
.category-box .ww-cat-thumb { width: 50px; height: 50px; flex-shrink: 0; border-radius: 50%; object-fit: cover; }

/* Pagination dots + empty states */
.pagination .ww-dots { display: inline-grid; place-items: center; min-width: 30px; }
.search-empty.is-visible a { color: var(--accent); text-decoration: underline; }

/* Reviews (the design only had an empty state) */
.review-summary.ww-review-single { grid-template-columns: 1fr; }
.ww-reviews { display: grid; gap: 16px; margin-top: 24px; }
.ww-review { padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.ww-review__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.ww-review__head > div { display: grid; flex: 1; }
.ww-review__head small { color: var(--muted); }
.ww-review__avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--accent); color: var(--white); font-weight: 600; }
.ww-review .stars { color: var(--accent-2); white-space: nowrap; }
.ww-review p { margin: 0; color: var(--text); }

/* Post content + legal pages */
.ww-content img, .legal img { max-width: 100%; height: auto; }
.ww-content h2 { margin: 30px 0 12px; }

/* Blog post FAQ (+/- accordion in the design's colours) */
.ww-post-faq { display: grid; gap: 12px; margin: 10px 0 30px; }
.ww-post-faq .faq-item { border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); overflow: hidden; }
.ww-post-faq .faq-item__btn { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 18px 22px; border: 0; background: none; color: var(--title); font: 600 18px/1.4 var(--font); text-align: left; cursor: pointer; }
.ww-post-faq .faq-item__icon { position: relative; flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--accent-soft); }
.ww-post-faq .faq-item__icon::before, .ww-post-faq .faq-item__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; background: var(--accent); transform: translate(-50%, -50%); transition: transform .3s var(--ease); }
.ww-post-faq .faq-item__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.ww-post-faq .faq-item.is-open .faq-item__icon::after { transform: translate(-50%, -50%) rotate(0); }
.ww-post-faq .faq-item.is-open .faq-item__btn { color: var(--accent); }
.ww-post-faq .faq-item__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s var(--ease); }
.ww-post-faq .faq-item.is-open .faq-item__body { grid-template-rows: 1fr; }
.ww-post-faq .faq-item__body > div { overflow: hidden; padding: 0 22px; }
.ww-post-faq .faq-item.is-open .faq-item__body > div { padding-bottom: 18px; }
.ww-post-faq .faq-item__body p { margin: 0 0 8px; }

/* Footer: latest articles under the about text */
.ww-footer-posts { margin-top: 18px; }
