/* Blood-Type Personality — RT-PSY-031
   Widget styling. The form shell + ad/section styling come from the platform
   tool layout; this file scopes the bt-* result components (RED theme,
   accent #B91C1C). Loaded automatically by show.blade.php when present.
   Entertainment only — no scientific basis. */

.bt-form { display: flex; flex-direction: column; gap: 14px; }

.bt-disclaimer {
  padding: 10px 14px; background: #fef2f2; border-left: 3px solid #ef4444;
  border-radius: 0 6px 6px 0; font-size: 12.5px; color: var(--rt-accent); line-height: 1.5;
}

.bt-pickwrap {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 16px;
  background: var(--rt-surface-2); border: 1px solid var(--rt-hairline); border-radius: 8px;
}
@media (max-width: 720px) { .bt-pickwrap { grid-template-columns: 1fr; } }

.bt-pick-label {
  font-family: var(--rt-font-mono); font-size: 11px; color: var(--rt-ink-muted);
  text-transform: uppercase; letter-spacing: .04em; font-weight: 600;
  display: block; margin-bottom: 8px;
}

.bt-btn-row { display: flex; gap: 8px; flex-wrap: wrap; }
.bt-type-btn {
  flex: 1 1 0; min-width: 56px; padding: 12px 0; font-family: var(--rt-font-sans);
  font-size: 20px; font-weight: 700; border: 1.5px solid rgba(185,28,28,.3);
  border-radius: 8px; background: #fff; color: #991b1b; cursor: pointer;
  transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}
.bt-type-btn:hover { border-color: #b91c1c; }
.bt-type-btn.is-active { background: #b91c1c; color: #fff; border-color: #991b1b; }

.bt-second-hint {
  padding: 8px 12px; background: #fef2f2; border-radius: 6px;
  font-size: 12px; color: var(--rt-ink-muted); font-style: italic;
}

.bt-results { padding: 0; background: transparent; }
.bt-empty { padding: 16px; text-align: center; color: var(--rt-ink-muted); font-style: italic; }

.bt-forfun {
  padding: 8px 14px; margin-bottom: 12px; background: #fef2f2; border-radius: 6px;
  font-size: 12px; color: var(--rt-accent); line-height: 1.5; font-style: italic;
}

/* Profile card */
.bt-profile {
  border: 1px solid var(--rt-hairline); border-top: 4px solid var(--bt-accent, #b91c1c);
  border-radius: 10px; padding: 18px; background: #fff;
}
.bt-profile-head { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.bt-badge {
  flex: 0 0 auto; width: 58px; height: 58px; display: inline-flex; align-items: center;
  justify-content: center; border-radius: 50%; background: var(--bt-accent, #b91c1c);
  color: #fff; font-family: var(--rt-font-sans); font-size: 24px; font-weight: 800;
}
.bt-profile-essence { flex: 1; }
.bt-profile-name {
  font-family: var(--rt-font-mono); font-size: 11.5px; text-transform: uppercase;
  letter-spacing: .05em; font-weight: 700; color: var(--bt-accent, #b91c1c); margin-bottom: 4px;
}
.bt-profile-essence p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--rt-ink); }

/* Strengths / weaknesses grid */
.bt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
@media (max-width: 560px) { .bt-grid { grid-template-columns: 1fr; } }
.bt-block { padding: 14px 16px; border-radius: 8px; border: 1px solid var(--rt-hairline); background: var(--rt-surface-2); }
.bt-block-pos { border-left: 4px solid #16a34a; }
.bt-block-neg { border-left: 4px solid #b91c1c; }
.bt-block-lbl {
  font-family: var(--rt-font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em; font-weight: 700; color: var(--rt-ink-muted); margin-bottom: 8px;
}
.bt-list { margin: 0; padding-left: 18px; }
.bt-list li { font-size: 13.5px; line-height: 1.5; color: var(--rt-ink); margin-bottom: 4px; }

/* Social / work / match rows */
.bt-rows { display: flex; flex-direction: column; gap: 0; border-top: 1px dashed rgba(0,0,0,.08); }
.bt-row {
  display: grid; grid-template-columns: 120px 1fr; gap: 14px; padding: 10px 0;
  border-bottom: 1px dashed rgba(0,0,0,.06); align-items: baseline;
}
@media (max-width: 560px) { .bt-row { grid-template-columns: 1fr; gap: 4px; } }
.bt-row-lbl {
  font-family: var(--rt-font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em; font-weight: 600; color: var(--rt-ink-muted);
}
.bt-row-val { font-size: 13.5px; line-height: 1.55; color: var(--rt-ink); }
.bt-match { font-weight: 700; color: var(--bt-accent, #b91c1c); }

/* Compatibility note */
.bt-compat { margin-top: 14px; padding: 14px 18px; border-radius: 10px; border: 1px solid var(--rt-hairline); }
.bt-compat-warm { background: #f0fdf4; border-left: 4px solid #16a34a; }
.bt-compat-mixed { background: #fffbeb; border-left: 4px solid #d97706; }
.bt-compat-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.bt-compat-title {
  font-family: var(--rt-font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em; font-weight: 700; color: var(--rt-ink-muted);
}
.bt-compat-pair { font-family: var(--rt-font-sans); font-size: 15px; font-weight: 700; color: var(--rt-ink); }
.bt-compat-body { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--rt-ink); }