body {
    background: #fff;
}

.header-bar {
    background: #0d1e53;
    color: white;
    padding: 15px 10px;
}

.header-title {
    font-weight: bold;
    font-size: 26px;
    color: #08990e;
}

.table-container {
    margin: 20px auto;
    max-width: 100%;
    overflow-x: auto;
    padding: 0 10px;
}

.table-header {
    background: #C0E5C3 !important;
    color: white;
    font-size: 18px;
}

.purple td {
    background-color: #C0E5C3;
}

.bg-bright-yellow {
    background-color: yellow !important;
    color: #000 !important;
}


td {
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    border: 1px solid #333;
    white-space: nowrap;
    font-size: 22px !important;
}

.purple {
    background-color: #C0E5C3 !important;
}

.violet {
    background-color: #08990E !important;
    color: #ffff !important;
}

.footer {
    text-align: center;
    font-size: 13px;
    padding: 20px;
    color: #000;
}

@media (max-width: 576px) {
    .header-bar {
        text-align: center;
    }

    .header-title {
        font-size: 24px;
    }
}

#stickyLink {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 6px;
    text-align: center;
    font-size: 13px;
    z-index: 9999;
    border-top: 1px solid #ffffff;
    box-shadow: 0 -1px 5px rgb(255, 255, 255);
}

#stickyLink a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
}

/* PWA Top Install Banner */
#pwa-top-banner{position:fixed;left:50%;top:12px;transform:translateX(-50%);width:min(760px,calc(100% - 24px));display:flex;align-items:center;padding:12px 14px;gap:14px;z-index:2147483647;border:1px solid rgba(0,0,0,.06)}
#pwa-top-banner .pwa-logo{width:48px;height:48px;display:flex;align-items:center;justify-content:center;overflow:hidden}
#pwa-top-banner .pwa-logo img{width:100%;height:100%;object-fit:cover;}
#pwa-top-banner .pwa-copy{flex:1 1 auto;min-width:0}
#pwa-top-banner .pwa-title{margin:0 0 2px;font:700 16px system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#111827}
#pwa-top-banner .pwa-sub{margin:0;font:400 13px/1.35 system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#6b7280}
#pwa-top-banner .pwa-cta{flex:0 0 auto;border:0;border-radius:9999px;padding:10px 22px;color:#fff;background:linear-gradient(135deg,#1c611e,#0a6f0e);font:700 15px system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;cursor:pointer;box-shadow:0 8px 18px rgba(10,111,14,.35)}
#pwa-top-banner .pwa-cta:hover{filter:brightness(1.03)}
#pwa-top-banner .pwa-cta:active{transform:translateY(1px)}
#pwa-top-banner .pwa-close{display:none}
@media (max-width:480px){
  #pwa-top-banner{padding:10px;gap:10px;top:10px;width:calc(100% - 16px)}
  #pwa-top-banner .pwa-logo{width:40px;height:40px}
  #pwa-top-banner .pwa-cta{padding:8px 16px;font-weight:700}
}

/* New banner structure per request */
.pwa-install-banner{position:fixed;left:50%;top:12px;transform:translateX(-50%);width:min(760px,calc(100% - 24px));background:#ffffff;align-items:center;padding:12px 14px;gap:14px;z-index:2147483647;border:1px solid rgba(0,0,0,.06);display:none}
.pwa-install-banner.show{display:flex;border-radius:15px}
.pwa-install-banner__icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.pwa-install-banner__icon img{width:100%;height:100%;object-fit:cover;}
.pwa-install-banner__body{flex:1 1 auto;min-width:0}
.pwa-install-banner__title{margin:0 0 2px;font:700 16px system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#111827}
.pwa-install-banner__subtitle{margin:0;font:400 13px/1.35 system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#6b7280}
.pwa-install-banner__actions{flex:0 0 auto}
.pwa-btn{border:0;border-radius:9999px;padding:10px 22px;font:700 15px system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;cursor:pointer;position:relative;overflow:hidden}
.pwa-btn--primary{color:#fff;background:linear-gradient(135deg,#1c611e,#0a6f0e);box-shadow:0 8px 18px rgba(10,111,14,.35)}
.pwa-btn--primary:hover{filter:brightness(1.03)}
.pwa-btn--primary:active{transform:translateY(1px)}
/* Shiny sweep on hover/focus */
.pwa-btn--primary::after{content:"";position:absolute;top:-50%;left:-40%;width:30%;height:200%;background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.35) 50%,rgba(255,255,255,0) 100%);transform:skewX(-20deg);opacity:0;pointer-events:none}
.pwa-btn--primary:hover::after,.pwa-btn--primary:focus-visible::after{animation:pwaShine 1.6s ease;opacity:1}
@keyframes pwaShine{0%{left:-40%}100%{left:120%}}
@media (max-width:480px){
  .pwa-install-banner{padding:10px;gap:10px;top:10px;width:calc(100% - 16px)}
  .pwa-install-banner__icon{width:40px;height:40px}
  .pwa-btn{padding:8px 16px}
}
