:root {
  --legend-red: #c4161c;
  --legend-red-dark: #8f0f14;
  --legend-ink: #172033;
  --legend-muted: #6c7484;
  --legend-bg: #f5f6f8;
  --legend-border: #e5e7eb;
  --sidebar-width: 272px;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: 'Be Vietnam Pro', system-ui, -apple-system, sans-serif;
  color: var(--legend-ink);
  background: var(--legend-bg);
  min-height: 100vh;
}
button, input, textarea, select { font: inherit; }
textarea { resize: vertical; }

.app-loader {
  min-height: 100vh;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 24px;
  background: radial-gradient(circle at 20% 10%, #fff 0, #fff5f5 34%, #f3f4f6 78%);
}
.brand-mark {
  display: inline-flex;
  align-items: baseline;
  font-weight: 800;
  font-size: 38px;
  letter-spacing: -2px;
  color: var(--legend-red);
}
.brand-mark span { font-size: 17px; letter-spacing: 0; margin-left: 2px; color: var(--legend-ink); }
.brand-mark.brand-white { color: #fff; }
.brand-mark.brand-white span { color: rgba(255,255,255,.8); }

.login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(460px, .92fr);
  background: #fff;
}
.login-visual {
  position: relative;
  overflow: hidden;
  padding: clamp(32px, 6vw, 86px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(91,5,9,.94), rgba(196,22,28,.92)),
    radial-gradient(circle at 20% 10%, #ef7a7d, transparent 45%);
}
.login-visual::before,
.login-visual::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
}
.login-visual::before { width: 520px; height: 520px; right: -180px; top: -160px; }
.login-visual::after { width: 340px; height: 340px; right: 40px; top: 80px; }
.visual-content, .visual-footer { position: relative; z-index: 2; }
.visual-content { max-width: 680px; margin-top: 8vh; }
.visual-content h1 { font-size: clamp(40px, 5vw, 72px); line-height: 1.08; font-weight: 800; letter-spacing: -2.5px; }
.visual-content p { font-size: 18px; line-height: 1.75; color: rgba(255,255,255,.82); max-width: 620px; }
.feature-pills { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.feature-pill { padding: 10px 14px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.09); backdrop-filter: blur(10px); border-radius: 999px; font-size: 14px; }
.visual-footer { font-size: 13px; color: rgba(255,255,255,.65); }
.login-panel { display: grid; place-items: center; padding: 40px; background: linear-gradient(180deg,#fff,#fafafa); }
.login-card { width: min(440px, 100%); }
.login-card h2 { font-size: 32px; font-weight: 800; letter-spacing: -1px; }
.login-card .form-control { min-height: 54px; border-radius: 14px; border-color: #d8dbe1; padding: 14px 16px; }
.login-card .form-control:focus { border-color: var(--legend-red); box-shadow: 0 0 0 .22rem rgba(196,22,28,.12); }
.phone-input { position: relative; }
.phone-input i { position: absolute; left: 17px; top: 50%; transform: translateY(-50%); color: var(--legend-muted); }
.phone-input input { padding-left: 47px !important; }
.btn-legend { background: var(--legend-red); border-color: var(--legend-red); color: #fff; border-radius: 14px; min-height: 52px; font-weight: 700; }
.btn-legend:hover, .btn-legend:focus { background: var(--legend-red-dark); border-color: var(--legend-red-dark); color: #fff; }
.otp-boxes { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.otp-boxes input { text-align: center; font-size: 22px; font-weight: 700; padding: 12px 2px; }
.dev-otp { background: #fff4d6; border: 1px dashed #e3aa22; padding: 10px 12px; border-radius: 12px; color: #7d5900; font-size: 13px; }


/* VINKA.VN brand homepage */
.brand-lockup { display:flex; flex-direction:column; align-items:flex-start; gap:6px; position:relative; z-index:2; }
.brand-lockup-note { font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--legend-muted); }
.brand-lockup-light .brand-lockup-note { color:rgba(255,255,255,.55); }
.vinka-login-visual {
  background:
    linear-gradient(138deg, rgba(18,24,39,.97) 0%, rgba(74,14,24,.95) 48%, rgba(196,22,28,.93) 100%),
    radial-gradient(circle at 18% 8%, #ee777b, transparent 42%);
}
.vinka-login-visual::before { width:620px; height:620px; right:-230px; top:-260px; box-shadow:0 0 0 72px rgba(255,255,255,.025),0 0 0 144px rgba(255,255,255,.018); }
.vinka-login-visual::after { width:280px; height:280px; right:7%; top:31%; opacity:.7; }
.vinka-hero-content { max-width:790px; margin-top:clamp(32px,5vh,70px); }
.vinka-hero-content h1 { max-width:780px; font-size:clamp(38px,4.6vw,68px); }
.vinka-hero-content > p { max-width:760px; }
.vinka-meaning-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:30px; }
.vinka-meaning-item { min-width:0; min-height:112px; padding:14px 12px; border:1px solid rgba(255,255,255,.17); background:rgba(255,255,255,.075); border-radius:17px; backdrop-filter:blur(12px); }
.vinka-meaning-item > strong { display:block; font-size:28px; line-height:1; margin-bottom:12px; color:#fff; }
.vinka-meaning-item span { display:block; font-size:11px; line-height:1.5; color:rgba(255,255,255,.7); }
.vinka-meaning-item b { display:block; margin-bottom:4px; color:#fff; font-size:11px; }
.vinka-feature-pills { margin-top:20px; }
.vinka-login-panel { position:relative; overflow:hidden; }
.vinka-login-panel::before { content:''; position:absolute; width:340px; height:340px; border-radius:50%; background:radial-gradient(circle,rgba(196,22,28,.08),transparent 68%); right:-120px; top:-120px; pointer-events:none; }
.vinka-login-card { position:relative; z-index:1; }
.login-mobile-intro { display:none; padding:0 0 28px; }
.login-mobile-intro h1 { font-size:26px; line-height:1.22; font-weight:800; letter-spacing:-.9px; margin:10px 0; }
.login-mobile-intro p { color:var(--legend-muted); line-height:1.65; margin:0; font-size:14px; }
.vinka-login-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:30px; padding-top:22px; border-top:1px solid var(--legend-border); }
.vinka-login-benefits span { display:flex; flex-direction:column; align-items:center; gap:7px; text-align:center; color:var(--legend-muted); font-size:10px; line-height:1.35; }
.vinka-login-benefits i { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#fff1f1; color:var(--legend-red); font-size:15px; }

.vinka-home-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr); gap:34px; padding:clamp(28px,4vw,48px); margin-bottom:30px; color:#fff; border-radius:28px; background:linear-gradient(130deg,#111827 0%,#20283a 50%,#8d1116 100%); box-shadow:0 26px 58px rgba(23,32,51,.18); }
.vinka-home-copy,.vinka-home-capabilities,.vinka-home-values { position:relative; z-index:2; }
.vinka-home-kicker { display:inline-flex; align-items:center; gap:8px; font-size:10px; letter-spacing:.14em; font-weight:800; color:rgba(255,255,255,.66); }
.vinka-home-copy h1 { max-width:760px; margin:15px 0; font-size:clamp(32px,4vw,54px); line-height:1.08; font-weight:800; letter-spacing:-2px; }
.vinka-home-copy > p { max-width:700px; margin:0; color:rgba(255,255,255,.72); font-size:16px; line-height:1.75; }
.vinka-home-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:27px; }
.vinka-home-actions .btn { font-weight:700; }
.vinka-home-capabilities { display:grid; grid-template-columns:1fr 1fr; gap:11px; align-content:center; }
.vinka-home-capabilities article { display:flex; gap:12px; align-items:flex-start; min-height:112px; padding:17px; border:1px solid rgba(255,255,255,.14); border-radius:18px; background:rgba(255,255,255,.075); backdrop-filter:blur(10px); }
.vinka-home-capabilities article > i { flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center; border-radius:13px; background:rgba(255,255,255,.12); font-size:18px; }
.vinka-home-capabilities strong,.vinka-home-capabilities span { display:block; }
.vinka-home-capabilities strong { margin-bottom:5px; font-size:13px; }
.vinka-home-capabilities span { color:rgba(255,255,255,.62); font-size:11px; line-height:1.5; }
.vinka-home-values { grid-column:1/-1; display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid rgba(255,255,255,.12); padding-top:18px; }
.vinka-home-values span { display:flex; align-items:center; justify-content:center; gap:8px; padding:5px 12px; color:rgba(255,255,255,.58); font-size:10px; letter-spacing:.06em; text-transform:uppercase; border-right:1px solid rgba(255,255,255,.1); }
.vinka-home-values span:last-child { border-right:0; }
.vinka-home-values b { color:#fff; font-size:17px; }
.vinka-home-orbit { position:absolute; border:1px solid rgba(255,255,255,.12); border-radius:50%; pointer-events:none; }
.vinka-home-orbit.orbit-one { width:390px; height:390px; right:-150px; top:-210px; box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018); }
.vinka-home-orbit.orbit-two { width:180px; height:180px; left:47%; bottom:-125px; }

.app-layout { min-height: 100vh; }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 1030;
  width: var(--sidebar-width);
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  background: #131826;
  color: #fff;
  padding: 24px 18px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform .25s ease;
}
.sidebar-brand { flex: 0 0 auto; padding: 0 10px 24px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sidebar-subtitle { color: rgba(255,255,255,.45); font-size: 11px; letter-spacing: .11em; text-transform: uppercase; margin-top: 6px; }
.sidebar-nav {
  margin-top: 22px;
  display: grid;
  gap: 6px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 6px;
  margin-right: -6px;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.28) transparent;
}
.sidebar-nav::-webkit-scrollbar { width: 6px; }
.sidebar-nav::-webkit-scrollbar-track { background: transparent; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 999px; }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.38); }
.nav-button { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 0; background: transparent; color: rgba(255,255,255,.68); border-radius: 12px; text-align: left; font-weight: 600; }
.nav-button i { font-size: 18px; width: 24px; }
.nav-button:hover { color: #fff; background: rgba(255,255,255,.06); }
.nav-button.active { color: #fff; background: linear-gradient(135deg, var(--legend-red), #e83e44); box-shadow: 0 10px 24px rgba(196,22,28,.22); }
.sidebar-user { flex: 0 0 auto; margin-top: 14px; padding: 14px; border-radius: 18px; background: rgba(255,255,255,.06); overflow: hidden; }
.avatar { width: 42px; height: 42px; min-width: 42px; min-height: 42px; aspect-ratio: 1 / 1; border-radius: 14px; display: grid; place-items: center; background: linear-gradient(135deg,#fff,#f6ced0); color: var(--legend-red); font-weight: 800; line-height: 1; flex: 0 0 42px; }
.sidebar-user-row { display: grid; grid-template-columns: 42px minmax(0, 1fr) 34px; gap: 12px; align-items: center; width: 100%; min-width: 0; }
.sidebar-user-info { min-width: 0; overflow: hidden; }
.sidebar-user .user-name { font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; }
.sidebar-user .user-phone { font-size: 12px; color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.35; }
.sidebar-logout-btn { width: 34px; height: 34px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 12px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.62); flex: 0 0 34px; }
.sidebar-logout-btn:hover, .sidebar-logout-btn:focus { background: rgba(255,255,255,.12); color: #fff; }

.main-shell { margin-left: var(--sidebar-width); min-height: 100vh; }
.topbar { height: 76px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(20px, 4vw, 54px); background: rgba(255,255,255,.9); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(229,231,235,.85); position: sticky; top: 0; z-index: 1020; }
.topbar-title { font-weight: 800; letter-spacing: -.4px; margin: 0; font-size: 20px; }
.main-content { padding: clamp(22px, 4vw, 48px); }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.page-heading h1 { font-size: clamp(28px, 3vw, 40px); font-weight: 800; letter-spacing: -1.3px; margin-bottom: 8px; }
.page-heading p { color: var(--legend-muted); margin: 0; max-width: 700px; line-height: 1.7; }

.hero-card { background: linear-gradient(125deg,#161b2b 0%,#282f45 58%,#8d1116 100%); color: #fff; border: 0; border-radius: 24px; padding: clamp(24px,4vw,46px); position: relative; overflow: hidden; box-shadow: 0 24px 50px rgba(23,32,51,.16); }
.hero-card::after { content:''; position:absolute; width:300px;height:300px;border-radius:50%;border:1px solid rgba(255,255,255,.13);right:-70px;top:-120px;box-shadow:0 0 0 50px rgba(255,255,255,.035),0 0 0 100px rgba(255,255,255,.025); }
.hero-card > * { position: relative; z-index: 1; }
.hero-card h2 { font-size: clamp(26px, 3vw, 42px); font-weight: 800; letter-spacing: -1.3px; }
.hero-card p { max-width: 720px; color: rgba(255,255,255,.72); line-height: 1.7; }

.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 22px 0 30px; }
.stat-card { background: #fff; border: 1px solid var(--legend-border); border-radius: 18px; padding: 20px; display: flex; gap: 15px; align-items: center; }
.stat-icon { width: 48px; height: 48px; border-radius: 15px; display: grid; place-items: center; font-size: 21px; }
.stat-number { font-weight: 800; font-size: 25px; line-height: 1; }
.stat-label { color: var(--legend-muted); font-size: 12px; margin-top: 7px; }
.soft-red { background: #fff0f0; color: var(--legend-red); }
.soft-gold { background: #fff8df; color: #b17d00; }
.soft-blue { background: #eef4ff; color: #3367b8; }
.soft-green { background: #eaf8f0; color: #177345; }

.section-title { font-size: 20px; font-weight: 800; letter-spacing: -.5px; }
.form-type-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.form-type-card { background:#fff; border:1px solid var(--legend-border); border-radius:20px; padding:22px; transition:.2s ease; cursor:pointer; position:relative; overflow:hidden; }
.form-type-card:hover { transform: translateY(-3px); box-shadow:0 16px 34px rgba(23,32,51,.09); border-color:#d5d8de; }
.form-type-icon { width:54px;height:54px;border-radius:17px;display:grid;place-items:center;font-size:23px;margin-bottom:20px; }
.form-type-card h3 { font-size:17px;font-weight:800; }
.form-type-card p { color:var(--legend-muted);font-size:13px;line-height:1.65;min-height:64px; }

.version-list { display:grid; gap:12px; }
.version-card { background:#fff;border:1px solid var(--legend-border);border-radius:18px;padding:17px 20px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center; }
.version-card:hover { border-color:#cfd2d8; box-shadow:0 10px 25px rgba(23,32,51,.05); }
.version-title { font-weight:750; margin-bottom:6px; }
.version-meta { display:flex;flex-wrap:wrap;gap:12px;color:var(--legend-muted);font-size:12px; }
.status-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:700; }
.status-draft { background:#f1f2f4;color:#5e6572; }
.status-published { background:#eaf8f0;color:#177345; }
.version-actions { display:flex;gap:7px; }
.icon-btn { width:38px;height:38px;border-radius:11px;border:1px solid var(--legend-border);background:#fff;display:grid;place-items:center;color:#596172; }
.icon-btn:hover { background:#f5f6f8;color:var(--legend-ink); }
.empty-state { background:#fff;border:1px dashed #cfd3da;border-radius:22px;padding:54px 24px;text-align:center; }
.empty-icon { width:70px;height:70px;border-radius:22px;background:#fff1f1;color:var(--legend-red);display:grid;place-items:center;margin:0 auto 18px;font-size:28px; }

.editor-layout { display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start; }
.editor-main { min-width:0; }
.editor-sidebar { position:sticky;top:100px;display:grid;gap:14px; }
.editor-top { background:#fff;border:1px solid var(--legend-border);border-radius:20px;padding:20px;margin-bottom:18px; }
.title-input { font-size:23px;font-weight:800;border:0;border-bottom:1px dashed #cfd3da;border-radius:0;padding:4px 0 10px; }
.title-input:focus { box-shadow:none;border-color:var(--legend-red); }
.progress { height:8px;background:#eceef1;border-radius:999px; }
.progress-bar { background:linear-gradient(90deg,var(--legend-red),#ea4a50); }
.form-section { background:#fff;border:1px solid var(--legend-border);border-radius:20px;margin-bottom:18px;overflow:hidden; }
.form-section-header { padding:20px 22px 16px;border-bottom:1px solid #eef0f2;background:linear-gradient(180deg,#fff,#fdfdfd); }
.form-section-header h2 { font-size:17px;font-weight:800;margin:0; }
.form-section-header p { color:var(--legend-muted);font-size:12px;line-height:1.6;margin:7px 0 0; }
.form-section-body { padding:22px;display:grid;gap:22px; }
.field-wrap { position:relative; }
.field-label-row { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:9px; }
.field-label { font-weight:700;font-size:13px;line-height:1.5; }
.field-actions { display:flex;gap:7px;flex-shrink:0; }
.ai-btn { border:1px solid #ead7f3;background:#fbf4ff;color:#7e3fa0;border-radius:9px;padding:6px 9px;font-size:11px;font-weight:700; }
.ai-btn:hover { background:#f3e6fa; }
.visibility-btn { border:1px solid var(--legend-border);background:#fff;color:#6b7280;border-radius:9px;padding:6px 9px;font-size:11px; }
.visibility-btn.is-public { background:#edf8f2;border-color:#c8e8d5;color:#177345; }
.field-control { border-radius:13px;border-color:#dadee5;padding:12px 14px;font-size:14px;line-height:1.65; }
.field-control:focus { border-color:var(--legend-red);box-shadow:0 0 0 .2rem rgba(196,22,28,.09); }
.range-wrap { display:grid;grid-template-columns:1fr 54px;gap:15px;align-items:center; }
.range-value { width:54px;height:44px;border-radius:12px;background:#fff0f0;color:var(--legend-red);display:grid;place-items:center;font-weight:800;font-size:20px; }

.side-card { background:#fff;border:1px solid var(--legend-border);border-radius:18px;padding:18px; }
.side-card h3 { font-size:14px;font-weight:800;margin-bottom:14px; }
.save-state { display:flex;align-items:center;gap:9px;color:var(--legend-muted);font-size:12px; }
.save-dot { width:8px;height:8px;border-radius:50%;background:#9aa1ad; }
.save-dot.saving { background:#e5a313;animation:pulse 1s infinite; }
.save-dot.saved { background:#15915b; }
@keyframes pulse { 50% { opacity:.35; } }
.share-box { background:#f7f8fa;border-radius:12px;padding:12px;font-size:11px;word-break:break-all;color:#5f6673; }

.ai-modal-header { background:linear-gradient(135deg,#4f205f,#8b3aa9 62%,#c4161c);border:0;padding:20px 24px; }
.eyebrow { font-size:10px;letter-spacing:.14em;font-weight:800; }
.ai-result { white-space:pre-wrap;line-height:1.75;color:#343b49;background:#faf8fc;border:1px solid #eee5f2;border-radius:16px;padding:20px;min-height:170px; }
.ai-orbit { width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:#f4e8fa;color:#8b3aa9;font-size:26px;animation:float 1.6s ease-in-out infinite; }
@keyframes float { 50% { transform:translateY(-6px); } }

.public-shell { min-height:100vh;background:linear-gradient(180deg,#f7f8fa,#fff); }
.public-header { background:#151a29;color:#fff;padding:22px 0; }
.public-content { max-width:920px;margin:0 auto;padding:44px 20px 70px; }
.public-hero { background:linear-gradient(135deg,#fff,#fff7f7);border:1px solid #eadfe0;border-radius:24px;padding:30px;margin-bottom:20px; }
.public-hero h1 { font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-1.4px; }
.public-section { background:#fff;border:1px solid var(--legend-border);border-radius:20px;margin-bottom:16px;overflow:hidden; }
.public-section h2 { margin:0;padding:17px 20px;background:#f8f9fa;border-bottom:1px solid var(--legend-border);font-size:16px;font-weight:800; }
.public-item { padding:18px 20px;border-bottom:1px solid #f0f1f3; }
.public-item:last-child { border-bottom:0; }
.public-label { font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--legend-muted);font-weight:800;margin-bottom:7px; }
.public-value { white-space:pre-wrap;line-height:1.7; }

.mobile-menu { display:none; }

@media (max-width: 1250px) {
  .vinka-meaning-grid { grid-template-columns:repeat(3,1fr); }
  .vinka-meaning-item { min-height:98px; }
  .vinka-home-hero { grid-template-columns:1fr; }
  .vinka-home-capabilities { grid-template-columns:repeat(4,1fr); }
}
@media (max-width: 980px) {
  .vinka-home-capabilities { grid-template-columns:1fr 1fr; }
}
@media (max-width: 1100px) {
  .form-type-grid { grid-template-columns:1fr; }
  .editor-layout { grid-template-columns:1fr; }
  .editor-sidebar { position:static;grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 860px) {
  .login-shell { grid-template-columns:1fr; }
  .login-visual { display:none; }
  .login-panel { min-height:100vh;padding:24px; }
  .login-mobile-intro { display:block; }
  .vinka-login-card { width:min(500px,100%); }
  .vinka-home-hero { border-radius:22px; padding:26px 22px; }
  .vinka-home-copy h1 { font-size:clamp(30px,8vw,44px); letter-spacing:-1.4px; }
  .vinka-home-values { grid-template-columns:repeat(5,minmax(0,1fr)); overflow-x:auto; }
  .vinka-home-values span { min-width:94px; }
  .sidebar { transform:translateX(-100%);box-shadow:20px 0 40px rgba(0,0,0,.18); }
  .sidebar.open { transform:translateX(0); }
  .main-shell { margin-left:0; }
  .mobile-menu { display:grid; }
  .stat-grid { grid-template-columns:1fr; }
  .page-heading { flex-direction:column; }
}

@media (max-width: 575px) {
  .vinka-home-capabilities { grid-template-columns:1fr; }
  .vinka-home-capabilities article { min-height:auto; }
  .vinka-home-actions .btn { width:100%; }
  .vinka-login-benefits { gap:5px; }
  .brand-mark { font-size:34px; }
}
@media (max-width: 600px) {
  .main-content { padding:20px 14px 36px; }
  .topbar { padding:0 14px;height:66px; }
  .topbar-title { font-size:16px; }
  .version-card { grid-template-columns:1fr; }
  .version-actions { justify-content:flex-end; }
  .editor-sidebar { grid-template-columns:1fr; }
  .field-label-row { flex-direction:column; }
  .field-actions { width:100%; }
  .hero-card { border-radius:18px; }
}

@media print {
  .sidebar,.topbar,.editor-sidebar,.field-actions,.page-heading .btn,.toast-container { display:none !important; }
  .main-shell { margin:0; }
  .main-content { padding:0; }
  body { background:#fff; }
  .editor-top,.form-section { border:1px solid #bbb;box-shadow:none;break-inside:avoid; }
  .field-control { border:0;padding-left:0;padding-right:0; }
}

/* PHP/MySQL edition additions */
.channel-picker { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.channel-picker label { cursor:pointer; }
.channel-picker input { position:absolute; opacity:0; pointer-events:none; }
.channel-picker span { min-height:54px; border:1px solid var(--legend-border); border-radius:14px; display:flex; align-items:center; justify-content:center; gap:9px; font-size:13px; font-weight:700; background:#fff; }
.channel-picker input:checked + span { border-color:var(--legend-red); background:#fff3f3; color:var(--legend-red); box-shadow:0 0 0 3px rgba(196,22,28,.07); }
.section-number { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; background:#fff0f0; color:var(--legend-red); font-size:11px; font-weight:800; }
.status-shared { background:#fff7df; color:#966c00; }
.shared-card { border-left:4px solid #e5b927; }
.small-avatar { width:36px; height:36px; font-size:11px; flex:0 0 auto; }
.share-section { background:#fff; }
.member-search { position:relative; }
.member-search > i { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:#9097a3; z-index:2; }
.member-search input { padding-left:42px; border-radius:13px; }
.member-results { max-height:240px; overflow:auto; display:grid; gap:7px; }
.member-result { width:100%; border:1px solid var(--legend-border); border-radius:13px; background:#fff; padding:10px 12px; display:flex; align-items:center; gap:11px; }
.member-result:hover { background:#f8f9fa; border-color:#cfd3da; }
.member-result strong, .current-share-row strong { display:block; font-size:13px; }
.member-result small, .current-share-row small { display:block; color:var(--legend-muted); font-size:11px; margin-top:2px; }
.current-share-row { border:1px solid var(--legend-border); border-radius:13px; padding:10px 12px; display:flex; align-items:center; gap:11px; margin-bottom:8px; }
.create-picker-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width: 760px) { .create-picker-grid { grid-template-columns:1fr; } .channel-picker { grid-template-columns:1fr; } }

/* Product / service management */
.product-mini-card,
.product-ai-entry {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 24px;
  border: 1px solid rgba(220, 53, 69, .14);
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(255,245,246,.88));
  box-shadow: 0 18px 40px rgba(15, 23, 42, .06);
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 22px;
}
.product-card {
  border: 0;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 20px 46px rgba(15, 23, 42, .08);
  overflow: hidden;
}
.product-card-image {
  height: 210px;
  background: #f5f7fb;
  overflow: hidden;
}
.product-card-image img,
.product-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.product-no-image {
  height: 100%;
  display: grid;
  place-items: center;
  color: #9aa4b2;
  font-size: 44px;
}
.product-card-body { padding: 22px; }
.product-card-body h3 { font-size: 20px; font-weight: 800; margin: 0 0 8px; color: #111827; }
.product-price { font-weight: 800; color: #c4161c; margin-bottom: 10px; }
.product-desc { color: #667085; min-height: 48px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.product-editor {
  display: block;
}
.product-editor-main {
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.product-image-box,
.product-fields-card {
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 20px 46px rgba(15, 23, 42, .08);
  padding: 24px;
}
.product-preview {
  height: 320px;
  border: 2px dashed #d8dee9;
  border-radius: 24px;
  background: #f8fafc;
  display: grid;
  place-items: center;
  color: #98a2b3;
  text-align: center;
  overflow: hidden;
}
.product-preview i { font-size: 52px; display: block; }
.product-preview span { display: block; font-weight: 700; margin-top: 8px; }
.product-preview.has-image { border-style: solid; padding: 0; }
.btn-purple {
  color: #7e22ce;
  background: #faf5ff;
  border: 1px solid #e9d5ff;
  font-weight: 700;
}
.btn-purple:hover { color: #581c87; background: #f3e8ff; border-color: #d8b4fe; }
.product-ai-result .lead { font-weight: 800; color: #101828; }
.tag-row { display: flex; flex-wrap: wrap; gap: 8px; }
.tag-row span { padding: 6px 10px; border-radius: 999px; background: #f1f5f9; color: #475467; font-size: 12px; font-weight: 700; }
@media (max-width: 992px) {
  .product-editor-main { grid-template-columns: 1fr; }
  .product-mini-card,
  .product-ai-entry { flex-direction: column; align-items: flex-start; }
}

/* Public profile / summary module */
.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}.avatar-upload-row{display:flex;gap:18px;align-items:center}.profile-avatar-xl,.profile-avatar-hero,.public-avatar{display:grid;place-items:center;border-radius:999px;background:linear-gradient(135deg,#d92536,#111827);color:#fff;font-weight:800;overflow:hidden;flex:0 0 auto}.profile-avatar-xl{width:104px;height:104px;font-size:32px}.profile-avatar-hero{width:112px;height:112px;font-size:36px}.profile-avatar-xl img,.profile-avatar-hero img,.public-avatar img{width:100%;height:100%;object-fit:cover}.summary-admin-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}.summary-preview-card,.summary-settings-card,.orders-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:28px;box-shadow:0 20px 50px rgba(17,24,39,.06);padding:28px}.summary-owner-card{display:flex;gap:22px;align-items:center;padding:24px;border-radius:24px;background:linear-gradient(135deg,#fff7f7,#f7fafc);border:1px solid rgba(217,37,54,.1);margin-bottom:22px}.summary-owner-card h2{font-size:32px;font-weight:800;margin:6px 0}.summary-section{padding:22px 0;border-top:1px solid rgba(17,24,39,.08)}.summary-section h3,.summary-settings-card h3,.orders-card h2{font-weight:800;font-size:20px;margin-bottom:16px}.summary-kv{padding:14px 0;border-bottom:1px dashed rgba(17,24,39,.1)}.summary-kv:last-child{border-bottom:0}.summary-kv>div{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#d92536;font-weight:800;margin-bottom:6px}.summary-kv p{white-space:pre-line;margin:0;color:#344054;line-height:1.7}.mini-product-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mini-product-card{display:flex;gap:12px;align-items:center;padding:12px;border-radius:18px;background:#f8fafc;border:1px solid rgba(17,24,39,.06)}.mini-product-card img,.mini-product-placeholder{width:58px;height:58px;border-radius:14px;object-fit:cover;background:#e5e7eb;display:grid;place-items:center}.mini-product-card p{margin:2px 0 0;color:#667085;font-size:13px}.qr-box{text-align:center;padding:16px;border-radius:20px;background:#f8fafc}.qr-box img{max-width:220px;width:100%;height:auto;border-radius:14px;background:#fff;padding:8px}.order-list{display:grid;gap:12px}.order-row{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:16px;border-radius:18px;background:#f8fafc;border:1px solid rgba(17,24,39,.06)}.order-status{max-width:160px}.public-profile-shell{background:#f6f7fb;min-height:100vh}.public-profile-main{max-width:1120px;margin:0 auto;padding:54px 20px 80px}.public-profile-hero{display:grid;grid-template-columns:160px minmax(0,1fr) 260px;gap:26px;align-items:center;background:#fff;border-radius:34px;padding:34px;border:1px solid rgba(17,24,39,.08);box-shadow:0 24px 70px rgba(17,24,39,.08)}.public-avatar{width:150px;height:150px;font-size:48px}.public-hero-text h1{font-size:44px;font-weight:900;letter-spacing:-.04em;margin:8px 0}.public-headline{font-size:20px;color:#344054;line-height:1.6;margin-bottom:14px}.public-meta-row,.public-actions{display:flex;flex-wrap:wrap;gap:12px}.public-meta-row span{display:inline-flex;align-items:center;gap:7px;color:#667085;font-weight:600}.public-actions{margin-top:22px}.public-qr-card{text-align:center;background:#111827;color:#fff;border-radius:26px;padding:18px}.public-qr-card img{width:190px;max-width:100%;background:#fff;border-radius:16px;padding:8px}.public-qr-card p{margin:12px 0 0;color:rgba(255,255,255,.75);font-size:13px}.public-profile-section{background:#fff;border-radius:28px;padding:30px;margin-top:24px;border:1px solid rgba(17,24,39,.08);box-shadow:0 18px 45px rgba(17,24,39,.05)}.public-profile-section h2{font-weight:900;font-size:26px;margin-bottom:18px}.public-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.public-product-card{display:flex;gap:18px;border-radius:22px;border:1px solid rgba(17,24,39,.08);padding:16px;background:#fff}.public-product-card>img,.public-product-placeholder{width:160px;height:160px;object-fit:cover;border-radius:18px;background:#edf2f7;display:grid;place-items:center;flex:0 0 auto}.public-product-body h3{font-weight:800;margin:12px 0 8px}.public-benefits{background:#f8fafc;border-radius:14px;padding:12px;line-height:1.6;color:#344054}.public-order-form{background:#fff7f7;border:1px solid rgba(217,37,54,.15);border-radius:22px;padding:22px}.order-public-section{border-color:rgba(217,37,54,.18)}
@media (max-width: 991px){.profile-layout,.summary-admin-grid,.public-profile-hero{grid-template-columns:1fr}.public-qr-card{max-width:260px}.public-product-grid,.mini-product-list{grid-template-columns:1fr}.public-product-card{flex-direction:column}.public-product-card>img,.public-product-placeholder{width:100%;height:220px}.summary-owner-card{align-items:flex-start;flex-direction:column}}
@media (max-width: 575px){.avatar-upload-row{flex-direction:column;align-items:flex-start}.public-profile-hero{padding:24px}.public-hero-text h1{font-size:34px}.public-avatar{width:120px;height:120px}.order-row{flex-direction:column}.order-status{max-width:100%}}
.contact-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.contact-link-item{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:18px;background:#f8fafc;border:1px solid rgba(17,24,39,.07);min-width:0}.contact-link-item>i{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:#fff;color:#d92536;box-shadow:0 8px 20px rgba(17,24,39,.06);flex:0 0 auto}.contact-link-item span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#667085;font-weight:800;margin-bottom:4px}.contact-link-item a,.contact-link-item p{margin:0;color:#111827;font-weight:700;line-height:1.5;word-break:break-word;white-space:pre-line}.contact-link-item a{text-decoration:none}.contact-link-item a:hover{color:#d92536}
@media (max-width: 767px){.contact-link-grid{grid-template-columns:1fr}}

/* Admin account/package management */
.admin-toolbar{display:flex;gap:12px;margin-bottom:18px}.admin-toolbar .input-group{max-width:720px}.admin-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:22px;align-items:start}.admin-list-card,.admin-detail-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:28px;box-shadow:0 20px 50px rgba(17,24,39,.06);padding:20px}.admin-list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.admin-list-head h3,.admin-detail-card h3{font-weight:900;margin:0}.admin-user-list{display:grid;gap:10px}.admin-user-row{width:100%;border:1px solid rgba(17,24,39,.08);background:#fff;border-radius:20px;padding:14px;text-align:left;display:flex;gap:13px;align-items:center;transition:.18s ease}.admin-user-row:hover,.admin-user-row.active{border-color:rgba(217,37,54,.35);box-shadow:0 12px 30px rgba(217,37,54,.08);transform:translateY(-1px)}.small-avatar{width:42px!important;height:42px!important;font-size:14px!important}.admin-badges{display:flex;gap:6px;flex-wrap:wrap}.admin-counts{display:flex;flex-direction:column;gap:4px;text-align:right;font-size:12px;color:#667085;font-weight:700;white-space:nowrap}.admin-detail-sticky{position:sticky;top:24px}.admin-detail-section{border-top:1px solid rgba(17,24,39,.08);padding-top:18px;margin-top:18px}.admin-detail-section h4{font-size:16px;font-weight:900;margin-bottom:12px}.admin-switch-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border:1px solid rgba(17,24,39,.08);border-radius:18px;padding:14px;margin-bottom:10px;background:#f8fafc}.admin-switch-row strong{display:block;font-size:14px;color:#111827}.admin-switch-row p{margin:4px 0 0;font-size:12px;color:#667085;line-height:1.5}.admin-switch-row .form-check-input{width:46px;height:24px;flex:0 0 auto}.admin-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.admin-mini-stats span{background:#f8fafc;border-radius:14px;padding:10px;text-align:center;font-size:12px;font-weight:800;color:#344054}.admin-kv{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px dashed rgba(17,24,39,.08)}.admin-kv:last-child{border-bottom:0}.admin-kv span{color:#667085}.admin-kv strong{color:#111827}.admin-loading{text-align:center;background:#fff;border-radius:28px;padding:60px 24px;box-shadow:0 20px 50px rgba(17,24,39,.06)}.package-locked{border-style:dashed!important;background:#fff!important}
@media (max-width: 1100px){.admin-layout{grid-template-columns:1fr}.admin-detail-sticky{position:static}}
@media (max-width: 640px){.admin-toolbar{flex-direction:column}.admin-user-row{align-items:flex-start}.admin-counts{text-align:left}.admin-mini-stats{grid-template-columns:1fr}.admin-switch-row{align-items:flex-start;flex-direction:column}.admin-switch-row .form-check-input{align-self:flex-end}}

.limit-alert{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #d8f3dc;background:#f1fbf4;color:#146c43;border-radius:18px;padding:14px 18px;margin-bottom:18px;font-weight:600}.limit-alert span{background:#fff;border:1px solid rgba(20,108,67,.15);border-radius:999px;padding:6px 12px;white-space:nowrap}.limit-alert-danger{border-color:#f5c2c7;background:#fff5f5;color:#b02a37}.admin-number-row{display:grid;grid-template-columns:1fr 140px;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid rgba(17,24,39,.08)}.admin-number-row strong{display:block;color:#111827}.admin-number-row p{margin:3px 0 0;color:#6b7280;font-size:.88rem}.admin-number-row input{text-align:center;font-weight:800;border-radius:14px}

/* Phone-only Zalo OTP login */
.otp-countdown {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .65rem .9rem;
  border-radius: 999px;
  background: #fff4f4;
  color: #d92d43;
  font-weight: 700;
  border: 1px solid rgba(217, 45, 67, .18);
}


.contact-save-main{max-width:980px}.contact-save-hero{grid-template-columns:140px minmax(0,1fr)}.contact-save-card{border-color:rgba(217,37,54,.15)}.contact-save-actions{display:flex;flex-wrap:wrap;gap:12px}.contact-save-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.contact-save-steps div{background:#f8fafc;border:1px solid rgba(17,24,39,.08);border-radius:18px;padding:16px}.contact-save-steps strong{display:block;color:#111827;margin-bottom:6px}.contact-save-steps span{display:block;color:#667085;line-height:1.6}@media (max-width: 767px){.contact-save-hero{grid-template-columns:1fr}.contact-save-actions .btn{width:100%;justify-content:center}.contact-save-steps{grid-template-columns:1fr}}

/* Shop packages / upgrade module */
.shop-current-card,.shop-extra-card,.shop-payment-card{display:flex;justify-content:space-between;align-items:center;gap:24px;background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:28px;padding:28px;box-shadow:0 20px 50px rgba(17,24,39,.06)}.shop-current-card h3,.shop-extra-card h3,.shop-payment-card h3{font-weight:900;margin:8px 0}.shop-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.shop-plan-card{display:flex;flex-direction:column;justify-content:space-between;gap:22px;background:#fff;border:1px solid rgba(217,37,54,.14);border-radius:30px;padding:28px;box-shadow:0 22px 56px rgba(17,24,39,.07)}.shop-plan-card h3{font-weight:900;margin:8px 0 10px}.shop-plan-card ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}.shop-plan-card li{display:flex;gap:9px;align-items:flex-start;color:#344054;font-weight:600}.shop-plan-card li i{color:#16a34a;margin-top:2px}.shop-price-actions{display:flex;flex-wrap:wrap;gap:10px}.shop-extra-form{display:flex;gap:10px;align-items:center;flex:0 0 auto}.shop-extra-form input{width:120px;text-align:center;font-weight:800;border-radius:999px}.shop-payment-card{align-items:stretch;border-color:rgba(217,37,54,.22);background:linear-gradient(135deg,#fff,#fff7f7)}.payment-content{display:inline-flex;padding:10px 14px;border-radius:14px;background:#111827;color:#fff;font-weight:900;letter-spacing:.03em}.payment-bank{display:grid;gap:4px;color:#344054}.shop-qr-box{width:260px;display:grid;place-items:center;background:#fff;border-radius:24px;border:1px dashed rgba(217,37,54,.25);padding:18px}.shop-qr-box img{max-width:220px;width:100%;height:auto;border-radius:16px}.qr-placeholder{display:grid;place-items:center;text-align:center;color:#667085;gap:10px;min-height:200px}.qr-placeholder i{font-size:64px;color:#d92d43}.qr-placeholder span{font-weight:700}.public-cart-items{display:grid;gap:8px}.public-cart-item{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:16px;padding:12px}.public-cart-item span{display:block;color:#667085;font-size:13px;margin-top:2px}.nav-button .bi-stars{color:#ffd166}@media(max-width:991px){.shop-plan-grid{grid-template-columns:1fr}.shop-current-card,.shop-extra-card,.shop-payment-card{flex-direction:column;align-items:flex-start}.shop-qr-box{width:100%}.shop-extra-form{width:100%}.shop-extra-form input{width:100%}.shop-extra-form .btn{white-space:nowrap}}@media(max-width:575px){.shop-price-actions .btn{width:100%}.shop-extra-form{flex-direction:column}.shop-extra-form .btn{width:100%}}

/* Product gallery images */
.product-gallery-box{border:1px solid rgba(17,24,39,.08);border-radius:22px;background:#f8fafc;padding:16px}
.product-gallery-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.gallery-thumb{position:relative;aspect-ratio:1/1;border-radius:16px;overflow:hidden;background:#e5e7eb;border:1px solid rgba(17,24,39,.08)}
.gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-thumb span{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:999px;display:grid;place-items:center;background:rgba(17,24,39,.82);color:#fff;font-size:12px;font-weight:800}
.gallery-empty{grid-column:1/-1;border:1px dashed #cbd5e1;border-radius:16px;padding:14px;text-align:center;color:#667085;font-weight:700;background:#fff}
@media(max-width:575px){.product-gallery-preview{grid-template-columns:repeat(2,minmax(0,1fr))}}
.public-product-gallery{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.public-product-gallery img{width:56px;height:56px;object-fit:cover;border-radius:12px;border:1px solid rgba(17,24,39,.08);background:#f1f5f9}

/* Admin package settings */
.package-settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 18px; }
.package-setting-card { overflow: hidden; }
.package-price-editor { border-top: 1px solid rgba(15, 23, 42, .08); padding-top: 14px; }
.package-price-row { padding: 12px; border: 1px solid rgba(15, 23, 42, .08); border-radius: 18px; background: #f8fafc; margin: 0 0 10px; }

.subscription-status-box{border:1px solid rgba(17,24,39,.08);border-radius:18px;padding:14px 16px;margin-bottom:12px;background:#f8fafc;display:flex;justify-content:space-between;gap:12px;align-items:center}.subscription-status-box strong{color:#111827}.subscription-status-box span{font-size:12px;color:#667085}.subscription-status-box.expired{background:#fff1f2;border-color:rgba(217,37,54,.22)}.subscription-status-box.expiring{background:#fffbeb;border-color:rgba(245,158,11,.28)}.package-history-list{display:grid;gap:10px}.package-history-row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;border:1px solid rgba(17,24,39,.08);border-radius:16px;padding:12px;background:#f8fafc}.status-pending{background:#fffbeb;color:#92400e;border-color:#fde68a}

.shop-date-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}.shop-date-row>span{display:inline-flex;align-items:center;gap:4px;background:#f8fafc;border:1px solid rgba(17,24,39,.08);border-radius:999px;padding:7px 11px;font-size:13px;color:#344054;font-weight:700}

/* Internal finance dashboard */
.finance-chart-card,.finance-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:28px;box-shadow:0 20px 50px rgba(17,24,39,.06);padding:24px}.finance-chart-card h3,.finance-card h3{font-weight:900;margin:6px 0 8px}.finance-legend{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:#667085;font-weight:700;font-size:13px}.finance-legend span{width:12px;height:12px;border-radius:999px;display:inline-block;margin-left:8px}.finance-legend .revenue{background:#d92d43}.finance-legend .profit{background:#16a34a}.finance-legend .expense{background:#f59e0b}.finance-chart-wrap{width:100%;overflow-x:auto}.finance-chart-wrap svg{width:100%;min-width:760px;height:auto}.finance-chart-wrap .axis{stroke:#cbd5e1;stroke-width:1}.finance-chart-wrap text{font-size:12px;fill:#64748b;font-weight:700}.finance-chart-wrap .axis-label{fill:#111827;font-size:13px}.revenue-line,.profit-line,.expense-line{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.revenue-line{stroke:#d92d43}.profit-line{stroke:#16a34a}.expense-line{stroke:#f59e0b}.revenue-point{fill:#d92d43}.profit-point{fill:#16a34a}.expense-point{fill:#f59e0b}.finance-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.finance-expense-form{margin-top:14px}.finance-breakdown-list{display:grid;gap:10px;margin-top:12px}.finance-breakdown-list>div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:12px 14px;border-radius:16px;background:#f8fafc;border:1px solid rgba(17,24,39,.06)}.finance-breakdown-list span{font-weight:800;color:#111827}.finance-breakdown-list strong{color:#d92d43}.finance-breakdown-list small{color:#667085;font-weight:700}@media(max-width:991px){.finance-layout{grid-template-columns:1fr}.finance-chart-card,.finance-card{padding:18px}.finance-breakdown-list>div{grid-template-columns:1fr}.finance-legend span{margin-left:0}}

/* Hotfix: gói dùng thử chỉ dùng một lần */
.shop-plan-card.shop-plan-disabled {
  opacity: 0.78;
}
.shop-plan-card.shop-plan-disabled .btn:disabled {
  cursor: not-allowed;
}

/* SePay payment modal for shop package upgrade */
body.payment-modal-open{overflow:hidden}
#upgradePaymentModalRoot:not(.show){display:none}
#upgradePaymentModalRoot.show{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;padding:18px;height:var(--legend-visual-height,100dvh);max-height:var(--legend-visual-height,100dvh);overflow:hidden}
.payment-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(8px)}
.payment-modal-card{position:relative;z-index:1;width:min(920px,100%);max-height:min(calc(100vh - 36px),calc(var(--legend-visual-height,100dvh) - 36px));overflow:auto;background:#fff;border-radius:30px;box-shadow:0 30px 90px rgba(15,23,42,.35);padding:30px;border:1px solid rgba(217,37,54,.14);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.payment-modal-close{position:absolute;right:18px;top:18px;width:42px;height:42px;border:0;border-radius:999px;background:#f2f4f7;color:#344054;display:grid;place-items:center;transition:.18s ease}
.payment-modal-close:hover{background:#111827;color:#fff}
.payment-modal-head{padding-right:46px;margin-bottom:22px}.payment-modal-head h2{font-weight:950;margin:6px 0}.payment-modal-head p{margin:0;color:#667085;font-weight:700}
.payment-modal-body{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:26px;align-items:center}
.payment-modal-qr{display:grid;place-items:center;background:linear-gradient(135deg,#fff7f7,#fff);border:1px dashed rgba(217,37,54,.3);border-radius:26px;padding:22px;min-height:320px}
.payment-modal-qr img{width:min(320px,100%);height:auto;border-radius:20px;background:#fff;box-shadow:0 18px 45px rgba(15,23,42,.12)}
.payment-modal-info{display:grid;gap:16px}.payment-amount{font-size:clamp(34px,5vw,56px);line-height:1;font-weight:950;color:#d92d43;letter-spacing:-.04em}.payment-modal-section label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#667085;font-weight:900;margin-bottom:8px}.modal-payment-content{font-size:15px;max-width:100%;word-break:break-word}.payment-modal-bank{background:#f9fafb;border:1px solid rgba(17,24,39,.07);border-radius:18px;padding:14px}.payment-modal-mobile-actions{display:none}
@media(max-width:767px){#upgradePaymentModalRoot.show{align-items:stretch;justify-items:stretch;padding:calc(env(safe-area-inset-top,0px) + 12px) 10px calc(env(safe-area-inset-bottom,0px) + 12px);height:var(--legend-visual-height,100dvh);max-height:var(--legend-visual-height,100dvh)}body.payment-modal-open{position:fixed;inset:0;width:100%}.payment-modal-card{width:100%;max-height:calc(var(--legend-visual-height,100dvh) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);border-radius:26px;padding:16px;overflow-y:auto}.payment-modal-close{position:sticky;top:0;margin-left:auto;margin-right:0;margin-bottom:-38px;z-index:8;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.18)}.payment-modal-head{padding-right:52px;padding-top:4px;margin-bottom:16px}.payment-modal-head h2{font-size:24px;line-height:1.18}.payment-modal-body{grid-template-columns:1fr;gap:18px}.payment-modal-qr{min-height:auto;padding:12px;border-radius:22px}.payment-modal-qr img{width:min(100%,320px);border-radius:16px}.payment-amount{font-size:44px}.payment-modal-mobile-actions{display:flex;position:sticky;bottom:0;z-index:7;margin:18px -16px -16px;padding:12px 16px calc(env(safe-area-inset-bottom,0px) + 12px);background:linear-gradient(180deg,rgba(255,255,255,.72),#fff 35%);backdrop-filter:blur(10px);border-top:1px solid rgba(17,24,39,.08)}.payment-modal-mobile-actions .btn{width:100%;font-weight:900}}

/* Upgrade request tracking */
.upgrade-filter-toolbar{flex-wrap:wrap;align-items:center}
.upgrade-filter-toolbar .form-select{max-width:220px}
.upgrade-filter-toolbar input[type="date"]{max-width:170px}
.upgrade-request-table th,.upgrade-request-table td{vertical-align:middle}.payment-code-inline{display:inline-block;max-width:260px;word-break:break-word;font-weight:800;color:#111827;background:#f8fafc;border:1px solid rgba(17,24,39,.08);border-radius:12px;padding:7px 10px}
.upgrade-request-mobile-list{display:none}.upgrade-request-empty-mobile{display:grid;place-items:center;text-align:center;gap:8px;padding:34px 18px;border-radius:24px;background:#fff;border:1px dashed rgba(17,24,39,.15);color:#667085}.upgrade-request-empty-mobile i{font-size:42px;color:#d92d43}.upgrade-request-empty-mobile strong{color:#111827}.upgrade-request-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:24px;box-shadow:0 16px 38px rgba(17,24,39,.07);padding:18px;display:grid;gap:14px}.upgrade-request-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.upgrade-request-card-head h3{font-size:18px;line-height:1.3;font-weight:900;margin:4px 0 0;color:#111827}.upgrade-request-id{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#667085;font-weight:900}.upgrade-request-amount{font-size:28px;line-height:1;font-weight:950;color:#d92d43;letter-spacing:-.035em}.upgrade-request-mobile-member{display:flex;gap:10px;align-items:center;background:#f8fafc;border:1px solid rgba(17,24,39,.06);border-radius:18px;padding:12px}.upgrade-request-mobile-member i{font-size:22px;color:#d92d43}.upgrade-request-mobile-member strong,.upgrade-request-mobile-member span{display:block}.upgrade-request-mobile-member span{font-size:13px;color:#667085;font-weight:700}.upgrade-request-mobile-grid{display:grid;grid-template-columns:1fr;gap:10px}.upgrade-request-mobile-grid>div{background:#f8fafc;border:1px solid rgba(17,24,39,.06);border-radius:16px;padding:11px 12px}.upgrade-request-mobile-grid span,.upgrade-request-payment-box>span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#667085;font-weight:900;margin-bottom:5px}.upgrade-request-mobile-grid strong{font-size:13px;color:#111827}.upgrade-request-payment-box{display:grid;gap:7px}.upgrade-request-card-actions{display:flex;gap:10px;flex-wrap:wrap}.upgrade-request-card-actions .btn{flex:1 1 145px}
@media(max-width:767px){.upgrade-filter-toolbar .input-group,.upgrade-filter-toolbar .form-select,.upgrade-filter-toolbar input[type="date"],.upgrade-filter-toolbar .btn{max-width:none;width:100%}.payment-code-inline{max-width:100%}.upgrade-request-table-wrap{display:none}.upgrade-request-mobile-list{display:grid;gap:14px}.upgrade-request-card .status-badge{white-space:nowrap}.upgrade-request-card-head{align-items:flex-start}.upgrade-request-card-actions{flex-direction:column}.upgrade-request-card-actions .btn{width:100%;flex:auto}}

/* Hotfix: ép trang Giao dịch gói/Yêu cầu gần đây dùng card list trên iPhone/mobile */
.upgrade-requests-view.is-mobile-list .upgrade-request-table-wrap{display:none!important}
.upgrade-requests-view.is-mobile-list .upgrade-request-mobile-list{display:grid!important;gap:14px;width:100%}
.upgrade-requests-view.is-desktop-table .upgrade-request-table-wrap{display:block}
.upgrade-requests-view.is-desktop-table .upgrade-request-mobile-list{display:none}
@media (max-width:991.98px), (hover:none) and (pointer:coarse){
  .upgrade-requests-view .upgrade-request-table-wrap{display:none!important}
  .upgrade-requests-view .upgrade-request-mobile-list{display:grid!important;gap:14px;width:100%}
  .upgrade-request-table-wrap{display:none!important}
  .upgrade-request-mobile-list{display:grid!important;gap:14px;width:100%}
  .upgrade-request-card{border-radius:22px;padding:16px}
  .upgrade-request-card-head{display:grid;grid-template-columns:1fr;gap:10px}
  .upgrade-request-card .status-badge{width:max-content;max-width:100%;white-space:normal}
  .upgrade-filter-toolbar{grid-template-columns:1fr!important}
  .upgrade-request-pagination{gap:8px!important}
  .upgrade-request-pagination .btn{padding-left:12px!important;padding-right:12px!important}
}

@media(max-width:430px){.payment-modal-head h2{font-size:22px}.payment-modal-qr img{width:min(100%,300px)}.payment-amount{font-size:40px}.modal-payment-content{font-size:14px}}

/* Hotfix: nút tải QR chuyển khoản */
.payment-modal-qr-actions{width:min(320px,100%);margin-top:14px;display:grid;gap:8px}
.payment-modal-qr-actions .btn{font-weight:900}
@media(max-width:767px){.payment-modal-qr-actions{width:100%;margin-top:10px}.payment-modal-qr-actions .btn{padding:.8rem 1rem}}

/* Menu + network/marketplace update */
.sidebar-divider{height:1px;background:rgba(255,255,255,.12);margin:8px 0 10px}
.network-toolbar .input-group-text{border-right:0}.network-toolbar .form-control{border-left:0}.network-toolbar .form-control:focus{box-shadow:none;border-color:#dee2e6}
.business-network-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}.business-member-card{background:#fff;border:1px solid #eef0f4;border-radius:24px;padding:22px;box-shadow:0 16px 40px rgba(18,24,38,.06);display:flex;gap:16px;align-items:flex-start}.business-member-avatar{width:62px;height:62px;border-radius:20px;background:#fff1f2;color:#dc3545;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:18px;flex:0 0 62px;overflow:hidden}.business-member-avatar img{width:100%;height:100%;object-fit:cover}.business-member-body h3{font-size:18px;font-weight:900;margin:0 0 8px;color:#111827}.business-member-body p{margin:0 0 7px;color:#687086;display:flex;gap:8px;align-items:flex-start;line-height:1.35}.business-member-body .business-field{color:#111827;font-weight:700}.business-member-body i{color:#dc3545;margin-top:2px}
.marketplace-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.marketplace-product-card{background:#fff;border:1px solid #eef0f4;border-radius:26px;overflow:hidden;box-shadow:0 18px 45px rgba(18,24,38,.07);display:flex;flex-direction:column}.marketplace-product-image{width:100%;height:210px;object-fit:cover;background:#f6f7fb}.marketplace-product-image.placeholder{display:flex;align-items:center;justify-content:center;font-size:42px;color:#c0c7d2}.marketplace-product-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}.marketplace-product-body h3{font-size:20px;font-weight:900;margin:0;color:#111827}.market-desc{color:#687086;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.market-owner{display:flex;flex-direction:column;gap:4px;font-size:13px;color:#687086;background:#f8fafc;border-radius:16px;padding:12px}.market-owner strong{color:#111827;font-size:14px}.market-owner span{display:flex;gap:6px;align-items:center}.market-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:auto}.market-phone-link{border:1px solid #dc3545;background:#fff;color:#dc3545;border-radius:999px;padding:8px 14px;font-weight:800;text-decoration:none;display:inline-flex;gap:7px;align-items:center}.market-phone-link:hover,.market-phone-link.revealed{background:#dc3545;color:#fff}.premium-plan-card{grid-column:span 2}.premium-config-box{background:#f8fafc;border-radius:22px;padding:18px;border:1px solid #eef0f4}.premium-estimate{background:#fff;border:1px dashed #dc3545;border-radius:18px;padding:12px 14px;color:#111827;font-weight:800}.premium-estimate small{display:block;font-weight:500;color:#687086;margin-top:4px}.product-extra-upgrade-card{background:linear-gradient(135deg,#fff,#fff7f7);border:1px solid #fee2e2;border-radius:26px;padding:22px;display:grid;grid-template-columns:1fr minmax(240px,340px);gap:20px;align-items:center;box-shadow:0 18px 45px rgba(220,53,69,.08)}.product-extra-upgrade-card h3{font-weight:900;margin:4px 0}.product-extra-upgrade-form{display:grid;grid-template-columns:110px 1fr auto;gap:10px;align-items:center}.extra-upgrade-estimate{font-weight:900;color:#dc3545;background:#fff;border-radius:16px;padding:10px 12px;text-align:center;border:1px solid #fee2e2}
@media(max-width:991px){.premium-plan-card{grid-column:auto}.product-extra-upgrade-card{grid-template-columns:1fr}.product-extra-upgrade-form{grid-template-columns:1fr}.marketplace-grid,.business-network-grid{grid-template-columns:1fr}.business-member-card{border-radius:20px;padding:16px}.network-toolbar .input-group{display:grid;grid-template-columns:auto 1fr}.network-toolbar .btn{grid-column:1 / -1;border-radius:16px!important;margin-top:10px}.marketplace-product-image{height:190px}}
.one-to-one-actions{display:flex;flex-wrap:wrap;gap:12px}.one-to-one-actions .btn{font-weight:800}

.network-pagination{background:#fff;border:1px solid #eef0f4;border-radius:22px;padding:14px 16px;box-shadow:0 14px 35px rgba(18,24,38,.05)}
.network-pagination .btn{min-width:44px;font-weight:800}
@media(max-width:575px){.network-pagination{justify-content:center!important}.network-pagination>button{width:100%}.network-pagination .d-flex{justify-content:center}}

/* OpenAI network search */
.network-ai-note{margin:16px 0 0;background:linear-gradient(135deg,#fff7ed,#fff);border:1px solid rgba(217,45,67,.16);border-radius:22px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;box-shadow:0 14px 35px rgba(18,24,38,.05)}
.network-ai-note>i{width:38px;height:38px;border-radius:14px;background:#fff1f2;color:#dc3545;display:grid;place-items:center;flex:0 0 38px;font-size:18px}.network-ai-note strong,.network-ai-note span{display:block}.network-ai-note strong{color:#111827;font-weight:900}.network-ai-note span{color:#667085;font-weight:700;font-size:13px;margin-top:3px}.network-ai-note.warning{background:#fffbeb;border-color:#fde68a}.network-ai-note.warning>i{background:#fef3c7;color:#b45309}.business-member-body .ai-match{background:#f8fafc;border:1px solid rgba(17,24,39,.07);border-radius:14px;padding:9px 10px;margin:4px 0 9px;color:#344054;font-size:13px}.business-member-body .ai-match i{color:#dc3545}.business-member-body .ai-match span{flex:1}.business-member-body .ai-match em{font-style:normal;font-weight:900;color:#dc3545;background:#fff;border-radius:999px;padding:2px 7px;white-space:nowrap}

/* Mạng lưới doanh nghiệp: mỗi hàng chỉ hiển thị 1 kết quả, tránh card bị bó hẹp khi AI trả lý do dài. */
.business-member-card{width:100%;}
.business-member-body{min-width:0;flex:1;}
.business-member-body .ai-match{max-width:100%;}
.business-member-body .ai-match span{word-break:break-word;}

/* Network graph default view */
.business-network-list{display:grid;grid-template-columns:1fr!important;gap:18px}
.business-network-list .business-member-card{width:100%}
.business-network-graph{background:#fff;border:1px solid #eef0f4;border-radius:30px;padding:18px;box-shadow:0 18px 45px rgba(18,24,38,.07)}
.network-graph-stage{position:relative;min-height:620px;border-radius:26px;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(220,53,69,.12),rgba(255,255,255,.2) 22%,rgba(248,250,252,.96) 70%),linear-gradient(135deg,#fff,#f8fafc);isolation:isolate}
.network-graph-stage:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(220,53,69,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(220,53,69,.055) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle,#000 45%,transparent 86%);opacity:.9;pointer-events:none}
.network-graph-lines{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible}.network-edge{stroke:rgba(220,53,69,.22);stroke-width:.25;vector-effect:non-scaling-stroke}.network-edge-ring{stroke-dasharray:1.2 1.2;stroke:rgba(15,23,42,.16)}
.network-graph-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:132px;height:132px;border-radius:38px;background:linear-gradient(135deg,#dc3545,#9f1239);color:#fff;z-index:4;display:grid;place-items:center;text-align:center;box-shadow:0 24px 60px rgba(220,53,69,.35);padding:18px}.network-graph-center i{font-size:26px}.network-graph-center strong{font-size:25px;line-height:1;font-weight:1000}.network-graph-center span{font-size:12px;font-weight:800;opacity:.9}
.network-node{--size:72px;position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);transform:translate(-50%,-50%);width:var(--size);min-height:var(--size);border:0;background:transparent;color:#111827;text-decoration:none;z-index:5;display:grid;justify-items:center;gap:6px;padding:0;cursor:pointer;animation:networkNodeIn .45s ease both;animation-delay:calc(var(--i) * 22ms)}
.network-node>img,.network-node>span:first-child,.network-node>span:first-child img{width:58px;height:58px;border-radius:20px}.network-node>img,.network-node>span:first-child{display:grid;place-items:center;overflow:hidden;background:#fff1f2;color:#dc3545;border:3px solid #fff;box-shadow:0 16px 40px rgba(18,24,38,.16);font-weight:1000;font-size:15px}.network-node img{width:100%;height:100%;object-fit:cover}.network-node-name{max-width:112px;text-align:center;font-size:11px;font-weight:900;line-height:1.12;color:#344054;text-shadow:0 1px 0 #fff;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.85);border-radius:999px;padding:3px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.network-node:hover,.network-node:focus{z-index:20;outline:0}.network-node:hover>img,.network-node:hover>span:first-child,.network-node:focus>img,.network-node:focus>span:first-child{transform:translateY(-6px) scale(1.18);box-shadow:0 24px 55px rgba(220,53,69,.28);border-color:#fee2e2}.network-node:hover .network-node-name,.network-node:focus .network-node-name{color:#dc3545;background:#fff}
.network-node-tooltip{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translateX(-50%) translateY(8px);width:270px;background:#fff;border:1px solid rgba(220,53,69,.18);border-radius:18px;padding:13px 14px;box-shadow:0 26px 70px rgba(18,24,38,.2);opacity:0;visibility:hidden;pointer-events:none;text-align:left;transition:.18s ease;z-index:30}.network-node-tooltip:after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%) rotate(45deg);width:14px;height:14px;background:#fff;border-right:1px solid rgba(220,53,69,.18);border-bottom:1px solid rgba(220,53,69,.18)}.network-node:hover .network-node-tooltip,.network-node:focus .network-node-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}.network-node-tooltip strong{display:block;font-size:15px;font-weight:1000;color:#111827;margin-bottom:4px}.network-node-tooltip em{display:block;font-style:normal;font-weight:900;color:#dc3545;margin-bottom:7px}.network-node-tooltip small{display:flex;gap:7px;align-items:flex-start;color:#667085;font-weight:700;line-height:1.35;margin-top:5px}.network-node-tooltip small i{color:#dc3545}.network-node-tooltip b{display:inline-flex;margin-top:9px;color:#dc3545;background:#fff1f2;border-radius:999px;padding:4px 9px;font-size:12px}
.network-graph-hint{display:flex;gap:10px;align-items:flex-start;margin-top:12px;color:#667085;font-weight:700}.network-graph-hint i{color:#dc3545;font-size:18px;margin-top:1px}@keyframes networkNodeIn{from{opacity:0;transform:translate(-50%,-50%) scale(.72)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:991px){.network-graph-stage{min-height:560px}.network-node{--size:62px}.network-node>img,.network-node>span:first-child{width:50px;height:50px;border-radius:17px}.network-node-name{max-width:84px;font-size:10px}.network-node-tooltip{width:230px}.network-graph-center{width:108px;height:108px;border-radius:30px}.network-graph-center strong{font-size:21px}}
@media(max-width:575px){.business-network-graph{padding:12px;border-radius:24px}.network-graph-stage{min-height:520px}.network-node-tooltip{left:auto;right:-95px;transform:translateY(8px);width:218px}.network-node:hover .network-node-tooltip,.network-node:focus .network-node-tooltip{transform:translateY(0)}.network-node-tooltip:after{left:28px}.network-graph-hint{font-size:12px}}

/* Chapter-first network graph */
.business-network-chapter-map{background:#fff;border:1px solid #eef0f4;border-radius:30px;padding:18px;box-shadow:0 18px 45px rgba(18,24,38,.07)}
.network-chapter-map-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px;padding:8px 4px 2px}.network-chapter-map-head h2{font-size:26px;font-weight:1000;color:#111827;margin:4px 0}.network-chapter-map-head p{color:#667085;font-weight:700;margin:0}.network-chapter-stats{display:grid;grid-template-columns:auto auto;gap:3px 10px;background:#fff7ed;border:1px solid rgba(217,45,67,.14);border-radius:20px;padding:12px 15px;min-width:170px}.network-chapter-stats strong{font-size:20px;font-weight:1000;color:#dc3545;line-height:1}.network-chapter-stats span{font-size:12px;font-weight:800;color:#7c2d12;align-self:end}
.network-chapter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}.network-chapter-cluster{position:relative;min-height:330px;border-radius:28px;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(220,53,69,.11),rgba(255,255,255,.15) 24%,rgba(248,250,252,.96) 72%),linear-gradient(135deg,#fff,#f8fafc);border:1px solid #eef0f4;box-shadow:0 14px 35px rgba(18,24,38,.055);isolation:isolate;animation:networkNodeIn .45s ease both;animation-delay:calc(var(--i) * 28ms)}
.network-chapter-cluster:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(220,53,69,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(220,53,69,.045) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(circle,#000 48%,transparent 88%);pointer-events:none}.network-chapter-cluster .network-graph-lines{z-index:1}.network-chapter-node{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:118px;height:118px;border-radius:34px;background:linear-gradient(135deg,#dc3545,#9f1239);color:#fff;z-index:4;display:grid;place-items:center;text-align:center;box-shadow:0 22px 50px rgba(220,53,69,.28);padding:14px}.network-chapter-node i{font-size:22px}.network-chapter-node strong{font-size:16px;line-height:1.08;font-weight:1000;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.network-chapter-node span{font-size:11px;font-weight:900;opacity:.92}
.network-member-node{--size:58px;z-index:6}.network-member-node>img,.network-member-node>span:first-child{width:44px!important;height:44px!important;border-radius:16px!important;font-size:12px!important}.network-member-node .network-node-name{max-width:86px;font-size:9.5px;padding:2px 6px}.network-member-node .network-node-tooltip{width:238px}.network-member-node:hover>img,.network-member-node:hover>span:first-child,.network-member-node:focus>img,.network-member-node:focus>span:first-child{transform:translateY(-4px) scale(1.14)}
@media(max-width:991px){.network-chapter-map-head{display:block}.network-chapter-stats{margin-top:12px;width:max-content}.network-chapter-grid{grid-template-columns:1fr}.network-chapter-cluster{min-height:310px}}
@media(max-width:575px){.business-network-chapter-map{padding:12px;border-radius:24px}.network-chapter-grid{gap:14px}.network-chapter-cluster{min-height:300px}.network-chapter-node{width:104px;height:104px;border-radius:30px}.network-member-node .network-node-tooltip{width:218px}}

/* Network members layout: default matrix, search results as vertical list */
.business-network-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px}
.business-network-grid .business-member-card{height:100%;display:flex;flex-direction:column;align-items:flex-start}
.business-network-grid .business-member-avatar{width:68px;height:68px;flex:0 0 68px;border-radius:22px}
.business-network-grid .business-member-body{width:100%}
.business-network-list{display:grid!important;grid-template-columns:1fr!important;gap:18px}
.business-network-list .business-member-card{width:100%;display:flex;flex-direction:row;align-items:flex-start}
@media(max-width:1199px){.business-network-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:991px){.business-network-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.business-network-list .business-member-card{border-radius:20px;padding:16px}}
@media(max-width:575px){.business-network-grid{grid-template-columns:1fr!important}.business-network-grid .business-member-card,.business-network-list .business-member-card{flex-direction:row}}

/* Hotfix: icon trong nút Xem thiệp điện tử phải màu trắng, không bị rule icon màu đỏ của card ghi đè. */
.business-member-card .btn-danger i,
.business-member-body .btn-danger i,
.business-member-card a.btn-danger i,
.business-member-body a.btn-danger i{
  color:#fff!important;
}

.network-find-more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center}.network-find-more .btn{border-radius:18px;font-weight:900;padding:12px 20px;box-shadow:0 12px 28px rgba(217,45,67,.10)}.network-find-more p{margin:0;color:#667085;font-size:13px;font-weight:700}.network-find-more-status{display:flex;align-items:center;gap:9px;background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;border-radius:18px;padding:12px 16px;font-weight:800}.network-find-more-status.is-limit{background:#fffbeb;border-color:#fde68a;color:#92400e}.network-find-more-status i{font-size:18px}

/* Mua thêm lượt tìm kiếm AI */
.network-ai-purchase{width:min(760px,100%);display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;background:linear-gradient(135deg,#fff7f7,#fff);border:1px solid rgba(217,45,67,.2);border-radius:24px;padding:20px 22px;box-shadow:0 18px 45px rgba(17,24,39,.08)}
.network-ai-purchase>div{min-width:0}.network-ai-purchase strong{display:block;font-size:22px;line-height:1.25;color:#111827;margin:4px 0 7px;font-weight:950}.network-ai-purchase p{margin:0;color:#667085;font-size:13px;font-weight:700;line-height:1.55}.network-ai-purchase .btn{flex:0 0 auto;white-space:nowrap;box-shadow:0 14px 30px rgba(217,45,67,.2)}
@media(max-width:767px){.network-ai-purchase{align-items:stretch;flex-direction:column;padding:18px}.network-ai-purchase .btn{width:100%;white-space:normal}.network-ai-purchase strong{font-size:20px}}

/* Network search console: Smart vs Normal */
.network-search-console{position:relative;overflow:hidden;margin:18px 0 0;padding:26px;border-radius:28px;background:radial-gradient(circle at 85% 10%,rgba(255,62,92,.28),transparent 32%),linear-gradient(135deg,#101725 0%,#171d2b 52%,#23101a 100%);border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 64px rgba(15,23,42,.22);color:#fff;isolation:isolate}
.network-search-console-grid{position:absolute;inset:0;z-index:-1;opacity:.32;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.network-search-console:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-130px;bottom:-150px;background:rgba(217,45,67,.22);filter:blur(4px);z-index:-1}
.network-search-console-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:20px}.network-search-console-head h2{font-size:clamp(24px,3vw,38px);line-height:1.08;font-weight:950;letter-spacing:-.04em;margin:8px 0}.network-search-console-head p{margin:0;color:#b8c0ce;font-weight:650}.network-tech-label{display:inline-flex;align-items:center;gap:8px;color:#ff8da0;font-weight:900;font-size:12px;letter-spacing:.15em}.network-tech-label i{animation:networkPulse 1.7s infinite}
.network-ai-balance{min-width:178px;text-align:right;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(12px);padding:14px 16px;border-radius:20px}.network-ai-balance span,.network-ai-balance small{display:block;color:#cdd3dc;font-size:12px;font-weight:750}.network-ai-balance strong{display:block;font-size:34px;line-height:1;color:#fff;margin:5px 0;font-weight:950}
.network-search-modes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}.network-search-mode{appearance:none;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#fff;border-radius:20px;padding:16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;text-align:left;transition:.22s ease;position:relative;overflow:hidden}.network-search-mode:hover{transform:translateY(-2px);background:rgba(255,255,255,.09)}.network-search-mode.active{border-color:rgba(255,84,111,.8);background:linear-gradient(135deg,rgba(217,45,67,.28),rgba(255,255,255,.08));box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 14px 32px rgba(0,0,0,.16)}.network-search-mode.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#f43f5e}.network-mode-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-size:20px;color:#ff8da0}.network-search-mode:not(.active) .network-mode-icon{color:#c4cbd6}.network-mode-copy strong{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:900}.network-mode-copy strong em{font-size:10px;font-style:normal;text-transform:uppercase;letter-spacing:.08em;color:#fff;background:#d92d43;padding:4px 7px;border-radius:999px}.network-mode-copy small{display:block;color:#b9c1cd;line-height:1.45;margin-top:5px;font-weight:620}.network-mode-check{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);color:transparent}.network-search-mode.active .network-mode-check{background:#d92d43;border-color:#d92d43;color:#fff}
.network-search-command{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:9px 9px 9px 14px;background:#fff;border-radius:22px;box-shadow:0 15px 36px rgba(0,0,0,.22)}.network-search-command .form-control{border:0!important;box-shadow:none!important;font-size:16px;min-height:50px;padding:8px 4px;color:#101828}.network-search-command .form-control::placeholder{color:#98a2b3}.network-search-pulse{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:#fff1f3;color:#d92d43;font-size:18px}.network-search-submit{border:0!important;border-radius:16px!important;min-height:50px;padding:0 20px!important;background:linear-gradient(135deg,#d92d43,#f04462)!important;color:#fff!important;font-weight:900!important;box-shadow:0 10px 25px rgba(217,45,67,.28)}.network-search-console.is-normal .network-search-submit{background:linear-gradient(135deg,#344054,#101828)!important;box-shadow:0 10px 25px rgba(16,24,40,.22)}.network-search-clear{width:50px;height:50px;border-radius:16px!important;background:#f2f4f7!important;color:#344054!important}.network-search-console-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;color:#c6ccd5;font-size:12px;font-weight:700}.network-search-console-foot span{display:flex;align-items:center;gap:7px}.network-search-mode-hint i{color:#ff6b82}
.network-result-summary{margin-top:14px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(16,24,40,.08);border-radius:16px;padding:10px 14px;color:#475467;font-size:13px;font-weight:750}.network-result-summary i{color:#d92d43}.network-location-detected{display:inline-flex!important;align-items:center;gap:6px;width:max-content;max-width:100%;margin-top:7px!important;padding:6px 10px;border-radius:999px;background:#fff1f3;color:#b4233b!important;border:1px solid #fecdd6;font-size:12px!important}.network-ai-note.normal{background:linear-gradient(135deg,#eff8ff,#fff);border-color:#b2ddff}.network-ai-note.normal>i{background:#d1e9ff;color:#175cd3}
@keyframes networkPulse{0%,100%{opacity:.6;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}

/* Multi-credit purchase */
.network-ai-purchase{align-items:stretch}.network-ai-purchase-copy{flex:1}.network-credit-quick-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.network-credit-quick{border:1px solid #fda4af;background:#fff;color:#b4233b;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:850}.network-credit-quick.active{background:#d92d43;border-color:#d92d43;color:#fff}.network-credit-purchase-controls{min-width:270px;background:#fff;border:1px solid rgba(16,24,40,.08);border-radius:20px;padding:14px;display:flex;flex-direction:column;gap:10px}.network-credit-purchase-controls>label{font-size:12px;font-weight:850;color:#344054;text-transform:uppercase;letter-spacing:.06em}.network-credit-stepper{display:grid;grid-template-columns:44px 1fr 44px;border:1px solid #e4e7ec;border-radius:14px;overflow:hidden}.network-credit-stepper button{border:0;background:#f9fafb;color:#344054;font-size:17px}.network-credit-stepper input{border:0;text-align:center;font-size:18px;font-weight:900;min-width:0;padding:9px}.network-credit-stepper input:focus{outline:none}.network-credit-total{display:flex;align-items:center;justify-content:space-between;color:#667085;font-size:12px;font-weight:750}.network-credit-total strong{font-size:20px!important;margin:0!important;color:#d92d43!important}.network-credit-purchase-controls .btn{width:100%;font-size:14px}

@media(max-width:900px){.network-search-console{padding:20px}.network-search-console-head{flex-direction:column}.network-ai-balance{text-align:left;width:100%}.network-search-modes{grid-template-columns:1fr}.network-search-command{grid-template-columns:auto 1fr}.network-search-submit,.network-search-clear{grid-column:1/-1;width:100%}.network-search-clear{height:44px}.network-search-console-foot{align-items:flex-start;flex-direction:column}.network-ai-purchase{flex-direction:column}.network-credit-purchase-controls{min-width:0;width:100%}}
@media(max-width:520px){.network-search-console{padding:16px;border-radius:22px}.network-search-mode{grid-template-columns:auto 1fr;padding:13px}.network-mode-check{display:none}.network-mode-copy strong{align-items:flex-start;flex-direction:column}.network-search-command{padding:8px}.network-search-pulse{display:none}.network-search-command{grid-template-columns:1fr}.network-search-command .form-control{padding:10px}.network-search-submit,.network-search-clear{grid-column:1}.network-ai-balance strong{font-size:28px}}

/* Discount codes */
.shop-coupon-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;background:linear-gradient(135deg,#111827,#241119);color:#fff;border-radius:28px;box-shadow:0 22px 54px rgba(17,24,39,.18);overflow:hidden;position:relative}.shop-coupon-card:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-90px;top:-110px;background:radial-gradient(circle,rgba(244,63,94,.38),transparent 68%)}.shop-coupon-card>div{position:relative;z-index:1}.shop-coupon-card h3{font-weight:950;margin:6px 0}.shop-coupon-card p{margin:0;color:rgba(255,255,255,.7);max-width:680px}.shop-coupon-control{min-width:360px}.shop-coupon-control .input-group{background:#fff;padding:5px;border-radius:16px}.shop-coupon-control .input-group-text,.shop-coupon-control .form-control{border:0;background:#fff}.shop-coupon-control small{display:block;margin-top:8px;color:rgba(255,255,255,.68);font-weight:700}.coupon-input-row{display:grid;grid-template-columns:1fr auto;gap:8px}.coupon-input-row .form-control,.coupon-input-row .btn{border-radius:12px}.coupon-quote-success{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ecfdf3;border:1px solid #abefc6;color:#067647;border-radius:12px;padding:9px 11px;font-size:12px;font-weight:850}.coupon-quote-success span{display:flex;align-items:center;gap:7px}.coupon-quote-success strong{font-size:13px!important;color:#067647!important;margin:0!important}.payment-discount-line{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#667085;font-size:12px;font-weight:750;margin:4px 0 10px}.payment-discount-line strong{color:#067647}.upgrade-request-amount small{display:block;font-size:11px;color:#067647;margin-top:3px}.discount-admin-layout{display:grid;grid-template-columns:minmax(420px,.85fr) minmax(0,1.15fr);gap:20px;align-items:start}.discount-code-form h3{font-weight:950;margin:5px 0 0}.discount-form-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;margin-bottom:20px}.discount-code-form small{display:block;color:#667085;margin-top:4px}.discount-type-checks{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:13px 14px;border:1px solid #e4e7ec;border-radius:15px;background:#f9fafb}.discount-type-checks label{font-weight:800;color:#344054;display:flex;align-items:center;gap:6px}.discount-type-checks span{font-size:12px;color:#667085}.discount-code-list{display:grid;gap:14px}.discount-code-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:24px;padding:20px;box-shadow:0 16px 42px rgba(17,24,39,.06)}.discount-code-card.is-disabled{opacity:.68;background:#f9fafb}.discount-code-card-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.discount-code-card h3{font-weight:900;font-size:18px;margin:9px 0 0}.discount-code-token{display:inline-flex;padding:7px 11px;border-radius:10px;background:#111827;color:#fff;font-weight:950;letter-spacing:.08em}.discount-code-value{font-size:28px;font-weight:950;color:#d92d43;margin:15px 0}.discount-code-meta{display:flex;flex-wrap:wrap;gap:9px}.discount-code-meta span{display:inline-flex;align-items:center;gap:6px;background:#f2f4f7;border-radius:999px;padding:7px 10px;color:#475467;font-size:12px;font-weight:800}.discount-code-period{margin-top:12px;color:#667085;font-size:12px;font-weight:700}
@media(max-width:1000px){.discount-admin-layout{grid-template-columns:1fr}.shop-coupon-card{align-items:stretch;flex-direction:column}.shop-coupon-control{min-width:0;width:100%}}@media(max-width:575px){.coupon-input-row{grid-template-columns:1fr}.shop-coupon-card{padding:21px}.shop-coupon-control .input-group{display:grid;grid-template-columns:auto 1fr}.shop-coupon-control .btn{grid-column:1/-1;border-radius:12px!important}.discount-type-checks{align-items:flex-start;flex-direction:column}}


/* Product detail + related products */
.marketplace-product-clickable{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.marketplace-product-clickable:hover,.marketplace-product-clickable:focus-visible{transform:translateY(-4px);box-shadow:0 24px 60px rgba(18,24,38,.13);border-color:#fecaca;outline:none}.marketplace-detail-shell{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:30px;background:#fff;border:1px solid #eef0f4;border-radius:30px;padding:28px;box-shadow:0 22px 60px rgba(18,24,38,.08)}.marketplace-detail-media{min-width:0}.marketplace-detail-main-image{aspect-ratio:4/3;border-radius:24px;overflow:hidden;background:#f5f7fa;display:flex;align-items:center;justify-content:center}.marketplace-detail-main-image>img{width:100%;height:100%;object-fit:contain;background:#fff}.marketplace-detail-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#a0a8b8;font-size:15px}.marketplace-detail-placeholder i{font-size:54px}.marketplace-detail-thumbnails{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 2px}.marketplace-detail-thumb{width:82px;height:68px;border:2px solid transparent;border-radius:14px;padding:0;overflow:hidden;background:#fff;flex:0 0 auto;transition:border-color .2s ease,transform .2s ease}.marketplace-detail-thumb:hover{transform:translateY(-2px)}.marketplace-detail-thumb.active{border-color:#dc3545}.marketplace-detail-thumb img{width:100%;height:100%;object-fit:cover}.marketplace-detail-content{display:flex;flex-direction:column;gap:18px}.marketplace-detail-price{font-size:28px;font-weight:900;color:#dc3545;margin:0}.marketplace-detail-section{border-bottom:1px solid #eef0f4;padding-bottom:16px}.marketplace-detail-section:last-of-type{border-bottom:0}.marketplace-detail-section h2{font-size:16px;font-weight:900;margin:0 0 8px;color:#111827}.marketplace-detail-section p{white-space:pre-line;color:#566074;line-height:1.75;margin:0}.marketplace-detail-owner{margin-top:auto;background:linear-gradient(135deg,#fff7f7,#fff);border:1px solid #fee2e2;border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:16px}.marketplace-detail-owner h3{font-weight:900;margin:5px 0 8px}.marketplace-detail-owner p{display:flex;align-items:flex-start;gap:8px;margin:5px 0;color:#687086}.marketplace-related-section{margin-top:32px}.marketplace-related-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:16px}.marketplace-related-heading h2{font-size:24px;font-weight:900;margin:4px 0 0}.marketplace-related-heading>span{background:#fff;border:1px solid #eef0f4;padding:8px 13px;border-radius:999px;font-size:13px;font-weight:800;color:#687086}.marketplace-related-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}.marketplace-detail-heading{margin-bottom:18px}
@media(max-width:991px){.marketplace-detail-shell{grid-template-columns:1fr;padding:18px;border-radius:24px}.marketplace-detail-main-image{aspect-ratio:1/1}.marketplace-related-heading{align-items:flex-start}.marketplace-detail-price{font-size:24px}}
@media(max-width:575px){.marketplace-detail-shell{padding:14px}.marketplace-detail-thumb{width:66px;height:58px}.marketplace-related-heading{flex-direction:column}.marketplace-detail-owner .market-actions{flex-direction:column;align-items:stretch}.marketplace-detail-owner .market-actions>*{justify-content:center;width:100%}}

/* Public product sharing / SEO page */
.marketplace-detail-share-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;align-self:flex-end}
.public-product-page{min-height:100vh;background:linear-gradient(180deg,#f7f8fb 0,#fff 50%,#f7f8fb 100%);color:#111827}
.public-product-main{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:34px 0 54px}
.public-product-breadcrumb{display:flex;align-items:center;gap:8px;color:#667085;font-size:14px;margin-bottom:18px;min-width:0}
.public-product-breadcrumb a{color:#d92536;font-weight:800;text-decoration:none}.public-product-breadcrumb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.public-product-detail{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr);gap:32px;background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:32px;padding:30px;box-shadow:0 24px 70px rgba(17,24,39,.09)}
.public-product-content{display:flex;flex-direction:column;gap:18px;min-width:0}.public-product-content h1{font-size:clamp(30px,4vw,48px);font-weight:900;line-height:1.14;margin:0;color:#111827}.public-product-share-row{display:flex;flex-wrap:wrap;gap:10px}
.public-related-section{margin-top:34px}.public-related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.public-related-product-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:22px;padding:12px;text-decoration:none;color:#111827;box-shadow:0 14px 34px rgba(17,24,39,.05);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.public-related-product-card:hover{color:#111827;transform:translateY(-4px);box-shadow:0 22px 48px rgba(17,24,39,.11);border-color:#fecaca}.public-related-product-card>img,.public-related-product-placeholder{width:100%;aspect-ratio:4/3;border-radius:16px;object-fit:cover;background:#f1f5f9;display:grid;place-items:center;color:#98a2b3;font-size:32px}.public-related-product-card>div:last-child{padding:12px 4px 4px}.public-related-product-card span{display:block;color:#d92536;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.public-related-product-card h3{font-size:17px;font-weight:900;line-height:1.4;margin:6px 0}.public-related-product-card strong{display:block;color:#d92536}.public-related-product-card p{color:#667085;margin:6px 0 0;font-size:13px}
.public-product-footer{margin-top:38px;padding:22px 0;border-top:1px solid rgba(17,24,39,.08);display:flex;justify-content:space-between;gap:18px;color:#667085}.public-product-footer strong{color:#d92536;font-size:18px}.public-product-error{margin-top:44px;background:#fff;border-radius:28px;border:1px solid rgba(17,24,39,.08)}
@media(max-width:991px){.marketplace-detail-share-actions{align-self:flex-start;justify-content:flex-start}.public-product-detail{grid-template-columns:1fr;padding:20px}.public-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575px){.public-product-main{width:min(100% - 20px,1180px);padding-top:20px}.public-product-detail{padding:14px;border-radius:24px}.public-product-share-row .btn,.marketplace-detail-share-actions .btn,.marketplace-detail-share-actions a{width:100%;justify-content:center}.public-related-grid{grid-template-columns:1fr}.public-product-footer{flex-direction:column}.public-header .brand-mark{font-size:19px}.public-header .btn{padding:.5rem .8rem;font-size:.82rem}}
.public-product-card>a:first-child{width:160px;height:160px;flex:0 0 auto;border-radius:18px;overflow:hidden;background:#edf2f7;text-decoration:none}.public-product-card>a:first-child>img{width:100%;height:100%;object-fit:cover}.public-product-card>a.public-product-placeholder{display:grid;place-items:center;color:#98a2b3}
@media(max-width:991px){.public-product-card>a:first-child{width:100%;height:220px}}

/* ==================================================
   VINKA PUBLIC PROFILE — SHOP + QR + COLLAPSIBLE 1-2-1
   ================================================== */
.public-profile-hero{grid-template-columns:150px minmax(0,1fr) 300px;overflow:hidden;position:relative}
.public-profile-hero::after{content:"";position:absolute;right:-90px;top:-110px;width:250px;height:250px;border-radius:999px;background:radial-gradient(circle,rgba(217,37,54,.12),rgba(217,37,54,0) 68%);pointer-events:none}
.public-qr-feature{position:relative;z-index:1;padding:22px;background:linear-gradient(155deg,#161b28 0%,#090c13 58%,#8d1622 150%);border:1px solid rgba(255,255,255,.14);box-shadow:0 22px 45px rgba(17,24,39,.24),0 0 0 6px rgba(217,37,54,.08)}
.public-qr-eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:900;letter-spacing:.12em;color:#fff0f1;margin-bottom:14px}
.public-qr-frame{background:#fff;border-radius:22px;padding:11px;box-shadow:0 16px 38px rgba(0,0,0,.28);position:relative}
.public-qr-frame::before,.public-qr-frame::after{content:"";position:absolute;width:28px;height:28px;border-color:#d92536;border-style:solid;pointer-events:none}
.public-qr-frame::before{left:5px;top:5px;border-width:3px 0 0 3px;border-radius:10px 0 0 0}
.public-qr-frame::after{right:5px;bottom:5px;border-width:0 3px 3px 0;border-radius:0 0 10px 0}
.public-qr-feature img{display:block;width:100%;max-width:230px;margin:0 auto;background:#fff;border-radius:13px;padding:3px}
.public-qr-feature h2{font-size:18px;font-weight:900;margin:16px 0 5px;color:#fff}
.public-qr-feature p{font-size:12px;line-height:1.55;margin:0;color:rgba(255,255,255,.72)}

.public-shop-featured{position:relative;overflow:hidden;border:1px solid rgba(217,37,54,.25);box-shadow:0 24px 60px rgba(217,37,54,.10);background:linear-gradient(180deg,#fff 0%,#fffafa 100%)}
.public-shop-featured::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:linear-gradient(90deg,#d92536,#f05a67,#111827)}
.public-shop-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-bottom:22px;border-bottom:1px solid rgba(17,24,39,.08)}
.public-shop-heading h2{font-size:32px;margin:6px 0 8px;letter-spacing:-.025em}
.public-shop-count{min-width:116px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 18px;border-radius:20px;background:#111827;color:#fff;text-align:center;box-shadow:0 12px 28px rgba(17,24,39,.16)}
.public-shop-count strong{font-size:28px;line-height:1;font-weight:900}
.public-shop-count small{font-size:11px;color:rgba(255,255,255,.68);margin-top:6px}
.public-shop-featured .public-product-card{border-color:rgba(217,37,54,.12);box-shadow:0 14px 34px rgba(17,24,39,.07);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.public-shop-featured .public-product-card:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(17,24,39,.11);border-color:rgba(217,37,54,.28)}
.public-product-card>a:first-child{display:block;width:160px;height:160px;border-radius:18px;overflow:hidden;flex:0 0 auto;background:#edf2f7}
.public-product-card>a:first-child img{width:100%;height:100%;object-fit:cover;display:block}
.public-shop-empty{display:flex;align-items:center;gap:12px;padding:25px 0 4px}
.public-shop-empty>i{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:#fff0f1;color:#d92536;font-size:22px}

.public-121-section{padding:0;overflow:hidden}
.public-121-toggle{width:100%;display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:17px;align-items:center;border:0;background:#fff;padding:26px 30px;text-align:left;color:#111827;cursor:pointer;transition:background .2s ease}
.public-121-toggle:hover,.public-121-toggle.is-open{background:linear-gradient(135deg,#fff7f7,#fff)}
.public-121-toggle-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:#fff0f1;color:#d92536;font-size:25px}
.public-121-toggle-copy{display:flex;flex-direction:column;min-width:0}
.public-121-toggle-copy strong{font-size:24px;font-weight:900;margin:3px 0 4px}
.public-121-toggle-copy small{font-size:13px;line-height:1.5;color:#667085}
.public-121-toggle-action{display:inline-flex;align-items:center;gap:9px;color:#d92536;font-weight:800;white-space:nowrap;padding:10px 15px;border-radius:999px;background:#fff0f1}
.public-121-content{border-top:1px solid rgba(17,24,39,.08);padding:28px 30px 32px;background:#fbfcfe}
.public-121-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.public-121-card{background:#fff;border:1px solid rgba(17,24,39,.08);border-radius:22px;padding:23px;box-shadow:0 12px 30px rgba(17,24,39,.04)}
.public-121-card-wide{grid-column:1/-1}
.public-121-card-title{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.public-121-card-title i{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:#fff0f1;color:#d92536;font-size:17px}
.public-121-card-title h3{font-size:19px;font-weight:900;margin:0}
.public-121-content .summary-kv:first-of-type{padding-top:4px}

@media (max-width:991px){
  .public-profile-hero{grid-template-columns:130px minmax(0,1fr)}
  .public-qr-feature{grid-column:1/-1;display:grid;grid-template-columns:190px minmax(0,1fr);column-gap:24px;align-items:center;max-width:none;text-align:left}
  .public-qr-eyebrow{grid-column:2;margin-bottom:0;align-self:end}
  .public-qr-frame{grid-column:1;grid-row:1/4}
  .public-qr-feature h2{grid-column:2;margin:4px 0}
  .public-qr-feature p{grid-column:2}
  .public-qr-feature img{max-width:175px}
  .public-product-card>a:first-child{width:100%;height:230px}
}
@media (max-width:767px){
  .public-profile-main{padding:28px 14px 60px}
  .public-profile-hero{grid-template-columns:1fr;padding:24px;border-radius:26px}
  .public-avatar{width:112px;height:112px}
  .public-qr-feature{grid-column:auto;display:block;text-align:center;padding:20px}
  .public-qr-eyebrow{display:inline-flex;margin-bottom:14px}
  .public-qr-frame{max-width:246px;margin:0 auto}
  .public-qr-feature img{max-width:220px}
  .public-shop-heading{align-items:flex-start}
  .public-shop-heading h2{font-size:27px}
  .public-shop-count{min-width:90px;padding:12px}
  .public-121-toggle{grid-template-columns:50px minmax(0,1fr);padding:22px 20px}
  .public-121-toggle-icon{width:48px;height:48px}
  .public-121-toggle-action{grid-column:1/-1;justify-content:center}
  .public-121-grid{grid-template-columns:1fr}
  .public-121-card-wide{grid-column:auto}
  .public-121-content{padding:22px 18px 24px}
}
@media (max-width:575px){
  .public-shop-heading{display:block}
  .public-shop-count{display:inline-flex;flex-direction:row;gap:7px;min-width:0;margin-top:14px;padding:10px 14px}
  .public-shop-count strong{font-size:20px}
  .public-shop-count small{margin:0}
  .public-121-toggle-copy strong{font-size:21px}
  .public-profile-section{padding:24px 20px}
  .public-121-section{padding:0}
}

/* ==================================================
   VINKA PUBLIC PROFILE — COMMERCE PRODUCT CARDS
   Card chỉ hiển thị ảnh, tên, giá và hành động.
   Nội dung đầy đủ được xem tại trang chi tiết sản phẩm.
   ================================================== */
.public-shop-featured .public-product-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  align-items:stretch;
}
.public-shop-featured .public-product-card{
  display:flex;
  flex-direction:column;
  gap:0;
  min-width:0;
  padding:0;
  overflow:hidden;
  border-radius:24px;
  background:#fff;
  cursor:pointer;
  position:relative;
  isolation:isolate;
}
.public-shop-featured .public-product-card:focus-visible{
  outline:3px solid rgba(217,37,54,.28);
  outline-offset:4px;
}
.public-product-card>a.public-product-cover,
.public-product-card>a:first-child.public-product-cover{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  flex:0 0 auto;
  border-radius:0;
  overflow:hidden;
  background:linear-gradient(135deg,#f3f4f6,#e5e7eb);
  position:relative;
  text-decoration:none;
}
.public-product-cover>img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}
.public-product-card:hover .public-product-cover>img{
  transform:scale(1.045);
}
.public-product-cover>.public-product-placeholder{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color:#98a2b3;
  font-size:48px;
  background:linear-gradient(145deg,#f8fafc,#e9eef5);
}
.public-product-kind{
  position:absolute;
  top:13px;
  left:13px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(17,24,39,.82);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
  backdrop-filter:blur(8px);
  box-shadow:0 7px 18px rgba(17,24,39,.18);
}
.public-shop-featured .public-product-body{
  display:flex;
  flex-direction:column;
  flex:1;
  min-width:0;
  padding:18px;
}
.public-product-category{
  display:block;
  color:#d92536;
  font-size:11px;
  line-height:1.4;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:7px;
}
.public-shop-featured .public-product-body h3{
  margin:0;
  font-size:19px;
  line-height:1.42;
  font-weight:900;
  letter-spacing:-.015em;
  min-height:54px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.public-shop-featured .public-product-body h3 a{
  color:#111827;
  text-decoration:none;
}
.public-shop-featured .public-product-body h3 a:hover{
  color:#d92536;
}
.public-product-price-row{
  margin-top:12px;
  margin-bottom:16px;
}
.public-shop-featured .product-price{
  margin:0;
  color:#d92536;
  font-size:21px;
  line-height:1.25;
  font-weight:900;
}
.public-product-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:auto;
}
.public-product-actions .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:.58rem .75rem;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
@media(max-width:991px){
  .public-shop-featured .public-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-product-card>a.public-product-cover,
  .public-product-card>a:first-child.public-product-cover{width:100%;height:auto;aspect-ratio:4/3}
}
@media(max-width:575px){
  .public-shop-featured .public-product-grid{grid-template-columns:1fr;gap:16px}
  .public-product-actions{grid-template-columns:1fr 1fr}
  .public-shop-featured .public-product-body h3{min-height:auto}
}


/* ==================================================
   VINKA — PUBLIC PRODUCT NAME + DETAIL ORDER FORM
   ================================================== */
.public-shop-featured .public-product-body h3{
  margin:12px 0 8px;
  min-height:0;
  font-size:20px;
  line-height:1.4;
  font-weight:800;
  letter-spacing:0;
}
.public-shop-featured .public-product-body h3 a,
.public-shop-featured .public-product-body h3 a:hover,
.public-shop-featured .public-product-body h3 a:focus{
  color:#111827 !important;
  text-decoration:none;
}
.public-product-primary-order{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin:18px 0 14px;
  padding:16px;
  border:1px solid rgba(217,37,54,.16);
  border-radius:20px;
  background:linear-gradient(135deg,#fff7f7,#fff);
}
.public-product-primary-order span{
  flex:1 1 220px;
  color:#667085;
  font-size:14px;
  line-height:1.55;
  font-weight:600;
}
.public-product-order-section{
  margin-top:28px;
  padding:30px;
  border:1px solid rgba(217,37,54,.18);
  border-radius:30px;
  background:linear-gradient(145deg,#fff,#fff8f8);
  box-shadow:0 22px 58px rgba(17,24,39,.07);
  scroll-margin-top:24px;
}
.public-product-order-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  margin-bottom:20px;
}
.public-product-order-heading h2{
  margin:5px 0 8px;
  color:#111827;
  font-size:28px;
  line-height:1.25;
  font-weight:900;
}
.public-product-order-heading p{
  margin:0;
  max-width:720px;
  color:#667085;
  line-height:1.65;
}
.public-product-order-heading>i{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  flex:0 0 auto;
  border-radius:18px;
  background:#d92536;
  color:#fff;
  font-size:25px;
  box-shadow:0 12px 28px rgba(217,37,54,.22);
}
.public-product-order-section .public-order-form{
  margin:0;
  background:#fff;
  border-color:rgba(17,24,39,.08);
}
@media(max-width:575px){
  .public-product-primary-order .btn{width:100%}
  .public-product-order-section{padding:18px;border-radius:24px}
  .public-product-order-heading>i{display:none}
  .public-product-order-heading h2{font-size:24px}
}
