/* 
   -CONTENT:
   ---------
   -VARIABLES
   -FORM STYLE
*/

/* -VARIABLES */
:root{
   --bs-primary: #071f41;
   --bs-primary-rgb: 5, 22, 45;
   /* --bs-btn-bg */
}

/* .btn:hover {
   color: #05162D;
} */

/* .btn-primary{
   --bs-btn-bg: #05162D;
   --bs-btn-border-color: #05162D;
   --bs-btn-hover-bg: #;
   --bs-btn-hover-border-color: #05162D;
   --bs-btn-focus-shadow-rgb: 5, 22, 45;
   --bs-btn-active-border-color: #05162D;
   --bs-btn-disabled-bg: #05162D;
   --bs-btn-disabled-border-color: #05162D;
} */

/* .btn-outline-primary {
   --bs-btn-color:#05162D;
   --bs-btn-border-color: #05162D;
   --bs-btn-hover-bg: #253852;
   --bs-btn-hover-border-color: #253852;
   --bs-btn-focus-shadow-rgb: 5, 22, 45;
   --bs-btn-active-border-color: #05162D;
   --bs-btn-disabled-bg: #05162D;
   --bs-btn-disabled-border-color: #05162D;
} */


/* -FORM STYLE */ 
.bmh-form-kit { 
   label {font-size: 16px; font-weight: 700;}
   input {
      margin-bottom: 20px;
      border: solid 1px #ddd !important;
      box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.12);
   }

   /* Hide the default checkbox */
   .custom-checkbox input {
      position: absolute;
      opacity: 0;
      cursor: pointer;
   }

   /* Create custom box */
   .custom-checkbox .checkmark {
      position: relative;
      height: 20px;
      width: 20px;
      background-color: #fff;
      border-radius: 4px;
      display: inline-block;
      margin-right: 8px;
      vertical-align: middle;
   }

   /* When checked */
   .custom-checkbox input:checked+.checkmark {
      background-color: var(--e-global-color-secondary);
   }

   /* Add tick mark */
   .custom-checkbox .checkmark::after {
      content: "";
      position: absolute;
      display: none;
   }

   .custom-checkbox input:checked+.checkmark::after {
      display: block;
   }

   .custom-checkbox .checkmark::after {
      left: 6px;
      top: 2px;
      width: 6px;
      height: 12px;
      border: solid var(--e-global-color-accent);
      border-width: 0 2px 2px 0;
      transform: rotate(45deg);
   }
   
   /* .btn {
      display: inline-block;
      padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x) !important;
      font-family: var(--bs-btn-font-family)!important;
      font-size: var(--bs-btn-font-size)!important;
      font-weight: var(--bs-btn-font-weight)!important;
      line-height: var(--bs-btn-line-height)!important;
      color: var(--bs-btn-color)!important;
      border: var(--bs-btn-border-width) solid var(--bs-btn-border-color) !important;
      border-radius: var(--bs-btn-border-radius) !important;
      background-color: var(--bs-btn-bg) !important;
   } */
   
}

#user-account-page{
   a {text-decoration: none !important;}

   .bmh-my-account-main-menu{
      a {font-size:medium; font-weight: 700;}
   }

   #user-profile-view {
      p:not(.lead) {font-size: medium;}
   }
}

/* MARQUEE */
.marquee-wrapper {
   width: 100%;
   overflow: hidden;
   white-space: nowrap;
   box-sizing: border-box;
   --marquee-speed: 1000s;
}

.marquee-left {
   display: inline-block;
   padding-right: 100%;
   animation: scroll-left var(--marquee-speed) linear infinite;
}

@keyframes scroll-left {
   0% {
      transform: translateX(0%);
   }

   100% {
      transform: translateX(-50%);
   }
}

.marquee-right {
   display: inline-block;
   padding-left: 100%;
   animation: scroll-right var(--marquee-speed) linear infinite;
}

@keyframes scroll-right {
   0% {
      transform: translateX(-50%);
   }

   100% {
      transform: translateX(0%);
   }
}

/* PROPERTY CAROUSEL */
.bmh-carousel-container {
   position: relative;
   width: 100%;
   margin: 20px auto;
   overflow: hidden;
}

.bmh-carousel-wrapper {
   overflow: hidden;
   width: 100%;
}

.bmh-carousel-track {
   display: flex;
   transition: transform 0.5s ease;
   gap:10;
}

.bmh-carousel-item {
   /* Items visibles */
   /* flex: 0 0 <?php echo 100 / (int)$atts['phone-visible'] ?>%; */
   box-sizing: border-box;
   position: relative;

   @media only screen and (min-width: 769px) {
      flex: 0 0 50%
   }

   @media only screen and (min-width: 1025px) {
      flex: 0 0 100%;
   }

   h3 {
      color: white;
   }

   .item-container {
      overflow: hidden;

      * {
         z-index: 1;
      }

      &.layout-1:hover::after {
         visibility: visible;
      }

      &.layout-1::after {
         content: '';
         width: 100%;
         height: 100%;
         background-color: rgba(0, 0, 0, 0.2);
         position: absolute;
         top: 0;
         z-index: 0;
         border-radius: 16px;
         visibility: hidden;
      }
   }
}

.bmh-carousel-btn {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   border: none;
   cursor: pointer;
   z-index: 5;
   opacity: 0.5;
}

.bmh-carousel-btn:hover {
   opacity: 1;
}

.bmh-prev {
   left: 10px;
}

.bmh-next {
   right: 10px;
}

.bmh-table {
   /* overflow: hidden; */
   border-collapse: separate;
   border-spacing: 0;
   font-size: 14px;
   .thumb {
      width: 70px;
      height: 70px;
      background-color: #CCC;
      display: inline-block;
      vertical-align: middle;
      margin-right: 10px;
      object-fit: cover;
   }

   thead { 
      th {

            border: none !important;
            padding: 20px 15px;
            background-color: var(--e-global-color-secondary);
            color: var(--e-global-color-accent);
            position: relative;

            &:not(:last-child):after {
               margin-top: 6px;
               content: '';
               width: 1px;
               height: 10px;
               border-left: solid 1px white;
               position: absolute;
               right: 0px;
            }
         }
   }

   tbody {
      /* border: none; */
      th, td {
         vertical-align: middle;
         /* border: none !important; */
      }
      tr:last-child {
         th, td:first-child {
            border-bottom-left-radius: 10px;
         }
         td:last-child {
            border-bottom-right-radius: 10px;
         }
      }
   }
}