/*
 * 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.
 */
 @import url("https://cdn.jsdelivr.net/npm/slim-select@2.12.1/dist/slimselect.css");

 .slim-select-override {
    align-items: initial !important;
  }

  /* Override DaisyUI select styles for slim-select elements - keep main border */
  .select.slim-select-override {
      box-shadow: none !important;
      outline: none !important;
  }
  
  .select-no-arrow {
    align-items: initial !important;
    padding-right: 0 !important;
    /* Keep DaisyUI styling, just remove Slim Select's arrow */
  }
  
  /* Hide Slim Select's arrow elements */
  .select-no-arrow + .ss-main .ss-arrow {
    display: none !important;
  }
  
  /* Alternative selector for Slim Select arrow */
  .ss-main .ss-arrow {
    display: none !important;
  }
  
  /* Hide the original select when Slim Select is active (DOM is: select + .ss-main) */
  select[data-controller~="slim-select"] {
    position: absolute !important;
    left: -9999px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }
  
  /* Make sure no select elements are visible within the dropdown content */
  .ss-content select {
    display: none !important;
  }
  
  /* Hide any background images (arrows) in the dropdown area */
  .ss-content,
  .ss-list,
  .ss-option {
    background-image: none !important;
  }
  
  /* Target the dropdown container more aggressively */
  .ss-main.ss-open .ss-content {
    background: white !important;
    background-image: none !important;
  }
  
  /* Hide any potential select styling that might bleed through */
  .ss-main.ss-open * {
    background-image: none !important;
  }
  
  /* Override any inherited select styling in the open state */
  .ss-main.ss-open {
    background-image: none !important;
  }
  
  /* Copy the select classes to the Slim Select main element only when closed */
  .ss-main:not(.ss-open) {
    @apply select select-bordered;
  }
  
  /* When open, remove DaisyUI select styling to prevent arrow from showing */
  .ss-main.ss-open {
    background-image: none !important;
    padding-right: 1rem !important;
  }

  /* Tablet-optimized utilities for larger touch targets */
  /* Use these classes in tablet layout views for better UX on warehouse tablets */
  .btn-tablet {
    @apply min-h-[3.5rem] text-lg px-6 py-3;
  }
  
  .btn-tablet-sm {
    @apply min-h-[2.75rem] text-base px-4 py-2;
  }
  
  .btn-tablet-lg {
    @apply min-h-[4.5rem] text-xl px-8 py-4;
  }
  
  /* Ensure full width elements in tablet layout */
  .tablet-full-width {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
  }