
    .max-w-4xl.w-full.bg-white.rounded-lg.shadow-lg.p-6 {
      max-width: 56rem;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      display: block;
      background-color: #ffffff;
      border-radius: 0.5rem;
       border: 2px solid #009688;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.1);
      padding: 1.5rem;
    }
    #upload-area {
      border-width: 1px;
      border-style: dashed;
      border-color: #d1d5db;
      border-radius: 0.5rem;
      padding: 1.5rem;
      text-align: center;
      margin-bottom: 1.5rem;
    }
     .fas fa-cloud-upload-alt upload-icon {
    color: #009688;
    width: 50px;
    height: 50px;
  }
    #upload-area.border-blue-500 {
      border-color: #3b82f6;
    }
    #upload-area p.text-gray-600.mb-2 {
      color: #4b5563;
      margin-bottom: 0.5rem;
    }
    #upload-area #browse-btn {
      background-color: #f0fdfa;
      color: #059669;
      padding-left: 1rem;
      padding-right: 1rem;
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
      border-radius: 0.25rem;
      border: 1px solid #059669;
    }
    #upload-area #browse-btn:hover {
      background-color: #2563eb;
    }
    #reset-btn {
      background-color: #ef4444;
      color: #ffffff;
      padding-left: 1rem;
      padding-right: 1rem;
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
      border-radius: 0.25rem;
      margin-bottom: 1.5rem;
    }
    #reset-btn:hover {
      background-color: #dc2626;
    }
    #reset-btn.hidden {
      display: none;
    }
    .cropper-container {
      max-width: 100%;
      max-height: 400px;
    }
    @media (max-width: 640px) {
      .cropper-container {
        max-height: 300px;
      }
    }
    
    .image-card {
      background-color: #f9fafb;
      padding: 1rem;
      border-radius: 0.5rem;
      box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
      transition: all 0.3s ease;
    }
    .preview {
      border: 2px solid #e5e7eb;
      max-width: 200px;
      max-height: 200px;
      overflow: hidden;
      border-radius: 0.5rem;
    }
    @media (max-width: 640px) {
      .preview {
        max-width: 150px;
        max-height: 150px;
      }
    }
    .image-card .flex.flex-col.md\:flex-row.gap-4 {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }
    @media (min-width: 768px) {
      .image-card .flex.flex-col.md\:flex-row.gap-4 {
        flex-direction: row;
      }
    }
    .image-card img.w-full.rounded {
      width: 100%;
      border-radius: 0.25rem;
    }
    .preview img.w-full.h-full.object-contain {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
    .image-card .flex.gap-2 {
      display: flex;
      gap: 0.5rem;
    }
    .image-card input.border.rounded.p-2.w-1\/2 {
      border: 1px solid #d1d5db;
      border-radius: 0.25rem;
      padding: 0.5rem;
      width: 50%;
    }
    .image-card input[type="number"][min="1"] {
      min: 1;
    }
    .image-card input[type="number"][min="0"] {
      min: 0;
    }
    .image-card label.flex.items-center.gap-2 {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }
    .image-card select.border.rounded.p-2 {
      border: 1px solid #d1d5db;
      border-radius: 0.25rem;
      padding: 0.5rem;
    }
     select optgroup[label="YouTube"] {
      color: #ff4081 !important;
      font-weight: bold;
    }
    select optgroup[label="Facebook"] {
      color: #2196f3 !important;
      font-weight: bold;
    }
     select optgroup[label="Instagram"] {
     color: #ef5350!important;
      font-weight: bold;
    }
     select optgroup[label="LInkedin"] {
      color: #0091ea !important;
      font-weight: bold;
    }
     select optgroup[label="Pinterest"] {
      color: #ec407a !important;
      font-weight: bold;
    }
     select optgroup[label="Snapchta"] {
      color: #ffb300 !important;
      font-weight: bold;
    }
     select optgroup[label="Blog/Website"] {
      color: #1de9b6 !important;
      font-weight: bold;
    }
     select optgroup[label="Google Ads"] {
      color: #f06292 !important;
      font-weight: bold;
    }
    .image-card button.bg-green-500 {
      background-color: #22c55e;
      color: #ffffff;
      padding-left: 1rem;
      padding-right: 1rem;
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
      border-radius: 0.25rem;
    }
    .image-card button.bg-green-500:hover {
      background-color: #16a34a;
    }
    #cropper-container.space-y-6 {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }