:root {
  --smx-navy: #162F56;
  --smx-navy-dark: #0B1D36;
  --smx-green: #26922A;
  --smx-lime: #A8FA00;
  --smx-light: #F2F6FA;
  --smx-text: #202628;
  --smx-muted: #667174;
  --smx-border: #D8E0E7;
  --smx-white: #FFFFFF;
}

.smx-tg-page { background: var(--smx-white); color: var(--smx-text); font-family: inherit; }

/* Full-width RFQ hero: keep the text aligned to the normal SMX content shell,
   while the navy gradient and lime rule extend cleanly to both viewport edges. */
body.smx-trade-gateway-active { overflow-x: hidden; }
body.smx-trade-gateway-active .smx-tg-hero {
  width: 100vw;
  max-width: none;
  box-sizing: border-box;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Match the approved SMX internal-page header treatment on the RFQ page. */
body.smx-trade-gateway-active #Header #Top_bar,
body.smx-trade-gateway-active.header-transparent #Top_bar,
body.smx-trade-gateway-active #Top_bar {
  background-color: var(--smx-navy-dark) !important;
  background-image: none !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.08) !important;
}
body.smx-trade-gateway-active #Top_bar .top_bar_left,
body.smx-trade-gateway-active #Top_bar .top_bar_right {
  background: transparent !important;
}
body.smx-trade-gateway-active #Subheader {
  display: none !important;
}

