/*
    * Custom CSS for easyordersApp
    * This file contains custom styles for the application.
    */
    
/* Set default font size to 24px */
body {
    font-size: 24px;
}

/* Set paragraphs and list items to 10px */
p, ol li, ul li {
    font-size: 18px;
}

.table-choice-form > :not(caption) > * > * {
    padding: 0.25rem 0.5rem;
}

/* Carousel controls visibility fix */
#ProblemSolutionCarousel .carousel-control-prev,
#ProblemSolutionCarousel .carousel-control-next {
  opacity: 1 !important;
}

#ProblemSolutionCarousel .carousel-control-prev:hover,
#ProblemSolutionCarousel .carousel-control-next:hover {
  opacity: 1 !important;
}

/* Define background images for custom carousel controls */
.carousel-dark-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 16 16'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  width: 2rem;
  height: 2rem;
  display: inline-block;
}

.carousel-dark-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 16 16'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  width: 2rem;
  height: 2rem;
  display: inline-block;
}

/* Ensure carousel controls are visible and clickable */
#ProblemSolutionCarousel .carousel-control-prev,
#ProblemSolutionCarousel .carousel-control-next {
 z-index: 10;
 width: 15%;
}

#ProblemSolutionCarousel .carousel-control-prev-icon,
#ProblemSolutionCarousel .carousel-control-next-icon {
 width: 2rem;
 height: 2rem;
}

/* Mobile Navigation Styles */
.navbar-toggler {
  border: none;
 outline: none !important;
  box-shadow: none !important;
}

/* Mobile menu styles */
@media (max-width: 991.98px) {
  .navbar-collapse {
    background: white;
    padding: 0.25rem 0.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0.15);
    margin-top: 0.5rem;
  }
  
  .navbar-nav {
    flex-direction: column;
  }
  
  .navbar-nav .nav-item {
    margin: 0.0625rem 0;
  }
  
  .navbar-nav .nav-link {
    padding: 0.4rem 0.5rem !important;
    display: block;
    border-radius: 0.375rem;
  }
  
  /* Remove extra spacing in mobile menu */
  .navbar-collapse .navbar-nav {
    margin: 0;
    padding: 0.25rem 0;
  }
  
  /* Fix for any extra blank space */
  .navbar-collapse .navbar-nav .nav-item:last-child {
    margin-bottom: 0;
  }
}