/* ==========================================================================
   Saidul Islam Miton – WordPress / Elementor compatibility for the Arif design
   ========================================================================== */

/* WordPress admin bar + sticky header */
.admin-bar .nav { top: 32px; }
@media (max-width: 782px) { .admin-bar .nav { top: 46px; } }
@media (max-width: 600px) { .admin-bar .nav { top: 0; } }

/* Elementor wrappers around each section: no padding, no gaps, full width */
.elementor .arif-el,
.elementor .e-con.arif-el {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --margin-top: 0px; --margin-right: 0px; --margin-bottom: 0px; --margin-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
  --content-width: 100%; --width: 100%;
  padding: 0; margin: 0; gap: 0; max-width: none; width: 100%;
}
.elementor .e-con.arif-el > .e-con-inner { max-width: none; padding: 0; gap: 0; }
.elementor .arif-el .elementor-widget,
.elementor .arif-el > .elementor-widget {
  width: 100%; max-width: 100%; margin: 0 !important; --kit-widget-spacing: 0px;
}
.elementor .arif-el .elementor-widget:not(:last-child) { margin-block-end: 0 !important; margin-bottom: 0 !important; }
.elementor .arif-el .elementor-widget-container { margin: 0; padding: 0; }
.elementor .elementor-section.arif-el > .elementor-container { max-width: none; }
.elementor .elementor-section.arif-el .elementor-widget-wrap,
.elementor .elementor-section.arif-el .elementor-column > .elementor-element-populated { padding: 0 !important; }
.elementor .arif-el .elementor-widget-shortcode .elementor-shortcode { width: 100%; }

