.text-custom {
  @apply text-[#606060] font-cairo font-normal  text-[14px];
}

.slick-dots li button:before,
.slick-dots li.slick-active button:before {
  color: transparent !important;
}

.ant-carousel .slick-dots {
  z-index: 0;
}

.ant-carousel .slick-dots li button {
  background-color: #fff !important;
}

.ant-carousel .slick-dots li.slick-active button {
  background-color: #fff !important;
}

/* Blogs Slider Styles */
.blogs-slider .slick-dots {
  bottom: -40px !important;
}

.blogs-slider .slick-dots li button {
  background-color: #d1d5db !important;
  border-radius: 50% !important;
  width: 8px !important;
  height: 8px !important;
}

.blogs-slider .slick-dots li.slick-active button {
  background-color: #3c5355 !important;
}

.blogs-slider .slick-dots li {
  margin: 0 4px !important;
}

/* Equal height for all blog cards */
.blogs-slider .slick-track {
  display: flex !important;
  align-items: stretch !important;
}

.blogs-slider .slick-slide {
  display: flex !important;
  align-items: stretch !important;
  height: auto !important;
  pointer-events: auto !important;
}

.blogs-slider .slick-slide > div {
  height: 100%;
  display: flex;
  flex-direction: column;
  pointer-events: auto !important;
  position: relative;
  z-index: 1;
}

.blogs-slider .blog-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  pointer-events: auto !important;
  position: relative;
  z-index: 2;
}

.blogs-slider .blog-card .ant-card-body {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  pointer-events: auto !important;
}

.blogs-slider .blog-card a {
  pointer-events: auto !important;
  position: relative;
  z-index: 3;
}

/* RTL Support for Blog Cards */
.blog-card.rtl {
  direction: rtl;
}

.blog-card.rtl .ant-card-body {
  text-align: right;
}

.blog-card.ltr {
  direction: ltr;
}

.blog-card.ltr .ant-card-body {
  text-align: left;
}

/* Line clamp utilities */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Responsive adjustments for different screen sizes */
@media (max-width: 768px) {
  .blogs-slider .slick-slide > div {
    padding: 0 8px;
  }
}

@media (max-width: 480px) {
  .blogs-slider .slick-slide > div {
    padding: 0 12px;
  }
}

.ant-float-btn-icon svg {
  width: 100%;
}

.ant-float-btn .ant-float-btn-body .ant-float-btn-content .ant-float-btn-icon {
  width: 25px;
}

[dir="rtl"] .ant-btn svg {
  margin-top: 2px !important;
}

[dir="rtl"] .ant-btn svg {
  margin-top: 4px !important;
}

.svg svg {
  width: 150px;
  height: 200px;
}

.app__title_ar {
  background: linear-gradient(270deg, #182f30 -100%, #3c5355 100%);
  -webkit-clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
  clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}

.app__title_en {
  background: linear-gradient(270deg, #3c5355 100%, #182f30 50%);
  -webkit-clip-path: polygon(0% 0%, 80% 0%, 100% 100%, 0% 100%);
  clip-path: polygon(0% 0%, 80% 0%, 100% 100%, 0% 100%);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}

@media screen and (width < 767px) {
  .app__title_en {
    -webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 75% 0%, 100% 100%, 0% 100%);
  }
}

.app__title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  width: 301px !important;
  height: 52px !important;
  overflow: hidden !important;
}

@media screen and (width < 767px) {
  .app__title {
    width: 200px !important;
    height: 50px !important;
  }
}

.app__title h1, .app__title h3 {
  height: 40px;
  color: #fff;
  font-size: 20px;
  font-style: normal;
  line-height: normal;
  display: flex;
  align-items: center;
  padding: 25px 0;
  justify-content: center;
}

@media screen and (width <=767px) {
  .app__title h3 {
    font-size: 16px;
  }
}

.app__title2 {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}

.app__title2 h1, .app__title2 h3 {
  color: #37474f;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 4px;
}

@media screen and (width <=767px) {
  .app__title2 h1, .app__title2 h3 {
    font-size: 16px;
  }
}

.app__title2 .after {
  background-color: var(--color-secondary);
  width: 10px;
  height: 30px;
  border-radius: 5px;
}

/* Global  design */
.reservation-bg-container {
  background-image: url("/assets/Images/bg_app_reservation.png");
  background-repeat: no-repeat;
  background-size: cover;
}

