/* AC-EXISTING-HEADER-R176 */
/* HOME ONLY: restore the original website header */

@media screen and (max-width:767px) {

  /* Hide experimental duplicate headers */
  html body #ac172-mobile,
  html body #ac171-mobile-header,
  html body .ac170-mobile-header,
  html body #ac-home-r173-shared {
    display:none !important;
  }

  /* Show original Angkor Connect header */
  html body section#myID.bottomMenu {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;

    position:sticky !important;
    top:0 !important;
    left:0 !important;
    z-index:99990 !important;

    width:100% !important;
    max-width:100% !important;
    height:66px !important;
    min-height:66px !important;

    margin:0 !important;
    padding:0 !important;

    background:#203650 !important;
    box-shadow:0 4px 12px rgba(0,0,0,.24) !important;
    box-sizing:border-box !important;
  }

  html body #myID .container.top-search-main,
  html body #myID .container.top-search-main > .row {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:66px !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }

  html body #myID .ts-menu {
    display:flex !important;
    flex-flow:row nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:9px !important;

    width:100% !important;
    height:66px !important;
    margin:0 !important;
    padding:7px 10px !important;
    background:#203650 !important;
    box-sizing:border-box !important;
  }

  /* Existing logo */
  html body #myID .ts-menu > .ts-menu-1 {
    display:flex !important;
    flex:0 0 57px !important;
    order:1 !important;
    align-items:center !important;
    width:57px !important;
    height:52px !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
  }

  html body #myID .ts-menu-1 a {
    display:block !important;
    width:100% !important;
  }

  html body #myID .ts-menu-1 img {
    display:block !important;
    width:57px !important;
    max-width:100% !important;
    height:auto !important;
    max-height:52px !important;
    object-fit:contain !important;
  }

  /* Desktop-only controls */
  html body #myID .ts-menu > .ts-menu-2,
  html body #myID .ts-menu > .ts-menu-4 {
    display:none !important;
  }

  /* Existing keyword search */
  html body #myID .ts-menu > .ts-menu-3 {
    display:block !important;
    flex:1 1 auto !important;
    order:2 !important;
    min-width:0 !important;
    width:auto !important;
    height:52px !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
  }

  html body #myID .ts-menu-3 > div,
  html body #myID #top_filter_form {
    display:block !important;
    width:100% !important;
    height:52px !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Hide province and submit icon in header;
     keep the original form functional. */
  html body #myID #top_filter_form
  > .input-field:first-child,
  html body #myID #top_filter_form
  > .input-field:nth-child(3) {
    display:none !important;
  }

  html body #myID #top_filter_form
  > .input-field:nth-child(2) {
    display:block !important;
    position:relative !important;
    float:none !important;
    width:100% !important;
    height:52px !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #myID input#top-select-search {
    display:block !important;
    width:100% !important;
    height:52px !important;
    min-height:52px !important;

    margin:0 !important;
    padding:0 12px 0 40px !important;

    background:#fff !important;
    color:#111 !important;
    border:0 !important;
    border-radius:5px !important;
    box-shadow:none !important;

    font-size:16px !important;
    box-sizing:border-box !important;
  }

  html body #myID
  #top_filter_form > .input-field:nth-child(2)::before {
    content:"" !important;
    position:absolute !important;
    z-index:2 !important;
    left:14px !important;
    top:15px !important;
    width:15px !important;
    height:15px !important;
    border:2px solid #1b2430 !important;
    border-radius:50% !important;
    pointer-events:none !important;
  }

  html body #myID
  #top_filter_form > .input-field:nth-child(2)::after {
    content:"" !important;
    position:absolute !important;
    z-index:2 !important;
    left:29px !important;
    top:31px !important;
    width:10px !important;
    height:2px !important;
    background:#1b2430 !important;
    transform:rotate(45deg) !important;
    pointer-events:none !important;
  }

  html body #myID
  label.search-hotel-type:not(.active) {
    left:42px !important;
    top:50% !important;
    margin:0 !important;
    color:#151515 !important;
    font-size:16px !important;
    transform:translateY(-50%) !important;
    pointer-events:none !important;
  }

  /* Reuse original mobile hamburger and its JS */
  html body #myID .ts-menu > .ts-menu-5 {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    flex:0 0 44px !important;
    order:3 !important;

    width:44px !important;
    height:50px !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
  }

  html body #myID .ts-menu-5 > span {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:43px !important;
    height:43px !important;
    border-radius:50% !important;

    background:#2c4588 !important;
    color:#fff !important;
    box-shadow:0 3px 8px rgba(0,0,0,.25) !important;
    cursor:pointer !important;
  }

  html body #myID .ts-menu-5 .fa {
    color:#fff !important;
    font-size:21px !important;
  }
}

