/* Themes share the established slate / paper / logo-red palette. */
.wcd-home-themes { padding: 28px; background: #eeede7; border: 1px solid var(--wcd-line); border-radius: 18px; }
.wcd-theme-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.wcd-theme-grid a.wcd-theme-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; background: #fff; color: var(--wcd-ink); border: 1px solid var(--wcd-line); border-radius: 14px; text-decoration: none; box-shadow: 0 4px 15px rgba(31,51,55,.04); transition: transform .18s ease,box-shadow .18s ease; }
.wcd-theme-grid a.wcd-theme-card:hover { transform: translateY(-3px); box-shadow: var(--wcd-shadow); }
.wcd-theme-image { display: block; aspect-ratio: 4/3; padding: 14px; background: #f7f8f6; }
.wcd-theme-image img { display: block; width: 100%; height: 100%; max-height: 220px; object-fit: contain; border-radius: 5px; }
.wcd-theme-copy { display: flex; flex: 1; flex-direction: column; gap: 7px; padding: 16px; }
.wcd-theme-copy strong { display: block; color: var(--wcd-primary); font-size: 17px; line-height: 1.3; overflow-wrap: anywhere; }
.wcd-theme-copy small { display: block; font-size: 13px; line-height: 1.5; color: #626a6c; }
.wcd-theme-count { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 9px; color: var(--wcd-accent); font-size: 12px; font-weight: 700; }
.wcd-themes-directory { padding: clamp(16px,3vw,30px); border: 1px solid var(--wcd-line); border-radius: 18px; background: var(--wcd-paper); }
.wcd-themes-directory > header { margin-bottom: 24px; }
.wcd-themes-directory > header h2 { margin: 8px 0 12px; font-size: clamp(25px,3vw,36px); line-height: 1.2; color: var(--wcd-primary); }
.wcd-themes-directory > header p { margin: 0; color: var(--wcd-muted); }
body.wcd-themes-page .entry .wcd-theme-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
body.wcd-enabled .wcd-theme-sidebar { box-sizing: border-box; padding: 22px; margin: 0 0 28px; background: linear-gradient(135deg,#f5f3ee,#edf0ef); border: 1px solid var(--wcd-line); border-top: 4px solid var(--wcd-gold); border-radius: 15px; box-shadow: 0 8px 25px rgba(31,51,55,.055); }
body.wcd-enabled .wcd-theme-sidebar * { box-sizing: border-box; }
body.wcd-enabled .wcd-theme-sidebar h2 { padding: 0; margin: 0 0 8px; font-size: 21px; line-height: 1.3; color: var(--wcd-primary); }
body.wcd-enabled .wcd-theme-sidebar p { margin: 0 0 16px; color: #626a6c; font-size: 13px; line-height: 1.5; }
body.wcd-enabled .wcd-theme-sidebar nav { display: grid; gap: 7px; }
body.wcd-enabled .wcd-theme-sidebar nav a { display: grid; grid-template-columns: minmax(0,1fr) auto 10px; align-items: center; gap: 9px; min-height: 43px; width: 100%; padding: 10px 12px; margin: 0; background: rgba(255,255,255,.8); border: 1px solid #dfe4e1; border-radius: 9px; color: var(--wcd-ink) !important; font-size: 13px; line-height: 1.35; text-decoration: none; }
body.wcd-enabled .wcd-theme-sidebar nav a > span:first-child { overflow-wrap: anywhere; }
body.wcd-enabled .wcd-theme-sidebar nav a small { color: #626a6c; font-size: 11px; font-variant-numeric: tabular-nums; }
body.wcd-enabled .wcd-theme-sidebar nav a > span:last-child { color: var(--wcd-accent); font-size: 20px; line-height: 1; }
body.wcd-enabled .wcd-theme-sidebar nav a::before, body.wcd-enabled .wcd-theme-sidebar nav a::after { content: none !important; display: none !important; }
body.wcd-enabled .wcd-theme-sidebar nav a:hover, body.wcd-enabled .wcd-theme-sidebar nav a[aria-current="page"] { background: var(--wcd-primary); color: #fff !important; border-color: var(--wcd-primary); }
body.wcd-enabled .wcd-theme-sidebar nav a:hover small, body.wcd-enabled .wcd-theme-sidebar nav a:hover > span:last-child, body.wcd-enabled .wcd-theme-sidebar nav a[aria-current="page"] small, body.wcd-enabled .wcd-theme-sidebar nav a[aria-current="page"] > span:last-child { color: #fff; }
body.wcd-enabled .wcd-theme-sidebar .wcd-all-themes { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; color: var(--wcd-primary) !important; font-size: 13px; font-weight: 700; text-decoration: none; }
.wcd-theme-card:focus-visible, .wcd-theme-sidebar a:focus-visible { outline: 3px solid var(--wcd-gold); outline-offset: 3px; }
@media (max-width: 1100px) { .wcd-theme-grid, body.wcd-themes-page .entry .wcd-theme-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .wcd-home-themes { padding: 18px 14px; } .wcd-theme-grid { gap: 12px; } .wcd-theme-copy { padding: 12px; } .wcd-theme-copy strong { font-size: 15px; } .wcd-theme-image { padding: 10px; } }
@media (max-width: 380px) { .wcd-theme-grid, body.wcd-themes-page .entry .wcd-theme-grid { grid-template-columns: minmax(0,1fr); } }
@media (prefers-reduced-motion: reduce) { .wcd-theme-grid a.wcd-theme-card { transition: none; } .wcd-theme-grid a.wcd-theme-card:hover { transform: none; } }
