/* ============================================================
   UNITRONIX 셀러 화면 — [B2B 판매처 연결] 모양 (2026-09-27)
   styles.css(서버판·저장소판이 다름)를 건드리지 않으려고 따로 둔 파일. index.html 이 styles.css 다음에 싣는다.
   ============================================================ */

.ubc-head { margin-bottom: 14px; }
.ubc-plan { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-weight: 700; margin-bottom: 8px; }
.ubc-how { margin: 0 0 6px; padding-left: 20px; line-height: 1.8; font-size: 13px; }

.ubc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 14px; align-items: start; }
.ubc-card .card-head { display: flex; align-items: center; gap: 10px; }
.ubc-logo {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  min-width: 30px; height: 30px; padding: 0 6px; border-radius: 8px;
  color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .02em;
}
.ubc-state { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap;
  margin-bottom: 12px; font-size: 13px; }
.ubc-on { color: var(--ok); }
.ubc-off { color: var(--muted); }
.ubc-saved { margin-left: 4px; font-size: 11px; font-weight: 700; color: var(--ok); background: #ecfdf5;
  border-radius: 6px; padding: 1px 6px; }
.ubc-reason, .ubc-result { margin: 10px 0 0; }
.ubc-card .btn-row { margin-top: 4px; }
.ubc-guide { margin-top: 12px; }
.ubc-guide summary { cursor: pointer; font-size: 12px; font-weight: 700; color: #64748b; }

@media (max-width: 560px) {
  .ubc-grid { grid-template-columns: minmax(0, 1fr); }
}