/* PARTNER-COMMERCE-MICROSOFT-V1 — region commerce block styles (additive, scoped under .ms).
 * Mobile-first; verified 360/390/412 + desktop 1440. No horizontal overflow; tap targets >=44px.
 * FAIL CLOSED: no price styling needed — "Nhận báo giá" only. */
.ms { --ms-blue:#0a5bd3; --ms-blue-d:#0842a0; --ms-ink:#12233b; --ms-mut:#5b6b80; --ms-line:#e3e9f2;
  --ms-bg:#f6f9ff; --ms-ok:#0a7d47; --ms-warn:#b25b00; --ms-radius:14px; display:block; color:var(--ms-ink); }
.ms * { box-sizing:border-box; }
.ms .ms-region { margin:26px 0; padding:20px; background:#fff; border:1px solid var(--ms-line);
  border-radius:var(--ms-radius); box-shadow:0 2px 10px rgba(16,35,59,.04); }
.ms .ms-r-head { display:flex; align-items:center; gap:12px; margin:0 0 6px; }
.ms .ms-r-num { flex:0 0 auto; width:32px; height:32px; border-radius:50%; background:var(--ms-blue);
  color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; font-size:16px; }
.ms .ms-r-head h2 { margin:0; font-size:1.28rem; line-height:1.25; color:var(--ms-ink); }
.ms .ms-r-sub { color:var(--ms-mut); margin:6px 0 14px; line-height:1.55; }
.ms .ms-note { font-size:.9rem; line-height:1.5; margin:10px 0 0; }
.ms .ms-note-muted { color:var(--ms-mut); }
.ms .ms-flash { animation:msflash 1.3s ease; }
@keyframes msflash { 0%{ box-shadow:0 0 0 0 rgba(10,91,211,.35);} 100%{ box-shadow:0 0 0 8px rgba(10,91,211,0);} }

/* buttons */
.ms .ms-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px;
  padding:10px 18px; border-radius:10px; font-weight:700; font-size:.98rem; cursor:pointer;
  border:1.5px solid transparent; text-decoration:none; transition:.15s; line-height:1.2; }
