/* PIVOTFLOW_UI_DESIGN_SAFE_V4_20260830
   Safe visual-only refinement over UI CLEAN UNIFIED V1.
   No runtime observers. No trading/navigation logic changes. */

/* ---- 1. Signals: remove extra vertical air inside metric cards ---- */
body:not(.adminMode) #signals .signal,
body:not(.adminMode) #signalBox .signal{
  padding:9px 10px 8px!important;
}
body:not(.adminMode) #signals .levels,
body:not(.adminMode) #signalBox .levels{
  gap:6px!important;
  margin-top:7px!important;
  align-items:start!important;
}
body:not(.adminMode) #signals .levels>div,
body:not(.adminMode) #signalBox .levels>div{
  min-height:0!important;
  height:auto!important;
  padding:6px 8px 5px!important;
  border-radius:11px!important;
}
body:not(.adminMode) #signals .levels>div b,
body:not(.adminMode) #signalBox .levels>div b{
  margin-top:4px!important;
  font-size:12.5px!important;
  line-height:1!important;
}
body:not(.adminMode) #signals .levels>div small,
body:not(.adminMode) #signalBox .levels>div small{
  margin-top:3px!important;
  font-size:9.8px!important;
  line-height:1.05!important;
}
body:not(.adminMode) #signals .signal>small,
body:not(.adminMode) #signalBox .signal>small{
  margin-top:4px!important;
}
body:not(.adminMode) #signals .actions,
body:not(.adminMode) #signalBox .actions{
  margin-top:7px!important;
}
body:not(.adminMode) #signals .actions button,
body:not(.adminMode) #signalBox .actions button{
  min-height:35px!important;
  height:35px!important;
  font-size:12px!important;
}

/* ---- 2. Deals report: exactly one active period row ---- */
body:not(.adminMode) #trades .dealReportPeriod.hidden,
body:not(.adminMode) #trades .dealReportPeriod[hidden]{
  display:none!important;
}
body:not(.adminMode) #trades .dealReportCard{
  padding:9px!important;
}
body:not(.adminMode) #trades .dealReportTop{
  margin-bottom:7px!important;
}
body:not(.adminMode) #trades .dealReportDashboard{
  grid-template-columns:78px minmax(0,1fr)!important;
  gap:7px!important;
}
body:not(.adminMode) #trades .dealReportTabs{
  gap:5px!important;
}
body:not(.adminMode) #trades .dealReportTabs button{
  min-height:32px!important;
  height:32px!important;
  padding:0 5px!important;
  font-size:11px!important;
}
body:not(.adminMode) #trades .dealReportMetric{
  padding:7px 7px 5px!important;
}
body:not(.adminMode) #trades .dealReportSpark{
  height:12px!important;
  margin-top:4px!important;
}
body:not(.adminMode) #trades .dealReportPeriod{
  gap:9px!important;
  min-height:31px!important;
  margin-top:7px!important;
  padding-top:6px!important;
}
body:not(.adminMode) #trades .dealPeriodArrow{
  width:31px!important;
  height:31px!important;
  min-height:31px!important;
  border-radius:10px!important;
  background:#07121e!important;
  background-image:none!important;
  box-shadow:none!important;
}
body:not(.adminMode) #trades .dealPeriodValue{
  min-width:124px!important;
  height:31px!important;
  min-height:31px!important;
  font-size:12.5px!important;
  border-radius:11px!important;
}

/* ---- 3. Bottom navigation: reference-like compact capsule ---- */
body:not(.adminMode)>nav{
  left:8px!important;
  right:8px!important;
  bottom:29px!important;
  width:auto!important;
  height:58px!important;
  min-height:58px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  overflow:hidden!important;
  border:1px solid #20364d!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,rgba(6,15,26,.98),rgba(3,9,17,.99))!important;
  box-shadow:0 10px 26px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
body:not(.adminMode)>nav button{
  min-width:0!important;
  width:auto!important;
  height:58px!important;
  min-height:58px!important;
  padding:5px 2px 4px!important;
  border:0!important;
  border-right:1px solid rgba(30,52,74,.48)!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  color:#a8b4c4!important;
  box-shadow:none!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
}
body:not(.adminMode)>nav button:last-child{border-right:0!important}
body:not(.adminMode)>nav button.active{
  background:linear-gradient(180deg,rgba(29,72,190,.72) 0%,rgba(14,46,149,.58) 55%,rgba(3,10,20,.92) 100%)!important;
  background-image:linear-gradient(180deg,rgba(29,72,190,.72) 0%,rgba(14,46,149,.58) 55%,rgba(3,10,20,.92) 100%)!important;
  color:#fff!important;
  box-shadow:inset 0 0 18px rgba(68,111,255,.20)!important;
}
body:not(.adminMode)>nav .pfNavIcon{
  width:20px!important;
  height:20px!important;
  display:block!important;
  flex:0 0 20px!important;
}
body:not(.adminMode)>nav .pfNavIcon svg{
  width:20px!important;
  height:20px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.65!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
body:not(.adminMode)>nav button[data-page="signals"] .pfNavIcon svg{
  stroke-width:1.8!important;
}
body:not(.adminMode)>nav button span:not(.pfNavIcon){
  display:block!important;
  margin:0!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:430!important;
  letter-spacing:-.01em!important;
  white-space:nowrap!important;
}

/* ---- 4. Admin primary button gradient ---- */
body.adminMode .primary,
body.adminMode button.primary,
body.adminMode #adminLogin,
body.adminMode .adminLoginV6 .primary,
body.adminMode .adminDownloadButton,
body.adminMode #reportExcel{
  background:linear-gradient(180deg,#214fce 0%,#0E2E95 52%,#000 100%)!important;
  background-image:linear-gradient(180deg,#214fce 0%,#0E2E95 52%,#000 100%)!important;
  border-color:#5b82f5!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(55,94,211,.16),0 5px 14px rgba(14,46,149,.22),inset 0 1px 0 rgba(255,255,255,.07)!important;
}

@media(max-width:390px){
  body:not(.adminMode)>nav{left:6px!important;right:6px!important;bottom:27px!important;height:56px!important;min-height:56px!important}
  body:not(.adminMode)>nav button{height:56px!important;min-height:56px!important}
  body:not(.adminMode)>nav .pfNavIcon,
  body:not(.adminMode)>nav .pfNavIcon svg{width:19px!important;height:19px!important}
}