/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

 .ts-control {
  border: none;
 }

.ts-dropdown .optgroup-header {
  padding: 0.5rem 0.75rem 0.25rem;
  margin-top: 0.25rem;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tblr-secondary);
  background: var(--tblr-bg-surface-secondary);
  border-top: 1px solid var(--tblr-border-color);
}

.ts-dropdown .optgroup:first-child .optgroup-header {
  margin-top: 0;
  border-top: 0;
}

.ts-dropdown .optgroup .option {
  padding-left: 1.25rem;
}

.simulations-filter-form .ts-wrapper.form-select {
  min-height: calc(1.4285714286em + 0.875rem + 2px);
  padding: 0;
}

.simulations-filter-form .ts-wrapper.form-select .ts-control {
  min-height: calc(1.4285714286em + 0.875rem);
  padding: 0.4375rem 2.25rem 0.4375rem 0.75rem;
  align-items: center;
}

.simulation-highlight-match > * {
  background-color: rgba(var(--tblr-success-rgb, 47, 179, 68), 0.16) !important;
}

.simulation-highlight-match > :first-child {
  box-shadow: inset 3px 0 0 var(--tblr-success, #2fb344);
}

.strategy-chart-container {
  height: 320px;
  min-height: 320px;
  cursor: crosshair;
}

.strategy-chart-container.strategy-chart-dragging {
  cursor: ns-resize;
}

.strategy-chart-empty {
  height: 320px;
}

.strategy-form-header .ts-wrapper.form-select {
  min-height: calc(1.4285714286em + 0.875rem + 2px);
  padding: 0;
}

.strategy-form-header .ts-wrapper.form-select .ts-control {
  min-height: calc(1.4285714286em + 0.875rem);
  padding: 0.4375rem 2.25rem 0.4375rem 0.75rem;
  align-items: center;
}

.exit-protection-config {
  max-width: 38rem;
}

.exit-protection-trigger-field {
  flex: 0 1 12.5rem;
}

.exit-protection-stop-field {
  flex: 0 0 11rem;
}

@media (max-width: 575.98px) {
  .exit-protection-trigger-field,
  .exit-protection-stop-field {
    flex-basis: 100%;
  }
}

.icon-button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: inherit; /* optional, match text color */
}

/* Left-align navbar items */
.navbar-vertical .navbar-nav {
  justify-content: flex-start !important;
  text-align: left !important;
}

.navbar-vertical .nav-link {
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 1rem !important;
}

/* Ensure proper offcanvas behavior with Tabler */
.offcanvas-lg.offcanvas-start {
  width: 270px;
}

/* Make sure the offcanvas backdrop works properly */
.offcanvas-backdrop {
  z-index: 1039;
}

/* Ensure proper sidebar behavior on desktop */
@media (min-width: 1200px) {
  .offcanvas-lg.offcanvas-start {
    transform: none !important;
    visibility: visible !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    background: transparent !important;
    border-right: none !important;
  }

  .offcanvas-lg .offcanvas-header {
    display: none !important;
  }

  .offcanvas-lg .offcanvas-body {
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  /* Hide toggler on desktop */
  .navbar-vertical .navbar-toggler {
    display: none !important;
  }
}

/* Mobile styles */
@media (max-width: 1199.98px) {
  .navbar-vertical {
    position: static;
  }

  .page-wrapper {
    margin-left: 0 !important;
  }

  /* Ensure toggler is visible on mobile */
  .navbar-toggler {
    display: block !important;
  }
}

/* Basic toggler styling */
.navbar-toggler {
  border: none;
  padding: 0.5rem;
}

.navbar-toggler:focus {
  box-shadow: none;
  outline: none;
}

/* Ensure proper z-index for offcanvas */
.offcanvas {
  z-index: 1040;
}