/*! MyMahotsav system status widget (mmst) 1.0.0 | Sumit Khobragade, https://sumitkhobragade.com */
.mmst {
    --mmst-ink: #232323;
    --mmst-muted: #7d7470;
    --mmst-line: #f1e7e3;
    --mmst-gerua: #e3634f;
    --mmst-up: #1f9d63;
    --mmst-up-bar: #34b27b;
    --mmst-up-tint: #eef8f2;
    --mmst-up-edge: #cdebda;
    --mmst-mn-bar: #9ad8b5;
    --mmst-dg: #94610a;
    --mmst-dg-bar: #e3ad4f;
    --mmst-dg-tint: #fdf6e8;
    --mmst-dg-edge: #f3dfb5;
    --mmst-dn: #a3122f;
    --mmst-dn-bar: #d12c4d;
    --mmst-dn-tint: #fcedf0;
    --mmst-dn-edge: #f3c5cf;
    --mmst-mt: #22606e;
    --mmst-mt-bar: #327a8b;
    --mmst-mt-tint: #ebf4f6;
    --mmst-mt-edge: #c7e0e6;
    --mmst-nd-bar: #e9e3e0;
    --mmst-nt-tint: #f8f5f4;
    --mmst-nt-edge: #eae3e0;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 clamp(12px, 2vw, 28px) 8px;
    color: var(--mmst-ink);
    font-size: 15px;
    line-height: 1.5;
    text-align: left;
}
.mmst *, .mmst *::before, .mmst *::after { box-sizing: border-box; }
.mmst:not([data-state]) { min-height: 420px; }
.mmst p { margin: 0; }
.mmst h3 { margin: 0; }

.mmst-ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.mmst-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mmst-muted { color: var(--mmst-muted); font-size: 13px; }