@media screen and (max-width:350px) {
  html body #myID .ts-menu {
    gap:7px !important;
    padding:7px 8px !important;
  }

  html body #myID .ts-menu > .ts-menu-1 {
    flex-basis:51px !important;
    width:51px !important;
  }

  html body #myID .ts-menu-1 img {
    width:51px !important;
  }
}



/* AC-R177-TOP-FIX-START
   Existing homepage header only.
   No new header HTML or JavaScript.
*/

@media screen and (max-width:767px) {

  /* Reserve space above homepage hero */
  html body:has(section#myID.bottomMenu) {
    padding-top:66px !important;
  }

  /* Move existing header visually to screen top */
  html body section#myID.bottomMenu.dir-il-top-fix {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;

    position:fixed !important;
    top:0 !important;
    right:0 !important;
    bottom:auto !important;
    left:0 !important;

    z-index:99990 !important;

    width:100% !important;
    max-width:100vw !important;
    height:66px !important;
    min-height:66px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    background:#203650 !important;
    box-shadow:0 4px 14px rgba(0,0,0,.20) !important;

    box-sizing:border-box !important;
  }

  /* Keep original header contents aligned */
  html body #myID .container.top-search-main,
  html body #myID .container.top-search-main > .row,
  html body #myID .ts-menu {
    height:66px !important;
    max-height:66px !important;
  }

  /* Hide only previously generated experimental headers */
  html body #ac172-mobile,
  html body #ac171-mobile-header,
  html body .ac170-mobile-header,
  html body #ac-home-r173-shared {
    display:none !important;
  }

  html {
    scroll-padding-top:70px;
  }
}

/* AC-R177-TOP-FIX-END */



/* AC-R192-ANTI-FLICKER */
/* Homepage-only stylesheet, mobile first paint */

@media screen and (max-width:767px) {

  /* Keep the header at the top from its first render. */
  html body {
    padding-top:66px !important;
  }

  html body #myID.bottomMenu {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    bottom:auto !important;

    width:100% !important;
    max-width:100% !important;
    height:66px !important;
    min-height:66px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;
    z-index:99990 !important;

    background:#203650 !important;
    box-sizing:border-box !important;
  }

  /* Suppress the old lower-page header while its
     original element has not yet moved to body top. */
  html body section#myID.bottomMenu {
    visibility:hidden;
    animation:ac192-header-fallback 0s 3s forwards;
  }

  html body > section#myID.bottomMenu:first-child {
    visibility:visible !important;
    animation:none !important;
  }

  @keyframes ac192-header-fallback {
    to { visibility:visible; }
  }

  /* Stable navy header space during initialization. */
  html body::before {
    content:"";
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:66px;
    background:#203650;
    z-index:99980;
    pointer-events:none;
  }

  /* Remove the old full-page loading overlay. */
  html body #hpreloader,
  html body #preloader {
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  /* Stable hamburger without waiting for icon fonts. */
  html body #myID .ts-menu-5 .fa::before {
    content:"☰" !important;
    font-family:Arial,sans-serif !important;
    font-size:24px !important;
    color:#fff !important;
  }

  /* Prevent the existing promo cards from appearing
     stacked briefly before the saved layout loads. */
  html:not(.ac192-cards-ready) body
  .row:has(> .col-md-3 .hom-pro) {
    visibility:hidden;
    animation:ac192-cards-fallback 0s 3s forwards;
  }

  html.ac192-cards-ready body
  .row:has(> .col-md-3 .hom-pro) {
    visibility:visible !important;
    animation:none !important;
  }

  @keyframes ac192-cards-fallback {
    to { visibility:visible; }
  }
}

@media(prefers-reduced-motion:reduce) {
  html body #myID.bottomMenu,
  html body .hom-pro {
    transition:none !important;
  }
}

/* END AC-R192-ANTI-FLICKER */