.variation-modal {
      border-radius: 12px;
  }

  .variation-group {
      margin-bottom: 20px;
  }

  .variation-group .title {
      font-weight: 600;
      margin-bottom: 8px;
      display: block;
      color: #333;
  }

  .variation-modal input {
      border-radius: 8px;
      border: 1px solid #ddd;
      padding: 10px;
  }

  .variation-modal input:focus {
      border-color: #008fd2;
      box-shadow: 0 0 0 0.15rem rgba(0, 143, 210, 0.2);
  }

  .custom-radio {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
  }

  .custom-radio label {
      padding: 8px 14px;
      border: 1px solid #ddd;
      border-radius: 8px;
      cursor: pointer;
      background: #f5f5f5;
  }

  .custom-radio input {
      display: none;
  }

  .custom-radio input:checked+label {
      background: #008fd2;
      color: #fff;
      border-color: #008fd2;
  }

  .color-group {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
  }

  .color-item {
      cursor: pointer;
      display: inline-block;
  }

  .color-item input {
      display: none;
  }

  .color-item span {
      display: block;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      border: 2px solid #ddd;
      transition: all 0.2s ease;
  }

  .color-item input:checked+span {
      border: 2px solid #0f72ba;
      transform: scale(1.15);
      box-shadow: 0 0 0 3px rgba(0, 143, 210, 0.2);
  }

  .add-to-cart-btn {
      background: linear-gradient(135deg, #008fd2, #0f72ba);
      color: #fff;
      border-radius: 8px;
      padding: 10px 25px;
      border: none;
      font-weight: 600;
  }


  select.nice-select-trigger {
      appearance: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      background-image: none !important;
  }

  .nice-select {
      width: 100%;
      border-radius: 8px;
      border: 1px solid #ddd;
      padding: 10px 14px;
      height: auto;
      line-height: normal;
      font-size: 14px;
  }

  .nice-select:hover {
      border-color: #008fd2;
  }

  .nice-select.open {
      border-color: #008fd2;
      box-shadow: 0 0 0 0.15rem rgba(0, 143, 210, 0.2);
  }

  .nice-select:after {
      border-bottom: 2px solid #008fd2;
      border-right: 2px solid #008fd2;
      width: 6px;
      height: 6px;
  }

  .nice-select .list {
      width: 100%;
      border-radius: 8px;
      border: 1px solid #eee;
  }

  .nice-select .option:hover,
  .nice-select .option.selected {
      background: #008fd2;
      color: #fff;
  }

  .custom-checkbox {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
  }

  .custom-checkbox label {
      padding: 8px 14px;
      border: 1px solid #ddd;
      border-radius: 8px;
      cursor: pointer;
      background: #f5f5f5;
      transition: 0.2s;
  }

  .custom-checkbox input {
      display: none;
  }

  .custom-checkbox input:checked+label {
      background: #008fd2;
      color: #fff;
      border-color: #008fd2;
  }