﻿  .feedback-input[type="email"], .feedback-input[type="text"], .feedback-input[type="file"] {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-family: Publico, serif;
    font-size: 16px;
    letter-spacing: 1px;
    
  }

  #feedbackEmail, #accountId, #feedbackType {
    width: 35%;
    min-width: 400px;
  }

  #feedbackDescription, #feedbackSummary{
    width: 65%;
    min-width: 400px;
  }

  #submitFeedback {
    font-family: Publico, serif;
    background-color: #1a95d4;
    color: white;
    border: none;
    padding: 15px 20px;
    border-radius: 6px;
    font-size: 16px;
    letter-spacing: 1px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    width: 200px;
  }
  

  .feedback-input-file{
    color: 'transparent';
    width: 150px;
    margin: 0;
  }

  .feedback-input-file::-webkit-file-upload-button {
      visibility: hidden;
  }

  .feedback-input-container-files{
    display: flex;
    flex-direction: column;
  }

  .feedback-input-file::before {
    font-family: Publico, serif;
    content: 'Choose files';
    display: inline-block;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    background-color: #1a95d4;
    color: white;
    border: none;
    padding: 15px 20px;
    border-radius: 6px;
    font-size: 16px;
    letter-spacing: 1px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    width: 150px;
  }

  small {
    margin-top: 20px;
  }

  .feedback-h1, .feedback-h2, button {
    user-select: none;
  }
  
  .feedback-h2 {
    margin-top: 30px;
  }

  #feedbackType {
      font-family: Publico, serif;
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 16px;
  }
  
  #submitFeedback:hover, .feedback-input-file:hover::before{
    background-color: #0356a5;
    transition: background-color 0.3s ease;
  }
  
  #submitFeedback:disabled {
    background-color: #9e9e9e;
    cursor: not-allowed;
  }
  
  .feedback-input[type="checkbox"] {
    margin-right: 10px;
  }
  
  .feedback-wrapper {
    padding: 20px;
    width: 100%;
    max-width: 1100px;
  }
  
  .feedback-h1 {
    padding-top:70px;
  }

  .feedback-h1, .feedback-h2 {
    font-family: Publico, serif;
  }
  
  .cofcopriv {
    font-family: Publico, serif;
    color: #1a95d4;
    text-decoration: none;
    transition: color 0.3s ease;
  }
  
  .cofcopriv:hover{
    color: #0356a5;
    transition: color 0.3s ease;
  }

  @media (max-width: 700px) {

    .feedback-wrapper{
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin: 0;
    }

    .feedback-input-container-files{
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 0;
      margin: 0;
    }

    .feedback-input-file{
      width: 300px;
    }

    .feedback-input-file::before{
      margin-left: 50%;
      transform: translate(-50%, 0%);
    }

    .feedback-h1 {
      font-size: 2em;
      margin-bottom: 0;
    }

    .feedback-h2 {
      font-size: 1.5em;
    }

    .feedback-input textarea, .feedback-input[type="email"], .feedback-input[type="text"], .feedback-input[type="file"] {
      font-size: 1em;
      text-align: center;
    }
  }
