/* PTC Serial Tiền Plugin – serial.css */
#ptc-serial-wrap { font-family:'Segoe UI',Arial,sans-serif; max-width:880px; margin:0 auto; color:#222; }
.ptc-serial-title { color:#8b0000; border-bottom:2px solid #8b0000; padding-bottom:8px; margin-bottom:16px; font-size:1.4rem; margin-top: 30px}

/* Tabs */
.ptc-sr-tab-header { display:flex; gap:4px; border-bottom:2px solid #8b0000; margin-bottom:14px; }
.ptc-sr-tab { padding:7px 18px; border:1px solid #ddd; border-bottom:none; background:#f5f5f5; cursor:pointer; border-radius:4px 4px 0 0; font-size:.9rem; transition:background .2s; }
.ptc-sr-tab.active,.ptc-sr-tab:hover { background:#8b0000; color:#fff; border-color:#8b0000; }
.ptc-sr-content { display:none; } .ptc-sr-content.active { display:block; }

/* Form */
.ptc-sr-row { display:flex; align-items:center; margin-bottom:10px; gap:8px; flex-wrap:wrap; }
.ptc-sr-row label:first-child { width:140px; font-weight:600; color:#555; flex-shrink:0; }
.ptc-sr-row input[type="text"] { padding:7px 12px; border:1px solid #ccc; border-radius:4px; font-size:.95rem; width:260px; }
.ptc-sr-row input[type="text"]:focus { border-color:#8b0000; outline:none; box-shadow:0 0 0 2px rgba(139,0,0,.1); }
.ptc-sr-note { font-size:.8rem; color:#888; font-style:italic; }
.ptc-sr-inline-boxes { display:flex; gap:6px; align-items:center; }
.ptc-sr-inline-boxes select { padding:6px 8px; border:1px solid #ccc; border-radius:4px; font-size:.9rem; background:#fff; }
.ptc-sr-checkbox-label { display:flex; align-items:center; gap:6px; cursor:pointer; font-size:.9rem; color:#333; }
.ptc-sr-checkbox-label input[type="checkbox"] { width:auto; padding:0; margin:0; }
.sr-msg-ok  { color:#197a00; font-size:.82rem; font-weight:600; }
.sr-msg-err { color:#c00;    font-size:.82rem; font-weight:600; }

/* Actions */
.ptc-sr-actions { margin-top:16px; text-align:center; }
.ptc-sr-btn-primary { background:#8b0000; color:#fff; border:none; padding:12px 40px; border-radius:6px; font-size:1.05rem; cursor:pointer; transition:background .2s; font-weight:600; letter-spacing:.03em; }
.ptc-sr-btn-primary:hover { background:#5a0000; }
.ptc-sr-btn-sec { background:#555; color:#fff; border:none; padding:7px 16px; border-radius:5px; font-size:.85rem; cursor:pointer; margin-right:8px; transition:background .2s; }
.ptc-sr-btn-sec:hover { background:#333; }

/* Loading */
#ptc-serial-loading { text-align:center; padding:36px; color:#8b0000; }
.ptc-sr-spinner { width:48px; height:48px; border:5px solid #f3f3f3; border-top:5px solid #8b0000; border-radius:50%; animation:srSpin .8s linear infinite; margin:0 auto 12px; }
@keyframes srSpin { to { transform:rotate(360deg); } }
.ptc-sr-result-actions { margin:12px 0; }

/* Result wrapper */
#ptc-serial-chart-wrapper { background:#fff; padding:20px; border:2px solid #8b0000; border-radius:8px; }
.sr-result-inner { font-family:'Segoe UI',Arial,sans-serif; }
.sr-result-title { text-align:center; font-size:1.2rem; font-weight:bold; color:#8b0000; margin-bottom:14px; padding-bottom:8px; border-bottom:1px solid #e0c090; }

/* Info strip */
.sr-info-strip { display:flex; flex-wrap:wrap; gap:10px 20px; background:#fff8f0; border:1px solid #e0c090; border-radius:6px; padding:10px 16px; margin-bottom:18px; font-size:.85rem; }
.sr-info-item  { display:flex; flex-direction:column; }
.sr-lbl { color:#888; font-size:.73rem; }
.sr-val { font-weight:600; color:#333; }
.sr-serial-display { font-family:monospace; font-size:1rem; color:#8b0000; letter-spacing:.1em; }

/* Hai quẻ cạnh nhau */
.sr-que-row { display:flex; align-items:flex-start; gap:20px; justify-content:center; margin:16px 0; flex-wrap:wrap; }
.sr-arrow { font-size:2.2rem; color:#8b0000; align-self:center; }
.sr-que-block { text-align:center; min-width:150px; }
.sr-que-label { font-size:.72rem; color:#888; text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px; font-weight:600; }
.sr-que-sym-wrap { display:inline-block; text-align:left; }
.sr-quai-name { font-size:.78rem; color:#8b0000; font-weight:600; margin:4px 0 2px; text-align:center; }
.sr-quai-sep { height:8px; border-top:1px dashed #c0a060; margin:4px 0; }
.sr-que-name { font-size:1rem; font-weight:bold; color:#8b0000; margin-top:10px; }
.sr-que-cn   { font-size:.78rem; color:#888; margin-top:2px; }
.sr-que-err  { color:#c00; padding:20px; font-size:.9rem; }

/* Hào row */
.sr-hao-row { display:flex; align-items:center; gap:6px; margin:4px 0; }
.sr-hao-num { font-size:.72rem; color:#999; width:62px; text-align:right; flex-shrink:0; }
.sr-hao-sym { font-size:1rem; font-weight:bold; letter-spacing:2px; display:inline-block; min-width:90px; }
.sr-yang { color:#c00; }
.sr-yin  { color:#1a56c4; }
.sr-dong { color:#e07800; }
.sr-dong-dot { font-size:.75rem; color:#e07800; }

/* Lời đoán */
.sr-loi-doan { background:#fff8f0; border:1px solid #e0c090; border-radius:6px; padding:14px 16px; margin-top:12px; }
.sr-loi-doan.sr-loi-bien { background:#f0f4ff; border-color:#a0b0e0; }
.sr-loi-title { font-weight:bold; color:#8b0000; margin-bottom:8px; font-size:.95rem; }
.sr-loi-bien .sr-loi-title { color:#1a56c4; }
.sr-judgment  { color:#333; line-height:1.75; font-size:.9rem; }
.sr-image     { color:#666; line-height:1.6; font-size:.85rem; margin-top:8px; }
.sr-hao-doan  { background:#fff3e0; border:1px solid #e07800; border-radius:6px; padding:12px 16px; margin-top:10px; }
.sr-hao-doan .sr-loi-title { color:#e07800; }
.sr-hao-line-text { color:#333; font-size:.88rem; line-height:1.65; margin-bottom:6px; padding-left:10px; border-left:3px solid #e07800; }

.sr-error { color:#c00; padding:12px; text-align:center; }

/* Hướng dẫn box */
.sr-huongdan-box { padding:14px 18px; background:#fff8f0; border:1px solid #e0c090; border-radius:8px; line-height:1.85; font-size:.88rem; color:#333; max-width:680px; }
.sr-huongdan-box h3 { color:#8b0000; margin-bottom:10px; }
.sr-huongdan-box table { border-collapse:collapse; font-size:.85rem; margin:10px 0; }
.sr-huongdan-box th { background:#8b0000; color:#fff; padding:5px 12px; }
.sr-huongdan-box td { border:1px solid #c0a060; padding:5px 12px; }
.sr-huongdan-box tr:nth-child(even) td { background:#fff8f0; }
.ptc-sr-inline-boxes {
	display: flex;
	gap: 12px;
}
.ptc-sr-colon-icon {
	padding-bottom: 17px;
}
#sr-nam {
	width: 60px !important;
}
/* Responsive */
@media(max-width:600px) {
  .sr-que-row { gap:12px; }
  .sr-arrow { font-size:1.6rem; }
  .sr-hao-sym { font-size:.88rem; min-width:72px; letter-spacing:1px; }
  .sr-hao-num { width:52px; font-size:.68rem; }
  .ptc-sr-row input[type="text"] { width:100%; }
}
