/*!
 * Roovet Search SERP Clean Layout
 * Marker: RV_SEARCH_SERP_CLEAN_LAYOUT_20260512
 * Purpose: flat Google/Bing-inspired UI, no bubbly cards, shared across All + vertical tabs.
 */

:root {
  --rv-serp-text: #202124;
  --rv-serp-muted: #5f6368;
  --rv-serp-subtle: #70757a;
  --rv-serp-link: #1a0dab;
  --rv-serp-blue: #1a73e8;
  --rv-serp-line: #dadce0;
  --rv-serp-soft-line: #e8eaed;
  --rv-serp-bg: #ffffff;
  --rv-serp-soft: #f8fafd;
  --rv-serp-red: #d93025;
  --rv-serp-green: #137333;
  --rv-serp-yellow: #fff8e1;
  --rv-serp-font: Arial, Helvetica, sans-serif;
}

html,
body {
  background: #fff !important;
  color: var(--rv-serp-text) !important;
  font-family: var(--rv-serp-font) !important;
}

a {
  color: var(--rv-serp-link);
}

img {
  max-width: 100%;
}

.rv-top,
.rv5-top {
  position: sticky;
  top: 0;
  z-index: 80;
  background: rgba(255,255,255,.98) !important;
  border-bottom: 1px solid var(--rv-serp-soft-line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.rv-head,
.rv5-head {
  display: grid !important;
  grid-template-columns: 150px minmax(340px, 760px) 1fr !important;
  gap: 22px !important;
  align-items: center !important;
  padding: 18px 30px 8px !important;
}

.rv-brand,
.rv5-brand {
  color: #111827 !important;
  text-decoration: none !important;
  font-weight: 800 !important;
  letter-spacing: -.05em !important;
}

.rv-brand-mark,
.rv5-brand-mark {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  background: var(--rv-serp-red) !important;
  color: #fff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.rv-searchbox,
.rv5-searchbox,
.search-box {
  height: 46px !important;
  border: 1px solid #dfe1e5 !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 1px 6px rgba(32,33,36,.12) !important;
  overflow: hidden !important;
}

.rv-searchbox:focus-within,
.rv5-searchbox:focus-within,
.search-box:focus-within {
  box-shadow: 0 1px 8px rgba(32,33,36,.20) !important;
  border-color: transparent !important;
}

.rv-input,
.rv5-input,
.search-input {
  color: var(--rv-serp-text) !important;
  font-size: 16px !important;
  background: transparent !important;
}

.rv-submit,
.rv5-submit,
.rv-search-icon,
.rv5-voice,
.search-btn,
.voice-btn {
  background: #fff !important;
  color: var(--rv-serp-blue) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.rv-tabs-wrap,
.rv5-tabs-wrap {
  padding-left: 198px !important;
  padding-right: 30px !important;
  overflow-x: auto !important;
}

.rv-tabs,
.rv5-tabs {
  height: 44px !important;
  display: flex !important;
  align-items: end !important;
  gap: 26px !important;
}

.rv-tab,
.rv5-tab {
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--rv-serp-muted) !important;
  border-bottom: 3px solid transparent !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.rv-tab.active,
.rv5-tab.is-active,
.rv5-tab.active {
  color: var(--rv-serp-blue) !important;
  border-bottom-color: var(--rv-serp-blue) !important;
}

.rv-more-tabs,
.rv5-more {
  border-top: 1px solid #f1f3f4 !important;
  padding: 9px 30px 11px 198px !important;
  display: flex !important;
  gap: 10px !important;
  overflow-x: auto !important;
}

.rv-chip,
.rv5-chip,
.rv5-filter,
.rv5-tool,
.rv-head-btn,
.rv5-btn {
  border: 1px solid var(--rv-serp-line) !important;
  background: #fff !important;
  color: #3c4043 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.rv-chip:hover,
.rv5-chip:hover,
.rv5-filter:hover,
.rv5-tool:hover,
.rv-head-btn:hover,
.rv5-btn:hover {
  background: #f8f9fa !important;
  text-decoration: none !important;
}

.rv-page {
  width: min(1250px, calc(100vw - 56px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 720px) minmax(320px, 390px) !important;
  gap: 46px !important;
  padding: 18px 0 72px !important;
  align-items: start !important;
}

.rv5-page {
  width: min(1250px, calc(100vw - 56px)) !important;
  margin: 0 auto !important;
  padding: 18px 0 72px !important;
}

.rv-main {
  min-width: 0 !important;
  max-width: 720px !important;
}

.rv-rail {
  min-width: 0 !important;
  max-width: 390px !important;
}

.rv-meta,
.rv5-muted,
.rv-domain,
.rv-linkline {
  color: var(--rv-serp-muted) !important;
}

.rv-title,
.rv-ad-title,
.rv5-title,
.rv5-media-title {
  color: var(--rv-serp-link) !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

.rv-title:hover,
.rv-ad-title:hover,
.rv5-title:hover,
.rv5-media-title:hover {
  text-decoration: underline !important;
}

.rv-result,
.rv5-result {
  margin: 0 0 26px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.rv-result-top {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  margin-bottom: 6px !important;
}

.rv-favicon,
.rv5-favicon {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  border-radius: 50% !important;
  border: 1px solid var(--rv-serp-soft-line) !important;
  background: #f1f3f4 !important;
  color: var(--rv-serp-muted) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  overflow: hidden !important;
}

.rv-thumb,
.rv5-thumb,
.rv5-media-img,
.rv-news-thumb,
.rv-news-lead-img,
.rv-product-img {
  background: #f1f3f4 !important;
  border: 1px solid var(--rv-serp-soft-line) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  object-fit: cover !important;
}

.rv-snippet,
.rv5-snippet {
  color: #4d5156 !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

/* AI Overview: premium, flat, and above ads/results. */
#aiModule,
#rvAi,
.rv-ai,
.rv5-ai,
.rv-serp-ai-wide {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  border: 1px solid #d2e3fc !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  margin: 0 0 20px !important;
  padding: 18px 20px !important;
  color: var(--rv-serp-text) !important;
}

#aiModule h2,
#rvAi h2,
.rv-ai h2,
.rv5-ai h2,
.rv-ai-label {
  color: var(--rv-serp-text) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
  margin: 0 0 10px !important;
}

#aiModule p,
#rvAi p,
.rv-ai p,
.rv5-ai p {
  color: #3c4043 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}

.rv-ai-sources,
.rv5-ai-sources,
#aiSources {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

.rv-ai-sources a,
.rv5-ai-sources a,
#aiSources a {
  border: 1px solid var(--rv-serp-line) !important;
  border-radius: 16px !important;
  padding: 6px 10px !important;
  color: #3c4043 !important;
  background: #fff !important;
  text-decoration: none !important;
}

/* Ads: flatter Google-style sponsored block. */
.rv-ads,
.rv-search-ads-premium-v3 {
  border-top: 1px solid var(--rv-serp-line) !important;
  border-bottom: 1px solid var(--rv-serp-line) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
  margin: 0 0 24px !important;
}

.rv-ad,
.rv-search-ads-premium-v3__item {
  border-bottom: 1px solid #edf0f2 !important;
  padding: 14px 0 16px !important;
  background: #fff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.rv-ad:last-child,
.rv-search-ads-premium-v3__item:last-child {
  border-bottom: 0 !important;
}

.rv-sponsored,
.rv-search-ads-premium-v3__badge {
  background: #fff8e1 !important;
  border: 1px solid #f5d98a !important;
  color: #5f4b13 !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
}

/* Modules: Google/Bing flat panels. */
.rv-module,
.rv5-module,
.rv5-google-module,
.rv-paa,
#rv5PeopleAsk {
  border-top: 1px solid var(--rv-serp-line) !important;
  border-bottom: 1px solid var(--rv-serp-line) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  margin: 0 0 28px !important;
  overflow: hidden !important;
}

.rv-module-head,
.rv5-module-head,
.rv5-google-head {
  min-height: 56px !important;
  border-bottom: 1px solid var(--rv-serp-line) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.rv-module-title,
.rv5-module-title,
.rv5-google-title {
  font-size: 22px !important;
  font-weight: 400 !important;
  color: var(--rv-serp-text) !important;
  letter-spacing: -.02em !important;
  margin: 0 !important;
}

/* Knowledge Panel: right rail, clean not bubbly. */
.rv-rail [class*="kp"],
.rv-rail [id*="Knowledge"],
.rv-rail [id*="Kp"],
.rv5-bkp,
.rv-bing-kp,
.rv-kp,
.rv5-kp {
  border: 1px solid var(--rv-serp-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  background: #fff !important;
}

.rv-rail img,
.rv5-bkp img,
.rv-bing-kp img,
.rv-kp img {
  border-radius: 8px !important;
}

/* Entity / people hero should stretch across the page above results + KP. */
#rv5EntityHero,
#rvEntityHero,
.rv5-entity-hero,
.rv-entity-hero {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  border: 1px solid var(--rv-serp-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  background: #fff !important;
  margin: 0 0 20px !important;
}

/* Vertical pages. */
.rv5-titlebar {
  border-bottom: 1px solid var(--rv-serp-line) !important;
  padding: 18px 0 16px !important;
  margin-bottom: 18px !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 20px !important;
  align-items: end !important;
}

.rv5-titlebar h1 {
  font-size: 28px !important;
  line-height: 1.18 !important;
  font-weight: 400 !important;
  letter-spacing: -.02em !important;
  margin: 0 0 6px !important;
}

.rv5-titlebar p {
  color: var(--rv-serp-muted) !important;
  margin: 0 !important;
}

.rv5-count {
  color: var(--rv-serp-muted) !important;
  font-size: 14px !important;
}

.rv5-grid {
  display: grid !important;
  gap: 16px !important;
}

.rv5-media-card,
.rv5-product,
.rv5-book,
.rv5-story {
  border: 1px solid var(--rv-serp-soft-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.rv5-media-card:hover,
.rv5-product:hover,
.rv5-book:hover,
.rv5-story:hover {
  border-color: #d2d6dc !important;
}

.rv5-media-body {
  padding: 10px 12px 12px !important;
}

/* Maps page: left list + right map, flatter. */
.rv5-map-layout {
  width: min(1280px, calc(100vw - 44px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(360px, 430px) minmax(0, 1fr) !important;
  min-height: calc(100vh - 150px) !important;
  border-left: 1px solid var(--rv-serp-line) !important;
  border-right: 1px solid var(--rv-serp-line) !important;
}

.rv5-map-list {
  border-right: 1px solid var(--rv-serp-line) !important;
  background: #fff !important;
  overflow: auto !important;
}

.rv5-place {
  border-bottom: 1px solid var(--rv-serp-soft-line) !important;
  background: #fff !important;
}

.rv5-map-canvas iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: calc(100vh - 150px) !important;
  border: 0 !important;
}

/* Hide all/KP modules on vertical pages unless explicitly rendered by that vertical. */
body.rv5-vertical .rv-rail,
body.rv5-vertical #rvSafeKnowledgePanel,
body.rv5-vertical #rvKnowledgePanel,
body.rv5-vertical #rv5BingKp,
body.rv5-vertical #aiModule,
body.rv5-vertical #rvAi {
  display: none !important;
}

/* Autocomplete: keep above sticky header and clean. */
.rv5-autocomplete,
.autocomplete-panel,
.rv-search-suggestions,
#rvSearchSuggestions {
  border: 1px solid var(--rv-serp-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 24px rgba(60,64,67,.16) !important;
  overflow: hidden !important;
  z-index: 9999 !important;
}

/* Utility for JS-hydrated thumbnails. */
.rv-serp-hydrated-thumb {
  display: block !important;
  width: 116px !important;
  height: 86px !important;
  object-fit: cover !important;
  border: 1px solid var(--rv-serp-soft-line) !important;
  border-radius: 6px !important;
  background: #f1f3f4 !important;
}

.rv-serp-broken-img {
  display: none !important;
}

@media (max-width: 1100px) {
  .rv-head,
  .rv5-head {
    grid-template-columns: 120px minmax(220px, 1fr) !important;
    gap: 14px !important;
    padding: 14px 16px 8px !important;
  }

  .rv-header-actions,
  .rv5-tools {
    display: none !important;
  }

  .rv-tabs-wrap,
  .rv5-tabs-wrap,
  .rv-more-tabs,
  .rv5-more {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .rv-page {
    width: min(760px, calc(100vw - 28px)) !important;
    display: block !important;
    padding-top: 14px !important;
  }

  .rv-main,
  .rv-rail {
    max-width: none !important;
  }

  .rv-rail {
    margin-top: 24px !important;
  }

  .rv5-page {
    width: min(920px, calc(100vw - 28px)) !important;
  }

  .rv5-map-layout {
    width: 100% !important;
    display: block !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }

  .rv5-map-list {
    border-right: 0 !important;
  }

  .rv5-map-canvas iframe {
    min-height: 360px !important;
  }
}

@media (max-width: 700px) {
  .rv-head,
  .rv5-head {
    grid-template-columns: 1fr !important;
  }

  .rv-brand,
  .rv5-brand {
    font-size: 22px !important;
  }

  .rv5-titlebar {
    display: block !important;
  }

  .rv-news-grid,
  .rv-news-also-grid {
    grid-template-columns: 1fr !important;
  }
}
