/*  Mobile mode threshold:  1300px */

  /* Desktop (1300px and up): keep desktop nav visible, hide mobile menu */
  @media (min-width: 1300px) {

    .mobile_menu { display: none !important; }

    /* header socials & topbar translate visible */
    #lp-topbar .social_media_links { display: flex !important; }
    #gt-li { display: flex !important; }

    /* hide the nav translate item on desktop */
    #gt-mobile-nav { display: none !important; }
  }

  /* Mobile/Tablet (less than 1300px): show mobile hamburger, hide desktop nav */
  @media (max-width: 1299.98px) {
    #navigation { display: none !important; }
    .mobile_menu { display: block !important; }

    /* hide header social icons and desktop GT on mobile */
    #lp-topbar .social_media_links { display: none !important; }
    #gt-li { display: none !important; }

    /* we are NOT using this nav slot anymore on mobile */
    #gt-mobile-nav { display: none !important; }

    /* Topbar wrap/right-align items so nothing overlaps */
    #lp-topbar .short_contact_list ul {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 14px;
      justify-content: flex-end;
      margin: 0;
      padding: 0;
    }

    /* Show the EN/FR toggle bar on mobile */
    #gt-mobile-topbar-slot {
      display: flex !important;
      align-items: center;
      justify-content: flex-end;
    }

    /* Compact logo */
    .logo img { width: 100px !important; height: 100px !important; }
    .logo span { font-size: 26px !important; }
    .logo small { font-size: 12px !important; }

    /* Header paddings a bit tighter */
    .main-header-area .container-fluid {
      padding-left: 16px;
      padding-right: 16px;
    }

    /* If we ever put GT widget in nav again, keep it compact */
    #gt-mobile-nav #google_translate_element{
      --gt-height: 28px;
      padding: 2px 6px;
      border-radius: 10px;
      font-size: 12px;
      margin: 6px 0;
    }
    #gt-mobile-nav #google_translate_element .goog-te-combo{
      height: calc(var(--gt-height) - 6px);
      font-size: 12px !important;
      max-width: 120px;
      min-width: 100px;
      padding: 0 14px 0 22px !important;
    }
    #gt-mobile-nav #google_translate_element::after{
      right: 6px;
      width: 6px;
      height: 4px;
    }
    #gt-mobile-nav #google_translate_element::before{
      left: 6px;
      width: 12px;
      height: 12px;
      background-size: 12px 12px;
    }
  }


  /* --- Simple collage styles (kept) ------------------------------------------ */
  #ns-slideShowContainer {
    margin: 0 auto;
    font-family: Arial, sans-serif;
    background: #f8f8f8;
    padding: 20px 0;
  }
  #ns-collageSlideshow {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 250px);
    gap: 10px;
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
  }
  .ns-cell {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
  }
  .ns-cell img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transform: scale(1);
    transition: opacity 1.5s ease-in-out, transform 10s ease-in-out;
    border-radius: 12px;
  }
  .ns-cell img.ns-active {
    opacity: 1;
    transform: scale(1.08);
  }
  #ns-thumbnailBar {
    width: 90%;
    max-width: 1000px;
    margin: 20px auto;
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
  }
  #ns-thumbnailBar img {
    width: 80px;
    height: 60px;
    object-fit: cover;
    cursor: pointer;
    opacity: 0.6;
    border-radius: 8px;
    transition: opacity 0.3s, transform 0.3s;
    border: 2px solid transparent;
  }
  #ns-thumbnailBar img.ns-thumbActive,
  #ns-thumbnailBar img:hover {
    opacity: 1;
    transform: scale(1.05);
    border-color: #FFD500;
  }

  /* === Modern Google Translate UI — base === */
  :root{
    --gt-height: 32px;          /* updated base (compact) */
    --gt-radius: 12px;
    --gt-accent: #390408;
    --gt-bg: #ffffff;
    --gt-bg-muted: #f6f6f6;
    --gt-shadow: 0 2px 8px rgba(0,0,0,.10);
  }

  /* Real host for Google widget */
  #google_translate_element{
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: var(--gt-radius);
    background: linear-gradient(180deg, var(--gt-bg), var(--gt-bg-muted));
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: none;
    opacity: 1;
    transition: transform .18s ease-out;
    position: relative;   /* for caret & stacking */
    z-index: 1004;        /* ensure above neighbors */
    pointer-events: auto; /* explicitly allow clicks */
    font-size: 13px;
  }
  #google_translate_element:hover{
    transform: translateY(-1px);
  }

  /* Make the select modern */
  #google_translate_element .goog-te-gadget{
    display: contents !important;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial !important;
    font-weight: 600;
    color: var(--gt-accent);
  }
  #google_translate_element .goog-te-combo{
    height: calc(var(--gt-height) - 8px);
    border: 0 !important;
    background: transparent !important;
    color: var(--gt-accent) !important;
    padding: 0 18px 0 24px !important;
    border-radius: 8px;
    font: inherit !important;
    line-height: 1 !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    max-width: 150px;
    min-width: 110px;
  }

  /* Down caret */
  #google_translate_element::after{
    content:"";
    position:absolute;
    right:8px;
    top:50%;
    transform:translateY(-50%);
    width:6px;
    height:4px;
    background: currentColor;
    color: var(--gt-accent);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    opacity:.75;
    pointer-events:none;
  }

  /* Hide branding image, keep dropdown */
  .goog-logo-link,
  .goog-te-gadget img{
    display:none !important;
  }
  .goog-te-gadget-simple{
    background:transparent !important;
    border:0 !important;
    padding:0 !important;
    margin:0 !important;
  }

  /* Minimal globe icon (you decided to hide this later) */
  #google_translate_element::before{
    content:"";
    position:absolute;
    left:8px;
    top:50%;
    transform:translateY(-50%);
    width:14px;
    height:14px;
    opacity:.8;
    pointer-events:none;
    background-repeat:no-repeat;
    background-size:14px 14px;
    background-image: url('data:image/svg+xml;utf8,<svg width="14" height="14" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="9" stroke="%23390408" stroke-width="1.5"/><path d="M3 12h18M12 3c-3.5 3.2-3.5 14.8 0 18M12 3c3.5 3.2 3.5 14.8 0 18" stroke="%23390408" stroke-width="1.2"/></svg>');
  }

  /* ================================
     HERO SLIDESHOW (Swiper)
     ================================ */
  #lp-slider{
    position:relative;
    min-height:550px;
    overflow:hidden;
  }
  #lp-slider-swiper{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none; /* clicks don't get eaten */
  }
  #lp-slider-swiper .swiper-wrapper,
  #lp-slider-swiper .swiper-slide{
    width:100%;
    height:100%;
  }
  #lp-slider-swiper img{
    width:100%;
    height:100%;
    object-fit:cover;
  }
  #lp-slider-swiper .swiper-button-prev,
  #lp-slider-swiper .swiper-button-next,
  #lp-slider-swiper .swiper-pagination{
    pointer-events:auto;
  }
  #lp-slider::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.35);
    z-index:2;
    pointer-events:none;
  }
  #lp-slider .slider_text{
    position:relative;
    z-index:3;
    color:#fff;
  }
  @media (max-width:768px){
    #lp-slider{ min-height:420px; }
    #lp-slider .slider_text h3{
      font-size:32px;
      line-height:1.2;
    }
    #lp-slider .slider_text p{
      font-size:16px;
    }
  }

  .single_slider.overlay2{
    position:relative !important;
    z-index:0 !important;
  }
  .single_slider.overlay2::before{
    content:"";
    position:absolute !important;
    inset:0 !important;
    background-color:#390408 !important;
    opacity:.38 !important;
    z-index:2 !important;
    pointer-events:none !important;
  }
  .single_slider.overlay2 > #lp-slider-swiper{
    position:absolute !important;
    inset:0 !important;
    z-index:1 !important;
    overflow:hidden;
  }
  .single_slider.overlay2 .slider_text{
    position:relative !important;
    z-index:3 !important;
    color:#fff;
  }

  /* ================================
     Header Topbar: no-overlap, aligned
     ================================ */
  .header-area,
  .header-top_area,
  #lp-topbar {
    position: relative;
    z-index: 1003;
  }
  #lp-slider-swiper {
    z-index: 1;
    pointer-events: none;
  }
  .single_slider.overlay2::before {
    z-index: 2;
    pointer-events: none;
  }

  @media (min-width: 992px) {
    #lp-topbar .container-fluid > .row {
      display: flex;
      align-items: center;
    }
    #lp-topbar .short_contact_list ul {
      display: flex;
      align-items: center;
      gap: 28px;
      margin: 0;
      padding: 0;
      flex-wrap: nowrap;
    }
    #lp-topbar .short_contact_list ul li {
      display: flex;
      align-items: center;
      white-space: nowrap;
    }
    #lp-topbar .short_contact_list ul li i {
      font-size: 14px;
      line-height: 1;
    }
    #lp-topbar li#gt-li {
      margin-left: 16px;
    }
    #lp-topbar .social_media_links {
      margin-left: auto;
      display: flex !important;
      align-items: center;
      justify-content: flex-end;
      gap: 12px;
      flex-wrap: nowrap;
      padding-right: 0;
    }
    #lp-topbar .social_media_links a {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      line-height: 1;
    }
    #lp-topbar #google_translate_element {
      margin-top: -4px;
    }
  }

  @media (max-width: 991.98px) {
    #lp-topbar .short_contact_list ul {
      display: flex;
      flex-wrap: wrap;
      gap: 12px 16px;
      justify-content: flex-end;
    }
    #lp-topbar li#gt-li {
      margin-left: auto;
    }
    .header-top_area .social_media_links {
      justify-content: flex-end;
    }
  }

  /* === Remove globe + small caret from Google Translate (final preference) === */
  #google_translate_element::before,
  #google_translate_element::after {
    content: none !important;
    display: none !important;
  }
  #google_translate_element {
    padding: 4px 8px !important;
  }
  #google_translate_element .goog-te-combo {
    padding: 0 10px !important;
  }

  #gt-mobile-nav #google_translate_element::before,
  #gt-mobile-nav #google_translate_element::after {
    content: none !important;
    display: none !important;
  }
  #gt-mobile-nav #google_translate_element .goog-te-combo {
    padding: 0 10px !important;
  }

  @media (min-width: 992px) {
    #footer-contacts-col { margin-left: auto; }
    #footer-contacts-col .footer_widget { text-align: right; }
    #footer-contacts-col .contacts p { margin-left: auto; }
  }
  
  /* =======================================
     MOBILE EN | FR LANGUAGE TOGGLE
     ======================================= */
  @media (max-width: 1299.98px) {

    /* Toggle wrapper */
    #lp-lang-toggle {
      display: inline-flex;
      gap: 6px;
      background: #fff;
      padding: 2px 6px;
      border-radius: 6px;
      border: 1px solid #ccc;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 600;
      color: #390408;
    }

    /* Toggle buttons */
    #lp-lang-toggle span {
      cursor: pointer;
      opacity: 0.7;
      padding: 0 3px;
    }

    #lp-lang-toggle span.active {
      opacity: 1;
      text-decoration: underline;
    }

    /* Hide full Google Translate dropdown but keep it functional */
    #gt-mobile-topbar-slot #google_translate_element .goog-te-combo {
      opacity: 0 !important;
      width: 0 !important;
      min-width: 0 !important;
      max-width: 0 !important;
      height: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
      border: 0 !important;
      font-size: 0 !important;
      pointer-events: none !important;
    }

    /* 🔥 Hide the "Select Language" text label */
    #gt-mobile-topbar-slot #google_translate_element,
    #gt-mobile-topbar-slot #google_translate_element .goog-te-gadget,
    #gt-mobile-topbar-slot #google_translate_element .goog-te-gadget * {
      font-size: 0 !important;
      line-height: 0 !important;
    }
  }
  
  /* Mobile: hide phone + email in top bar so Google Translate has space */
  @media (max-width: 700px) {
	  
  .lp-hide-mobile-text {
    color: transparent !important;
  }

  .lp-hide-mobile-text a {
    color: transparent !important;
  }

 
  .lp-hide-mobile-text i {
    color: #fff !important;  /* or the color you prefer */
  }


}