/* ══════════════════════════════════════════════════════════════════════════
   Gieldomania Theme — Custom Styles
   (Tailwind utilities provided by CDN; this file handles theme variables,
   custom utility classes, animations, and component styles)
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Theme Variables ──────────────────────────────────────────────────── */

:root {
    --transition-theme: background .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease;
}

[data-theme="dark"] {
    --bg-base: #111827;
    --bg-surface: #1f2937;
    --bg-card: rgba(31,41,55,0.7);
    --bg-card-solid: #1f2937;
    --bg-elevated: rgba(55,65,81,0.5);
    --bg-input: rgba(55,65,81,0.7);
    --border: rgba(75,85,99,0.5);
    --border-subtle: rgba(75,85,99,0.3);
    --text-primary: #f3f4f6;
    --text-secondary: #d1d5db;
    --text-muted: #9ca3af;
    --text-faint: #6b7280;
    --brand: #2d6ad6;
    --brand-soft: rgba(59,130,246,0.1);
    --brand-border: rgba(59,130,246,0.25);
    --gold: #f59e0b;
    --violet: #a78bfa;
    --gold-soft: rgba(245,158,11,0.1);
    --gold-border: rgba(245,158,11,0.25);
    --cyan: #06b6d4;
    --cyan-soft: rgba(6,182,212,0.1);
    --cyan-border: rgba(6,182,212,0.25);
    --orange: #f97316;
    --red: #ef4444;
    --header-bg: rgba(17,24,39,0.92);
    --hero-bg: linear-gradient(135deg, rgba(59,130,246,0.06), transparent 40%), linear-gradient(225deg, rgba(57,56,203,0.05), transparent 40%);
    --ticker-bg: rgba(17,24,39,0.9);
    --glow-line: linear-gradient(90deg, transparent, rgba(59,130,246,0.3), transparent);
    --section-divider: linear-gradient(90deg, transparent, rgba(75,85,99,0.4), transparent);
    --footer-bg: #111827;
    --footer-text: #9ca3af;
    --footer-heading: #d1d5db;
    --footer-hover: #f3f4f6;
    --footer-border: rgba(255,255,255,0.1);
    --footer-muted: #9ca3af;
    --footer-strong: #d1d5db;
    --footer-risk-bg: rgba(255,255,255,0.04);
    --scrollbar-track: #1f2937;
    --scrollbar-thumb: #4b5563;
    --tag-bg: rgba(55,65,81,0.5);
}

[data-theme="light"] {
    --bg-base: #fbfbfb;
    --bg-surface: #ffffff;
    --bg-card: #ffffff;
    --bg-card-solid: #ffffff;
    --bg-elevated: #f8f8f9;
    --bg-input: #f0f1f3;
    --border: #dfe3e7;
    --border-subtle: rgba(223,227,231,0.5);
    --text-primary: #191c1f;
    --text-secondary: #3d4349;
    --text-muted: #5c636a;
    --text-faint: #adb5bd;
    --brand: #0a67ee;
    --brand-soft: rgba(10,103,238,0.06);
    --brand-border: rgba(10,103,238,0.2);
    --gold: #d97706;
    --violet: #8b5cf6;
    --gold-soft: rgba(217,119,6,0.06);
    --gold-border: rgba(217,119,6,0.2);
    --cyan: #0891b2;
    --cyan-soft: rgba(8,145,178,0.06);
    --cyan-border: rgba(8,145,178,0.2);
    --orange: #ea580c;
    --red: #dc2626;
    --header-bg: rgba(251,251,251,0.95);
    --hero-bg: linear-gradient(135deg, rgba(10,103,238,0.03), transparent 40%), linear-gradient(225deg, rgba(10,103,238,0.03), transparent 40%);
    --ticker-bg: #18181b;
    --glow-line: linear-gradient(90deg, transparent, rgba(10,103,238,0.12), transparent);
    --section-divider: linear-gradient(90deg, transparent, rgba(223,227,231,0.6), transparent);
    --footer-bg: #18181b;
    --footer-text: #9ca3af;
    --footer-heading: #d1d5db;
    --footer-hover: #f3f4f6;
    --footer-border: rgba(255,255,255,0.1);
    --footer-muted: #9ca3af;
    --footer-strong: #d1d5db;
    --footer-risk-bg: rgba(255,255,255,0.04);
    --scrollbar-track: #e9ecef;
    --scrollbar-thumb: #adb5bd;
    --tag-bg: #f0f1f3;
}

/* ── Global border-radius override (0.625rem — kontomaniak style) ──── */

.rounded-xl,
.rounded-2xl,
.rounded-3xl { border-radius: 0.625rem !important; }

/* ── Ranking cards — subtle shadow like kontomaniak ─────────────────── */

.bg-card {
    box-shadow: 0 2px 8px rgba(25,28,31,0.10);
}

/* ── Base ─────────────────────────────────────────────────────────────── */

body {
    background: var(--bg-base);
    color: var(--text-primary);
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 500;
    transition: var(--transition-theme);
}

a { transition: color .15s ease; }

::-webkit-scrollbar { width: 7px; }
::-webkit-scrollbar-track { background: var(--scrollbar-track); }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 4px; }

/* ── Utility classes (CSS variable-backed) ────────────────────────────── */

.bg-base       { background: var(--bg-base); transition: var(--transition-theme); }
.bg-surface    { background: var(--bg-surface); transition: var(--transition-theme); }
.bg-card       { background: var(--bg-card); transition: var(--transition-theme); }
.bg-card-solid { background: var(--bg-card-solid); transition: var(--transition-theme); }
.bg-elevated   { background: var(--bg-elevated); transition: var(--transition-theme); }
.bg-input      { background: var(--bg-input); transition: var(--transition-theme); }

.b  { border-color: var(--border); transition: var(--transition-theme); }
.bs { border-color: var(--border-subtle); transition: var(--transition-theme); }

.t1 { color: var(--text-primary); transition: var(--transition-theme); }
.t2 { color: var(--text-secondary); transition: var(--transition-theme); }
.t3 { color: var(--text-muted); transition: var(--transition-theme); }
.t4 { color: var(--text-faint); transition: var(--transition-theme); }

.c-brand { color: var(--brand); }
.c-gold  { color: var(--gold); }
.c-cyan  { color: var(--cyan); }

.bg-brand-s { background: var(--brand-soft); }
.bg-gold-s  { background: var(--gold-soft); }
.bg-cyan-s  { background: var(--cyan-soft); }

.b-brand { border-color: var(--brand-border); }
.b-gold  { border-color: var(--gold-border); }
.b-cyan  { border-color: var(--cyan-border); }

.divider { background: var(--section-divider); height: 1px; }
.tag-bg  { background: var(--tag-bg); transition: var(--transition-theme); }

