@media (max-width: 767px) {
    /* Mobile-first responsive adjustments */
    html {
  font-size: 14px;
    }

    body {
        font-size: 0.95rem;
        margin-bottom: 80px;
    }

    .navbar-collapse {
 width: 100%;
 }

        .navbar-collapse.collapsing {
      right: -100%;
        }

    .navbar-toggler {
        background-color: transparent !important;
     padding: 0.5rem;
    }

 /* Shop page cards responsive */
    .shop_start {
        padding: 0 0.5rem;
    }

    .shop_start .card-deck {
        flex-direction: column;
        align-items: stretch;
    }

    .shop_start .card-deck .card {
     min-width: 100%;
        max-width: 100%;
      margin-bottom: 1.5rem;
        transform: none !important;
     -webkit-transform: none !important;
    }

    /* Better button sizing for mobile */
    .btn {
        padding: 0.75rem 1.25rem;
   font-size: 1rem;
 min-height: 44px; /* Touch-friendly minimum */
    }

    /* Progress bar mobile optimization */
    #progressbar {
        margin-bottom: 20px;
        font-size: 0.75rem;
    }

    #progressbar li {
        font-size: 0.7rem;
      width: 25%;
    }

    #progressbar:has(#survey) li,
    #progressbar.with-survey li {
        width: 20%;
    }

    #progressbar li:before {
      width: 40px;
        height: 40px;
     line-height: 36px;
        font-size: 16px;
    }

    #progressbar li:after {
  top: 20px;
    }

    .progressbar_img {
        max-width: 100%;
   width: 200px;
    }

    /* Form elements mobile friendly */
    .form-control,
    .form-select {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 0.75rem;
        min-height: 44px;
    }

    /* Table responsiveness */
    .table-responsive {
        border: 0;
 margin-bottom: 1rem;
    }

    /* Mobile-friendly navigation */
    .navbar-nav {
        padding-top: 80px;
    }

    .nav-item {
        padding-bottom: 15px;
    }

    /* Modal improvements */
    .modal-dialog {
     margin: 0.5rem;
    }

    /* Header adjustments */
    h1 {
        font-size: 1.75rem;
        line-height: 1.3;
}

    h2 {
    font-size: 1.5rem;
      line-height: 1.3;
    }

    h3 {
        font-size: 1.25rem;
    }

    /* Survey improvements */
    .survey-container {
     padding: 15px;
     margin-bottom: 15px;
    }

    .survey-question {
        padding: 15px;
        margin-bottom: 15px;
    }

    .survey-question legend,
    .survey-question .form-label {
        font-size: 1rem;
    }

 /* Rating stars mobile */
    .rating-container .rating-stars {
        justify-content: center;
      gap: 0.25rem;
    }

  .rating-container .fas.fa-star {
        font-size: 1.25rem;
    }

    /* Card improvements */
    .card {
        margin-bottom: 1rem;
    }

    .card-header {
 padding: 0.75rem 1rem;
    }

    .card-body {
        padding: 1rem;
    }

    /* Footer mobile */
    .footer {
        line-height: normal;
        padding: 1rem 0;
    }

    /* Spacing improvements */
    .mb-3 {
      margin-bottom: 1rem !important;
    }

    .mt-3 {
        margin-top: 1rem !important;
    }

    /* Touch-friendly links */
    a {
     min-height: 44px;
        display: inline-flex;
        align-items: center;
    }

    /* Image responsiveness */
    img {
 max-width: 100%;
     height: auto;
    }

  /* Container adjustments */
    .container,
    .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Badge sizing */
    .badge {
        font-size: 0.8rem;
   padding: 0.35em 0.65em;
    }

    /* Alert mobile */
    .alert {
        padding: 0.75rem 1rem;
        font-size: 0.95rem;
    }

    /* Scrollable horizontal content */
    .table-responsive,
    .overflow-auto {
 -webkit-overflow-scrolling: touch;
    }
}