/* Comercial — página de produto orientada à negociação e ao pedido. */

.commercial-hero .mod-hero-icon{ color:var(--blue); }
.commercial-hero .button-primary{ background:var(--blue); box-shadow:0 12px 26px rgba(21,94,201,.28); }
.commercial-hero .button-primary:hover{ background:var(--blue-2); }
.commercial-hero .text-link,.commercial-hero .mod-hero-meta .i{ color:var(--blue); }
.sales-order{ position:relative; z-index:2; margin:42px 38px 56px; overflow:hidden; border:1px solid rgba(153,193,244,.22); border-radius:22px; background:#f8fbff; box-shadow:0 28px 64px rgba(0,0,0,.36); }
.sales-order-top{ height:48px; padding:0 18px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; color:#dce9fc; background:#0e2140; }
.sales-order-top > span{ display:flex; gap:5px; }
.sales-order-top i{ width:7px; height:7px; border-radius:50%; background:#607594; }
.sales-order-top b{ font-size:12px; letter-spacing:.04em; }
.sales-order-top em{ justify-self:end; color:#8fa6c7; font-size:10px; font-style:normal; }
.sales-order-body{ padding:23px; color:var(--ink); }
.sales-customer{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.sales-customer small,.sales-order-main small,.sales-availability small,.sales-condition small{ display:block; color:var(--slate); font-size:10px; }
.sales-customer strong{ display:block; margin-top:3px; font-family:var(--font-display); font-size:19px; }
.sales-customer > span{ padding:7px 11px; border-radius:999px; color:#075e42; background:#dff7ec; font-size:9.5px; font-weight:800; }
.sales-order-main{ display:grid; grid-template-columns:1.45fr .55fr; gap:10px; margin-top:18px; }
.sales-order-main > div{ min-height:83px; padding:14px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.sales-order-main b{ display:block; margin-top:6px; font:800 21px var(--font-display); }
.sales-order-main .margin{ color:#087f78; background:#eaf8f5; border-color:#bde4dc; }
.sales-availability{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; padding:13px 14px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.sales-availability header{ grid-column:1/-1; display:flex; justify-content:space-between; gap:10px; }
.sales-availability header b{ font-size:10px; }
.sales-availability > span{ display:flex; align-items:center; gap:6px; padding:7px 9px; border-radius:9px; font-size:9px; font-weight:800; }
.sales-availability .ok{ color:#08754f; background:#e6f6ee; }
.sales-availability .wait{ color:#946000; background:#fff3de; }
.sales-availability .i{ width:13px; height:13px; }
.sales-condition{ display:flex; align-items:center; justify-content:space-between; margin-top:10px; padding:11px 14px; border-radius:13px; color:#fff; background:#102f63; }
.sales-condition b{ display:block; margin-top:2px; font-size:13px; }
.sales-condition > span{ color:#a9bddb; font-size:9px; }
.sales-float{ position:absolute; z-index:3; width:calc((100% - 64px)/3); min-width:0; display:flex; align-items:center; gap:8px; padding:9px 10px; border:1px solid rgba(153,193,244,.18); border-radius:12px; color:#fff; background:rgba(11,35,72,.84); box-shadow:0 8px 20px rgba(0,0,0,.16); backdrop-filter:blur(10px); }
.sales-float > .i{ width:17px; height:17px; flex:0 0 auto; color:var(--cyan); }
.sales-float small,.sales-float b{ display:block; }
.sales-float small{ color:#9aacc5; font-size:8px; }
.sales-float b{ margin-top:2px; font-size:9.5px; }
.sales-float--margin{ left:16px; top:auto; bottom:18px; }
.sales-float--limit{ left:50%; bottom:18px; transform:translateX(-50%); }
.sales-float--stock{ right:16px; top:auto; bottom:18px; }
.commercial-cap-card--carteira,.commercial-cap-card--faturamento{ grid-column:span 6; }
.sales-mini-order{ display:grid; grid-template-columns:1fr auto; gap:10px; margin-top:34px; }
.sales-mini-order > div{ padding:12px; border-radius:12px; background:rgba(255,255,255,.09); }
.sales-mini-order small,.sales-mini-order b{ display:block; }
.sales-mini-order small{ color:#a9bfde; font-size:9px; }
.sales-mini-order b{ margin-top:4px; color:#fff; font-size:13px; }
.sales-mini-order .wide{ grid-column:1/-1; display:grid; grid-template-columns:1fr auto; gap:5px; align-items:end; padding:18px; }
.sales-mini-order .wide span{ grid-column:1/-1; color:#a9bfde; font-size:9px; }
.sales-mini-order .wide strong{ color:#fff; font:800 24px var(--font-display); }
.sales-mini-order .wide em{ color:#7df0d5; font-size:12px; font-style:normal; font-weight:800; }
.sales-mini-order footer{ grid-column:1/-1; display:flex; justify-content:space-between; padding:11px 13px; border-radius:11px; color:#c3d3ee; background:rgba(0,0,0,.13); font-size:10px; }
.sales-mini-order footer b{ margin:0; color:#7df0d5; }
.sales-mini-price{ display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:6px; align-items:center; margin-top:26px; }
.sales-mini-price span{ padding:10px 8px; border-radius:10px; background:#f2f6fa; }
.sales-mini-price small,.sales-mini-price b{ display:block; }
.sales-mini-price small{ color:var(--slate); font-size:8px; }
.sales-mini-price b{ margin-top:4px; font-size:10px; }
.sales-mini-price i{ color:#8ca0b5; font-style:normal; }
.sales-mini-price .hot{ color:var(--blue); background:var(--blue-light); }
.sales-mini-margin,.sales-mini-stock{ display:grid; gap:7px; margin-top:24px; font-size:10px; color:var(--slate); }
.sales-mini-margin span,.sales-mini-margin strong,.sales-mini-stock span,.sales-mini-stock strong{ display:flex; justify-content:space-between; padding-bottom:6px; border-bottom:1px solid var(--line-2); }
.sales-mini-margin strong,.sales-mini-stock strong{ color:#087f78; border:0; }
.sales-mini-tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:26px; }
.sales-mini-tags span{ padding:7px 9px; border-radius:99px; color:var(--slate); background:#f0f4f9; font-size:9px; font-weight:700; }
.sales-mini-tags .on{ color:var(--blue); background:var(--blue-light); }
.sales-mini-pipeline{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:26px; }
.sales-mini-pipeline span{ display:grid; grid-template-columns:auto 1fr; gap:5px; color:var(--slate); font-size:9px; }
.sales-mini-pipeline i{ width:7px; height:7px; border-radius:50%; background:#f0b44c; }
.sales-mini-pipeline span:nth-child(2) i{ background:#36a3d9; }
.sales-mini-pipeline span:nth-child(3) i{ background:#19a373; }
.sales-mini-pipeline b{ grid-column:1/-1; color:var(--ink); font:800 22px var(--font-display); }
.sales-mini-commission{ display:flex; align-items:center; gap:13px; margin-top:25px; }
.sales-mini-commission > i{ width:56px; height:56px; border-radius:50%; background:conic-gradient(var(--blue-2) 0 72%,#e5edf3 72%); position:relative; }
.sales-mini-commission > i::after{ content:''; position:absolute; inset:9px; border-radius:50%; background:#fff; }
.sales-mini-commission b,.sales-mini-commission small{ display:block; }
.sales-mini-commission small{ color:var(--slate); font-size:9px; }
.sales-mini-billing{ display:flex; align-items:center; gap:8px; margin-top:28px; }
.sales-mini-billing span{ display:flex; align-items:center; gap:4px; padding:7px 9px; border-radius:9px; color:var(--slate); background:#f1f5fa; font-size:9px; font-weight:700; }
.sales-mini-billing span.done{ color:#087f78; background:#e4f6f2; }
.sales-mini-billing .i{ width:12px; height:12px; }
.sales-mini-billing > i{ flex:1; height:1px; background:#cad7e3; }
.sales-screen{ position:relative; z-index:1; overflow:hidden; border-radius:17px; background:#f8fbff; box-shadow:0 26px 60px rgba(0,0,0,.36); }
.sales-screen-bar{ min-height:48px; padding:0 18px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; color:#dce9fc; background:#0e2140; }
.sales-screen-bar > span{ display:flex; gap:5px; }
.sales-screen-bar i{ width:7px; height:7px; border-radius:50%; background:#607594; }
.sales-screen-bar b{ font-size:11px; }
.sales-screen-bar em{ justify-self:end; color:#8fa6c7; font-size:9px; font-style:normal; }
.sales-screen-body{ padding:19px; }
.sales-screen-toolbar{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.sales-screen-toolbar span,.sales-screen-toolbar b{ padding:7px 10px; border:1px solid var(--line); border-radius:8px; color:var(--slate); background:#fff; font-size:9px; }
.sales-screen-toolbar b{ margin-left:auto; color:var(--blue); background:var(--blue-light); border-color:#c9daf1; }
.sales-screen-kpis{ display:grid; grid-template-columns:1.3fr .7fr 1fr; gap:9px; margin-top:12px; }
.sales-screen-kpis div{ padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.sales-screen-kpis small,.sales-screen-kpis b{ display:block; }
.sales-screen-kpis small{ color:var(--slate); font-size:8px; }
.sales-screen-kpis b{ margin-top:3px; font-size:12px; }
.sales-screen-scroll{ margin-top:12px; overflow-x:auto; }
.sales-screen-table{ min-width:620px; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.sales-screen-table .th,.sales-screen-table .tr{ display:grid; grid-template-columns:1.2fr .45fr .8fr .65fr .9fr; }
.sales-screen-table span{ padding:9px 10px; border-bottom:1px solid var(--line-2); color:var(--slate); font-size:9px; }
.sales-screen-table .th span{ color:#61758c; background:#edf3f7; font-weight:800; }
.sales-screen-table .tr:last-child span{ border-bottom:0; }
.sales-screen-table .ok,.sales-screen-table .wait{ font-weight:800; }
.sales-screen-table .ok{ color:#0b8157; }
.sales-screen-table .wait{ color:#9a6300; }
.sales-screen footer{ display:flex; gap:8px; align-items:center; margin-top:12px; }
.sales-screen footer span,.sales-screen footer b{ padding:7px 9px; border-radius:8px; color:#557084; background:#eef4f6; font-size:9px; }
.sales-screen footer b{ margin-left:auto; color:#08754f; background:#e0f5ee; }

@media (min-width:1081px){
  .commercial-screen-stage{ padding-top:92px; padding-bottom:92px; }
  .commercial-screen-stage .module-system-hotspot--1,
  .commercial-screen-stage .module-system-hotspot--2{ top:20px; }
  .commercial-screen-stage .module-system-hotspot--3,
  .commercial-screen-stage .module-system-hotspot--4{ bottom:20px; }
  .commercial-screen-stage .module-system-hotspot--4{ right:24px; }
}

@media (min-width:701px){
  .commercial-hero-product{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px 8px; align-content:start; }
  .sales-order{ grid-column:1/-1; margin:42px 38px 12px; }
  .sales-float{ position:static; width:auto; }
  .sales-float--margin{ grid-column:1; }
  .sales-float--limit{ grid-column:2; transform:none; }
  .sales-float--stock{ grid-column:3; }
  .commercial-hero-product > small{ grid-column:1/-1; margin-top:2px; }
}

@media (max-width:1080px){
  .commercial-cap-card,.commercial-cap-card--carteira,.commercial-cap-card--faturamento{ grid-column:auto; }
}
@media (max-width:700px){
  .commercial-hero-product{ min-height:0; display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:14px; }
  .sales-order{ grid-column:1/-1; margin:28px 0 4px; }
  .sales-float{ position:static; width:auto; min-width:0; }
  .sales-float--limit{ grid-column:1/-1; transform:none; }
  .sales-order-body{ padding:17px; }
  .sales-order-main{ grid-template-columns:1fr 1fr; }
  .sales-availability{ grid-template-columns:1fr; }
  .sales-availability header{ grid-column:auto; display:block; }
  .sales-mini-price{ grid-template-columns:1fr; }.sales-mini-price i{ display:none; }
  .sales-mini-pipeline{ grid-template-columns:1fr 1fr 1fr; }
}
@media (max-width:420px){
  .commercial-hero-product{ grid-template-columns:1fr; }
  .sales-order,.sales-float--limit{ grid-column:auto; }
  .sales-customer{ align-items:flex-start; flex-direction:column; }
  .sales-order-main{ grid-template-columns:1fr; }
  .sales-float{ padding:9px 11px; }
  .sales-screen-kpis{ grid-template-columns:1fr; }
}