.content_data {
  color: #676767;
  font: 12px "__Cairo_82721f" !important;
  text-shadow: 1px 1px hsla(0, 0%, 100%, 0), -1px -1px hsla(0, 0%, 100%, 0),
    1px -1px hsla(0, 0%, 100%, 0), -1px 1px hsla(0, 0%, 100%, 0);
}

.content_data2 {
  color: #676767;
  font: 11px "__Cairo_82721f" !important;
  margin-top: 0.5px;
  text-shadow: 1px 1px hsla(0, 0%, 100%, 0), -1px -1px hsla(0, 0%, 100%, 0),
    1px -1px hsla(0, 0%, 100%, 0), -1px 1px hsla(0, 0%, 100%, 0);
}

/* global style overrides */
.custom_field .ant-input,
.custom_field .ant-select-selector,
.custom_field .ant-picker,
.custom_field .ant-picker-input > input {
  height: 45px !important;
}

.ant-input,
.ant-select-selector,
.ant-picker,
.ant-input-affix-wrapper,
.ant-picker-input > input {
  border-radius: 4px !important;
}

.ant-input:focus,
.ant-input-affix-wrapper:focus,
/* .ant-input-affix-wrapper, */
.ant-select-focused .ant-select-selector,
.ant-picker-focused {
  border-color: #fff !important;
  box-shadow: 0 0 0 2px rgba(3, 12, 11, 0.31) !important;
}

.custom_field .ant-select .ant-select-arrow {
  margin-top: 0;
}

.ant-input-outlined:focus,
.ant-input-outlined:focus-within {
  border-color: #fff !important;
  box-shadow: 0 0 0 2px rgba(3, 12, 11, 0.31) !important;
}

.ant-picker-dropdown
  .ant-picker-time-panel-column
  > li.ant-picker-time-panel-cell-selected
  .ant-picker-time-panel-cell-inner,
.ant-select-dropdown
  .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
  color: #fff;
}

.ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {
  font-size: 10px;
}
@media screen and (width < 767px) {
  .ant-picker-content th {
    font-size: 8px !important;
  }
}
.ant-message-notice-content > div,
.ant-notification-notice-description,
.ant-notification-notice-message {
  font-family: var(--font-cairo, 'Cairo', sans-serif) !important;
}

.otp_input .ant-otp-input-wrapper .ant-input {
  height: 50px !important;
  width: 50px !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  text-align: center !important;
  border-radius: 10px !important;
  background-color: #fff !important;
  color: var(--color-main) !important;
}

/* RTL Carousel Fixes */
.rtl-carousel .slick-list {
  direction: rtl !important;
}

.ltr-carousel .slick-list {
  direction: ltr !important;
}

/* .ant-btn-variant-solid:disabled,
.ant-btn-variant-solid.ant-btn-disabled {
  color: #fff !important;
  background-color: #162a2bc7 !important;
} */

/* Custom Error Message Styling */
.ant-form-item-explain-error {
  color: rgb(255, 77, 79) !important;
  font-family: var(--font-cairo, 'Cairo', sans-serif) !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 22px !important;
  margin-top: 8px !important;
  margin-bottom: 0 !important;
  text-align: right !important;
}

.ant-form-item-explain-error::before {
  display: none !important;
}

/* Error state for input fields */
.ant-form-item-has-error .ant-input,
.ant-form-item-has-error .ant-input:focus,
.ant-form-item-has-error .ant-input-focused {
  border-color: rgb(255, 77, 79) !important;
  box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2) !important;
}

/* Phone input error styling */
.ant-form-item-has-error .react-international-phone-input-container {
  border-color: rgb(255, 77, 79) !important;
}

.ant-form-item-has-error
  .react-international-phone-input-container:focus-within {
  border-color: rgb(255, 77, 79) !important;
  box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2) !important;
}

.ant-form-item-has-error .ant-input,
.ant-form-item-has-error .ant-input:focus,
.ant-form-item-has-error .ant-input-focused {
  box-shadow: none !important;
}

/* Button disabled styling */
.ant-btn-variant-solid:disabled,
.ant-btn-variant-solid.ant-btn-disabled {
  color: #fff !important;
  background-color: #0a0e0ec7 !important;
}

@media screen and (width < 767px) {
  .ant-select-item-option-content {
    font-size: 12px !important;
  }
  .DeliveryLocation .ant-form-item {
    margin: 0;
  }
}