/* MISTER FAST LiveMapChat WEB Theme V2.1.8
   Structural WEB Header + Footer shell. WEB only. */

:root{
  --mf218-header-h:82px;
  --mf218-footer-h:52px;
}

html,body.mf-web-long-center-v217{
  min-height:100%;
}

body.mf-web-long-center-v217{
  margin:0;
  background:#eef3fa;
}

.mf-web-long-center-v217 .mf514-window{
  position:relative !important;
  display:grid !important;
  grid-template-rows:var(--mf218-header-h) auto var(--mf218-footer-h) !important;
  min-height:100vh !important;
  width:100% !important;
  overflow:visible !important;
  background:#fff;
}

.mf218-web-header{
  position:sticky;
  top:0;
  z-index:1200;
  display:grid;
  grid-template-columns:minmax(230px,1fr) auto minmax(210px,auto);
  align-items:center;
  gap:20px;
  min-height:var(--mf218-header-h);
  padding:10px 22px;
  border-bottom:1px solid #dbe5f3;
  background:rgba(255,255,255,.97);
  box-shadow:0 8px 24px rgba(0,45,105,.08);
  backdrop-filter:blur(14px);
}

.mf218-header-brand{display:flex;align-items:center;gap:12px;min-width:0;color:#003DA5;text-decoration:none}
.mf218-header-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#003DA5;color:#FFC400;font-size:21px;font-weight:900;font-style:italic}
.mf218-header-brand b,.mf218-header-brand small{display:block}
.mf218-header-brand b{font-size:18px;line-height:1.15}
.mf218-header-brand small{margin-top:3px;color:#5f7088;font-size:12px}

.mf218-header-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.mf218-header-status span{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border:1px solid #dce6f4;border-radius:999px;background:#f8fbff;color:#29445f;font-size:13px;font-weight:700;white-space:nowrap}
.mf218-header-status i{width:8px;height:8px;border-radius:50%;background:#22b573;box-shadow:0 0 0 4px rgba(34,181,115,.12)}

.mf218-header-account{display:flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0;color:#12365f}
.mf218-header-account b,.mf218-header-account small{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf218-header-account small{color:#21a366;font-size:11px}
.mf218-header-account button{min-height:40px;padding:0 15px;border:0;border-radius:13px;background:#003DA5;color:#fff;font-weight:800;cursor:pointer}
.mf218-account-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#fff2b8;border:1px solid #ffd85b}

.mf-web-long-center-v217 .mf514-grid{
  grid-row:2 !important;
  align-self:start;
  min-height:calc(100vh - var(--mf218-header-h) - var(--mf218-footer-h));
  margin:0 !important;
}

/* Remove legacy titlebar offset now that the structural header owns the top row. */
.mf-web-long-center-v217 .mf514-grid,
.mf-web-long-center-v217 .mf514-sidebar,
.mf-web-long-center-v217 .mf514-chat-pane{
  top:auto;
}

.mf218-web-footer{
  grid-row:3;
  position:relative;
  z-index:1100;
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:20px;
  min-height:var(--mf218-footer-h);
  padding:8px 22px;
  border-top:1px solid #dbe5f3;
  background:#003DA5;
  color:#fff;
}
.mf218-web-footer div{display:flex;align-items:center;gap:10px;min-width:0}
.mf218-web-footer div span,.mf218-web-footer small{color:rgba(255,255,255,.72);font-size:12px}
.mf218-web-footer nav{display:flex;align-items:center;gap:14px}
.mf218-web-footer a{color:#fff;text-decoration:none;font-size:12px;font-weight:700}
.mf218-web-footer a:hover{color:#FFC400}

@media (max-width:1180px){
  :root{--mf218-header-h:72px}
  .mf218-web-header{grid-template-columns:1fr auto;padding:8px 14px}
  .mf218-header-status{display:none}
  .mf218-web-footer{grid-template-columns:1fr auto}
  .mf218-web-footer nav{display:none}
}

@media (max-width:760px){
  :root{--mf218-header-h:64px;--mf218-footer-h:46px}
  .mf218-header-brand small,.mf218-header-account span:not(.mf218-account-avatar){display:none}
  .mf218-header-mark{width:42px;height:42px}
  .mf218-web-footer{grid-template-columns:1fr;padding:7px 12px}
  .mf218-web-footer small{display:none}
}