/* [arif_design] shortcode dropped inside a narrow column breaks out to full width */
.elementor-widget .arif-design,
.entry-content .arif-design { width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

/* Google Translate: hide its top bar, tooltips and highlight */
.skiptranslate > iframe,
iframe.goog-te-banner-frame,
iframe.skiptranslate,
.goog-te-banner-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
#goog-gt-tt,
.VIpgJd-yAWNEb-L7lbkb { display: none !important; visibility: hidden !important; }
body { top: 0 !important; }
.goog-text-highlight,
.VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q { background: none !important; box-shadow: none !important; }
font[style] { background: transparent !important; }

/* Blog posts / generic pages content */
.arif-content, .arif-article { max-width: 860px; margin: 0 auto; color: var(--ink, #111318); font-size: 17px; line-height: 1.8; }
.arif-content > *:first-child, .arif-article > *:first-child { margin-top: 0; }
.arif-content h2, .arif-article h2 { font-size: clamp(26px, 3vw, 36px); line-height: 1.2; margin: 36px 0 14px; }
.arif-content h3, .arif-article h3 { font-size: 22px; line-height: 1.3; margin: 28px 0 12px; }
.arif-content p, .arif-article p { color: var(--muted, #566170); margin: 0 0 18px; }
.arif-content a:not(.primary-btn):not(.ghost-btn),
.arif-article a:not(.primary-btn):not(.ghost-btn):not(.read-now) { color: var(--red, #d9342b); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.arif-content ul, .arif-content ol, .arif-article ul, .arif-article ol { color: var(--muted, #566170); padding-left: 22px; margin: 0 0 18px; }
.arif-content img, .arif-article img { border-radius: 8px; height: auto; }
.arif-content blockquote, .arif-article blockquote { margin: 26px 0; padding: 18px 22px; border-left: 4px solid var(--red, #d9342b); background: #fff3f2; border-radius: 8px; }
.arif-article-image { margin: 0 0 28px; }
.arif-article-image img { width: 100%; max-height: 460px; object-fit: cover; box-shadow: 0 18px 50px rgba(17, 19, 24, .12); }
.arif-article-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--line, #e4e8ef); }
.arif-comments { margin-top: 48px; }
.arif-comments textarea, .arif-comments input[type="text"], .arif-comments input[type="email"], .arif-comments input[type="url"],
.arif-content input[type="search"] { width: 100%; padding: 12px 14px; border: 1px solid var(--line, #e4e8ef); border-radius: 8px; font: inherit; }
.arif-comments input[type="submit"], .arif-content .search-submit { min-height: 44px; padding: 0 18px; border: 0; border-radius: 8px; background: var(--red, #d9342b); color: #fff; font-weight: 800; cursor: pointer; }
.arif-content .search-form { display: flex; gap: 10px; }
.nav-link.is-current { color: var(--red, #d9342b); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }


/* ==== Arif fixes (Oct 2026): mobile/tab menu, bottom dock, scroll progress, faster hero ==== */

/* Hero sliders: only the visible slide image loads first; the others load after the page has finished loading. */
html:not(.arif-slides-ready) .hero-slide:not(.is-active) { background-image: none !important; }

/* Scroll progress ring + percentage on the "scroll to top" button */
.scroll-top.arif-progress { width: 48px !important; height: 48px !important; display: grid !important; place-items: center; padding: 0 !important; overflow: visible !important; }
.scroll-top.arif-progress .arif-ring { position: absolute; inset: auto; left: -6px; top: -6px; width: 58px !important; height: 58px !important; max-width: none !important; max-height: none !important; margin: 0 !important; transform: rotate(-90deg); pointer-events: none; overflow: visible; }
.scroll-top.arif-progress .arif-ring circle { fill: none; stroke-width: 3.5; }
.scroll-top.arif-progress .arif-ring .track { stroke: rgba(217, 52, 43, .16); }
.scroll-top.arif-progress .arif-ring .bar { stroke: var(--red, #d9342b); stroke-linecap: round; transition: stroke-dashoffset .12s linear; }
.scroll-top.arif-progress .arif-pct { display: none !important; }
/* Up button: no hover colour change - always white with the red ring and red arrow */
.scroll-top.arif-progress:hover, .scroll-top.arif-progress:focus, .scroll-top.arif-progress:active, .elementor .scroll-top.arif-progress:hover, .elementor .scroll-top.arif-progress:focus, .elementor .scroll-top.arif-progress:active { background: #fff !important; color: var(--red, #d9342b) !important; }
.scroll-top.arif-progress > svg.lucide { display: block !important; position: relative; z-index: 1; }
/* Keep the scroll-to-top button clear of the pulsing call button */
/* Layout like a speed-dial: call button, with the up button underneath it */
.scroll-top.arif-progress, .elementor .scroll-top.arif-progress { bottom: 28px !important; right: 30px !important; }
.floating-call, .elementor .floating-call { bottom: 104px !important; right: 22px !important; }

@media (max-width: 900px) {
  /* Bigger red menu (hamburger) button */
  .nav .menu-btn, .elementor .nav .menu-btn { width: 48px !important; height: 48px !important; min-width: 48px !important; padding: 0 !important; display: inline-grid !important; place-items: center !important; border: 0 !important; border-radius: 12px !important; background: var(--red, #d9342b) !important; color: #fff !important; box-shadow: 0 8px 18px rgba(217, 52, 43, .30) !important; }
  .nav .menu-btn svg, .nav .menu-btn i { width: 30px !important; height: 30px !important; color: #fff !important; stroke: #fff !important; stroke-width: 2.4; }
  .nav .menu-btn:active { transform: scale(.95); }

  /* While the menu is open the page behind it cannot scroll, so the menu stays open until X is tapped */
  html.arif-menu-lock { overflow: hidden !important; overscroll-behavior: none; }
  html.arif-menu-lock body { overflow: visible !important; } /* body must stay visible or the sticky header (and the menu inside it) scrolls away */
  body.menu-open .nav-links { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y; }

  /* Bottom floating dock: 20px left & right, larger buttons */
  .mobile-bottom-bar, .elementor .mobile-bottom-bar { left: 20px !important; right: 20px !important; width: auto !important; max-width: none !important; transform: none !important; min-height: 60px !important; padding: 5px !important; gap: 4px; border-radius: 20px !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; }
  .mobile-bottom-bar a, .elementor .mobile-bottom-bar a { min-height: 48px !important; gap: 4px !important; font-size: 11.5px !important; border-radius: 15px !important; }
  .mobile-bottom-bar a > i, .mobile-bottom-bar a > svg { width: 22px !important; height: 22px !important; }
  .mobile-bottom-bar a:nth-child(3) > i { font-size: 22px !important; line-height: 22px !important; }
  body { padding-bottom: 84px !important; }
  .floating-call, .elementor .floating-call { bottom: calc(162px + env(safe-area-inset-bottom)) !important; right: 20px !important; }
  .scroll-top, .elementor .scroll-top, .scroll-top.arif-progress, .elementor .scroll-top.arif-progress { bottom: calc(86px + env(safe-area-inset-bottom)) !important; right: 28px !important; }
}
@media (max-width: 380px) {
  .mobile-bottom-bar a, .elementor .mobile-bottom-bar a { font-size: 11px !important; }
}


/* ==== Floating contact menu: tap the call button to show Call / WhatsApp / Reservation (+ social links) ==== */
.floating-call .arif-fab-close { display: none; }
.floating-call.is-open > svg { display: none !important; }
.floating-call.is-open .arif-fab-close { display: grid; place-items: center; }
.floating-call .arif-fab-close svg { width: 26px; height: 26px; }
.floating-call.is-open, .floating-call.is-open::before, .floating-call.is-open::after { animation: none !important; }
.floating-call.is-open { transform: rotate(90deg) !important; transition: transform .25s ease; }
.floating-call.is-open .arif-fab-close { transform: rotate(-90deg); }
.arif-fab-menu { position: fixed; right: 29px; bottom: 182px; z-index: 61; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; pointer-events: none; }
.arif-fab-item { display: flex; align-items: center; gap: 10px; opacity: 0; transform: translateY(14px) scale(.96); transition: opacity .22s ease, transform .22s ease; pointer-events: none; text-decoration: none !important; cursor: pointer; border: 0; background: none; padding: 0; font: inherit; }
.arif-fab-menu.arif-fab-open .arif-fab-item { opacity: 1; transform: none; pointer-events: auto; }
.arif-fab-menu.arif-fab-open .arif-fab-item:nth-last-child(2) { transition-delay: .04s; }
.arif-fab-menu.arif-fab-open .arif-fab-item:nth-last-child(3) { transition-delay: .08s; }
.arif-fab-menu.arif-fab-open .arif-fab-item:nth-last-child(4) { transition-delay: .12s; }
.arif-fab-menu.arif-fab-open .arif-fab-item:nth-last-child(5) { transition-delay: .16s; }
.arif-fab-menu.arif-fab-open .arif-fab-item:nth-last-child(n+6) { transition-delay: .2s; }
.arif-fab-label { padding: 10px 15px; border-radius: 999px; background: #fff; color: #151a22; font: 700 14px/1 Inter, "Noto Sans Bengali", Arial, sans-serif; box-shadow: 0 8px 22px rgba(17, 19, 24, .14); white-space: nowrap; }
.arif-fab-icon { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--c, #d9342b); box-shadow: 0 12px 24px -10px var(--c, #d9342b), 0 4px 10px rgba(17, 19, 24, .12); font-size: 22px; transition: transform .2s ease; }
.arif-fab-icon svg { width: 22px; height: 22px; color: #fff; stroke: currentColor; }
.arif-fab-item:hover .arif-fab-icon, .arif-fab-item:focus-visible .arif-fab-icon { transform: scale(1.08); }
@media (max-width: 900px) {
  .arif-fab-menu { right: 27px; bottom: calc(240px + env(safe-area-inset-bottom)); gap: 11px; }
  .arif-fab-icon { width: 48px; height: 48px; }
  .arif-fab-label { font-size: 13.5px; padding: 9px 14px; }
}

/* Bottom bar: 4th item is now Call (red phone icon) */
.mobile-bottom-bar a:nth-child(4) > i, .mobile-bottom-bar a:nth-child(4) > svg { color: var(--red, #d9342b) !important; }


/* ==== Footer: developer credit (same style as tokyoleathertech) + mobile/tablet footer fixes ==== */
footer .copyright .footer-credit.arif-dev { display: flex !important; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px 14px; color: rgba(255, 255, 255, .58); font-size: 12px; line-height: 1.5; text-align: left; }
footer .arif-dev-credit { color: rgba(255, 255, 255, .7); font-size: 12px; font-weight: 400; }
footer .arif-dev-credit b { color: #fff; font-weight: 700; }
footer .arif-dev-contact { display: inline-flex; align-items: center; gap: 8px; }
footer .arif-dev-ic { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 34px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 99px; background: transparent; color: #fff !important; font-size: 12px; font-weight: 600; line-height: 1; text-decoration: none !important; transition: background-color .2s ease, border-color .2s ease, transform .2s ease; }
footer .arif-dev-wa { padding: 0 12px; }
footer .arif-dev-wa i { font-size: 15px; }
footer .arif-dev-fb { width: 34px; padding: 0; }
footer .arif-dev-fb i { font-size: 13px; }
footer .arif-dev-ic::before, footer .arif-dev-ic::after { content: none !important; display: none !important; } /* old credit style added an extra WhatsApp icon */
footer .copyright .footer-credit.arif-dev, footer .copyright .footer-credit.arif-dev * { text-transform: none !important; }
footer .arif-dev-ic:hover, footer .arif-dev-ic:focus-visible { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .5); transform: translateY(-1px); }

@media (max-width: 900px) {
  /* bKash / Nagad: one centred row each, full width (numbers no longer break) */
  footer .footer-payment-mobile { display: none !important; }
  footer .footer-desktop-payments { grid-column: 1 / -1 !important; order: 99 !important; display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 12px; width: 100%; margin: 6px 0 0; }
  footer .footer-desktop-payment { display: inline-flex !important; align-items: center; justify-content: center; gap: 10px; flex-wrap: nowrap; max-width: 100%; }
  footer .footer-desktop-payment .footer-payment-number { white-space: nowrap; }
  footer .footer-desktop-payment .footer-payment-color-logo { width: 44px !important; height: 44px !important; border-radius: 10px; }
  footer .footer-desktop-payment .footer-payment-number { font-size: 17px !important; font-weight: 800 !important; letter-spacing: .2px; }
  footer .footer-desktop-payment .payment-copy { min-height: 34px; padding: 0 14px !important; border-radius: 8px !important; background: #fff !important; color: #151a22 !important; font-size: 13px !important; font-weight: 800 !important; border: 0 !important; }
  footer .footer-grid > div { min-width: 0; }
  footer .foot-links a { overflow-wrap: anywhere; }
  /* bottom row: copyright, then credit, then the WhatsApp + Facebook pills, all centred */
  footer .copyright { flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 12px !important; text-align: center !important; }
  footer .copyright .footer-credit.arif-dev { flex-direction: column; justify-content: center; text-align: center; gap: 10px; width: 100%; }
}


/* ==== Footer on phone/tablet: 7 Rent A Car + 7 Ambulance links, bKash & Nagad on one line ==== */
@media (max-width: 900px) {
  footer .footer-grid > :nth-child(3) .foot-links a:nth-child(-n+7),
  footer .footer-grid > :nth-child(4) .foot-links a:nth-child(-n+7) { display: block !important; }
  footer .footer-grid > :nth-child(3) .foot-links a:nth-child(n+8),
  footer .footer-grid > :nth-child(4) .foot-links a:nth-child(n+8) { display: none !important; }

  footer .footer-desktop-payments { flex-direction: row !important; flex-wrap: nowrap !important; justify-content: center !important; gap: 10px !important; }
  footer .footer-desktop-payment { gap: 6px !important; min-width: 0; }
  footer .footer-desktop-payment .footer-payment-color-logo { width: 30px !important; height: 30px !important; border-radius: 7px; flex: 0 0 auto; }
  footer .footer-desktop-payment .footer-payment-number { font-size: 13.5px !important; font-weight: 800 !important; letter-spacing: 0 !important; }
  footer .footer-desktop-payment .payment-copy { min-height: 26px !important; height: 26px; padding: 0 8px !important; border-radius: 6px !important; font-size: 11px !important; flex: 0 0 auto; }
}
@media (max-width: 370px) {
  footer .footer-desktop-payments { gap: 6px !important; }
  footer .footer-desktop-payment { gap: 4px !important; }
  footer .footer-desktop-payment .footer-payment-color-logo { width: 26px !important; height: 26px !important; }
  footer .footer-desktop-payment .footer-payment-number { font-size: 12px !important; }
  footer .footer-desktop-payment .payment-copy { padding: 0 6px !important; font-size: 10px !important; }
}