.at-compare-check { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-body); cursor: pointer; margin: 10px 20px 4px; }
.at-compare-check input { width: 16px; height: 16px; accent-color: var(--navy-700); cursor: pointer; }
.at-compare-check.is-disabled { opacity: .4; }
.at-compare-check.is-disabled input { cursor: not-allowed; }

.at-compare-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; transform: translateY(100%);
  transition: transform .25s ease; background: var(--navy-700); color: #fff;
  padding: 16px 24px; display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap;
}
.at-compare-bar.is-visible { transform: translateY(0); }
.at-compare-bar__count { font-size: 14px; opacity: .85; }
.at-compare-bar__slots { display: flex; gap: 10px; }
.at-compare-bar__slot { width: 48px; height: 48px; border-radius: var(--radius-sm); background: rgba(255,255,255,.12); border: 1.5px dashed rgba(255,255,255,.4); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.at-compare-bar__slot img { width: 100%; height: 100%; object-fit: contain; }
.at-compare-bar__go, .at-compare-bar__clear { font-family: var(--font-display); font-weight: 700; font-size: 14px; border: 0; border-radius: var(--radius-md); padding: 10px 22px; cursor: pointer; }
.at-compare-bar__go { background: #fff; color: var(--navy-700); }
.at-compare-bar__go:disabled { opacity: .5; cursor: default; }
.at-compare-bar__clear { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }

.at-compare-modal { position: fixed; inset: 0; z-index: 200; background: rgba(20,26,38,.6); display: none; overflow-y: auto; padding: 60px 24px; }
.at-compare-modal.is-open { display: block; }
.at-compare-modal__inner { max-width: 1180px; margin: 0 auto; background: #fff; border-radius: var(--radius-lg); overflow: hidden; }
.at-compare-modal__head { display: flex; justify-content: space-between; align-items: center; padding: 20px 28px; border-bottom: 1px solid var(--border-subtle, #e4e4e7); }
.at-compare-modal__head h2 { font-family: var(--font-display); font-weight: 800; font-size: 20px; color: var(--navy-700); margin: 0; }
.at-compare-modal__close { background: none; border: 0; font-size: 20px; cursor: pointer; color: var(--text-muted); }
.at-compare-modal__body { padding: 0; }
.at-compare-modal__loading, .at-compare-modal__error { padding: 40px; text-align: center; color: var(--text-muted); }

.at-compare-table { width: 100%; border-collapse: collapse; }
.at-compare-table th, .at-compare-table td { padding: 14px 20px; text-align: left; font-size: 13.5px; border-bottom: 1px solid var(--border-subtle, #e4e4e7); vertical-align: top; }
.at-compare-table__row-label { width: 180px; font-weight: 700; color: var(--text-muted); background: var(--steel-50, #f4f7f9); }
.at-compare-table thead th { background: #fff; vertical-align: bottom; }
.at-compare-table__pcard { text-align: center; }
.at-compare-table__pcard img { width: 80px; height: 80px; object-fit: contain; margin-bottom: 8px; }
.at-compare-table__name { font-size: 13px; margin-bottom: 4px; }
.at-compare-table__name a { color: var(--navy-700); text-decoration: none; }
.at-compare-table__price { font-size: 14px; }
.at-compare-table__diff { color: var(--navy-700); font-weight: 700; }