/* ===========================================================
   DoingBuzz UI Polish — v1.0.0
   Objectif : contenu centré, lisible, grid propre, ultra fluide
   Compatible light/dark/auto (light par défaut)
   =========================================================== */

/* Base (clair par défaut) */
:root{
  --dbz-wrap: 1200px;
  --dbz-gutter: 18px;
  --dbz-gap: 22px;
  --dbz-radius: 18px;

  --dbz-bg: #f6f7fb;
  --dbz-card: #ffffff;
  --dbz-text: #0f172a;
  --dbz-muted: rgba(15,23,42,.72);
  --dbz-border: rgba(15,23,42,.08);
  --dbz-link: #1d4ed8;

  --dbz-shadow: 0 10px 30px rgba(2,6,23,.08);
  --dbz-shadow-hover: 0 16px 44px rgba(2,6,23,.14);
}

body.dbz-ui-polish{
  background: var(--dbz-bg);
  color: var(--dbz-text);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.dbz-ui-polish :is(a, button, input, select, textarea){
  -webkit-tap-highlight-color: transparent;
}

/* Centrage global (Home + listes) */
body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish :is(.site-main,#primary,.content-area){
  max-width: min(var(--dbz-wrap), calc(100% - (var(--dbz-gutter) * 2)));
  margin-inline: auto;
  padding-inline: var(--dbz-gutter);
}

/* Grid propre (capsules au milieu + espace respirable) */
body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish .site-main :is(.posts, .post-grid, .posts-grid, .blog-grid, .home-grid, .grid-posts, .dbz-post-grid){
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--dbz-gap);
  align-items: stretch;
  justify-content: center;
}

/* Tablette */
@media (max-width: 980px){
  body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish .site-main :is(.posts, .post-grid, .posts-grid, .blog-grid, .home-grid, .grid-posts, .dbz-post-grid){
	grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 640px){
  body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish .site-main :is(.posts, .post-grid, .posts-grid, .blog-grid, .home-grid, .grid-posts, .dbz-post-grid){
	grid-template-columns: 1fr;
	gap: 16px;
  }
}

/* Capsule / Card */
body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish .site-main :is(article.post, article.hentry, .post, .hentry){
  background: var(--dbz-card);
  border: 1px solid var(--dbz-border);
  border-radius: var(--dbz-radius);
  overflow: hidden;
  box-shadow: var(--dbz-shadow);
  transform: translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;

  /* perf style “React” */
  content-visibility: auto;
  contain-intrinsic-size: 420px 560px;
}

body:is(.home,.blog,.archive,.search,.category,.tag).dbz-ui-polish .site-main :is(article.post, article.hentry, .post, .hentry):hover{
  transform: translateY(-3px);
  box-shadow: var(--dbz-shadow-hover);
  border-color: rgba(29,78,216,.25);
}

/* Image propre + ratio fixe (évite layout shift) */
body.dbz-ui-polish .site-main :is(.post-thumbnail, .entry-media, .thumb, .post-image){
  display: block;
  overflow: hidden;
  background: rgba(2,6,23,.04);
}

body.dbz-ui-polish .site-main :is(.post-thumbnail img, .entry-media img, .thumb img, .post-image img, img.wp-post-image){
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
  transform: scale(1.001);
  transition: transform .25s ease;
}

body.dbz-ui-polish .site-main :is(article.post, article.hentry, .post, .hentry):hover :is(.post-thumbnail img, img.wp-post-image){
  transform: scale(1.05);
}

/* Padding interne : propre + respirable */
body.dbz-ui-polish .site-main :is(.entry-header, .entry-content, .post-content, .post-inner){
  padding: 16px 18px 18px;
}

@media (max-width: 640px){
  body.dbz-ui-polish .site-main :is(.entry-header, .entry-content, .post-content, .post-inner){
	padding: 14px 14px 16px;
  }
}

/* Titres : moins gros + plus premium */
body.dbz-ui-polish .site-main :is(.entry-title, .post-title){
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  font-size: clamp(16px, 1.05vw + 12px, 20px);
  margin: 0 0 10px;
}

body.dbz-ui-polish .site-main :is(.entry-title a, .post-title a){
  color: inherit;
  text-decoration: none;

  /* clamp 3 lignes */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.dbz-ui-polish .site-main :is(.entry-title a, .post-title a):hover{
  color: var(--dbz-link);
}

/* Extrait / résumé */
body.dbz-ui-polish .site-main :is(.entry-summary, .post-excerpt, .excerpt){
  color: var(--dbz-muted);
  line-height: 1.55;
  font-size: 14px;
  margin: 0;
}

/* Meta (date/catégorie) */
body.dbz-ui-polish .site-main :is(.entry-meta, .post-meta, .meta){
  color: rgba(15,23,42,.55);
  font-size: 12px;
  margin-top: 10px;
}

/* Si tu as une grosse section “CAN/Top” trop haute → on réduit */
body.home.dbz-ui-polish :is(.hero, .home-hero, .dbz-hero, .featured, .km-hero, .ewa-hero){
  max-height: 520px;
}

body.home.dbz-ui-polish :is(.hero h1, .home-hero h1, .dbz-hero h1){
  font-size: clamp(22px, 2.2vw + 14px, 40px);
  line-height: 1.05;
}

/* Dark mode (compat large : class + data-theme) */
body.dbz-ui-polish:is(.dark, .theme-dark, .km-theme-dark),
html[data-theme="dark"] body.dbz-ui-polish,
body[data-theme="dark"].dbz-ui-polish,
body[data-km-theme="dark"].dbz-ui-polish{
  --dbz-bg: #0b1220;
  --dbz-text: #e5e7eb;
  --dbz-muted: rgba(229,231,235,.75);
  --dbz-card: rgba(15,23,42,.72);
  --dbz-border: rgba(148,163,184,.18);
  --dbz-shadow: 0 12px 34px rgba(0,0,0,.35);
  --dbz-shadow-hover: 0 18px 52px rgba(0,0,0,.45);
  --dbz-link: #60a5fa;
}

body.dbz-ui-polish:is(.dark, .theme-dark, .km-theme-dark) .site-main :is(.post-thumbnail, .entry-media, .thumb, .post-image){
  background: rgba(148,163,184,.08);
}

/* Respect accessibilité */
@media (prefers-reduced-motion: reduce){
  *{
	animation: none !important;
	transition: none !important;
	scroll-behavior: auto !important;
  }
}