/* ==========================================================
   MOB365 V18.4 PREMIUM FINISH
   Final visual polish for Suite selector + Restaurant header.
   No business logic / routes / API / fiscal behavior changed.
   ========================================================== */

/* ---------- ENTERPRISE SUITE ---------- */
.suite-shell,
.enterprise-suite,
.module-hub,
[class*="suite-"]{
  --mob365-navy:#0e3152;
  --mob365-teal:#118d87;
  --mob365-ink:#122b43;
}

/* Main suite topbar */
.suite-shell header,
.enterprise-suite header,
.module-hub header,
.suite-topbar{
  background:linear-gradient(105deg,#0c2d4b 0%,#113b60 60%,#126e75 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 8px 26px rgba(14,49,82,.12)!important;
}

/* Hero becomes more premium and less generic */
.suite-hero,
.module-hub-hero,
.enterprise-suite .hero{
  background:
    radial-gradient(circle at 88% 20%,rgba(39,207,189,.18),transparent 28%),
    linear-gradient(120deg,#0f3151 0%,#14536d 52%,#0f8c82 100%)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:20px!important;
  box-shadow:0 18px 45px rgba(14,49,82,.16)!important;
  overflow:hidden!important;
}

/* Module cards */
.suite-module-card,
.module-card,
.enterprise-module-card{
  position:relative!important;
  border:1px solid #d8e3ec!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  box-shadow:0 8px 24px rgba(16,45,70,.07)!important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease!important;
  overflow:hidden!important;
}
.suite-module-card:hover,
.module-card:hover,
.enterprise-module-card:hover{
  transform:translateY(-4px)!important;
  box-shadow:0 16px 34px rgba(16,45,70,.13)!important;
  border-color:#9ccdc9!important;
}
.suite-module-card::after,
.module-card::after,
.enterprise-module-card::after{
  content:""!important;
  position:absolute!important;
  inset:auto -25px -35px auto!important;
  width:105px!important;
  height:105px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(17,141,135,.10),rgba(17,141,135,0) 70%)!important;
  pointer-events:none!important;
}

/* Module icon blocks */
.suite-module-card [class*="icon"],
.module-card [class*="icon"],
.enterprise-module-card [class*="icon"]{
  border-radius:14px!important;
  background:linear-gradient(145deg,#0e4b63,#0f7f7b)!important;
  box-shadow:0 7px 16px rgba(15,104,103,.18)!important;
}

/* Summary stat cards */
.suite-stat,
.module-hub-stat,
.enterprise-suite .stat-card{
  border:1px solid #d9e4ed!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 7px 20px rgba(14,49,82,.06)!important;
}

/* ---------- RESTAURANT TOPBAR ---------- */
.m3-shell .m3-top{
  display:grid!important;
  grid-template-columns:minmax(240px,1fr) auto!important;
  align-items:center!important;
  gap:14px!important;
  min-height:66px!important;
  height:66px!important;
  padding:7px 14px!important;
  background:
    radial-gradient(circle at 82% 10%,rgba(20,161,151,.16),transparent 24%),
    linear-gradient(100deg,#0c2e4e 0%,#113b60 65%,#0f5962 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 8px 24px rgba(14,49,82,.12)!important;
}

.m3-shell .m3-brand{
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  gap:11px!important;
}
.m3-shell .m3-brand img,
.m3-shell .m3-brand-mark{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  border-radius:12px!important;
  object-fit:contain!important;
  box-shadow:0 6px 16px rgba(0,0,0,.17)!important;
}
.m3-shell .m3-brand small{
  display:block!important;
  margin:0 0 2px!important;
  font-size:8.5px!important;
  letter-spacing:1.5px!important;
  color:#72d7cf!important;
  font-weight:900!important;
  text-transform:uppercase!important;
}
.m3-shell .m3-brand h1,
.m3-shell .m3-brand strong{
  margin:0!important;
  font-size:17px!important;
  line-height:1.05!important;
  color:#fff!important;
  font-weight:900!important;
}

/* Right side actions as a clean control cluster */
.m3-shell .m3-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  flex-wrap:nowrap!important;
  min-width:0!important;
}
.m3-shell .m3-actions .m3-btn,
.m3-shell .m3-actions button{
  min-width:70px!important;
  height:38px!important;
  min-height:38px!important;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#11304c!important;
  box-shadow:0 3px 10px rgba(0,0,0,.09)!important;
  font-size:9px!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.m3-shell .m3-actions .m3-btn:hover,
.m3-shell .m3-actions button:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 6px 14px rgba(0,0,0,.13)!important;
}

/* Status/operator badges */
.m3-shell .m3-actions .status,
.m3-shell .m3-actions .badge,
.m3-shell .m3-status{
  min-width:auto!important;
  height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border-radius:10px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  box-shadow:none!important;
  font-weight:850!important;
}

/* Avoid duplicate personalization-looking emphasis */
.m3-shell .m3-actions .personalize{
  border-color:#88d3cc!important;
  background:#f8fffe!important;
  color:#0f685f!important;
}

/* 1366–1500 laptop fit */
@media (min-width:1100px) and (max-width:1500px){
  .m3-shell .m3-top{
    min-height:62px!important;
    height:62px!important;
    padding:6px 10px!important;
  }
  .m3-shell .m3-brand img,
  .m3-shell .m3-brand-mark{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
  }
  .m3-shell .m3-actions{
    gap:4px!important;
  }
  .m3-shell .m3-actions .m3-btn,
  .m3-shell .m3-actions button{
    min-width:61px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 7px!important;
    font-size:8.2px!important;
  }
}

/* Touch/tablet */
@media (max-width:1099px){
  .m3-shell .m3-top{
    grid-template-columns:1fr!important;
    height:auto!important;
    min-height:0!important;
  }
  .m3-shell .m3-actions{
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
  }
}