/**
 * EMERGENCY CSS FOR HOTEL GUIDE
 * This must load absolutely last and force visibility
 */

/* FORCE VISIBILITY OF SEARCH FORM - SCOPED TO HOTEL GUIDE ONLY */
.search-view-with-facets.view-hotel-guide .view-filters,
.view-hotel-guide .view-filters {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 100 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 0 2rem 0 !important;
  box-shadow: none !important;
  transform: none !important;
  height: auto !important;
  width: auto !important;
  overflow: visible !important;
}

/* FORCE FORM VISIBILITY */
#views-exposed-form-hotel-guide-page-1,
.view-hotel-guide .views-exposed-form,
.view-hotel-guide form,
.search-view-with-facets.view-hotel-guide form {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 101 !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  align-items: flex-end !important;
  max-width: 1200px !important;
  margin: 0 auto 2rem !important;
  padding: 2rem !important;
  background: #fff !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
  height: auto !important;
  width: auto !important;
  transform: none !important;
  overflow: visible !important;
}

/* FORCE ALL FORM ELEMENTS VISIBLE */
.view-hotel-guide .form-item,
.view-hotel-guide .form-actions,
.view-hotel-guide input,
.view-hotel-guide select,
.view-hotel-guide label {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 102 !important;
}

/* FORCE SEARCH INPUT VISIBLE */
#edit-search,
.view-hotel-guide input[type="text"],
.view-hotel-guide input[type="search"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  padding: 0.75rem 1rem !important;
  border: 1px solid #d4d4d4 !important;
  border-radius: 0.375rem !important;
  background: #fff !important;
  color: #000 !important;
  height: auto !important;
}

/* FORCE BUTTONS VISIBLE */
#edit-submit-hotel-guide,
#edit-reset-hotel-guide,
.view-hotel-guide input[type="submit"],
.view-hotel-guide input[type="reset"],
.view-hotel-guide button[type="reset"] {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0.75rem 2rem !important;
  background: #1a1a1a !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0.375rem !important;
  cursor: pointer !important;
  height: auto !important;
  width: auto !important;
  margin: 0 0.5rem 0 0 !important;
  transition: background 0.2s ease !important;
}

/* Reset button secondary style */
#edit-reset-hotel-guide,
.view-hotel-guide input[type="reset"],
.view-hotel-guide button[type="reset"] {
  background: #6b7280 !important;
}

/* Hover states */
.view-hotel-guide input[type="submit"]:hover {
  background: #333 !important;
}

.view-hotel-guide input[type="reset"]:hover,
.view-hotel-guide button[type="reset"]:hover {
  background: #4b5563 !important;
}

/* SEARCH FIELD CONTAINER */
.view-hotel-guide .form-item-search {
  flex: 1 1 300px !important;
  min-width: 250px !important;
}

/* HIDE SORT FIELDS */
.view-hotel-guide .form-item-sort-by,
.view-hotel-guide .form-item-sort-order {
  display: none !important;
}

/* ========================================
   MOBILE LAYOUT FOR HOTEL GUIDE
   ======================================== */
@media (max-width: 768px) {
  /* Compact container */
  .view-hotel-guide .view-filters {
    padding: 0 !important;
    margin: 0 0 1rem 0 !important;
  }

  /* Compact form - row layout */
  .view-hotel-guide .views-exposed-form,
  .view-hotel-guide form {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 12px !important;
    margin: 0 !important;
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  }

  /* Search field - takes remaining space */
  .view-hotel-guide .form-item-search {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Hide labels */
  .view-hotel-guide label {
    display: none !important;
  }

  /* Compact input */
  .view-hotel-guide input[type="text"],
  .view-hotel-guide input[type="search"] {
    height: 44px !important;
    padding: 0 14px !important;
    font-size: 16px !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 8px !important;
  }

  /* Button wrapper - auto width */
  .view-hotel-guide .form-actions {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Compact button */
  .view-hotel-guide input[type="submit"],
  .view-hotel-guide .form-submit {
    height: 44px !important;
    padding: 0 20px !important;
    margin: 0 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
  }
}