:root {
    --bulma-tabs-border-bottom-color: var(--bulma-scheme-main);
    --bulma-card-shadow: 0px -10px 20px rgba(0,0,0,0.25) !important;
    --bulma-scheme-main: #F8F8F0;

    --bulma-info-h: 200;
    --bulma-info-s: 100%;
    --bulma-info-l: 88%;

    --bulma-primary-h: 10;
    --bulma-primary-l: 83%;
    --bulma-primary-l: 47%;

    --bulma-link-h: 215;
    --bulma-link-l: 99%;
    --bulma-link-l: 35%;
}

.modal-background {
    --bulma-modal-background-background-color: var(--bulma-scheme-main);
}

.modal-close {
    --bulma-delete-color: black;
}

.tabs {
    /* Override full width border on tabs */
    --bulma-tabs-border-bottom-color: var(--bulma-scheme-main);
    --bulma-tabs-link-active-border-bottom-color: #DC3514;
    --bulma-tabs-link-active-color: #DC3514;
    
}

.h-mobile-search input {
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    height: 3rem;
    --bulma-input-placeholder-color: var(--bulma-text-strong);
}

.h-is-scrollable {
  overflow-x: scroll;
}

.h-is-scrollable.h-snap {
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
}

.h-snap-item {
  scroll-snap-align: start;
  scroll-snap-stop: always;
  flex: 0 0 80vw; /* each card ~80% viewport width on mobile */
}

.navbar.h-nav-static {
  min-height: 3rem;
}

.navbar.h-nav-static .h-logo {
  height: 1.5rem;
  width: 10rem;
  display: flex;
  
}

.h-card {
  width: 300px;
}

.h-truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.h-nav-sticky {
  position: sticky;
  top: 0;               /* sticks to top of viewport */
  z-index: 30;
}

/* Chrome / Safari / Edge */
.h-scroll-is-red::-webkit-scrollbar {
    height: 4px;            /* thin horizontal bar */
}

.h-scroll-is-red::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.08); /* subtle track */
}

.h-scroll-is-red::-webkit-scrollbar-thumb {
    background: #DC3514;    /* Hotelist Red */
    border-radius: 2px;
}

.h-scroll-is-red::-webkit-scrollbar-thumb:hover {
    background: #b82d12;    /* slightly darker red when touched */
}

/* Firefox */
.h-scroll-is-red {
  scrollbar-width: thin;
  scrollbar-color: #DC3514 rgba(0,0,0,0.08);
}

.h-image-fit img {
  object-fit: cover;
}

.h-is-rounded-corners {
  border-top-left-radius: 0.75rem;
  border-top-right-radius: 0.75rem;
  border-bottom-right-radius: 0.75rem;
  border-bottom-left-radius: 0.75rem;
}