
/* SmartSetupUAE global responsive polish - desktop/tablet/fold/mobile */
html, body {
  max-width: 100%;
  overflow-x: hidden !important;
}

* {
  box-sizing: border-box;
}

img, video, canvas, svg {
  max-width: 100%;
  height: auto;
}

/* Keep page content centered and remove uneven left/right gaps */
.container,
.wrap,
.wrapper,
.checkout-wrap,
.checkout-container,
.portal-wrap,
.page-wrap,
.main-wrap,
.section .container {
  width: min(100% - 32px, 1180px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Checkout page alignment */
.checkout-page,
.checkout-main,
.checkout-content,
.checkout-grid,
.checkout-layout {
  width: min(100% - 32px, 1180px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.checkout-grid,
.checkout-layout,
.checkout-content {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px) !important;
  gap: 22px !important;
  align-items: start !important;
}

.checkout-card,
.buyer-card,
.summary-card,
.order-summary,
.checkout-sidebar {
  width: 100% !important;
  max-width: 100% !important;
}

/* Header/nav fixes for Fold/tablet widths */
header,
.site-header,
.navbar,
.nav {
  max-width: 100% !important;
}

header .container,
.site-header .container,
.navbar .container,
.nav-inner,
.header-inner {
  width: min(100% - 28px, 1180px) !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
}

.desktop-nav,
.nav-links,
.main-nav {
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.6vw, 26px) !important;
  flex-wrap: nowrap;
}

.desktop-nav a,
.nav-links a,
.main-nav a,
header a {
  font-size: clamp(13px, 1.05vw, 16px) !important;
  white-space: nowrap;
}

/* Samsung Fold / small desktop mode */
@media (max-width: 980px) {
  .desktop-nav,
  .nav-links,
  .main-nav {
    gap: 10px !important;
  }

  .desktop-nav a,
  .nav-links a,
  .main-nav a,
  header a {
    font-size: 12.5px !important;
  }

  .brand-title,
  .logo-text,
  .site-logo span {
    font-size: 14px !important;
  }

  .checkout-grid,
  .checkout-layout,
  .checkout-content {
    grid-template-columns: 1fr !important;
  }

  .checkout-sidebar,
  .order-summary,
  .summary-card {
    position: static !important;
  }
}

/* Mobile: only hamburger menu, no desktop nav */
@media (max-width: 768px) {
  body {
    overflow-x: hidden !important;
  }

  .desktop-nav,
  .nav-links,
  .main-nav {
    display: none !important;
  }

  .mobile-menu-btn,
  .hamburger,
  .menu-toggle {
    display: flex !important;
  }

  .mobile-menu,
  .mobile-panel,
  .drawer {
    width: min(82vw, 300px) !important;
    max-width: 300px !important;
    padding: 16px !important;
  }

  .mobile-menu a,
  .mobile-panel a,
  .drawer a {
    font-size: 14px !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    line-height: 1.25 !important;
  }

  .container,
  .wrap,
  .wrapper,
  .checkout-wrap,
  .checkout-container,
  .portal-wrap,
  .page-wrap,
  .main-wrap,
  .checkout-page,
  .checkout-main,
  .checkout-content,
  .checkout-grid,
  .checkout-layout {
    width: calc(100% - 24px) !important;
  }

  h1 {
    font-size: clamp(28px, 8vw, 38px) !important;
    line-height: 1.08 !important;
  }

  h2 {
    font-size: clamp(22px, 6vw, 30px) !important;
    line-height: 1.15 !important;
  }

  p, li, label, input, select, button {
    font-size: 14px !important;
  }

  input, select {
    height: 48px !important;
  }

  .checkout-card,
  .buyer-card,
  .summary-card,
  .order-summary {
    padding: 18px !important;
    border-radius: 18px !important;
  }

  .phone-row,
  .phone-input,
  .field-row,
  .form-row {
    grid-template-columns: 1fr !important;
  }

  .whatsapp-float,
  .wa-float {
    right: 14px !important;
    bottom: 16px !important;
    width: 54px !important;
    height: 54px !important;
    z-index: 9999 !important;
  }

  .chatbot-widget,
  .chat-widget,
  .advisor-widget {
    right: 12px !important;
    bottom: 82px !important;
    width: calc(100vw - 24px) !important;
    max-width: 360px !important;
    z-index: 9998 !important;
  }

  .activity-search-input,
  input[placeholder*="Software Development"],
  input[placeholder*="activity"],
  input[placeholder*="Try"] {
    font-size: 13px !important;
  }
}

/* Extra narrow mobile */
@media (max-width: 420px) {
  .container,
  .wrap,
  .wrapper,
  .checkout-wrap,
  .checkout-container,
  .checkout-page,
  .checkout-main,
  .checkout-content,
  .checkout-grid,
  .checkout-layout {
    width: calc(100% - 18px) !important;
  }

  .checkout-card,
  .buyer-card,
  .summary-card,
  .order-summary {
    padding: 15px !important;
  }

  .mobile-menu,
  .mobile-panel,
  .drawer {
    width: min(86vw, 280px) !important;
  }
}


/* Phone country code selector fix */
.ss-phone-row {
  display: grid !important;
  grid-template-columns: 132px 1fr !important;
  gap: 8px !important;
  align-items: center !important;
}
.ss-phone-row select,
.ss-phone-row input {
  width: 100% !important;
  height: 50px !important;
  border: 1.5px solid #dbe7e2 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  background: #fff !important;
  outline: none !important;
}
.ss-phone-row select:focus,
.ss-phone-row input:focus {
  border-color: #064c39 !important;
  box-shadow: 0 0 0 3px rgba(6,76,57,.10) !important;
}
@media(max-width:520px){
  .ss-phone-row{grid-template-columns:112px 1fr !important;}
  .ss-phone-row select,.ss-phone-row input{height:46px !important;font-size:13px !important;}
}

/* SEO copy sections */
.seo-keyword-strip {
  background:#f6faf8;
  border-top:1px solid #e5eee9;
  border-bottom:1px solid #e5eee9;
  padding:26px 5%;
}
.seo-keyword-strip .seo-inner {
  max-width:1180px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.seo-keyword-strip h2 {
  font-size:24px;
  line-height:1.15;
  color:#082c22;
  margin-bottom:10px;
}
.seo-keyword-strip p,
.seo-keyword-strip li {
  font-size:14px;
  line-height:1.65;
  color:#5d6863;
}
.seo-keyword-strip ul {padding-left:18px;}
@media(max-width:768px){
  .seo-keyword-strip .seo-inner{grid-template-columns:1fr;}
  .seo-keyword-strip{padding:22px 18px;}
  .seo-keyword-strip h2{font-size:21px;}
}
