/* Waleed Trade V4.23.24 — temporary split adjustment UI */
.split-adjustment-button{border:1px solid rgba(92,195,255,.35);background:rgba(6,36,50,.82);color:#8fdcff;border-radius:8px;min-height:27px;padding:4px 9px;font:700 11px/1.2 inherit;display:inline-flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap;transition:.18s ease}
.split-adjustment-button:hover{border-color:#37d4ff;color:#d7f8ff;transform:translateY(-1px)}
.split-adjustment-button.active{border-color:rgba(41,232,139,.65);background:rgba(6,58,42,.78);color:#42ef9c;box-shadow:0 0 12px rgba(34,221,132,.12)}
.split-adjustment-modal{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;padding:20px;direction:rtl}
.split-adjustment-modal.show{display:flex}
.split-adjustment-backdrop{position:absolute;inset:0;border:0;background:rgba(0,8,14,.78);backdrop-filter:blur(8px)}
.split-adjustment-dialog{position:relative;width:min(660px,96vw);max-height:92vh;overflow:auto;border:1px solid rgba(58,190,238,.34);border-radius:20px;background:linear-gradient(155deg,#071722 0%,#06121b 100%);box-shadow:0 28px 90px rgba(0,0,0,.56),0 0 36px rgba(0,174,255,.1);padding:20px;color:#e8f7ff}
.split-adjustment-dialog header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.split-adjustment-dialog header small{display:block;color:#7899aa;font-size:11px;margin-bottom:3px}
.split-adjustment-dialog h3{margin:0;color:#f1fbff;font-size:20px}
.split-adjustment-close{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#b9d3df;font-size:22px;cursor:pointer}
.split-adjustment-current{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px}
.split-adjustment-current>div{border:1px solid rgba(78,161,196,.18);background:rgba(5,28,40,.7);border-radius:11px;padding:10px;min-width:0}
.split-adjustment-current span{display:block;color:#7493a3;font-size:10px;margin-bottom:4px}
.split-adjustment-current b{display:block;color:#e9f8ff;font-size:13px;direction:ltr;text-align:right;overflow:hidden;text-overflow:ellipsis}
.split-adjustment-fields{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.split-adjustment-fields label{display:flex;flex-direction:column;gap:6px;color:#afc8d4;font-size:12px}
.split-adjustment-fields input{width:100%;box-sizing:border-box;border:1px solid rgba(74,169,210,.28);background:#06131c;color:#f3fbff;border-radius:9px;padding:10px 11px;font:700 13px inherit;outline:none}
.split-adjustment-fields input:focus{border-color:#29c8ff;box-shadow:0 0 0 3px rgba(41,200,255,.08)}
.split-adjustment-fields label>small{color:#688594;font-size:10px}
.split-ratio{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:7px}.split-ratio i{font-style:normal;color:#7d9bab;font-size:11px}
.split-repair-choice{display:flex;align-items:flex-start;gap:10px;margin:15px 0 10px;padding:11px 12px;border-radius:11px;border:1px solid rgba(50,220,147,.22);background:rgba(4,49,37,.34);cursor:pointer}
.split-repair-choice input{margin-top:3px;accent-color:#25db89}.split-repair-choice span{display:flex;flex-direction:column;gap:3px}.split-repair-choice b{font-size:12px;color:#45efa2}.split-repair-choice small{font-size:10px;color:#7fa997;line-height:1.5}
.split-adjustment-preview{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 12px;border-radius:10px;padding:10px 12px;margin-bottom:14px;background:rgba(7,30,42,.7);border:1px solid rgba(100,163,190,.16)}
.split-adjustment-preview span{font-size:11px;color:#86a3b1}.split-adjustment-preview b{font-size:15px;color:#d9f5ff;direction:ltr;text-align:right}.split-adjustment-preview small{grid-column:1/-1;font-size:10px;color:#7895a3}.split-adjustment-preview.warn{border-color:rgba(255,176,64,.32)}.split-adjustment-preview.warn small{color:#ffba59}.split-adjustment-preview.ok{border-color:rgba(47,221,143,.28)}.split-adjustment-preview.ok small{color:#4ee8a1}
.split-adjustment-dialog footer{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
.split-adjustment-dialog footer button{border-radius:9px;padding:9px 14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#b9cfda;font:700 12px inherit;cursor:pointer}
.split-adjustment-dialog footer .primary{background:linear-gradient(135deg,#0aa96a,#12c87e);border-color:#22d993;color:#03150e}.split-adjustment-dialog footer .danger{border-color:rgba(255,104,119,.35);color:#ff8490;background:rgba(91,20,31,.34)}
.split-adjustment-toast{position:fixed;z-index:100100;left:22px;bottom:22px;max-width:min(430px,calc(100vw - 44px));padding:12px 16px;border-radius:11px;background:#071924;border:1px solid rgba(73,178,222,.32);color:#dff7ff;box-shadow:0 18px 54px rgba(0,0,0,.42);font:700 12px/1.5 inherit;opacity:0;transform:translateY(12px);pointer-events:none;transition:.22s ease}.split-adjustment-toast.show{opacity:1;transform:translateY(0)}.split-adjustment-toast.error{border-color:rgba(255,90,110,.48);color:#ffabb3}.split-adjustment-toast.ok{border-color:rgba(42,224,139,.42);color:#8ff2be}
body.split-adjustment-open{overflow:hidden}
@media(max-width:700px){.split-adjustment-current{grid-template-columns:1fr 1fr}.split-adjustment-fields{grid-template-columns:1fr}.split-adjustment-dialog{padding:15px}.split-adjustment-dialog footer button{flex:1 1 auto}}


/* V4.23.24 — keep Edit and Timeline neatly stacked inside the reserved header slot. */
#tradesView .reinforcement-slot{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:4px!important;
  width:108px!important;
  min-width:108px!important;
  flex-basis:108px!important;
  min-height:56px!important;
  visibility:visible!important;
}
#tradesView .reinforcement-slot .reinforcement-toggle,
#tradesView .reinforcement-slot .split-adjustment-button{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  min-height:25px!important;
  margin:0!important;
  justify-content:center!important;
}
#tradesView .reinforcement-slot:empty{visibility:hidden!important}
.split-adjustment-preview.changed{border-color:rgba(44,201,255,.34)}
.split-adjustment-preview.changed small{color:#75dfff}
@media(max-width:700px){
  #tradesView .reinforcement-slot{width:84px!important;min-width:84px!important;flex-basis:84px!important;min-height:49px!important;gap:3px!important}
  #tradesView .reinforcement-slot .reinforcement-toggle,
  #tradesView .reinforcement-slot .split-adjustment-button{min-height:22px!important;padding:3px 5px!important;font-size:8px!important}
}

/* V4.23.30 — compact one-row trade header controls.
   UI only: keep Edit + Timeline on one line without pushing card data downward. */
#tradesView .reinforcement-slot{
  display:grid!important;
  grid-template-columns:82px 40px!important;
  grid-template-areas:"timeline edit"!important;
  column-gap:4px!important;
  align-items:center!important;
  justify-content:start!important;
  flex:0 0 126px!important;
  width:126px!important;
  min-width:126px!important;
  min-height:27px!important;
  height:27px!important;
  visibility:visible!important;
}
#tradesView .reinforcement-slot .reinforcement-toggle{
  grid-area:timeline!important;
  box-sizing:border-box!important;
  width:82px!important;
  min-width:82px!important;
  max-width:82px!important;
  min-height:24px!important;
  height:24px!important;
  padding:3px 5px!important;
  margin:0!important;
  justify-content:center!important;
  font-size:8.7px!important;
  line-height:1!important;
  gap:3px!important;
}
#tradesView .reinforcement-slot .reinforcement-toggle .reinforcement-icon{font-size:9px!important}
#tradesView .reinforcement-slot .reinforcement-toggle .reinforcement-chevron{display:none!important}
#tradesView .reinforcement-slot .split-adjustment-button{
  grid-area:edit!important;
  box-sizing:border-box!important;
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  min-height:24px!important;
  height:24px!important;
  padding:3px 4px!important;
  margin:0!important;
  justify-content:center!important;
  gap:2px!important;
  font-size:8.7px!important;
  line-height:1!important;
}
/* Keep the visible label compact even when an active split adjustment exists. */
#tradesView .reinforcement-slot .split-adjustment-button span{font-size:0!important}
#tradesView .reinforcement-slot .split-adjustment-button span::after{content:"تعديل";font-size:8.7px!important;line-height:1!important}
#tradesView .reinforcement-slot .split-adjustment-button b{font-size:8px!important;line-height:1!important}
/* The named timeline grid area remains reserved when this trade has no timeline yet. */
#tradesView .reinforcement-slot:empty{visibility:hidden!important}

@media(max-width:700px){
  #tradesView .reinforcement-slot{
    grid-template-columns:72px 36px!important;
    column-gap:3px!important;
    flex-basis:111px!important;
    width:111px!important;
    min-width:111px!important;
    min-height:24px!important;
    height:24px!important;
  }
  #tradesView .reinforcement-slot .reinforcement-toggle{
    width:72px!important;min-width:72px!important;max-width:72px!important;
    min-height:21px!important;height:21px!important;padding:2px 4px!important;font-size:7.7px!important;
  }
  #tradesView .reinforcement-slot .split-adjustment-button{
    width:36px!important;min-width:36px!important;max-width:36px!important;
    min-height:21px!important;height:21px!important;padding:2px 3px!important;
  }
  #tradesView .reinforcement-slot .split-adjustment-button span::after{font-size:7.7px!important}
}

/* V4.23.31 — trade-header collision fix only.
   Give the one-row Timeline/Edit controls their real reserved width so they never
   sit on top of each other or on top of the holding/ticker header content. */
#tradesView .identity-reinforcement-group{
  grid-template-columns:minmax(0,1fr) 130px!important;
  column-gap:6px!important;
  align-items:center!important;
}
#tradesView .identity-reinforcement-group .trade-identity{
  min-width:0!important;
}
#tradesView .reinforcement-slot{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:42px 82px!important;
  grid-template-areas:"edit timeline"!important;
  column-gap:4px!important;
  width:130px!important;
  min-width:130px!important;
  max-width:130px!important;
  flex:0 0 130px!important;
  min-height:24px!important;
  height:24px!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  direction:ltr!important;
  justify-self:start!important;
  align-self:center!important;
}
#tradesView .reinforcement-slot .reinforcement-toggle{
  grid-area:timeline!important;
  width:82px!important;
  min-width:82px!important;
  max-width:82px!important;
  height:24px!important;
  min-height:24px!important;
  padding:2px 5px!important;
  margin:0!important;
  direction:rtl!important;
  white-space:nowrap!important;
}
#tradesView .reinforcement-slot .split-adjustment-button{
  grid-area:edit!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:24px!important;
  min-height:24px!important;
  padding:2px 4px!important;
  margin:0!important;
  direction:rtl!important;
  white-space:nowrap!important;
}

@media (min-width:1050px) and (max-width:1280px){
  #tradesView .identity-reinforcement-group{
    grid-template-columns:minmax(0,1fr) 120px!important;
    column-gap:4px!important;
  }
  #tradesView .reinforcement-slot{
    grid-template-columns:39px 77px!important;
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
    flex-basis:120px!important;
  }
  #tradesView .reinforcement-slot .reinforcement-toggle{
    width:77px!important;min-width:77px!important;max-width:77px!important;
    font-size:8.2px!important;
  }
  #tradesView .reinforcement-slot .split-adjustment-button{
    width:39px!important;min-width:39px!important;max-width:39px!important;
  }
  #tradesView .reinforcement-slot .split-adjustment-button span::after{font-size:8.2px!important}
}

@media(max-width:700px){
  #tradesView .identity-reinforcement-group{
    grid-template-columns:minmax(0,1fr) 111px!important;
    column-gap:3px!important;
  }
  #tradesView .reinforcement-slot{
    grid-template-columns:36px 72px!important;
    width:111px!important;
    min-width:111px!important;
    max-width:111px!important;
    flex-basis:111px!important;
    height:21px!important;
    min-height:21px!important;
  }
}