
:root{--b:#155eef;--bd:#103b83;--ink:#14243d;--muted:#6c7890;--line:#e2e8f0;--bg:#f6f8fc}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Noto Sans Arabic",sans-serif}.wrap{width:min(1040px,calc(100% - 32px));margin:auto}.hidden{display:none!important}
button,select,input,textarea{font:inherit}.header{background:#fff;border-bottom:1px solid var(--line);height:76px;display:flex;align-items:center}.header-in{display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.logo img{width:48px;height:48px;object-fit:contain}.logo strong{font-size:24px;display:block}.logo small{font-size:8px;letter-spacing:3px;color:#7c8799}.header-actions{display:flex;gap:8px;align-items:center}.top-btn,.top-select,.circle-btn{height:40px;background:#fff;border:1px solid #d9e0ea;border-radius:12px;color:var(--ink)}.top-btn{padding:0 14px}.top-select{padding:0 10px}.circle-btn{width:40px}.login-btn{font-weight:bold}
main.wrap{padding-top:24px}.hero{background:linear-gradient(135deg,#12346f,#155eef);border-radius:26px;padding:30px;color:#fff}.hero-text span{font-size:12px;color:#c7dafd;font-weight:bold}.hero-text h1{font-size:34px;margin:7px 0}.hero-text p{margin:0;color:#d8e5ff}.finder{background:#fff;padding:12px;border-radius:18px;margin-top:22px}.search-row{display:flex;background:#f5f7fb;border:1px solid #dce3ed;border-radius:13px;padding:5px;align-items:center}.magnify{color:#748199;font-size:24px;padding:0 8px}.search-row input{flex:1;border:0;outline:0;background:transparent;padding:11px;color:var(--ink)}.search-row button{background:var(--b);color:#fff;border:0;border-radius:9px;padding:11px 20px;font-weight:bold}.selectors{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:9px}.selectors>div{border:1px solid var(--line);border-radius:11px;padding:7px 10px}.selectors label{display:block;color:#8490a3;font-size:9px}.selectors select{width:100%;border:0;outline:0;background:#fff;color:var(--ink);font-weight:bold;padding-top:4px}
.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.action-card{display:flex;align-items:center;gap:13px;text-align:right;border:1px solid var(--line);background:#fff;border-radius:18px;padding:16px;color:var(--ink)}.action-card strong{display:block;font-size:15px}.action-card small{display:block;color:#7a8699;margin-top:4px}.primary-card{background:var(--b);color:#fff;border-color:var(--b)}.primary-card small{color:#dce8ff}.action-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.15);font-size:24px}.action-icon.soft{background:#edf4ff;color:var(--b)}
.account-row{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--line);border-radius:15px;padding:11px 14px;margin:14px 0;color:var(--muted);font-size:12px}.account-row button{border:0;background:#edf4ff;color:var(--b);padding:8px 12px;border-radius:9px;font-weight:bold}
.results{padding:14px 0}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.section-title small{color:#7c8799}.section-title h2{margin:2px 0;font-size:22px}.section-title>span{background:#eaf2ff;color:var(--b);padding:6px 10px;border-radius:999px;font-size:11px;font-weight:bold}.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:14px}.card-top{display:flex;gap:11px}.thumb{width:65px;height:65px;border-radius:14px;object-fit:cover}.card h3{margin:2px 0 4px}.meta{font-size:12px;color:var(--muted);line-height:1.6}.card-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.card-actions a{text-align:center;text-decoration:none;background:#f1f5fa;color:#33445e;border-radius:9px;padding:8px;font-size:11px}.empty{background:#fff;border:1px dashed #d6dee9;border-radius:18px;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted)}.empty>span{font-size:30px;color:var(--b)}.empty strong{color:var(--ink);margin-top:4px}.empty p{font-size:12px}
.footer{text-align:center;color:#8893a4;font-size:10px;padding:28px 14px 92px;line-height:1.7}.footer strong{display:block;color:#536176;font-size:12px}.footer nav{margin-top:4px}.footer a{color:#7c8799;text-decoration:none;margin:0 4px}.mobile-nav{display:none}
.modal{position:fixed;inset:0;background:rgba(12,24,45,.52);z-index:80;display:flex;justify-content:center;align-items:center;padding:18px}.panel{background:#fff;width:min(540px,100%);max-height:88vh;overflow:auto;border-radius:20px;padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center}.panel-head button,.close-x{border:0;background:#f1f4f8;border-radius:9px;width:36px;height:36px}.panel label{display:block;font-size:12px;font-weight:bold;margin:11px 0 5px}.panel input,.panel select,.panel textarea{width:100%;border:1px solid #dce3ec;border-radius:10px;padding:10px;background:#fff}.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}.panel button{border:1px solid #dce3ec;background:#fff;border-radius:10px;padding:10px;font-weight:bold}.panel .blue{background:var(--b);border-color:var(--b);color:#fff}.panel .red{color:#b42318;background:#fff0f0}.full{width:100%;margin-top:10px}.onboarding{text-align:right}.onboarding>img{display:block;width:70px;height:70px;object-fit:contain;margin:0 auto}.onboarding h2{text-align:center}.onboarding>p{text-align:center;color:var(--muted)}.guide p{color:var(--muted);line-height:1.8}
@media(max-width:720px){.wrap{width:min(100% - 20px,1040px)}.header{height:66px}.logo img{width:38px;height:38px}.logo strong{font-size:19px}.logo small{font-size:6px}.header-actions{gap:4px}.top-btn,.top-select,.circle-btn{height:36px;font-size:10px}.location-btn{max-width:110px;overflow:hidden;white-space:nowrap}.circle-btn{display:none}.hero{padding:21px 13px;border-radius:20px}.hero-text h1{font-size:25px}.hero-text p{font-size:12px}.selectors{grid-template-columns:1fr 1fr 1fr}.selectors>div{padding:6px}.selectors select{font-size:10px}.action-grid{grid-template-columns:1fr 1fr}.action-card{padding:12px}.action-card strong{font-size:12px}.action-card small{font-size:9px}.action-icon{width:37px;height:37px}.cards{grid-template-columns:1fr}.footer{padding-bottom:88px}.mobile-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;z-index:40;bottom:9px;left:50%;transform:translateX(-50%);width:calc(100% - 20px);max-width:520px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:5px;box-shadow:0 10px 35px rgba(30,52,90,.16)}.mobile-nav button{border:0;background:#fff;color:#778397;border-radius:12px;padding:6px;font-size:19px}.mobile-nav button small{display:block;font-size:9px;margin-top:2px}.mobile-nav .on{background:#edf4ff;color:var(--b)}} 
@media(max-width:440px){.selectors{grid-template-columns:1fr}.action-grid{grid-template-columns:1fr}.header-actions .login-btn{display:none}}

/* BizMap v7 functional repair */

/* v13 */
.autofill-trap{position:fixed!important;left:-10000px!important;top:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
input[type="search"]::-webkit-search-cancel-button{cursor:pointer}

.custom-city{margin-top:7px;width:100%;border:1px solid #dce3ed;border-radius:9px;padding:8px 9px;background:#fff;color:var(--ink);font-size:11px}
.custom-city:focus{outline:2px solid #dce9ff;border-color:#8bb3f5}

/* =========================================================
   BizMap v15 — Professional mobile polish
   ========================================================= */
body{overflow-x:hidden}
.onboard-note{display:none}

@media (max-width:720px){
  /* App header */
  .header{
    height:64px;
    position:sticky;
    top:0;
    z-index:45;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }
  .header .wrap{width:calc(100% - 22px)}
  .header-in{gap:8px}
  .logo{min-width:52px}
  .logo img{
    width:52px;
    height:52px;
    border-radius:13px;
    object-fit:contain;
  }
  /* The icon already contains the BizMap wordmark, so don't repeat it on phones. */
  .logo>div{display:none}

  .header-actions{
    flex:1;
    justify-content:flex-start;
    gap:6px;
    min-width:0;
  }
  .location-btn{
    order:1;
    flex:1;
    min-width:0;
    max-width:150px;
    height:38px;
    border-radius:12px;
    padding:0 10px;
    font-size:11px;
    overflow:hidden;
    text-overflow:ellipsis;
    box-shadow:0 2px 8px rgba(16,43,99,.04);
  }
  .top-select{
    order:2;
    width:94px;
    height:38px;
    border-radius:12px;
    padding-inline:8px;
    font-size:11px;
    box-shadow:0 2px 8px rgba(16,43,99,.04);
  }
  .circle-btn,.login-btn{display:none!important}

  /* Main mobile canvas */
  main.wrap{
    width:calc(100% - 20px);
    padding-top:14px;
  }
  .hero{
    border-radius:22px;
    padding:20px 14px 16px;
    box-shadow:0 14px 34px rgba(19,53,117,.16);
  }
  .hero-text span{font-size:11px}
  .hero-text h1{
    margin:6px 0 7px;
    font-size:25px;
    line-height:1.22;
  }
  .hero-text p{
    font-size:11px;
    line-height:1.65;
  }
  .finder{
    margin-top:16px;
    padding:9px;
    border-radius:16px;
  }
  .search-row{
    min-height:48px;
    border-radius:12px;
  }
  .search-row input{font-size:13px;padding:9px 2px}
  .search-row button{
    min-width:60px;
    padding:10px 13px;
    border-radius:10px;
    font-size:12px;
  }
  .selectors{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
    margin-top:8px;
  }
  .selectors>div{
    min-height:48px;
    padding:6px 9px;
    border-radius:11px;
  }
  .selectors label{font-size:9px}
  .selectors select{font-size:12px;padding-block:3px}

  /* Action cards */
  .action-grid{
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin-top:10px;
  }
  .action-card{
    min-height:80px;
    padding:12px;
    border-radius:16px;
    gap:9px;
  }
  .action-icon{
    width:38px;
    height:38px;
    border-radius:12px;
    font-size:20px;
    flex:0 0 auto;
  }
  .action-card strong{font-size:12px;line-height:1.35}
  .action-card small{font-size:9px;line-height:1.35}

  /* Account/results */
  .account-row{
    margin:10px 0;
    padding:10px 12px;
    border-radius:14px;
  }
  .section-title h2{font-size:19px}
  .cards{grid-template-columns:1fr}
  .footer{
    padding:24px 14px 92px;
    font-size:9px;
    line-height:1.65;
  }

  /* Bottom app navigation */
  .mobile-nav{
    bottom:max(8px,env(safe-area-inset-bottom));
    width:calc(100% - 18px);
    height:66px;
    border-radius:20px;
    padding:5px;
    box-shadow:0 18px 44px rgba(22,47,92,.22);
  }
  .mobile-nav button{
    min-width:0;
    font-size:18px;
    border-radius:13px;
  }
  .mobile-nav button small{font-size:8px}

  /* Modal layer */
  .modal{
    padding:14px;
    background:rgba(9,20,40,.62);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  .panel{
    width:min(100%,430px);
    max-height:calc(100dvh - 28px);
    border-radius:26px;
    padding:20px;
    box-shadow:0 28px 80px rgba(6,20,47,.34);
  }

  /* First-run card */
  #onboardingModal{
    align-items:center;
    justify-content:center;
  }
  #onboardingModal .onboarding{
    overflow:auto;
    padding:22px 20px 18px;
    border:1px solid rgba(226,232,240,.85);
  }
  .onboard-brand{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:10px;
  }
  .onboard-brand>img{
    width:58px;
    height:58px;
    object-fit:contain;
    margin:0;
    flex:0 0 auto;
  }
  .onboard-brand-copy{
    min-width:0;
    flex:1;
  }
  .onboard-kicker{
    display:block;
    color:#155eef;
    font-size:8px;
    font-weight:800;
    letter-spacing:2.2px;
    margin-bottom:4px;
  }
  .onboarding h2{
    margin:0;
    text-align:start;
    font-size:23px;
    line-height:1.25;
    letter-spacing:-.3px;
  }
  .onboarding>p{
    margin:4px 0 14px;
    text-align:start;
    color:#6c7890;
    font-size:12px;
    line-height:1.65;
  }
  .onboard-fields{
    display:grid;
    gap:9px;
  }
  .onboard-fields label{
    margin:0;
    font-size:11px;
    color:#31425f;
  }
  .onboard-fields select,
  .onboard-fields input{
    height:48px;
    margin-top:5px;
    border:1px solid #dbe3ee;
    border-radius:13px;
    padding-inline:13px;
    background:#fafdff;
    font-size:13px;
    color:#14243d;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
  }
  .onboard-fields select:focus,
  .onboard-fields input:focus{
    border-color:#8fb4f8;
    box-shadow:0 0 0 3px rgba(21,94,239,.10);
    outline:none;
  }
  .onboard-start{
    height:52px;
    margin-top:14px!important;
    border-radius:14px!important;
    font-size:14px;
    letter-spacing:.1px;
    box-shadow:0 10px 22px rgba(21,94,239,.22);
  }
  .onboard-note{
    display:block;
    text-align:center;
    margin-top:9px;
    color:#99a3b3;
    font-size:9px;
    line-height:1.45;
  }
}

@media (max-width:390px){
  .header .wrap{width:calc(100% - 14px)}
  .logo img{width:46px;height:46px}
  .location-btn{max-width:126px;font-size:10px}
  .top-select{width:82px;font-size:10px}
  .hero-text h1{font-size:23px}
  .action-grid{grid-template-columns:1fr}
  .panel{padding:18px 16px}
  .onboard-brand>img{width:52px;height:52px}
  .onboarding h2{font-size:21px}
}

/* v16 admin account */
.account-status-wrap{display:flex;align-items:center;gap:8px;min-width:0}
.account-row-actions{display:flex;align-items:center;gap:7px}
.admin-badge{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
  background:#e9f7ef;
  color:#187947;
  border:1px solid #cdebd8;
  border-radius:999px;
  padding:5px 8px;
  font-size:10px;
  font-weight:800;
}
.admin-dashboard-btn{
  background:#142f68!important;
  color:#fff!important;
}
.admin-account-button{
  margin-top:10px;
  background:#142f68!important;
  color:#fff!important;
  border-color:#142f68!important;
}
@media(max-width:720px){
  .account-row{gap:8px;align-items:center}
  .account-status-wrap{flex-direction:column;align-items:flex-start;gap:3px}
  .account-row-actions{gap:5px}
  .account-row-actions button{font-size:9px;padding:8px 9px}
  .admin-badge{font-size:8px;padding:4px 7px}
}

/* v19.1 SAFE owner controls */
.owner-business-card{
  background:#fff;
  border:1px solid #e0e6ef;
  border-radius:15px;
  padding:12px;
  margin-bottom:10px;
}
.owner-business-info{display:flex;align-items:center;gap:10px}
.owner-business-info img{
  width:52px;height:52px;object-fit:cover;border-radius:12px;
  border:1px solid #e3e8ef;background:#f6f8fc
}
.owner-status{
  display:inline-flex;margin-top:5px;padding:4px 7px;border-radius:999px;
  font-size:9px;font-weight:800
}
.owner-status.published{background:#e8f7ed;color:#177f47}
.owner-status.pending{background:#fff4d7;color:#876600}
.owner-status.rejected{background:#fff0f0;color:#b42318}
.owner-status.suspended{background:#eef1f5;color:#596579}
.owner-business-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}
.owner-business-actions button{border:0;border-radius:10px;padding:9px;font-size:11px;font-weight:800}
.owner-edit{background:#edf4ff;color:#155eef}
.owner-delete{background:#fff0f0;color:#b42318}
.owner-empty{text-align:center;color:#7b8799;padding:28px 8px}

/* v20 — edit/delete controls on business cards */
.public-owner-controls{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid #edf1f6;
}
.public-owner-controls button{
  border:0;
  border-radius:10px;
  padding:9px 8px;
  font-size:11px;
  font-weight:800;
}
.public-edit-btn{
  background:#edf4ff;
  color:#155eef;
}
.public-delete-btn{
  background:#fff0f0;
  color:#b42318;
}
@media(max-width:720px){
  .public-owner-controls button{
    min-height:38px;
    font-size:10px;
  }
}

/* v20.2 account & bilingual guide */
.account-menu-btn{
  background:#f3f6fb!important;
  color:#33445e!important;
}
.my-businesses-logout{
  margin-top:14px!important;
}
.guide-kicker{
  display:block;
  color:#155eef;
  font-size:9px;
  font-weight:900;
  letter-spacing:2px;
  margin-bottom:3px;
}
.guide-head{
  align-items:flex-start;
}
.guide-language-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin:15px 0;
  padding:4px;
  border-radius:13px;
  background:#f1f5fa;
}
.guide-language-tabs .guide-lang{
  border:0;
  border-radius:10px;
  padding:9px 12px;
  background:transparent;
  color:#68758b;
  font-weight:800;
}
.guide-language-tabs .guide-lang.active{
  background:#fff;
  color:#155eef;
  box-shadow:0 3px 10px rgba(30,60,110,.09);
}
.guide-language-content{
  text-align:start;
}
.guide-section{
  padding:12px 0;
  border-bottom:1px solid #edf1f6;
}
.guide-section:last-child{
  border-bottom:0;
}
.guide-section h3{
  margin:0 0 5px;
  color:#1a335d;
  font-size:14px;
}
.guide-section p{
  margin:0;
  color:#66738a;
  line-height:1.8;
  font-size:12px;
}

@media(max-width:720px){
  .mobile-nav{
    grid-template-columns:repeat(5,1fr)!important;
  }
  .mobile-nav button{
    padding-inline:3px!important;
  }
  .mobile-nav button small{
    font-size:7.5px!important;
    white-space:nowrap;
  }
  .account-row-actions{
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .bilingual-guide{
    max-height:calc(100dvh - 28px);
  }
}

/* ==========================================================
   BizMap v20.3 — promotional launch popup
   ========================================================== */
.promo-overlay{
  position:fixed;
  inset:0;
  z-index:120;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(8,20,42,.66);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.promo-card{
  position:relative;
  width:min(520px,100%);
  background:#fff;
  border-radius:26px;
  padding:26px 24px 20px;
  box-shadow:0 32px 90px rgba(6,20,48,.34);
  border:1px solid rgba(224,231,242,.9);
  text-align:center;
  overflow:hidden;
}
.promo-card:before{
  content:"";
  position:absolute;
  top:-85px;
  left:-70px;
  width:200px;
  height:200px;
  border-radius:50%;
  background:rgba(21,94,239,.08);
}
.promo-close{
  position:absolute;
  top:12px;
  inset-inline-end:12px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:12px;
  background:#f2f5fa;
  color:#4e5c73;
  font-size:23px;
  line-height:1;
  z-index:3;
}
.promo-logo-wrap{
  width:84px;
  height:84px;
  margin:0 auto 10px;
  border-radius:22px;
  background:#f4f8ff;
  display:grid;
  place-items:center;
  border:1px solid #e5edfa;
}
.promo-logo-wrap img{
  width:74px;
  height:74px;
  object-fit:contain;
}
.promo-kicker{
  display:block;
  color:#155eef;
  font-size:11px;
  font-weight:900;
  margin-bottom:5px;
}
.promo-card h2{
  margin:0 0 8px;
  color:#152a4c;
  font-size:24px;
  line-height:1.3;
}
.promo-card p{
  margin:0 auto;
  max-width:430px;
  color:#69758a;
  font-size:13px;
  line-height:1.8;
}
.promo-benefits{
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
  margin:16px 0 13px;
  text-align:start;
}
.promo-benefits span{
  background:#f7f9fc;
  border:1px solid #e7ecf3;
  border-radius:12px;
  padding:9px 11px;
  color:#3e4d66;
  font-size:11px;
  font-weight:700;
}
.promo-timer-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#8a95a7;
  font-size:10px;
}
.promo-timer-row strong{
  min-width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#edf4ff;
  color:#155eef;
  font-size:12px;
}

@media(max-width:720px){
  .promo-overlay{
    padding:14px;
    align-items:center;
  }
  .promo-card{
    width:min(100%,390px);
    border-radius:24px;
    padding:22px 18px 17px;
  }
  .promo-logo-wrap{
    width:70px;
    height:70px;
    border-radius:19px;
  }
  .promo-logo-wrap img{
    width:62px;
    height:62px;
  }
  .promo-card h2{
    font-size:20px;
  }
  .promo-card p{
    font-size:11px;
    line-height:1.7;
  }
  .promo-benefits{
    margin:13px 0 11px;
  }
  .promo-benefits span{
    padding:8px 10px;
    font-size:10px;
  }
}

/* v20.4 shorter promo */
.promo-card{
  max-width:460px;
}
.promo-kicker{
  font-size:12px;
  letter-spacing:1.3px;
}
.promo-card h2{
  font-size:28px;
  margin:2px 0 10px;
  line-height:1.25;
}
.promo-main-text{
  font-size:16px !important;
  line-height:1.8 !important;
  color:#4b5a72 !important;
  max-width:360px;
}
.promo-cta{
  margin-top:16px;
  border:0;
  border-radius:14px;
  padding:13px 20px;
  background:#155eef;
  color:#fff;
  font-size:15px;
  font-weight:900;
  box-shadow:0 12px 24px rgba(21,94,239,.20);
}
.promo-timer-row{
  margin-top:14px;
}
@media(max-width:720px){
  .promo-card h2{
    font-size:23px;
  }
  .promo-main-text{
    font-size:14px !important;
    max-width:100%;
  }
  .promo-cta{
    width:100%;
    font-size:14px;
    padding:12px 16px;
  }
}
