.custom-img-size {
    width: 30.828rem;
    height: 18.51rem;
    object-fit: cover;
}

body {
    overflow-x: hidden;
}


/* Custom CSS untuk responsivitas */
    @media (max-width: 768px) {
      .header-container {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 1rem;
      }
      
      .header-actions {
        width: 100%;
        flex-wrap: wrap;
      }
      
      .header-actions .form-control,
      .header-actions .form-select,
      .header-actions .dropdown,
      .header-actions .btn {
        flex: 1 1 calc(50% - 0.5rem);
        min-width: calc(50% - 0.5rem);
      }
      
      .header-actions .btn-success {
        flex: 1 1 100%;
        min-width: 100%;
        margin-top: 0.5rem;
      }
      
      .product-card {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
      }
      
      .card-img-top.custom-img-size {
        height: 200px;
        object-fit: cover;
      }
      
      .skill-tags .badge {
        font-size: 0.75rem;
        margin-bottom: 0.25rem;
      }
      
      .dropdown-menu.skill-dropdown {
        position: fixed !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 90% !important;
        max-height: 70vh;
        overflow-y: auto;
      }
    }
    
    @media (max-width: 576px) {
      .header-actions .form-control,
      .header-actions .form-select,
      .header-actions .dropdown,
      .header-actions .btn {
        flex: 1 1 100%;
        min-width: 100%;
      }
      
      .card-body .btn {
        display: block;
        width: 100%;
        margin-bottom: 0.5rem;
      }
      
      .card-body form {
        display: block;
      }
    }
    
    /* Styling untuk desktop - tetap seperti semula */
    @media (min-width: 769px) {
      .header-actions {
        flex-wrap: nowrap;
      }
      
      .header-actions .form-control {
        min-width: 200px;
      }
      
      .header-actions .form-select {
        min-width: 130px;
      }
      
      .header-actions .dropdown .btn {
        min-width: 140px;
      }
      
      .header-actions .btn-success {
        white-space: nowrap;
      }
    }
    
    /* Styling tambahan untuk skill filter */
    .skill-filter-options {
      max-height: 200px;
      overflow-y: auto;
    }
    
    /* Memastikan dropdown skill filter tidak terlalu lebar di desktop */
    .dropdown-menu.skill-dropdown {
      width: 280px;
    }