.ms .ms-btn-primary { background:var(--ms-blue); color:#fff; }
.ms .ms-btn-primary:hover { background:var(--ms-blue-d); }
.ms .ms-btn-ghost { background:#fff; color:var(--ms-blue); border-color:var(--ms-blue); }
.ms .ms-btn-ghost:hover { background:var(--ms-bg); }
.ms .ms-btn-link { background:transparent; color:var(--ms-blue); border:none; text-decoration:underline; }
.ms .ms-btn-sm { min-height:38px; padding:8px 14px; font-size:.9rem; }
.ms .ms-btn[disabled] { opacity:.5; cursor:not-allowed; }
.ms .ms-btn.ms-added { background:var(--ms-ok); border-color:var(--ms-ok); color:#fff; }

/* ① journeys */
.ms .ms-journey-grid { display:grid; grid-template-columns:1fr; gap:12px; margin-top:6px; }
.ms .ms-journey { text-align:left; display:flex; flex-direction:column; gap:4px; position:relative;
  border:1.5px solid var(--ms-line); border-radius:12px; padding:16px 44px 16px 16px; background:#fff; cursor:pointer;
  transition:.15s; min-height:44px; }
.ms .ms-journey:hover { border-color:var(--ms-blue); background:var(--ms-bg); }
.ms .ms-journey-t { font-weight:800; font-size:1.04rem; color:var(--ms-ink); }
.ms .ms-journey-d { color:var(--ms-mut); font-size:.92rem; line-height:1.45; }
.ms .ms-journey-go { position:absolute; right:16px; top:50%; transform:translateY(-50%); color:var(--ms-blue);
  font-weight:800; font-size:1.3rem; }

/* ② catalogue */
.ms .ms-group { margin-top:18px; }
.ms .ms-group-head h3 { margin:0 0 2px; font-size:1.12rem; color:var(--ms-blue-d); }
.ms .ms-group-blurb { margin:0 0 10px; color:var(--ms-mut); font-size:.92rem; line-height:1.5; }
.ms .ms-card-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.ms .ms-card { border:1px solid var(--ms-line); border-radius:12px; padding:16px; background:#fff;
  display:flex; flex-direction:column; gap:6px; }
.ms .ms-card-name { font-weight:800; font-size:1.03rem; color:var(--ms-ink); line-height:1.3; }
.ms .ms-card-sum { color:#33465e; font-size:.93rem; line-height:1.5; }
.ms .ms-card-note { color:var(--ms-mut); font-size:.85rem; line-height:1.45; }
.ms .ms-card-meta { display:flex; flex-wrap:wrap; gap:6px; margin:2px 0; }
.ms .ms-tag-once, .ms .ms-tag-novat { font-size:.74rem; font-weight:800; padding:2px 8px; border-radius:12px; }
.ms .ms-tag-once { background:#eef3fb; color:var(--ms-blue-d); }
.ms .ms-tag-novat { background:#eafaf1; color:var(--ms-ok); }
.ms .ms-card-price { font-size:.98rem; color:var(--ms-mut); margin-top:2px; }
.ms .ms-card-price b { color:var(--ms-blue-d); font-weight:800; }
.ms .ms-card-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }

/* ③ server intake */
.ms .ms-intake { background:var(--ms-bg); border-radius:12px; padding:16px; }
.ms .ms-intake-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.ms .ms-f { display:flex; flex-direction:column; gap:5px; font-size:.9rem; color:var(--ms-mut); }
.ms .ms-f input, .ms .ms-f select { min-height:44px; padding:8px 12px; border:1.5px solid var(--ms-line);
  border-radius:10px; font-size:1rem; color:var(--ms-ink); background:#fff; }
.ms .ms-f input:focus, .ms .ms-f select:focus { outline:none; border-color:var(--ms-blue); }
.ms .ms-intake-summary { margin:14px 0; padding:12px 14px; border:1px dashed var(--ms-line); border-radius:10px;
  background:#fff; color:#33465e; font-size:.95rem; line-height:1.5; }
.ms .ms-intake-actions { display:flex; flex-wrap:wrap; gap:10px; }
.ms .ms-intake-foot { color:var(--ms-mut); font-size:.86rem; margin:10px 0 0; line-height:1.5; }

/* ④ infra attach */
.ms .ms-infra-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.ms .ms-infra-card { display:flex; flex-direction:column; gap:4px; border:1px solid var(--ms-line);
  border-radius:12px; padding:14px 16px; background:#fff; text-decoration:none; color:inherit; }
.ms .ms-infra-link:hover { border-color:var(--ms-blue); background:var(--ms-bg); }
.ms .ms-infra-l { font-weight:800; color:var(--ms-ink); }
.ms .ms-infra-n { color:var(--ms-mut); font-size:.9rem; line-height:1.45; }
.ms .ms-infra-go { color:var(--ms-blue); font-weight:700; font-size:.9rem; margin-top:2px; }

/* modal */
body.ms-modal-open { overflow:hidden; }
.ms-modal { position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center; padding:16px; }
.ms-modal[hidden] { display:none; }
.ms-modal .ms-modal-back { position:absolute; inset:0; background:rgba(10,20,40,.55); }
.ms-modal .ms-modal-box { position:relative; width:100%; max-width:460px; max-height:92vh; overflow:auto;
  background:#fff; border-radius:16px; padding:24px; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.ms-modal .ms-modal-x { position:absolute; top:10px; right:12px; background:transparent; border:none;
  font-size:1.8rem; line-height:1; color:#64748b; cursor:pointer; padding:4px 8px; }
.ms-modal h3 { margin:0 6px 6px 0; font-size:1.25rem; color:#0a5bd3; }
.ms-modal .ms-modal-sub { color:#5b6b80; font-size:.93rem; line-height:1.5; margin:0 0 14px; }
.ms-modal .ms-modal-form { display:flex; flex-direction:column; gap:10px; }
.ms-modal .ms-field { display:flex; flex-direction:column; gap:4px; font-size:.9rem; color:#5b6b80; }
.ms-modal .ms-field input, .ms-modal .ms-field textarea { min-height:44px; padding:9px 12px;
  border:1.5px solid #e3e9f2; border-radius:10px; font-size:1rem; color:#12233b; background:#fff; }
.ms-modal .ms-field textarea { min-height:64px; resize:vertical; }
.ms-modal .ms-field input:focus, .ms-modal .ms-field textarea:focus { outline:none; border-color:#0a5bd3; }
.ms-modal .ms-modal-msg { font-size:.9rem; min-height:1em; }
.ms-modal .ms-modal-msg.ms-err { color:#b91c1c; }
.ms-modal .ms-modal-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:4px; }
.ms .ms-lead-result { margin:14px 0 0; }
.ms .ms-lead-result.ms-ok { padding:14px 16px; border:1px solid #bbf7d0; background:#f0fdf4; border-radius:12px;
  color:#166534; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }

/* tablet/desktop grids */
@media (min-width:720px) {
  .ms .ms-journey-grid { grid-template-columns:repeat(2,1fr); }
  .ms .ms-card-grid { grid-template-columns:repeat(2,1fr); }
  .ms .ms-intake-grid { grid-template-columns:repeat(2,1fr); }
  .ms .ms-infra-grid { grid-template-columns:repeat(2,1fr); }
}
@media (min-width:1080px) {
  .ms .ms-card-grid { grid-template-columns:repeat(3,1fr); }
  .ms .ms-infra-grid { grid-template-columns:repeat(4,1fr); }
}
