/* =========================================================
   DATATABLES BUTTONS — GLASS / NEON (LOCKED)
   ---------------------------------------------------------
   OWNERSHIP:
   • Styles ONLY DataTables Buttons extension UI
   • Export / visibility / custom DT buttons
   ---------------------------------------------------------
   HARD RULES:
   ❌ MUST NOT change table layout
   ❌ MUST NOT affect #trade-log rows or cells
   ❌ MUST NOT introduce scroll containers
   ❌ MUST NOT interfere with tooltips or modals
   ---------------------------------------------------------
   Related files:
   • log.css            → table structure + behavior
   • log_glass.css      → table visuals + mobile cards
   • datatables.glass.css → DT chrome (pager/info)
   ========================================================= */

/* ---------------------------------------------------------
   Spinner Animation (Processing State)
--------------------------------------------------------- */
@keyframes dtb-spinner{
  to{ transform:rotate(360deg); }
}

/* ---------------------------------------------------------
   Wrapper (SCOPED — DO NOT TOUCH TABLE FLOW)
   ---------------------------------------------------------
   Why:
   • Needed only for absolute positioning of collections
   • Must NOT introduce layout or overflow changes
--------------------------------------------------------- */
#trade-log_wrapper{
  position:relative;
}

/* ---------------------------------------------------------
   Buttons Container (SAFE FLEX)
   ---------------------------------------------------------
   NOTE:
   • Flex used only for buttons
   • Does NOT affect table geometry
--------------------------------------------------------- */
#trade-log_wrapper div.dt-buttons{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;

  width:100%;
  max-width:100%;
  justify-content:flex-start;
  margin:0;
}

/* ---------------------------------------------------------
   Button Base (PILL STYLE)
   ---------------------------------------------------------
   Applies to:
   • <button>, <a>, <input> DT buttons
--------------------------------------------------------- */
button.dt-button,
div.dt-button,
a.dt-button,
input.dt-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:.42rem .9rem;
  min-height:30px;

  border-radius:999px;
  border:1px solid rgba(99,102,241,.45);

  background:
    linear-gradient(
      180deg,
      rgba(15,23,42,.92),
      rgba(2,6,23,.92)
    );

  color:#e7ecf7;
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;

  cursor:pointer;
  user-select:none;
  white-space:nowrap;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.05),
    0 0 14px rgba(99,102,241,.35);

  transition:
    transform .12s ease,
    box-shadow .12s ease,
    border-color .12s ease;
}

/* Hover / Active (non-disabled only) */
button.dt-button:hover:not(.disabled){
  transform:translateY(-1px);
  border-color:#6366f1;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 0 22px rgba(99,102,241,.55);
}

button.dt-button:active:not(.disabled){
  transform:none;
  box-shadow:inset 0 2px 6px rgba(0,0,0,.6);
}

/* ---------------------------------------------------------
   Disabled State
--------------------------------------------------------- */
button.dt-button.disabled,
button.dt-button:disabled{
  opacity:.4;
  cursor:default;
  box-shadow:none;
}

/* ---------------------------------------------------------
   Active / Toggled State
--------------------------------------------------------- */
button.dt-button.active:not(.disabled){
  border-color:#10b981;
  color:#6ee7b7;
  box-shadow:0 0 22px rgba(16,185,129,.45);
}

/* ---------------------------------------------------------
   Processing Spinner
   ---------------------------------------------------------
   DT applies `.processing` while exporting
--------------------------------------------------------- */
button.dt-button.processing{
  position:relative;
  color:transparent !important;
}

button.dt-button.processing::after{
  content:"";
  position:absolute;
  width:14px;
  height:14px;

  border-radius:50%;
  border:2px solid rgba(99,102,241,.6);
  border-left-color:transparent;
  border-right-color:transparent;

  animation:dtb-spinner 1.1s linear infinite;
}

/* ---------------------------------------------------------
   Button Collection (Dropdown Menu)
--------------------------------------------------------- */
div.dt-button-collection{
  position:absolute;
  z-index:2000;

  min-width:200px;
  padding:8px;

  background:
    linear-gradient(
      180deg,
      rgba(15,23,42,.96),
      rgba(2,6,23,.96)
    );

  border-radius:14px;
  border:1px solid rgba(99,102,241,.45);

  box-shadow:
    0 0 0 1px rgba(99,102,241,.25),
    0 20px 60px rgba(0,0,0,.85);

  backdrop-filter:blur(10px);
}

/* Buttons inside dropdown */
div.dt-button-collection .dt-button{
  width:100%;
  justify-content:flex-start;
  margin:4px 0;
}

/* ---------------------------------------------------------
   Collection Background (Modal Backdrop)
--------------------------------------------------------- */
div.dt-button-background{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.65);
  backdrop-filter:blur(2px);
  z-index:1999;
}

/* ---------------------------------------------------------
   Kill Legacy / Split Button Junk
   ---------------------------------------------------------
   Removes:
   • legacy split dropdowns
   • spacer artifacts
--------------------------------------------------------- */
.dt-button embed,
span.dt-button-spacer,
span.dt-button-spacer.bar,
button.dt-btn-split-drop,
button.buttons-split,
button.dt-btn-split-drop-button{
  display:none !important;
}

/* ---------------------------------------------------------
   Mobile Safety
--------------------------------------------------------- */
@media (max-width:640px){
  #trade-log_wrapper div.dt-buttons{
    justify-content:center;
  }
}