/* Recipes compare — Platform 22.2.3 (rc- prefix) */
.rc-page { padding: 2rem 0 4rem; overflow-x: clip; background: var(--recipes-surface-2); color: var(--recipes-text); }
.rc-page.rc-compare-show { padding-bottom: 2rem; }
body.rc-has-floating-bar .rc-page { padding-bottom: 6rem; }
.rc-container { max-width: 1280px; margin: 0 auto; padding: 0 1rem 3rem; }

.rc-breadcrumb { font-size: .875rem; color: var(--recipes-muted); margin-bottom: 1rem; display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; padding: 0; }
.rc-breadcrumb a { color: var(--recipes-primary); text-decoration: none; }
.rc-breadcrumb li:not(:last-child)::after { content: '/'; margin-left: .35rem; }

.rc-sticky-header { position: sticky; top: 0; z-index: 100; background: var(--recipes-card); border-bottom: 1px solid var(--recipes-border); box-shadow: var(--recipes-shadow-sm); }
.rc-sticky-inner { max-width: 1280px; margin: 0 auto; padding: .75rem 1rem; display: flex; align-items: center; gap: 1rem; overflow-x: auto; }
.rc-sticky-devices { display: flex; gap: .75rem; flex: 1; min-width: 0; }
.rc-sticky-device { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; border: 1px solid var(--recipes-border); border-radius: .5rem; min-width: 160px; flex-shrink: 0; background: var(--recipes-surface); }
.rc-sticky-device.rc-overall-winner { border-color: var(--recipes-primary); background: color-mix(in srgb, var(--recipes-primary) 10%, transparent); }
.rc-sticky-time { font-size: .75rem; color: var(--recipes-muted); }
.rc-remove-btn { border: none; background: transparent; color: var(--recipes-muted); cursor: pointer; padding: .25rem; }
.rc-add-device { flex-shrink: 0; }

.rc-winners { margin: 1.5rem 0; }
.rc-winners-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .75rem; }
.rc-winner-card { padding: .75rem; border-radius: .5rem; background: var(--recipes-surface); border: 1px solid var(--recipes-border); text-align: center; }
.rc-winner-label { display: block; font-size: .6875rem; text-transform: uppercase; color: var(--recipes-muted); margin-bottom: .25rem; }

.rc-section-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.5rem 0; }
.rc-section-nav-link { padding: .4rem .75rem; border-radius: 999px; font-size: .8125rem; font-weight: 600; border: 1px solid var(--recipes-border); color: var(--recipes-muted); text-decoration: none; }
.rc-section-nav-link:hover { color: var(--recipes-primary); border-color: var(--recipes-primary); }

.rc-mobile-cards { display: none; gap: 1rem; overflow-x: auto; margin-bottom: 1rem; }
@media (max-width: 767px) { .rc-mobile-cards { display: flex; } .rc-table-wrap { display: none; } }
.rc-mobile-card { min-width: 220px; border: 1px solid var(--recipes-border); border-radius: .75rem; padding: 1rem; background: var(--recipes-surface); }

.rc-table-toolbar { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin: 1rem 0; }
.rc-search-specs { display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 200px; border: 1px solid var(--recipes-border); border-radius: .5rem; padding: .5rem .75rem; background: var(--recipes-surface); }
.rc-search-specs input { border: none; outline: none; width: 100%; background: transparent; color: var(--recipes-text); }
.rc-diff-toggle { font-size: .875rem; display: flex; align-items: center; gap: .35rem; color: var(--recipes-text); }

.rc-table-wrap { overflow-x: auto; }
.rc-compare-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.rc-compare-table th, .rc-compare-table td { border: 1px solid var(--recipes-border); padding: .75rem; text-align: left; vertical-align: top; }
.rc-group-header th { background: color-mix(in srgb, var(--recipes-primary) 8%, var(--recipes-card)); }
.rc-group-toggle { background: none; border: none; font-weight: 700; cursor: pointer; display: flex; align-items: center; gap: .5rem; color: var(--recipes-text); width: 100%; text-align: left; }
.rc-spec-row.rc-hidden, .rc-spec-row.rc-diff-hidden { display: none; }
.rc-status-winner { background: color-mix(in srgb, var(--recipes-primary) 12%, transparent); font-weight: 600; }
.rc-diff-badge { margin-left: .35rem; font-size: .75rem; }
.rc-diff-winner { color: var(--recipes-primary); }

.rc-ai-summary { background: var(--recipes-primary-tint); border: 1px solid var(--recipes-primary-border); border-radius: var(--recipes-radius-sm); padding: 1.25rem; margin-bottom: 1.5rem; }

.rc-widgets-section { margin-top: 2rem; }
.rc-section-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 1rem; }
.rc-widget-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .75rem; }
.rc-widget-card { display: flex; flex-direction: column; gap: .25rem; padding: 1rem; border: 1px solid var(--recipes-border); border-radius: .75rem; text-decoration: none; color: inherit; }
.rc-widget-card:hover { border-color: var(--recipes-primary); }

.rc-floating-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 90;
  background: var(--recipes-card); border-top: 2px solid var(--recipes-primary);
  box-shadow: 0 -4px 24px rgba(0,0,0,.1); padding: .75rem 1rem;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
body.rc-has-floating-bar { padding-bottom: 4.5rem; }
.rc-floating-bar[hidden] { display: none !important; }
.rc-floating-devices { display: flex; gap: .5rem; align-items: center; flex: 1; overflow-x: auto; }
.rc-floating-device { position: relative; flex-shrink: 0; }
.rc-floating-device img { width: 48px; height: 48px; object-fit: cover; border-radius: .5rem; }
.rc-floating-device-fallback { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: var(--recipes-border); border-radius: .5rem; color: var(--recipes-muted); }
.rc-floating-slot { width: 48px; height: 48px; border: 2px dashed var(--recipes-border); border-radius: .5rem; flex-shrink: 0; }
.rc-floating-actions { display: flex; gap: .5rem; flex-shrink: 0; }

.rc-btn { display: inline-flex; align-items: center; gap: .35rem; padding: .5rem 1rem; border-radius: .5rem; font-weight: 600; font-size: .875rem; border: none; cursor: pointer; text-decoration: none; }
.rc-btn-primary { background: var(--recipes-primary); color: var(--recipes-on-primary); }
.rc-btn-outline { background: var(--recipes-card); border: 1px solid var(--recipes-border); color: var(--recipes-text); }

.rc-toast { position: fixed; bottom: 5rem; right: 1rem; z-index: 100; padding: .75rem 1.25rem; background: var(--recipes-text); color: var(--recipes-on-primary); border-radius: var(--recipes-radius-sm); opacity: 0; transition: opacity var(--recipes-transition); pointer-events: none; }
.rc-toast.is-visible { opacity: 1; }
.rc-toast--error { background: var(--recipes-danger-soft); }

@media print {
  .rc-floating-bar, .rp-nav, .rc-section-nav, .rc-table-toolbar, .rc-mobile-cards { display: none !important; }
  .rc-table-wrap { display: block !important; }
  .rc-status-winner { background: #fff7ed !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
