/* ===== TABLET THEME PAGES STYLES ===== */
/* Tablet only (768px to 1023px) */

@media (min-width: 768px) and (max-width: 1023px) {

  /* ===================== */
  /* TABLET LAYOUT         */
  /* ===================== */
  .a-container {
    flex-direction: column;
    height: auto;
    min-height: 100vh;
    gap: 10px;
    padding: 10px;
  }

  /* ===================== */
  /* TABLET PANELS         */
  /* ===================== */
  #panel-a {
    order: 1;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto;
    height: auto;
    max-height: 40vh;
    overflow-y: auto;
  }

  #panel-a.expanded {
    max-height: 50vh;
  }

  #panel-b {
    order: 2;
    flex: 1;
    width: 100%;
    height: auto;
    max-height: 50vh;
    overflow-y: auto;
  }

  #panel-c {
    order: 3;
    flex: 1;
    width: 100%;
    height: auto;
    min-height: 40vh;
    max-height: none;
    overflow-y: auto;
  }

  /* ===================== */
  /* TABLET HEADERS        */
  /* ===================== */
  .left-header,
  .central-header,
  .right-header {
    height: 70px;
    padding: 8px 12px;
  }

  .navbar-title {
    font-size: 1.1rem;
  }

  /* ===================== */
  /* TABLET SELECTORS      */
  /* ===================== */
  .selector-container select,
  .selector-container .search-select {
    width: 250px;
    padding: 9px 40px 9px 18px;
    font-size: 0.95rem;
    background-size: 18px;
    background-position: right 12px center;
  }

  .selector-container label,
  .selector-container .search-label {
    font-size: 0.95rem;
  }

  .search-input-selector {
    width: 250px !important;
    padding: 9px 40px 9px 18px !important;
    font-size: 0.95rem !important;
  }

  .search-input-container .search-button {
    right: 12px;
  }

  .search-input-container .search-button i {
    font-size: 15px;
  }

  /* ===================== */
  /* TABLET SEARCH FORMS   */
  /* ===================== */
  .search-form {
    height: 36px;
  }

  .search-form input {
    padding: 7px 10px;
    font-size: 0.95rem;
  }

  .search-form .search-btn {
    padding: 0 10px;
    font-size: 0.95rem;
  }

  #cinemaSearchInput,
  #literatureSearchInput,
  #composerSearchInput {
    padding: 7px 16px;
    font-size: 0.95rem;
  }

  /* ===================== */
  /* TABLET NAVBAR         */
  /* ===================== */
  .nav-links {
    margin-left: 15px;
    gap: 12px;
  }

  .nav-item {
    margin: 0 8px;
  }

  .nav-link {
    font-size: 15px;
  }

  .dropdown-btn {
    padding: 0 12px;
    font-size: 15px;
  }

  /* ===================== */
  /* TABLET MOVIE DISCOVERY */
  /* ===================== */
  .movie-carousel {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .movie-card {
    max-height: 70px;
  }

  .movie-link {
    font-size: 0.85rem;
  }

  .movie-image {
    flex: 0 0 28px;
    height: 28px;
  }

  /* ===================== */
  /* TABLET TABLES         */
  /* ===================== */
  .mytable th,
  .mytable td {
    font-size: 1rem;
    padding: 8px 10px;
  }

  /* ===================== */
  /* TABLET ACCORDION      */
  /* ===================== */
  .accordion-header,
  .literary-header {
    padding: 10px 12px;
    font-size: 0.95rem;
  }

  .literary-content {
    padding-left: 16px;
  }

  .literary-list li {
    padding: 7px 0;
    font-size: 0.95rem;
  }

  /* ===================== */
  /* TABLET BUTTONS        */
  /* ===================== */
  .tiny-button {
    padding: 6px 12px;
    font-size: 11px;
    min-width: 55px;
    height: 26px;
  }

  /* ===================== */
  /* TABLET SCROLLING      */
  /* ===================== */
  .panel-content,
  .central-panel,
  .right-panel {
    overflow-y: auto;
    height: 100%;
    -webkit-overflow-scrolling: touch;
  }

  /* ===================== */
  /* HIDE MOBILE NAV       */
  /* ===================== */
  .mobile-nav-aids {
    display: none !important;
  }

  /* ===================== */
  /* TABLET SPECIFIC FIXES */
  /* ===================== */
  .search-group {
    margin-bottom: 8px;
  }

  .search-group .selector-container {
    margin-bottom: 0.8rem !important;
  }

  .search-group #actor-search,
  .search-group #director-search,
  .search-group .films-by-genre select {
    width: 100% !important;
    max-width: 300px;
  }

  /* Hide right panel dropdown on tablet if needed */
  .navbar-nav.right .dropdown {
    display: none;
  }
}