/* tiles */
.mmst-tile { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 12px; background: var(--mmst-gerua); color: #fff; flex: none; }
.mmst-tile-lg { width: 52px; height: 52px; border-radius: 16px; }
.mmst-tile-lg .mmst-ico { width: 26px; height: 26px; stroke-width: 2.4; }
.mmst-tile-up { background: var(--mmst-up-bar); }
.mmst-tile-dg { background: var(--mmst-dg-bar); }
.mmst-tile-dn { background: var(--mmst-dn-bar); }
.mmst-tile-mt { background: var(--mmst-mt-bar); }
.mmst-tile-nt { background: #b9aea9; }

/* overall banner and notices */
.mmst-banner, .mmst-notice { display: flex; align-items: center; gap: 18px; border: 1px solid var(--mmst-nt-edge); background: var(--mmst-nt-tint); border-radius: 18px; }
.mmst-banner { padding: 22px 26px; }
.mmst-notice { align-items: flex-start; padding: 16px 22px; margin-top: 14px; }
.mmst-n-up { background: var(--mmst-up-tint); border-color: var(--mmst-up-edge); }
.mmst-n-dg { background: var(--mmst-dg-tint); border-color: var(--mmst-dg-edge); }
.mmst-n-dn { background: var(--mmst-dn-tint); border-color: var(--mmst-dn-edge); }
.mmst-n-mt { background: var(--mmst-mt-tint); border-color: var(--mmst-mt-edge); }
.mmst-banner-body { flex: 1 1 auto; min-width: 0; }
.mmst-banner-title { font-size: clamp(19px, 1.6vw, 24px); font-weight: 700; line-height: 1.25; }
.mmst-banner-text { margin-top: 2px; color: #4f4744; }
.mmst-banner-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; color: var(--mmst-muted); font-size: 13px; text-align: right; white-space: nowrap; }
.mmst-warn { color: var(--mmst-dg); font-weight: 600; }
.mmst-notice-title { font-weight: 700; }
.mmst-notice-text { margin-top: 4px; color: #4f4744; overflow-wrap: anywhere; }
.mmst-chip { display: inline-block; margin-left: 6px; padding: 1px 9px; border-radius: 999px; background: #fff; border: 1px solid var(--mmst-mt-edge); color: var(--mmst-mt); font-size: 12px; font-weight: 600; vertical-align: 1px; }

/* groups */
.mmst-group { margin-top: 18px; padding: 4px 26px 6px; background: #fff; border: 1px solid var(--mmst-line); border-radius: 18px; box-shadow: 0 1px 2px rgba(35, 35, 35, .04); }
.mmst-group-head { display: flex; align-items: center; gap: 12px; padding: 16px 0 14px; border-bottom: 1px solid var(--mmst-line); }
.mmst-group-title { flex: 1 1 auto; font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--mmst-ink); }
.mmst-group-count { color: var(--mmst-muted); font-size: 13px; }
.mmst-list { list-style: none; margin: 0; padding: 0; }
.mmst-svc { position: relative; display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) 132px; gap: 28px; align-items: center; padding: 15px 0; border-bottom: 1px solid #f6f0ee; }
.mmst-svc:last-child { border-bottom: 0; }
.mmst-svc-name { display: grid; grid-template-columns: 10px minmax(0, 1fr); column-gap: 10px; align-items: center; }
.mmst-name { font-weight: 600; overflow-wrap: anywhere; }
.mmst-state { grid-column: 2; font-size: 13px; font-weight: 600; }
.mmst-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--mmst-nd-bar); box-shadow: 0 0 0 3px rgba(0, 0, 0, .04); }
.mmst-dot.mmst-up { background: var(--mmst-up-bar); box-shadow: 0 0 0 3px rgba(52, 178, 123, .18); }
.mmst-dot.mmst-dg { background: var(--mmst-dg-bar); box-shadow: 0 0 0 3px rgba(227, 173, 79, .2); }
.mmst-dot.mmst-dn { background: var(--mmst-dn-bar); box-shadow: 0 0 0 3px rgba(209, 44, 77, .18); }
.mmst-dot.mmst-mt { background: var(--mmst-mt-bar); box-shadow: 0 0 0 3px rgba(50, 122, 139, .18); }
.mmst-t-up { color: var(--mmst-up); }
.mmst-t-dg { color: var(--mmst-dg); }
.mmst-t-dn { color: var(--mmst-dn); }
.mmst-t-mt { color: var(--mmst-mt); }
.mmst-t-nd { color: var(--mmst-muted); }

/* 90-day bars */
.mmst-bars { display: flex; gap: 3px; height: 30px; }
.mmst-bar { display: block; flex: 1 1 0; min-width: 2px; height: 100%; border-radius: 3px; background: var(--mmst-nd-bar); transition: transform .12s ease, filter .12s ease; transform-origin: bottom; }
.mmst-bars .mmst-bar:hover { transform: scaleY(1.14); filter: brightness(.94); }
.mmst-b-up { background: var(--mmst-up-bar); }
.mmst-b-mn { background: var(--mmst-mn-bar); }
.mmst-b-dg { background: var(--mmst-dg-bar); }
.mmst-b-dn { background: var(--mmst-dn-bar); }
.mmst-b-nd { background: var(--mmst-nd-bar); }
.mmst-axis { display: flex; justify-content: space-between; margin-top: 6px; color: var(--mmst-muted); font-size: 12px; }
.mmst-svc-up { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.mmst-svc-up b { font-size: 16px; font-weight: 700; line-height: 1.2; }
.mmst-svc-up span { color: var(--mmst-muted); font-size: 12px; }
.mmst-w30 { display: none; }

/* legend, events, foot */
.mmst-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 14px 4px 0; color: var(--mmst-muted); font-size: 12px; }
.mmst-legend span { display: inline-flex; align-items: center; gap: 7px; }
.mmst-legend .mmst-bar { flex: none; width: 8px; height: 14px; }
.mmst-events-list { list-style: none; margin: 0; padding: 6px 0; }
.mmst-events-list li { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 0; border-bottom: 1px solid #f6f0ee; }
.mmst-events-list li:last-child { border-bottom: 0; }
.mmst-events-list .mmst-dot { margin-top: 7px; }
.mmst-empty { display: flex; align-items: center; gap: 10px; padding: 16px 0 14px; color: #4f4744; }
.mmst-ico-up { color: var(--mmst-up); }
.mmst-foot { margin: 16px 4px 0; color: var(--mmst-muted); font-size: 13px; }

/* tooltip */
.mmst-tip { position: absolute; z-index: 5; transform: translateX(-50%); padding: 6px 10px; border-radius: 8px; background: var(--mmst-ink); color: #fff; font-size: 12px; line-height: 1.3; white-space: nowrap; pointer-events: none; box-shadow: 0 6px 18px rgba(35, 35, 35, .18); }
.mmst-tip::after { content: ""; position: absolute; left: 50%; bottom: -5px; width: 10px; height: 10px; background: inherit; transform: translateX(-50%) rotate(45deg); border-radius: 2px; }
.mmst-tip[hidden] { display: none; }

/* phones and narrow columns: 30 days */
@media (max-width: 900px) {
    .mmst-svc { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; padding: 14px 0; }
    .mmst-svc-bars { grid-column: 1 / -1; grid-row: 2; }
    .mmst-svc-up { grid-column: 2; grid-row: 1; }
    .mmst-bars .mmst-bar:nth-child(-n+60) { display: none; }
    .mmst-bars { height: 26px; }
    .mmst-w90 { display: none; }
    .mmst-w30 { display: inline; }
    .mmst-svc-up .mmst-w30 { display: block; }
    .mmst-banner { flex-wrap: wrap; padding: 18px; }
    .mmst-banner-meta { flex-direction: row; flex-wrap: wrap; gap: 4px 14px; width: 100%; align-items: flex-start; text-align: left; white-space: normal; }
    .mmst-group { padding: 2px 16px 4px; }
}

/* blueprint loader (printed with the page, replaced by the widget) */
.mmst-bp { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 56px 16px 40px; color: var(--mmst-gerua); }
.mmst-bp svg { width: min(440px, 100%); height: auto; overflow: visible; animation: mmst-bp-breathe 2.6s ease-in-out 2.4s infinite; }
.mmst-bp svg * { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 800; stroke-dashoffset: 800; animation: mmst-bp-draw 1.5s ease forwards; animation-delay: calc(var(--mmst-bp-i, 0) * 105ms); }
.mmst-bp svg .mmst-bp-faint { stroke: #cdbfba; stroke-width: 1; }
.mmst-bp svg .mmst-bp-ok { stroke: #34b27b; stroke-width: 2.4; }
.mmst-bp-cap { margin: 0; color: #7d7470; font: 600 12px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .14em; text-transform: uppercase; }
.mmst-bp-dots i { display: inline-block; width: 4px; height: 4px; margin-left: 4px; border-radius: 50%; background: currentColor; animation: mmst-bp-dot 1.2s ease-in-out infinite; }
.mmst-bp-dots i:nth-child(2) { animation-delay: .2s; }
.mmst-bp-dots i:nth-child(3) { animation-delay: .4s; }
@keyframes mmst-bp-draw { to { stroke-dashoffset: 0; } }
@keyframes mmst-bp-breathe { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
@keyframes mmst-bp-dot { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-2px); } }
@media (prefers-reduced-motion: reduce) {
    .mmst-bp svg, .mmst-bp svg *, .mmst-bp-dots i { animation: none; stroke-dashoffset: 0; }
    .mmst-bar { transition: none; }
}