.is-hidden { display: none; }
.thin-divider { width: 97%; height: 0; border: 0.5px solid #FEFEFE; }
.row-full-width { width: 100%; }

/* Index page specific navbar override */
.site-navbar {
    position: static !important;
    /* background-color: transparent !important; */
}

.hero-index {
  background-image: url('/images/hero.webp');
  background-color: #0000002b;
  color: #fff;
  height: 819px;
  background-size: cover;
  background-repeat: no-repeat;
  background-blend-mode: multiply;
}

/* New improved error alert styles */
.alert-error {
  position: fixed;
  top: 20px;
  right: 20px;
  left: auto;
  z-index: 999999;
  background: linear-gradient(135deg, #fff5f5 0%, #ffffff 100%);
  border: 2px solid #FC1923;
  border-radius: 12px;
  padding: 16px 20px;
  opacity: 0;
  display: none;
  max-width: 500px;
  min-width: 300px;
  width: auto;
  box-sizing: border-box;
  box-shadow: 0 8px 32px rgba(252, 25, 35, 0.15);
  backdrop-filter: blur(10px);
  transform: translateX(100%);
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.alert-error.show {
  display: block;
  opacity: 1;
  transform: translateX(0);
}

.alert-error.hide {
  opacity: 0;
  transform: translateX(100%);
}

.alert-error-text {
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
  color: #DC2626;
  margin: 0;
  word-break: break-word;
  overflow-wrap: anywhere;
  white-space: normal;
}

.alert-error-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: #FC1923;
  border-radius: 50%;
  margin-right: 12px;
  position: relative;
  vertical-align: middle;
}

.alert-error-icon::before,
.alert-error-icon::after {
  content: '';
  position: absolute;
  background: white;
  top: 50%;
  left: 50%;
}

.alert-error-icon::before {
  width: 2px;
  height: 10px;
  margin: -5px 0 0 -1px;
}

.alert-error-icon::after {
  width: 10px;
  height: 2px;
  margin: -1px 0 0 -5px;
}

/* Mobile responsive design */
@media (max-width: 480px) {
  .alert-error {
    left: 16px;
    right: 16px;
    width: auto;
    max-width: none;
    min-width: 0;
    top: 16px;
    padding: 14px 18px;
  }
  
  .alert-error-text {
    font-size: 15px;
    line-height: 1.4;
  }
  
  .alert-error-icon {
    width: 18px;
    height: 18px;
    margin-right: 10px;
  }
}

/* Legacy filter-error styles (keeping for backward compatibility) */
.filter-error-text {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.6;
  text-align: left;
  color: #FC1923;
  margin: 14px 18px;
  word-break: break-word;
  overflow-wrap: anywhere;
  white-space: normal;
}

.filter-error {
  position: fixed;
  top: 20px;
  right: 20px;
  left: auto;
  transform: translateY(-10px);
  z-index: 999999;
  background: #ffffff;
  border-right: 4px solid #FC1923;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  padding: 0;
  opacity: 0;
  display: none;
  max-width: 560px;
  min-width: 320px;
  width: auto;
  height: auto;
  min-height: 60px;
  box-sizing: border-box;
  overflow: hidden;
}

.filter-error.show {
  display: block;
  animation: filterErrorInRight 300ms ease-out forwards;
}

.filter-error.hide {
  animation: filterErrorOutRight 300ms ease-in forwards;
}

@keyframes filterErrorInRight {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes filterErrorOutRight {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-10px); }
}

@media (max-width: 480px) {
  .filter-error {
    left: 16px;
    right: 16px;
    width: auto;
    max-width: none;
    min-width: 0;
    padding: 0;
    top: 10px;
    overflow: visible;
  }
  
  .filter-error-text {
    font-size: 15px;
    line-height: 1.4;
    word-break: normal;
    overflow-wrap: normal;
  }
}

.red-text { color: red !important; }

.checkbox-row--flex {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.home-submitbutton {
  background-color: #FEFEFE;
  width: 222px;
  height: 60px;
  color: #00B5CC;
  float: right;
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-size: 32px;
  line-height: 7px;
}

.site-section--no-bottom { padding-bottom: 0 !important; }
.site-section--no-padding { padding: 0 !important; }
.justify-between { justify-content: space-between; }
.inline-block { display: inline; }
.card-link-btn { all: unset; display: block; cursor: pointer; text-align: left; }

.days--left { border-radius: 5px 0 0 5px; }
.days--right { border-radius: 0 5px 5px 0; }




/* Remove focus outlines from all elements */
* {
    outline: none !important;
}

/* Remove focus outlines from links and buttons */
a:focus, button:focus, input:focus, textarea:focus, select:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: initial !important;
}

/* Remove tap highlight on mobile */
* {
    -webkit-tap-highlight-color: transparent !important;
}
