/* ================================================
    RESPONSIVE STYLES
================================================ */

@media (max-width: 767px) {
  body {
    margin: 0 0 70px;
  }

  /* Logo Styles */
  .logo img {
    width: 250px;
  }

  .content-box {
    margin: 0;
    border: 2px solid #fff;
    padding: 0;
  }

  .content-box .section {
    margin-top: 40px;
    max-width: unset;
  }

  .entry-form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .entry-form input {
    width: 100%;
  }

  .hosts-domain,
  .hosts-key {
    width: 90%;
  }

  .hosts-submit {
    margin-top: 5px;
    margin-bottom: 5px;
    width: 100%;
  }

  #domain,
  #key {
    width: 100%;
  }

  .plupload.section,
  .thupload.section {
    flex-direction: column;
    gap: unset;
  }

  #upload-container,
  #message-container {
    width: 100%;
  }

  .row {
    flex-direction: column;
  }

  #hosts_table table tr th:last-child,
  #hosts_table table tr td:last-child {
    width: 70px;
  }

  #Themes_table table tr th:last-child,
  #Themes_table table tr td:last-child,
  #plugins_table table tr th:last-child,
  #plugins_table table tr td:last-child {
    width: 100px;
  }

  #Themes_table table tr th:first-child,
  #Themes_table table tr td:first-child,
  #plugins_table table tr th:first-child,
  #plugins_table table tr td:first-child {
    max-width: 250px;
  }

  #Themes_table table tr td:first-child,
  #plugins_table table tr td:first-child {
    word-break: break-all;
  }

  .logout-btn {
    margin: 10px 0 10px auto;
  }

  .log-sub-box {
    width: 100%;
  }

  .log-sub-box > h3 {
    font-size: calc(1vw + 1em);
  }

  /* Adjust the logo size for smaller screens */
  .logo {
    width: 60%;
    height: auto;
  }

  /* Reduce the width of the login box for smaller screens */
  .login-box {
    width: 80%;
  }
}