/* ── Animations ───────────────────────────────────────────────────────── */

@keyframes ticker {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.ticker-scroll { animation: ticker 30s linear infinite; }
.ticker-scroll:hover { animation-play-state: paused; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.fade-up { animation: fadeUp .55s ease-out forwards; opacity: 0; }
.fd1 { animation-delay: .08s; }
.fd2 { animation-delay: .16s; }
.fd3 { animation-delay: .24s; }
.fd4 { animation-delay: .32s; }
.fd5 { animation-delay: .4s; }

/* ── Components ───────────────────────────────────────────────────────── */

/* Card hover lift */
.card-lift {
    transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s;
}
.card-lift:hover {
    transform: translateY(-4px);
}
[data-theme="dark"] .card-lift:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,.3), 0 0 30px rgba(59,130,246,.08);
}
[data-theme="light"] .card-lift:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,.06), 0 0 20px rgba(59,130,246,.05);
}

/* Line clamp */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Star rating */
.star-rating { --percent: 0%; }
.star-rating::before {
    content: '\2605\2605\2605\2605\2605';
    letter-spacing: 2px;
    font-size: 13px;
    background: linear-gradient(90deg, #f59e0b var(--percent), var(--text-faint) var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Mega menu */
.mega-menu {
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all .25s ease;
}
.nav-item:hover .mega-menu,
.nav-item:focus-within .mega-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Nav link hover */
.nav-link { transition: color .15s; }
[data-theme="dark"] .nav-link:hover  { color: #ffffff; }
[data-theme="light"] .nav-link:hover { color: #0f172a; }

/* Tab active */
.tab-active {
    color: var(--brand) !important;
    border-bottom: 2px solid var(--brand);
}

/* Theme toggle */
.theme-toggle {
    position: relative;
    width: 52px;
    height: 28px;
    border-radius: 14px;
    cursor: pointer;
    transition: background .3s;
}
.theme-toggle .knob {
    position: absolute;
    top: 3px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    transition: left .3s cubic-bezier(.34,1.56,.64,1), background .3s;
}
[data-theme="dark"] .theme-toggle       { background: #374151; }
[data-theme="dark"] .theme-toggle .knob { left: 3px; background: #f59e0b; }
[data-theme="light"] .theme-toggle       { background: #cbd5e1; }
[data-theme="light"] .theme-toggle .knob { left: 27px; background: #3b82f6; }

/* Ranking nav cards (hero) */
.rank-nav {
    transition: transform .2s, border-color .2s, box-shadow .2s;
}
.rank-nav:hover {
    transform: translateX(4px);
}
[data-theme="dark"] .rank-nav:hover  { box-shadow: 0 4px 20px rgba(0,0,0,.3); }
[data-theme="light"] .rank-nav:hover { box-shadow: 0 4px 20px rgba(0,0,0,.06); }

/* Comparison row */
.comparison-row { transition: background .15s; }
.comparison-row:hover { background: var(--brand-soft); }

/* ── Plugin component classes (plain CSS equivalents of @apply) ──────── */

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    font-weight: 600;
    font-size: 0.875rem;
    transition: color .15s, background-color .15s;
}
.btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(45,106,214,0.5);
}
.btn-primary {
    background-color: #2d6ad6;
    color: #fff;
}
.btn-primary:hover { background-color: #1e429f; }
.btn-secondary {
    border: 1px solid #2d6ad6;
    color: #2d6ad6;
    background: transparent;
}
.btn-secondary:hover {
    background-color: #2d6ad6;
    color: #fff;
}
.btn-success {
    background-color: #057a55;
    color: #fff;
}
.btn-success:hover { opacity: 0.9; }

/* Score bar */
.skill-bar {
    position: relative;
    width: 100%;
    height: 0.75rem;
    background-color: #e5e7eb;
    border-radius: 0.25rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.skill-percentage {
    height: 100%;
    border-radius: 0.25rem;
    transition: all 0.5s;
}
.skill-percentage.green  { background-color: #057a55; }
.skill-percentage.yellow { background-color: #c27803; }
.skill-percentage.red    { background-color: #c81e1e; }

/* Info rows */
.info_row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.875rem;
}
.info_row.no-border { border-bottom: 0; }
.info_row .info_right.yes, td.yes { color: #057a55; font-weight: 600; }
.info_row .info_right.no, td.no   { color: #c81e1e; font-weight: 600; }

/* Trophy */
.lbTrophy svg.bi-trophy-fill-gold   { color: #facc15; }
.lbTrophy svg.bi-trophy-fill-silver { color: #9ca3af; }
.lbTrophy svg.bi-trophy-fill-brown  { color: #b45309; }

/* Alert / promo box */
.alert-hot {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    border-radius: 0.25rem;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

/* ── Ranking: detail rows – extra spacing on <br> ─────────────────────── */
.bg-elevated br { display: block; content: ""; margin-top: 0.5rem; }

/* ── Ranking: pros/cons/promotions ACF HTML ───────────────────────────── */

.gm-pros-cons { color: var(--text-primary); }
.gm-pros-cons ul { list-style: none; padding: 0; margin: 0; }
.gm-pros-cons li,
.gm-pros-cons p { position: relative; padding-left: 1.75rem; margin: 0 0 0.35rem; line-height: 1.5; }
.gm-pros-cons li::before,
.gm-pros-cons p::before {
    position: absolute; left: 0; top: 0.1rem;
    width: 1.125rem; height: 1.125rem;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.625rem; font-weight: 700; line-height: 1;
    text-align: center;
}
.gm-pros li::before, .gm-pros p::before {
    content: "✓"; color: #fff; background: #1aa023;
}
.gm-cons li::before, .gm-cons p::before {
    content: "✕"; color: #fff; background: #e14427;
}

/* Subtle background highlight for pros/cons containers */
.gm-pros {
    background: #e8faea;
    border-radius: 0.5rem;
    padding: 0.75rem 0.75rem;
}
.gm-cons {
    background: #fff4f3;
    border-radius: 0.5rem;
    padding: 0.75rem 0.75rem;
}
[data-theme="dark"] .gm-pros {
    background: rgba(26,160,35,0.1);
}
[data-theme="dark"] .gm-cons {
    background: rgba(225,68,39,0.1);
}
.gm-promotions { line-height: 1.8 !important; }
.gm-promotions ul { list-style: disc; padding-left: 1.25rem; margin: 0; }
.gm-promotions li { margin-bottom: 0.25rem; }
.gm-promotions a { color: var(--brand) !important; font-weight: 600; }
.gm-promotions a:hover { opacity: 0.8; }
@media (max-width: 639px) {
    .gm-promotions { text-align: center; }
    .gm-promotions ul { list-style-position: inside; padding-left: 0; }
    /* Mobile: only force-center floated images that occupy > 2/3 of content width (set via JS) */
    .entry-content .gm-force-center-mobile {
        float: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 1.75rem !important;
        margin-bottom: 1.25rem !important;
        display: block;
        text-align: center;
    }
    .entry-content .gm-force-center-mobile img {
        max-width: 100% !important;
        height: auto !important;
    }
}
.gm-description p { margin-bottom: 0.75rem; }
.gm-description p:last-child { margin-bottom: 0; }

/* Logo pill — subtle bg per theme */
[data-theme="dark"] .gm-logo-bg { background: rgba(255,255,255,0.08); }

/* Ranking spacing in content */
.entry-content .gm-ranking { margin-bottom: 2rem; }

/* Light mode ranking cards — more contrast */
[data-theme="light"] .gm-ranking > div > .bg-card {
    box-shadow: 0 2px 8px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.06);
    border-color: rgba(0,0,0,0.10);
}
[data-theme="light"] .gm-ranking .bg-elevated {
    background: var(--bg-base);
}
[data-theme="light"] .gm-ranking .gm-score-wrap .bg-elevated,
[data-theme="light"] .gm-score-wrap .bg-elevated {
    background: var(--bg-elevated);
}

/* Dark mode ranking cards */
[data-theme="dark"] .gm-ranking > div > .bg-card {
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

/* CTA button in ranking + widgets */
.gm-cta-btn {
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(45,106,214,0.3);
}
.gm-cta-btn:hover {
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(45,106,214,0.4);
    transform: translateY(-1px);
}

/* Score tooltip on hover */
.gm-score-wrap:hover .gm-score-tooltip { display: block; }
/* Suppress tooltip when hovering only the rank-info text/link. */
.gm-score-wrap:has(.gm-rank-info:hover) .gm-score-tooltip { display: none; }
@media (max-width: 639px) {
    .gm-score-wrap:hover .gm-score-tooltip { display: none; }
}

/* ── Notice boxes (converted from ub/styled-box) — alias to .gm-box ───── */
.gm-notice { margin: 20px 0 !important; padding: 1rem 1.25rem; border-radius: 0.5rem; font-size: inherit; line-height: 1.7; color: #1a1a1a; }
.gm-notice > *:first-child { margin-top: 0; }
.gm-notice > *:last-child  { margin-bottom: 0; }
.gm-notice--info    { background: #d9edf7; border-left: 4px solid #31708f; }
.gm-notice--warning { background: #ffdd80; border-left: 4px solid #eaac00; }
.gm-notice--danger  { background: #ffd2d2; border-left: 4px solid #c0392b; }
.gm-notice--success { background: #dff0d8; border-left: 4px solid #3c763d; }
.gm-notice--neutral { background: #f5f5f5; border-left: 4px solid #999; }
[data-theme="dark"] .gm-notice { background-color: var(--gm-box-bg-dark, #2a2a2a) !important; color: #e5e5e5; }

/* ── Entry Content Typography ────────────────────────────────────────── */

.entry-content {
    color: var(--text-primary);
    font-size: 1rem;
    line-height: 1.8;
}

.entry-content h2 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 600;
    font-size: 1.7rem;
    line-height: 1.3;
    color: var(--text-primary);
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

.entry-content h3 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    line-height: 1.35;
    color: var(--text-primary);
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

.entry-content h4 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 600;
    font-size: 1.25rem;
    line-height: 1.4;
    color: var(--text-primary);
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
}

.entry-content > h2:first-child,
.entry-content > h3:first-child {
    margin-top: 0;
}

.entry-content p {
    margin-bottom: 1.25rem;
    color: var(--text-secondary);
}

.entry-content p:last-child { margin-bottom: 0; }

.entry-content strong,
.entry-content b {
    font-weight: 600;
    color: var(--text-primary);
}
.entry-content a strong,
.entry-content a b {
    color: inherit;
}

.entry-content a {
    color: var(--brand);
    font-weight: 600;
    text-decoration: none;
}
.entry-content a.text-white { color: #fff !important; }

.entry-content a:hover {
    opacity: 0.8;
}

/* Don't override styles inside ranking shortcodes */
.entry-content .gm-pros-cons p,
.entry-content .gm-pros-cons li {
    margin: 0 0 0.35rem;
    color: inherit;
}
.entry-content .gm-ranking a:hover,
.gm-ranking a:hover {
    text-decoration: none;
}
.entry-content .gm-ranking a.text-white {
    color: #fff !important;
}

.entry-content ul,
.entry-content ol {
    margin-bottom: 1.25rem;
    padding-left: 1.5rem;
    color: var(--text-secondary);
}

.entry-content ul { list-style-type: disc; }
.entry-content ol { list-style-type: decimal; }

.entry-content li {
    margin-bottom: 0.375rem;
    line-height: 1.7;
}

.entry-content li::marker { color: var(--text-muted); }

.entry-content ul ul,
.entry-content ol ul { list-style-type: circle; margin-top: 0.375rem; margin-bottom: 0; }

.entry-content ul ol,
.entry-content ol ol { margin-top: 0.375rem; margin-bottom: 0; }

.entry-content blockquote {
    border-left: 3px solid var(--brand);
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
    background: var(--bg-elevated);
    border-radius: 0 0.5rem 0.5rem 0;
    color: var(--text-secondary);
    font-style: italic;
}

.entry-content blockquote p { margin-bottom: 0; }

.entry-content .gm-table-wrap {
    margin-bottom: 0;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.entry-content table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
    margin: 0;
}

.entry-content th,
.entry-content td {
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    word-break: normal !important;
    overflow-wrap: break-word;
}

.entry-content tr:first-child th,
.entry-content tr:first-child td { border-top: none; }
.entry-content tr:last-child th,
.entry-content tr:last-child td { border-bottom: none; }
.entry-content th:first-child,
.entry-content td:first-child { border-left: none; }
.entry-content th:last-child,
.entry-content td:last-child { border-right: none; }

.entry-content th {
    background: #ffffff;
    font-weight: 700;
    text-align: left;
    color: var(--text-primary);
    font-size: 0.8125rem;
    letter-spacing: 0.02em;
}

.entry-content td {
    color: var(--text-secondary);
}

.entry-content tbody tr { background: #ffffff; }
.entry-content tbody tr:hover { background: #fbfbfb; }
.wp-block-table thead { background: #ffffff; border-bottom: 1px solid var(--border); }

[data-theme="dark"] .entry-content .gm-table-wrap {
    border-color: #3f4550;
}

[data-theme="dark"] .entry-content th,
[data-theme="dark"] .entry-content td {
    border-color: #3f4550;
}

[data-theme="dark"] .entry-content th {
    background: #1e2230;
}

[data-theme="dark"] .entry-content tbody tr { background: transparent; }
[data-theme="dark"] .entry-content tbody tr:nth-child(even) { background: rgba(255,255,255,0.03); }
[data-theme="dark"] .entry-content tbody tr:hover { background: rgba(255,255,255,0.05); }
[data-theme="dark"] .wp-block-table thead { background: transparent; }

.entry-content img {
    border-radius: 0.5rem;
    height: auto;
    max-width: 100%;
}
.gm-logo-bg img,
.gm-ranking img {
    border-radius: 0 !important;
}

.entry-content figure { margin: 1.5rem 0; }

.entry-content figcaption {
    font-size: 0.8125rem;
    color: var(--text-muted);
    margin-top: 0.5rem;
    text-align: center;
}

.entry-content code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.875em;
    background: var(--bg-elevated);
    padding: 0.15em 0.4em;
    border-radius: 0.25rem;
    color: var(--text-primary);
}

.entry-content pre {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    overflow-x: auto;
    margin-bottom: 1.5rem;
    font-size: 0.875rem;
    line-height: 1.6;
}

.entry-content pre code {
    background: none;
    border-radius: 0;
    padding: 0;
}

/* Separator styles moved to styled-boxes.php inline CSS (applies to both editor & front). */

.entry-content .aligncenter { display: block; margin-left: auto; margin-right: auto; }
.entry-content .alignleft { float: left; margin-right: 1.5rem; margin-bottom: 1rem; }
.entry-content .alignright { float: right; margin-left: 1.5rem; margin-bottom: 1rem; }
.entry-content .wp-caption { max-width: 100%; }
.entry-content .alignwide,
.entry-content .alignfull { max-width: 100%; }

/* WP block image wrappers — pass float through to the wrapper div */
.entry-content .wp-block-image { margin: 1.5rem 0; }
.entry-content .wp-block-image.alignright,
.entry-content .wp-block-image:has(.alignright) {
    float: right;
    margin: 0.25rem 0 1rem 1.5rem;
    width: auto;
}
.entry-content .wp-block-image.alignleft,
.entry-content .wp-block-image:has(.alignleft) {
    float: left;
    margin: 0.25rem 1.5rem 1rem 0;
}
.entry-content .wp-block-image.aligncenter,
.entry-content .wp-block-image:has(.aligncenter) {
    float: none;
    margin-left: auto;
    margin-right: auto;
}
.entry-content .wp-block-image figure { margin: 0; display: block; width: 100%; }
.entry-content .wp-block-image figure.aligncenter,
.entry-content .wp-block-image figure.aligncenter.is-resized {
    margin-left: auto !important;
    margin-right: auto !important;
}
.entry-content .wp-block-image figure.aligncenter img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.entry-content .wp-block-image img { border-radius: 0.5rem; height: auto; max-width: 100%; }
.entry-content .wp-block-image figcaption { display: block; width: 100%; text-align: center; }

/* Resized image fix: figure takes img width, caption wraps to that width */
.entry-content .wp-block-image figure.is-resized {
    display: table;
    width: auto;
}
.entry-content .wp-block-image figure.is-resized > figcaption {
    display: table-caption;
    caption-side: bottom;
    width: auto;
}

/* Gallery block alignment - override generic .aligncenter display:block */
.entry-content .wp-block-gallery { margin: 1.5rem 0; }
.entry-content .wp-block-gallery.is-layout-flex { display: flex; flex-wrap: wrap; }
.entry-content .wp-block-gallery.aligncenter { justify-content: center; text-align: center; }
.entry-content .wp-block-gallery.alignleft { justify-content: flex-start; }
.entry-content .wp-block-gallery.alignright { justify-content: flex-end; }
.entry-content .wp-block-gallery > figure.wp-block-image { margin: 0; }
.entry-content .wp-block-gallery > figcaption { width: 100%; text-align: center; }
.entry-content .wp-block-gallery .wp-block-image img { border-radius: 0.5rem; }

/* Legacy .buttonfirma .button3 - style as primary CTA button */
.entry-content :has(> .buttonfirma) {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin: 1rem 0;
}
.entry-content .buttonfirma { display: inline-flex; }
.entry-content .buttonfirma .button3 {
    display: inline-block;
    background: var(--brand);
    color: #fff !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.75rem 2rem;
    border-radius: 0.75rem;
    text-decoration: none;
    transition: opacity 0.2s;
}
.entry-content .buttonfirma .button3:hover { opacity: 0.9; }

/* Standalone .button3 in posts (not inside .buttonfirma) - same primary CTA style */
.entry-content .button3 {
    display: inline-block;
    background: var(--brand);
    color: #fff !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.75rem 2rem;
    border-radius: 0.75rem;
    text-decoration: none;
    transition: opacity 0.2s;
}
.entry-content .button3:hover { opacity: 0.9; }
.entry-content p:has(> .button3) { text-align: center; margin: 1rem 0; }

/* Native wp:button block - brand styling */
.entry-content .wp-block-buttons { margin: 1rem 0; gap: 0.75rem; }
.entry-content .wp-block-button__link {
    background: var(--brand) !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.75rem 2rem;
    border-radius: 0.75rem !important;
    text-decoration: none;
    transition: opacity 0.2s;
}
.entry-content .wp-block-button__link:hover { opacity: 0.9; }
.entry-content .wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent !important;
    color: var(--brand) !important;
    border: 2px solid var(--brand);
}

/* ── Entry meta & navigation links ──────────────────────────────────── */

.entry-meta a { color: var(--text-muted); transition: color 0.15s; }
.entry-meta a:hover { color: var(--brand); }

.post-navigation a { color: var(--text-secondary); transition: color 0.15s; }
.post-navigation a:hover { color: var(--brand); }

/* ── Author badge tooltip ────────────────────────────────────────────── */

.gm-author-badge { position: relative; }
.gm-author-tooltip {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: 0.5rem;
    z-index: 30;
    width: 22rem;
}
.gm-author-badge:hover .gm-author-tooltip { display: block; }
@media (max-width: 639px) {
    .gm-author-badge:hover .gm-author-tooltip { display: none; }
}

/* ── Styled Boxes (callout/notification) ───────────────────────────── */

.gm-box {
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border-radius: 0.5rem;
    font-size: inherit;
    line-height: 1.7;
    color: #1a1a1a;
}
.gm-box > *:first-child { margin-top: 0; }
.gm-box > *:last-child { margin-bottom: 0; }
.gm-box p { margin-bottom: 0.5rem; color: #1a1a1a; }
.gm-box strong, .gm-box b { color: #1a1a1a; }
.gm-box a { color: var(--brand); font-weight: 600; text-decoration: none; }

/* Notification — left border accent */
.gm-box--notification,
.gm-box--warning {
    background: #fef9e7;
    border-left: 4px solid #f59e0b;
}

/* Info */
.gm-box--info {
    background: #eff6ff;
    border-left: 4px solid var(--brand);
}

/* Success */
.gm-box--success {
    background: #ecfdf5;
    border-left: 4px solid #10b981;
}

/* Error */
.gm-box--error {
    background: #fef2f2;
    border-left: 4px solid #ef4444;
}

/* Dark mode: use darkened bg computed in PHP */
[data-theme="dark"] .gm-box {
    background-color: var(--gm-box-bg-dark, #2a2a2a) !important;
    color: #e5e5e5;
}
[data-theme="dark"] .gm-box p,
[data-theme="dark"] .gm-box strong,
[data-theme="dark"] .gm-box b,
[data-theme="dark"] .gm-box a {
    color: #e5e5e5;
}

/* Bordered */
.gm-box--bordered {
    border: 2px solid var(--border);
    background: transparent;
}

/* Number box */
.gm-box--number {
    display: flex;
    gap: 1rem;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
}
.gm-box__number-panel {
    flex: 1;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    padding: 1.25rem;
    text-align: center;
    background: var(--bg-card);
}
.gm-box__number-circle {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--bg-elevated);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: -2.5rem auto 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
}
.gm-box__number-title {
    font-weight: 700;
    font-size: 1.125rem;
    margin-bottom: 0.5rem;
    color: var(--text-primary);
}
.gm-box__number-body {
    font-size: 0.875rem;
    color: var(--text-secondary);
}

/* Feature box */
.gm-box--feature {
    display: flex;
    gap: 1rem;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
}
.gm-box__feature {
    flex: 1;
    text-align: center;
    padding: 1rem;
}
.gm-box__feature-img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}
.gm-box__feature-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0.75rem 0 0.5rem;
    color: var(--text-primary);
}
.gm-box__feature-body {
    font-size: 0.875rem;
    color: var(--text-secondary);
}

@media (max-width: 639px) {
    .gm-box--number,
    .gm-box--feature { flex-direction: column; }
}

/* Override entry-content styles inside boxes */
.entry-content .gm-box p,
.entry-content .gm-box strong,
.entry-content .gm-box b {
    margin-bottom: 0.5rem;
    color: inherit;
}
.entry-content .gm-box a {
    color: var(--brand);
    text-decoration: none;
}

/* ── FAQ / Content Toggle (accordion) ───────────────────────────────── */

.gm-faq {
    margin: 1.5rem 0;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.gm-faq__panel {
    border-top: 1px solid var(--border);
}

.gm-faq__panel:first-child {
    border-top: none;
}

.gm-faq__title,
.gm-faq__panel > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    list-style: none;
    background: var(--bg-elevated);
    transition: background 0.15s;
}

.gm-faq__title::-webkit-details-marker,
.gm-faq__panel > summary::-webkit-details-marker { display: none; }

.gm-faq__title::after,
.gm-faq__panel > summary::after {
    content: '';
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid var(--text-muted);
    border-bottom: 2px solid var(--text-muted);
    transform: rotate(45deg);
    transition: transform 0.2s;
    flex-shrink: 0;
}

.gm-faq__panel[open] > .gm-faq__title,
.gm-faq__panel[open] > summary {
    background: var(--bg-card);
}

.gm-faq__panel[open] > .gm-faq__title::after,
.gm-faq__panel[open] > summary::after {
    transform: rotate(-135deg);
}

.gm-faq__title:hover,
.gm-faq__panel > summary:hover {
    background: var(--bg-card);
}

.gm-faq__content,
.gm-faq__panel > :not(summary) {
    padding: 0.75rem 1.25rem 1.25rem;
    font-size: 0.9375rem;
    line-height: 1.7;
    color: var(--text-primary);
    background: var(--bg-card);
}

.gm-faq__content > *:last-child,
.gm-faq__panel > :not(summary):last-child { margin-bottom: 0; }

.entry-content .gm-faq__content p,
.entry-content .gm-faq__panel > :not(summary) p {
    color: var(--text-primary);
    margin-bottom: 0.75rem;
}

/* ── Table of Contents ────────────────────────────────────────────── */

.gm-toc {
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    background: var(--bg-card);
    margin-bottom: 2rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.gm-toc__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.25rem;
    cursor: pointer;
}

.gm-toc__title {
    font-weight: 700;
    font-size: 0.9375rem;
    color: var(--text-primary);
}

.gm-toc__toggle {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--brand);
}

.entry-content .gm-toc__list,
.entry-content .gm-toc__list ul {
    list-style: none !important;
    margin-bottom: 0 !important;
}

.entry-content .gm-toc__list li::marker {
    content: none;
}

.gm-toc__list {
    padding: 0 1.25rem 0.75rem 2rem !important;
    margin: 0;
}

.gm-toc__list ul {
    padding-left: 1.5rem !important;
    margin: 0;
}

.gm-toc__list li,
.entry-content .gm-toc__list li {
    padding: 0.1rem 0;
    line-height: 1.5;
    margin-bottom: 0 !important;
}

.gm-toc__list a {
    color: var(--text-secondary);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.15s;
}

.gm-toc__list a:hover {
    color: var(--brand);
    font-weight: 600;
}

.gm-toc--collapsed .gm-toc__list {
    display: none;
}

/* ── Ad Inserter ─────────────────────────────────────────────────────── */

.gm-ad {
    margin: 1.5rem 0;
    text-align: center;
    clear: both;
}

.gm-ad img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
}

/* Ad box-info — promo banner (text + logo) */
.box-info {
    display: block;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    background: var(--bg-card);
    clear: both;
}

.box-info a {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: var(--text-primary);
    font-weight: 400;
    text-decoration: none;
    text-align: left;
}

.box-info a:hover {
    opacity: 0.85;
}

.box-info img {
    flex: 0 0 auto;
    width: 150px;
    max-height: 48px;
    object-fit: contain;
}

.box-info .box-icon {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.entry-content .box-info a {
    color: var(--text-primary);
    font-weight: 400;
    text-decoration: none;
}

@media (max-width: 639px) {
    .box-info {
        padding: 0.75rem;
    }
    .box-info a {
        flex-direction: column;
        text-align: center;
    }
    .box-info span {
        margin-bottom: 0.5rem;
    }
    .box-info img {
        width: 120px;
        margin: 0 auto;
    }
}

/* ── Comparison table (widgets) ─────────────────────────────────────── */

.gm-compare-table {
    display: flex;
    flex-direction: column;
}
.gm-compare-row {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--border);
    min-height: 2.25rem;
}
.gm-compare-row:last-child {
    border-bottom: 0;
}
.gm-compare-header {
    border-bottom-width: 2px;
    padding-bottom: 0.5rem;
    margin-bottom: 0.25rem;
}
.gm-compare-section {
    border-bottom: 0;
    margin-top: 1.25rem;
}
.gm-compare-header + .gm-compare-section {
    margin-top: 0;
}
.gm-detail-text {
    font-size: 0.85rem;
    line-height: 1.4;
}
.gm-compare-stretch {
    align-items: stretch;
}
.gm-compare-stretch .gm-compare-cell {
    display: flex;
}
.gm-compare-stretch .gm-compare-cell > .gm-pros-cons {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    text-align: left;
}
.gm-compare-stretch .gm-compare-label {
    display: flex;
    align-items: center;
}
.gm-compare-label {
    flex: 0 0 11rem;
    font-size: 0.85rem;
    line-height: 1.1rem;
    color: var(--text-tertiary);
    padding: 0.375rem 0 0.375rem 0.75rem;
}
.gm-compare-cell {
    flex: 1;
    font-size: 0.85rem;
    line-height: 1.1rem;
    color: var(--text-primary);
    text-align: center;
    padding: 0.375rem 0.25rem;
}
.gm-compare-full {
    flex: 1;
}

@media (max-width: 639px) {
    .gm-compare-row {
        flex-wrap: wrap;
    }
    .gm-compare-stretch .gm-compare-cell {
        flex: 1 1 0;
        min-width: 0;
    }
    .gm-compare-label {
        flex: 0 0 100%;
        font-size: 0.75rem;
        padding-bottom: 0;
        text-align: center;
    }
    .gm-compare-stretch .gm-compare-label {
        display: block;
        text-align: center;
    }
    .gm-compare-section .gm-compare-full {
        text-align: center;
    }
    .gm-compare-header .gm-compare-cell {
        padding: 0.25rem 0;
    }
}

/* ── Score Component Tooltips ─────────────────────────────────── */

.gm-score-tip {
    position: relative;
    cursor: help;
    border-bottom: 1px dotted var(--text-muted);
}
.gm-score-tip-content {
    display: none;
    position: absolute;
    left: 0;
    bottom: calc(100% + 0.5rem);
    width: 18rem;
    padding: 0.75rem 1rem;
    background: var(--bg-card-solid);
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    font-size: 0.6875rem;
    line-height: 1.5;
    color: var(--text-secondary);
    z-index: 50;
    pointer-events: none;
}
.gm-score-tip-content b {
    color: var(--text-primary);
}
.gm-score-tip:hover .gm-score-tip-content,
.gm-score-tip:focus .gm-score-tip-content {
    display: block;
}
@media (max-width: 639px) {
    .gm-score-tip-content {
        width: 18rem;
        max-width: calc(100vw - 1rem);
        left: 0;
        right: auto;
    }
}

/* Report CTA: smaller font + center everything on mobile */
@media (max-width: 659px) {
    .gm-report-cta { flex-direction: column; justify-content: center; text-align: center; }
    .gm-report-cta > div { justify-content: center; }
}

/* Detail rows: label wraps only on spaces (no mid-word breaks), value can break harder */
.flex.justify-between > .gm-detail-text:first-child {
    flex: 0 1 auto !important;
    min-width: 0;
    max-width: 40%;
    overflow-wrap: break-word;
}
.flex.justify-between > .gm-detail-text + .gm-detail-text {
    flex: 1 1 0%;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: normal;
}

/* Below 460px: ranking CTAs - row 1 (offer + review), row 2 (details full width) */
@media (max-width: 459px) {
    .gm-crypto-ctas {
        grid-template-columns: 1fr 1fr !important;
    }
    .gm-crypto-ctas > *:nth-child(3) {
        grid-column: 1 / -1;
    }
}

/* ── Image Lightbox ───────────────────────────────────────────── */

.gm-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.85);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
    cursor: zoom-out;
    padding: 2rem;
}
.gm-lightbox--open {
    opacity: 1;
    visibility: visible;
}
.gm-lightbox img {
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 0.5rem;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
    transform: scale(0.95);
    transition: transform .25s ease;
}
.gm-lightbox--open img {
    transform: scale(1);
}

/* ── Methodology modal ──────────────────────────────────────────────── */

.gm-methodology-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
    padding: 1rem;
}
.gm-methodology-modal--open {
    opacity: 1;
    visibility: visible;
}
.gm-methodology-modal__card {
    width: 100%;
    max-width: 36rem;
    transform: translateY(1rem);
    transition: transform .2s ease;
}
.gm-methodology-modal--open .gm-methodology-modal__card {
    transform: translateY(0);
}
.gm-methodology-modal__card h3,
.gm-report-modal__card h3 {
    margin-top: 0;
}

/* ── Ranking filter toggles ────────────────────────────────────────── */

.gm-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
}

.gm-filter-switch {
    position: relative;
    width: 2.25rem;
    height: 1.25rem;
    border-radius: 0.625rem;
    background: var(--bg-input);
    border: 1px solid var(--border);
    transition: background .2s, border-color .2s;
    flex-shrink: 0;
}

.gm-filter-switch::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 50%;
    background: var(--text-muted);
    transition: transform .2s, background .2s;
}

.gm-filter-cb:checked + .gm-filter-switch {
    background: var(--brand);
    border-color: var(--brand);
}

.gm-filter-cb:checked + .gm-filter-switch::after {
    transform: translateX(1rem);
    background: #fff;
}

/* Dual-range price slider */
.gm-range-wrap {
    position: relative;
    height: 2rem;
}
.gm-range-wrap input[type="range"] {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    margin: 0;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    z-index: 2;
}
.gm-range-wrap input[type="range"]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    background: transparent;
    height: 4px;
}
.gm-range-wrap input[type="range"]::-moz-range-track {
    background: transparent;
    border: none;
    height: 4px;
}
.gm-range-wrap input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    pointer-events: auto;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--brand);
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.3);
    cursor: pointer;
}
.gm-range-wrap input[type="range"]::-moz-range-thumb {
    pointer-events: auto;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--brand);
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.3);
    cursor: pointer;
}
.gm-range-track {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 4px;
    background: #d1d5db;
    border-radius: 2px;
    z-index: 1;
}
html.dark .gm-range-track {
    background: #4b5563;
}
.gm-range-fill {
    position: absolute;
    height: 100%;
    background: var(--brand);
    border-radius: 2px;
}

/* ── Report error modal ─────────────────────────────────────────────── */

.gm-report-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
    padding: 1rem;
}
.gm-report-modal--open {
    opacity: 1;
    visibility: visible;
}
.gm-report-modal__card {
    width: 100%;
    max-width: 42rem;
    transform: translateY(1rem);
    transition: transform .2s ease;
}
.gm-report-modal--open .gm-report-modal__card {
    transform: translateY(0);
}

/* ── Pagination ──────────────────────────────────────────────────────── */

.nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}
.nav-links a,
.nav-links span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.625rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    transition: background .15s, color .15s;
}
.nav-links a {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border);
}
.nav-links a:hover {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}
.nav-links .current {
    background: var(--brand);
    color: #fff;
    font-weight: 600;
}
.nav-links .dots {
    border: none;
    background: none;
    color: var(--text-muted);
    min-width: auto;
    padding: 0 0.25rem;
}
.nav-links .prev,
.nav-links .next {
    font-weight: 600;
}

/* ── Footer ──────────────────────────────────────────────────────────── */

.gm-footer-link {
    display: block;
    font-size: 0.875rem;
    color: var(--footer-text);
    transition: color .15s;
}
.gm-footer-link:hover {
    color: var(--footer-hover);
}

/* ── Tailwind spacing override ──────────────────────────────────────── */

.p-4 { padding: 1.25rem !important; }

/* ── UB Button block ────────────────────────────────────────────────── */

.gm-ub-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin: 1.5rem 0;
}
.gm-ub-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.625rem 1.25rem;
    font-weight: 600;
    color: #fff !important;
    text-decoration: none;
    transition: opacity 0.15s;
}
.gm-ub-btn,
.gm-ub-btn strong,
.gm-ub-btn b {
    color: #fff !important;
}
.gm-ub-btn:hover {
    opacity: 0.85;
}

/* ── Crypto Price Widget ───────────────────────────────────────────── */
.gm-cpw-up { color: #16a34a; }
.gm-cpw-down { color: #ef4444; }

.gm-cpw-pct-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.5rem;
}
@media (max-width: 767px) {
    .gm-cpw-pct-grid {
        grid-template-columns: repeat(6, 1fr);
    }
}
@media (max-width: 639px) {
    .gm-cpw-pct-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.gm-cpw-header.gm-cpw-stacked {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 1rem;
    row-gap: 0.5rem;
}
.gm-cpw-header.gm-cpw-stacked .gm-cpw-logo {
    grid-column: 1;
    grid-row: 1;
}
.gm-cpw-header.gm-cpw-stacked .gm-cpw-rank {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
}
.gm-cpw-header.gm-cpw-stacked .gm-cpw-price {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: center;
}
.gm-cpw-header.gm-cpw-stacked .gm-cpw-change {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-content: center;
}

/* Where-to-buy widget: 3-pair view in 1024-1299 and below 920 */
.gm-wtb-more-3 { display: none; }
@media (min-width: 1024px) and (max-width: 1299px),
       (max-width: 919px) {
    .gm-wtb-pairs-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .gm-wtb-pair-extra,
    .gm-wtb-more-8 {
        display: none !important;
    }
    .gm-wtb-more-3 {
        display: inline-block !important;
    }
}
@media (max-width: 1299px) {
    .gm-wtb-volume-pill {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        line-height: 1.15;
    }
    .gm-wtb-vol-sep {
        display: none;
    }
}
@media (min-width: 1024px) and (max-width: 1099px),
       (min-width: 575px) and (max-width: 749px) {
    .gm-wtb-grid,
    .gm-wtb-grid > * {
        grid-template-columns: 5rem auto 1fr auto !important;
    }
    .gm-wtb-volume-cell,
    .gm-wtb-volume-header {
        display: none !important;
    }
}
@media (max-width: 574px) {
    .gm-wtb-grid,
    .gm-wtb-grid > * {
        grid-template-columns: 5rem auto 1fr !important;
    }
    .gm-wtb-volume-cell,
    .gm-wtb-volume-header,
    .gm-wtb-empty-header,
    .gm-wtb-pairs-header {
        display: none !important;
    }
    .gm-wtb-pairs-cell {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        padding-top: 0.5rem;
    }
    .gm-wtb-cta-cell {
        grid-column: 3 !important;
        grid-row: 1 !important;
        justify-self: end !important;
    }
    .gm-wtb-footer {
        flex-direction: column !important;
        align-items: center !important;
        gap: 0.75rem !important;
    }
    .gm-wtb-footer-filler {
        display: none !important;
    }
    .gm-wtb-footer-date {
        flex: 0 0 auto !important;
        text-align: right !important;
        align-self: flex-end !important;
        margin-bottom: 0 !important;
    }
}
@media (min-width: 920px) and (max-width: 1023px) {
    .gm-wtb-pairs-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* ── Wallet Compare Float Bar ────────────────────────────────────── */
.gm-compare-float {
    position: fixed;
    bottom: 0.5rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 50;
    width: max-content;
    max-width: calc(100% - 2rem);
    animation: gm-float-in 0.25s ease-out;
}
@keyframes gm-float-in {
    from { opacity: 0; transform: translateX(-50%) translateY(1rem); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.gm-compare-float__inner {
    backdrop-filter: blur(12px);
}
.gm-compare-float__inner > .flex {
    gap: 0.5rem;
}
.gm-compare-float__slots {
    justify-content: center;
}
.gm-compare-float__slot {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
    white-space: nowrap;
    flex-shrink: 0;
    height: 45px;
}
.gm-compare-float__remove {
    font-size: 1.125rem;
    line-height: 1;
    padding: 0 0.25rem;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 0.35rem;
}

/* Compare checkbox on wallet cards */
.gm-compare-cb-label {
    position: absolute;
    left: -10px;
    bottom: -10px;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: var(--text-tertiary);
    cursor: pointer;
    user-select: none;
    padding: 0.4rem 0.45rem;
    border-radius: 0.375rem;
    border: 1px solid var(--border);
    background: var(--bg-card);
    transition: all 0.15s;
    white-space: nowrap;
}
.gm-compare-cb-label:hover {
    color: var(--brand);
    border-color: var(--brand);
}
.gm-compare-cb-active {
    border-color: var(--brand) !important;
    color: var(--brand) !important;
}
.gm-compare-cb-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/* Crypto exchange top row: 2 cols desktop, 1 col mobile */
.gm-crypto-top-row {
    grid-template-columns: 1fr 1fr;
}
@media (max-width: 639px) {
    .gm-crypto-top-row {
        grid-template-columns: 1fr;
    }
    .gm-crypto-top-row .gm-logo-bg {
        margin-left: -2rem;
    }
    .gm-crypto-ctas a,
    .gm-crypto-ctas button {
        font-size: 0.75rem;
    }
    .gm-ranking-row .gm-score-wrap {
        position: static !important;
    }
    .gm-exchange-compare-label,
    .gm-broker-compare-label,
    .gm-forex-compare-label {
        position: absolute !important;
        top: 0.75rem;
        right: 0.75rem;
        left: auto;
        bottom: auto;
        z-index: 5;
    }
}



/* Sort options */
.gm-sort-option {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    padding: 0.25rem 0;
}
.gm-sort-label {
    position: relative;
    padding-left: 1.25rem;
}
.gm-sort-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 50%;
    border: 2px solid var(--border);
    background: transparent;
}
.gm-sort-radio:checked + .gm-sort-label::before {
    border-color: var(--brand);
    background: var(--brand);
    box-shadow: inset 0 0 0 2px var(--bg-card, #fff);
}

/* Metric tooltip */
.gm-metric-tip {
    position: relative;
    cursor: help;
    border-bottom: 1px dotted var(--text-muted);
}
.gm-metric-tip-content {
    display: none;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(100% + 0.5rem);
    width: 18rem;
    padding: 0.75rem 1rem;
    background: var(--bg-card-solid);
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--text-secondary);
    z-index: 50;
    pointer-events: none;
    text-align: left;
}
.gm-metric-tip:hover .gm-metric-tip-content,
.gm-metric-tip:focus .gm-metric-tip-content {
    display: block;
}
@media (max-width: 639px) {
    .gm-metric-tip-content {
        width: 14rem;
    }
}

/* Compare checkbox on exchange/broker cards */
.gm-exchange-compare-label,
.gm-broker-compare-label,
.gm-forex-compare-label {
    position: static;
}
.gm-compare-float .gm-compare-float__slot img {
    height: 2rem;
}
.gm-exchange-compare-float .gm-compare-float__slot img,
.gm-broker-compare-float .gm-compare-float__slot img,
.gm-forex-compare-float .gm-compare-float__slot img {
    width: 4rem;
    height: 4rem;
}

/* ── Promoted badge ────────────────────────────────────────── */
.gm-ranking-row { position: relative; }
.gm-promoted-bar {
    position: absolute;
    top: -0.55rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--text-tertiary);
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 0.25rem;
    padding: 0.1rem 0.5rem;
    white-space: nowrap;
    line-height: 1.4;
    z-index: 5;
}

/* ── Broker details masonry ────────────────────────────────── */
.gm-details-masonry {
    columns: 1;
    column-gap: 1rem;
}
.gm-details-masonry > div {
    break-inside: avoid;
    margin-bottom: 1rem;
}
@media (min-width: 768px) {
    .gm-details-masonry { columns: 2; }
}

/* ── Comments ─────────────────────────────────────────────── */
.gm-comment-list { list-style: none; padding: 0; margin: 0; }
.gm-comment-list .gm-comment { list-style: none; }
.gm-comment-text p:last-child { margin-bottom: 0; }

/* ── Disclaimers ──────────────────────────────────────────── */
.gm-disclaimer-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;
}
.gm-disclaimer-header::before,
.gm-disclaimer-header::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--border);
}
.gm-disclaimer-header span {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-tertiary);
    white-space: nowrap;
}
.gm-disclaimer-text {
    font-size: 0.8rem;
    line-height: 1.7;
    color: var(--text-tertiary);
    margin-bottom: 0.5rem;
}
.gm-disclaimer-footer {
    padding: 1rem 0;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--text-tertiary);
    border-top: 1px solid var(--border);
}

/* Diff highlight — highlight rows with differences */
.gm-compare-highlight {
    background: var(--brand-soft, rgba(59,130,246,0.08));
    border-radius: 0.375rem;
    transition: background 0.2s;
}

/* Sticky header for comparison table — offset by site navbar height */
.gm-compare-sticky {
    position: sticky;
    top: 4rem;
    z-index: 10;
    background: var(--bg-card);
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--border);
}

/* Compare result container */
.gm-compare-result { margin-top: 2.5rem; }
.gm-broker-compare-result, .gm-exchange-compare-result, #gm-compare-result { scroll-margin-top: 3rem; }

/* ── Wallet ranking card layout ──────────────────────────────────────── */
.gm-metrics-val { font-size: 13px; }
@media (max-width: 639px) {
    .entry-content .gm-metrics-val { line-height: 1.5; display: block; padding-bottom: 0.3rem; }
}
.gm-wallet-body {
    grid-template-columns: 180px 1fr;
}
.gm-wallet-img {
    width: 180px;
    max-width: 180px;
    max-height: 10rem;
    object-fit: contain;
}

/* Desktop/mobile switching */
.gm-metrics-mobile { display: none; }
.gm-mobile-ctas { display: none !important; }

/* Mobile metric rows */
.gm-metrics-mobile-item {
    padding: 0.35rem 0;
    text-align: center;
    position: relative;
}
.gm-metrics-mobile-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15%;
    width: 70%;
    height: 1px;
    background: var(--border);
}
.gm-metrics-mobile-item:last-child::after {
    display: none;
}
.gm-metrics-mobile-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.2;
    padding-bottom: 0.3rem;
}

@media (min-width: 1024px) {
    .lg\:top-20 {
        top: -2rem !important;
    }
}

@media (max-width: 1024px) {
    .gm-compare-float__inner > .flex {
        flex-wrap: wrap;
        justify-content: center;
    }
    .gm-compare-float__slots {
        flex-wrap: wrap;
    }
    .gm-compare-float {
        width: calc(100% - 2rem);
    }
}

@media (max-width: 639px) {
    .gm-ranking-row {
        position: relative;
    }
    .gm-wallet-body {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }
    .gm-wallet-col-img {
        padding: 0.5rem 0 !important;
        justify-content: center;
    }
    .gm-wallet-col-img .gm-compare-cb-label {
        position: absolute;
        top: 0;
        left: 0;
        bottom: auto;
    }
    .gm-wallet-img {
        width: 100%;
        max-width: 120px;
        max-height: 8rem;
    }
    /* Show mobile metrics, hide desktop */
    .gm-metrics-desktop {
        display: none;
    }
    .gm-metrics-mobile {
        display: block;
    }
    .gm-mobile-ctas {
        display: flex !important;
    }
    .gm-desktop-ctas {
        display: none !important;
    }
    .gm-cta-btn {
        font-size: 0.75rem;
        padding: 0.5rem 0.25rem;
    }
    .gm-ranking-row .gm-score-tooltip {
        width: 16rem;
    }
}

/* Sidebar article widgets: title turns brand on row hover */
.gm-sidebar-article-title { text-align: center; }
.gm-sidebar-article-link:hover .gm-sidebar-article-title {
    color: var(--brand);
    transition: color 150ms ease;
}