:root{--orangtua-primary:#17a2b8;--orangtua-accent:#007bff;--orangtua-text:#212529}
*{box-sizing:border-box}
[hidden]{display:none!important}
.orangtua-login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,var(--orangtua-primary),var(--orangtua-accent));position:relative;color:var(--orangtua-text)}
.orangtua-login-page:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 10% 15%,rgba(255,255,255,.24),transparent 31%),radial-gradient(circle at 90% 85%,rgba(255,255,255,.16),transparent 29%);pointer-events:none}
.orangtua-login-card{position:relative;width:100%;max-width:430px;background:#fff;padding:34px;border-radius:24px;box-shadow:0 24px 60px rgba(15,23,42,.28)}
.orangtua-login-logo{width:82px;height:82px;object-fit:contain;margin-bottom:12px}
.portal-label{display:inline-block;padding:5px 10px;margin-bottom:8px;border-radius:999px;background:rgba(23,162,184,.12);color:var(--orangtua-primary);font-size:.72rem;font-weight:700;letter-spacing:.08em}
.orangtua-login-card h1{font-size:1.7rem;font-weight:700;margin:0;color:var(--orangtua-text)}
.orangtua-login-card p{color:#6c757d}
.orangtua-login-card .form-control,.orangtua-login-card .input-group-text,.orangtua-login-card .btn{border-radius:10px}
.orangtua-login-card .input-group>.form-control:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.orangtua-login-card .input-group-append .input-group-text,.orangtua-login-card .input-group-append .btn{border-top-left-radius:0;border-bottom-left-radius:0}
.orangtua-login-card .btn-primary{background:linear-gradient(90deg,var(--orangtua-primary),var(--orangtua-accent));border:0;font-weight:600}
.orangtua-login-help{text-align:center;color:#6c757d;font-size:.87rem;margin:24px 0 12px}
.kembali-login{display:block;text-align:center;font-size:.86rem;color:var(--orangtua-primary)}
@media(max-width:575.98px){.orangtua-login-page{padding:16px}.orangtua-login-card{padding:26px 20px;border-radius:20px}.orangtua-login-logo{width:72px;height:72px}.orangtua-login-card h1{font-size:1.5rem}}

.btn-install-pwa{border-radius:999px;font-weight:600;white-space:nowrap}
.install-pwa-card{border:0;border-radius:18px;background:linear-gradient(135deg,rgba(23,162,184,.12),rgba(0,123,255,.10));box-shadow:0 10px 30px rgba(15,23,42,.06)}
.install-pwa-card .install-icon{width:52px;height:52px;flex:0 0 52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--orangtua-primary);color:#fff;font-size:1.35rem}
.notification-center-card{border:0;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(15,23,42,.07)}
.notification-row{position:relative;display:flex;align-items:flex-start;gap:15px;padding:18px 20px;border-top:1px solid #edf0f3;background:#fff}
.notification-row.is-unread{background:rgba(23,162,184,.07);border-left:4px solid var(--orangtua-primary)}
.notification-icon{width:44px;height:44px;flex:0 0 44px;border-radius:14px;background:#f1f4f7;display:flex;align-items:center;justify-content:center;font-size:1.15rem}
.notification-copy{flex:1;min-width:0}.notification-copy p{margin:5px 0 7px}.notification-action{margin-left:auto}
.notification-empty{text-align:center;color:#6c757d;padding:64px 20px}
.navbar-notification-badge{position:absolute;top:3px;right:1px;font-size:.65rem;min-width:17px}
.navbar-install-pwa{margin-right:6px}
@media(max-width:575.98px){.notification-row{padding:15px 14px;gap:10px}.notification-icon{width:38px;height:38px;flex-basis:38px}.notification-action{position:absolute;right:10px;bottom:10px}.navbar-install-pwa [data-install-label]{display:none}.navbar-install-pwa{padding-left:10px!important;padding-right:10px!important}}