.smx-tg-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.smx-tg-hero { position: relative; overflow: hidden; background: linear-gradient(115deg, var(--smx-navy-dark) 0%, var(--smx-navy) 68%, #315A60 100%); padding: 110px 0 96px; border-bottom: 5px solid var(--smx-lime); }
.smx-tg-hero:after { content: ''; position: absolute; width: 460px; height: 460px; border: 1px solid rgba(168,250,0,.12); border-radius: 50%; right: -80px; top: -190px; box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.018); }
.smx-tg-kicker { color: var(--smx-lime); font-size: 13px; line-height: 1.2; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 18px; }
.smx-tg-kicker-dark { color: var(--smx-green); }
.smx-tg-hero h1 { color: #fff; font-size: clamp(44px, 6vw, 76px); line-height: 1.02; margin: 0 0 22px; font-weight: 750; letter-spacing: -.03em; }
.smx-tg-hero p { color: #E3EBF2; max-width: 820px; font-size: 20px; line-height: 1.65; margin: 0; }
.smx-tg-main { background: var(--smx-light); padding: 72px 0 96px; }
.smx-tg-success, .smx-tg-error { border-radius: 10px; padding: 18px 20px; margin: 0 0 28px; display: flex; gap: 8px; flex-direction: column; box-shadow: 0 10px 30px rgba(11,29,54,.06); }
.smx-tg-success { background: #effbea; border-left: 5px solid var(--smx-green); }
.smx-tg-error { background: #fff3f3; border-left: 5px solid #c43b3b; }
.smx-tg-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: end; margin-bottom: 34px; }
.smx-tg-intro-grid h2 { color: var(--smx-navy-dark); font-size: clamp(32px, 4vw, 48px); line-height: 1.1; margin: 0; letter-spacing: -.025em; }
.smx-tg-intro-grid p { color: var(--smx-muted); margin: 0; font-size: 17px; line-height: 1.75; }
.smx-tg-type-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 28px; }
.smx-tg-tab { text-align: left; background: #fff; border: 1px solid var(--smx-border); border-radius: 12px; padding: 22px 24px; cursor: pointer; transition: .2s ease; display: grid; grid-template-columns: 54px 1fr; column-gap: 16px; align-items: center; box-shadow: 0 8px 24px rgba(11,29,54,.045); color: var(--smx-navy-dark); }
.smx-tg-tab:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(11,29,54,.09); }
.smx-tg-tab.is-active { border-color: var(--smx-green); box-shadow: inset 0 0 0 1px var(--smx-green), 0 14px 30px rgba(11,29,54,.08); }
.smx-tg-tab > span { width: 46px; height: 46px; border-radius: 50%; background: var(--smx-navy-dark); color: var(--smx-lime); display: grid; place-items: center; font-weight: 800; grid-row: span 2; }
.smx-tg-tab b { font-size: 19px; line-height: 1.25; }
.smx-tg-tab small { color: var(--smx-muted); line-height: 1.4; margin-top: 5px; }
.smx-tg-form { background: #fff; border-radius: 16px; box-shadow: 0 20px 55px rgba(11,29,54,.08); overflow: hidden; }
.smx-tg-panel { display: none; }
.smx-tg-panel.is-active { display: block; }
.smx-tg-section-head { background: var(--smx-navy-dark); color: #fff; padding: 34px 40px; }
.smx-tg-section-head span { color: var(--smx-lime); font-size: 12px; letter-spacing: .18em; font-weight: 800; }
.smx-tg-section-head h3 { color: #fff; font-size: 32px; margin: 8px 0 8px; }
.smx-tg-section-head p { color: #cad7e3; max-width: 850px; margin: 0; line-height: 1.65; }
.smx-tg-section-head-light { background: transparent; padding: 0 0 24px; }
.smx-tg-section-head-light span { color: var(--smx-green); }
.smx-tg-section-head-light h3 { color: var(--smx-navy-dark); margin-bottom: 0; }
.smx-tg-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; padding: 36px 40px 42px; }
.smx-tg-common { border-top: 1px solid #e7edf2; padding: 42px 40px 36px; }
.smx-tg-common .smx-tg-grid { padding: 0; }
.smx-tg-span-2 { grid-column: span 2; }
.smx-tg-span-4 { grid-column: span 4; }
.smx-tg-field label { display: block; font-weight: 700; color: var(--smx-navy-dark); margin: 0 0 8px; font-size: 14px; }
.smx-tg-field label em { color: var(--smx-green); font-style: normal; }

/* Keep all compact four-column controls on the same horizontal baseline,
   even when one field label wraps to two lines. A fixed label box is more
   reliable than flex/min-height against BeTheme label styles. */
.smx-tg-grid > .smx-tg-field:not(.smx-tg-span-2):not(.smx-tg-span-4) > label {
  display: block !important;
  box-sizing: border-box;
  height: 56px !important;
  min-height: 56px !important;
  line-height: 1.45 !important;
  margin: 0 0 8px !important;
}
.smx-tg-grid > .smx-tg-field:not(.smx-tg-span-2):not(.smx-tg-span-4) > label em {
  display: inline !important;
  white-space: nowrap;
}
.smx-tg-field input[type="text"], .smx-tg-field input[type="email"], .smx-tg-field input[type="url"], .smx-tg-field input[type="file"], .smx-tg-field select, .smx-tg-field textarea { width: 100%; box-sizing: border-box; border: 1px solid #cfd9e1; border-radius: 7px; background: #fff; color: var(--smx-text); min-height: 48px; padding: 11px 13px; font: inherit; transition: .15s ease; }
.smx-tg-field textarea { min-height: 115px; resize: vertical; }
.smx-tg-field input:focus, .smx-tg-field select:focus, .smx-tg-field textarea:focus { outline: 0; border-color: var(--smx-green); box-shadow: 0 0 0 3px rgba(38,146,42,.11); }
.smx-tg-field .smx-tg-invalid { border-color: #c43b3b !important; box-shadow: 0 0 0 3px rgba(196,59,59,.1) !important; }
.smx-tg-field small { color: var(--smx-muted); display: block; margin-top: 7px; line-height: 1.5; }
.smx-tg-checks { display: flex; flex-wrap: wrap; gap: 10px 24px; padding-top: 4px; }
.smx-tg-checks label { font-weight: 500; margin: 0; }
.smx-tg-consent { background: #f7fafc; border: 1px solid #e0e7ec; border-radius: 8px; padding: 16px 18px; margin: 28px 0; }
.smx-tg-consent label { display: flex; gap: 11px; align-items: flex-start; color: #4d5961; line-height: 1.55; }
.smx-tg-consent input { margin-top: 4px; }
.smx-tg-submit-row { background: var(--smx-navy-dark); border-radius: 10px; padding: 22px 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; color: #fff; }
.smx-tg-submit-row > div { display: flex; flex-direction: column; gap: 3px; }
.smx-tg-submit-row > div span { color: #bdcbd7; font-size: 13px; }
.smx-tg-submit { border: 0; border-radius: 7px; background: var(--smx-lime); color: var(--smx-navy-dark); min-height: 50px; padding: 0 24px; font-weight: 800; letter-spacing: .04em; cursor: pointer; transition: .2s ease; white-space: nowrap; }
.smx-tg-submit:hover { background: var(--smx-green); color: #fff; transform: translateY(-1px); }
.smx-tg-submit span { margin-left: 8px; }
.smx-tg-honeypot { position: absolute !important; left: -99999px !important; opacity: 0 !important; pointer-events: none !important; }

/* wp-admin */
.smx-tg-admin h1 small { font-size: 14px; color: #667174; font-weight: 400; }
.smx-tg-admin-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); gap: 15px; margin: 20px 0; }
.smx-tg-admin-cards div { background: #fff; border: 1px solid #dcdcde; border-left: 4px solid #26922A; padding: 18px; }
.smx-tg-admin-cards b { display: block; font-size: 28px; color: #0B1D36; }
.smx-tg-admin-cards span { color: #667174; }
.smx-tg-admin-table th, .smx-tg-admin-table td { vertical-align: middle; }
.smx-tg-status { display: inline-block; border-radius: 999px; padding: 5px 9px; background: #eef2f5; color: #334; font-size: 12px; font-weight: 600; }
.smx-tg-status-received { background: #eaf5ff; color: #14568b; }
.smx-tg-status-under-review { background: #fff6d9; color: #7c5b00; }
.smx-tg-status-needs-information { background: #fff0e8; color: #93411c; }
.smx-tg-status-qualified { background: #eaf8e8; color: #276d2b; }
.smx-tg-status-rejected { background: #ffe8e8; color: #9a2525; }
.smx-tg-admin-detail-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, .8fr); gap: 22px; }
.smx-tg-admin-detail-grid section { background: #fff; border: 1px solid #dcdcde; padding: 22px; }
.smx-tg-detail-row { display: grid; grid-template-columns: 190px 1fr; gap: 14px; padding: 10px 0; border-bottom: 1px solid #eef0f2; }
.smx-tg-detail-row b { color: #0B1D36; }
.smx-tg-detail-row span { white-space: normal; }
.smx-tg-status-form { display: flex; gap: 8px; align-items: center; }
.smx-tg-status-form select { min-width: 180px; }
.smx-tg-files { margin-left: 18px; }

@media (max-width: 900px) {
  .smx-tg-shell { width: min(100% - 30px, 1180px); }
  .smx-tg-hero { padding: 76px 0 66px; }
  .smx-tg-intro-grid { grid-template-columns: 1fr; gap: 18px; }
  .smx-tg-type-tabs { grid-template-columns: 1fr; }
  .smx-tg-grid { grid-template-columns: 1fr 1fr; padding: 28px 24px 32px; }
  .smx-tg-span-4 { grid-column: span 2; }
  .smx-tg-common { padding: 32px 24px; }
  .smx-tg-section-head { padding: 28px 24px; }
  .smx-tg-submit-row { align-items: flex-start; flex-direction: column; }
  .smx-tg-admin-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 580px) {
  .smx-tg-grid { grid-template-columns: 1fr; }
  .smx-tg-grid > .smx-tg-field:not(.smx-tg-span-2):not(.smx-tg-span-4) > label { height: auto !important; min-height: 0 !important; display: block !important; }
  .smx-tg-span-2, .smx-tg-span-4 { grid-column: span 1; }
  .smx-tg-tab { grid-template-columns: 48px 1fr; padding: 18px; }
  .smx-tg-submit { width: 100%; }
  .smx-tg-admin-cards { grid-template-columns: 1fr; }
  .smx-tg-detail-row { grid-template-columns: 1fr; gap: 4px; }
}
