/* v28 -- additive, isolated fixes above v27. No modification to original app.css. */
/* Full-width bottom menu follows the page. It does NOT cover content. */
html body.vs27 #portal{display:flex!important;flex-direction:column!important;min-height:100dvh!important;}
html body.vs27 #portal main{flex:1 0 auto!important;min-height:0!important;padding-bottom:0!important;}
html body.vs27 #portal #bottomMenu.bottom-menu{
 position:static!important;inset:auto!important;bottom:auto!important;left:auto!important;right:auto!important;top:auto!important;
 transform:none!important;display:flex!important;align-self:stretch!important;width:100%!important;max-width:100%!important;
 flex-shrink:0!important;margin:0!important;min-height:66px!important;
 padding:6px max(6px,env(safe-area-inset-right,0px)) calc(7px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px))!important;
 box-sizing:border-box!important;border-radius:14px 14px 0 0!important;box-shadow:none!important;
}
html body.vs27 #portal #bottomMenu.bottom-menu[hidden]{display:none!important;}
html body.vs27 #portal #bottomMenu.bottom-menu button{min-height:53px!important;padding:6px 3px!important;}
@media(max-width:600px){html body.vs27 #portal main{padding-bottom:0!important;}}
/* Do not show party masthead twice inside the member profile card. */
body.vs27 #profileCardView .member-top,
body.vs27 #profileCardView .member-divider,
body.vs27 #profileCardView .member-label{display:none!important;}
body.vs27 #profileCardView .member-card{padding-top:0;overflow:hidden;}
body.vs27 #profileCardView .member-body{padding-top:20px;}
body.vs27 #profileCardView .member-stripe{height:5px;}
body.vs27 #profileCardView .member-photo{cursor:zoom-in;}
/* Live profile-photo enlargement: only image-sized popup, centered, never an enormous blank box. */
html body.vs27 dialog#vs27PhotoDialog.vs27-photo-dialog[open]{
 box-sizing:content-box!important;display:block!important;position:fixed!important;
 inset:0!important;left:0!important;right:0!important;top:0!important;bottom:0!important;
 width:max-content!important;height:max-content!important;min-width:0!important;min-height:0!important;
 max-width:calc(100vw - 38px)!important;max-height:calc(100dvh - 34px)!important;
 padding:6px!important;margin:auto!important;border:2px solid #fff!important;border-radius:13px!important;
 background:transparent!important;overflow:visible!important;scrollbar-gutter:auto!important;
 line-height:0!important;box-shadow:0 20px 65px #000a!important;
}
html body.vs27 dialog#vs27PhotoDialog.vs27-photo-dialog:not([open]){display:none!important;}
html body.vs27 #vs27PhotoDialog.vs27-photo-dialog img{
 display:block!important;width:auto!important;height:auto!important;
 max-width:min(82vw,600px)!important;max-height:calc(100dvh - 65px)!important;
 object-fit:contain!important;object-position:center!important;border-radius:9px!important;
}
html body.vs27 #vs27PhotoDialog .vs27-photo-close{width:34px;height:34px;right:-10px;top:-10px;line-height:1!important;}
/* Add photo edit near dashboard headshot without changing the picture zoom behavior. */
body.vs27 .vs27-welcome{position:relative;padding-right:clamp(108px,16vw,152px);}
body.vs27 #vs28PhotoEdit{
 position:absolute;right:16px;bottom:13px;width:clamp(93px,12vw,122px);min-height:30px;
 background:#fff4e8;color:#af4c0d;border:1px solid #ffd2ac;border-radius:9px;
 padding:5px 3px;font-size:11px;line-height:1.3;font-weight:750;cursor:pointer;z-index:1;
}
body.vs27 #vs28PhotoEdit:hover{background:#ffe8d5;}
body.vs27 .vs27-profile-picture{align-self:flex-start;}
@media(max-width:600px){body.vs27 .vs27-welcome{padding-right:105px!important;}body.vs27 #vs28PhotoEdit{right:11px;bottom:10px;width:88px;font-size:10px;}body.vs27 .vs27-profile-picture{margin-right:9px;}}
/* ID card entry / actions */
body.vs27 .vs28-profile-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
body.vs27 .vs28-profile-actions button{white-space:normal;}
body.vs27 .vs28-id-dialog{box-sizing:border-box;width:min(96vw,690px);max-width:min(96vw,690px);max-height:min(96dvh,900px);padding:16px;border:1px solid #f8c5a2;border-radius:16px;box-shadow:0 14px 46px #0005;background:#fff;color:#193825;overflow-y:auto;}
body.vs27 .vs28-id-dialog::backdrop{background:#0009;}
body.vs27 .vs28-id-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
body.vs27 .vs28-id-dialog-head h2{font-size:19px;line-height:1.4;margin:0;}
body.vs27 .vs28-icon-close{border:0;border-radius:50%;background:#fff1e9;color:#ad430b;min-width:39px;height:39px;}
body.vs27 .vs28-id-select{display:grid;gap:5px;max-width:330px;margin:10px 0 14px;}
body.vs27 .vs28-id-select label{font-weight:750;font-size:13px;}
body.vs27 .vs28-id-select select{padding:9px;min-height:43px;}
body.vs27 .vs28-card-stage{display:flex;align-items:center;justify-content:center;max-width:100%;overflow-x:auto;padding:8px 0 12px;}
body.vs27 .vs28-id-card{--fest-1:#ed6200;--fest-2:#fcad27;--fest-bg:#fff3e6;--fest-foot:#145b38;
 position:relative;flex-shrink:0;width:min(100%,575px);aspect-ratio:86/54;max-height:none;overflow:hidden;
 border:1px solid #e3b28e;border-radius:15px;background:linear-gradient(135deg,#fffefa,var(--fest-bg));
 color:#193926;box-shadow:0 7px 25px #8b441e20;font-family:'Segoe UI',Arial,sans-serif;}
body.vs27 .vs28-id-card:before{content:'';position:absolute;right:-70px;top:-70px;width:180px;height:180px;border-radius:50%;background:#ffffff30;pointer-events:none;}
body.vs27 .vs28-card-top{display:flex;align-items:center;gap:10px;padding:8px 14px;background:linear-gradient(110deg,var(--fest-1),var(--fest-2));color:#fff;}
body.vs27 .vs28-card-top img{width:33px;height:33px;object-fit:contain;border-radius:6px;background:#fff;padding:2px;}
body.vs27 .vs28-card-top strong{display:block;font-size:clamp(13px,2vw,19px);line-height:1.18;}
body.vs27 .vs28-card-top small{display:block;font-size:clamp(9px,1.4vw,12px);}
body.vs27 .vs28-card-main{display:flex;align-items:center;gap:15px;padding:13px 18px 7px;min-height:0;}
body.vs27 .vs28-card-photo-wrap{flex:0 0 clamp(72px,20%,113px);height:clamp(90px,21vw,142px);border:2px solid var(--fest-1);border-radius:10px;overflow:hidden;display:grid;place-items:center;background:#fff;}
body.vs27 .vs28-card-photo-wrap img{width:100%;height:100%;object-fit:cover;}
body.vs27 .vs28-card-photo-wrap span{color:#77877d;font-size:12px;}
body.vs27 .vs28-card-copy{min-width:0;flex:1;}
body.vs27 .vs28-card-copy>strong{display:block;font-size:clamp(15px,2.5vw,24px);line-height:1.2;overflow-wrap:anywhere;margin-bottom:3px;color:#18492c;}
body.vs27 .vs28-card-role{color:#bf520a;font-weight:800;margin-bottom:6px;font-size:clamp(11px,1.9vw,15px);}
body.vs27 .vs28-card-info{display:grid;grid-template-columns:95px minmax(0,1fr);align-items:baseline;gap:8px;padding:2px 0;line-height:1.35;font-size:clamp(10px,1.8vw,13px);}
body.vs27 .vs28-card-info span{color:#5d715e;}
body.vs27 .vs28-card-info b{font-weight:700;overflow-wrap:anywhere;}
body.vs27 .vs28-card-foot{position:absolute;left:0;right:0;bottom:0;min-height:25px;display:flex;align-items:center;justify-content:space-between;gap:5px;padding:4px 13px;background:var(--fest-foot);color:#fff;font-weight:600;font-size:11px;}
body.vs27 .vs28-id-card[data-design=diwali]{--fest-1:#b33a00;--fest-2:#f3ae20;--fest-bg:#fff2d1;--fest-foot:#794216;}
body.vs27 .vs28-id-card[data-design=holi]{--fest-1:#dc3b7c;--fest-2:#ef8933;--fest-bg:#f2e9ff;--fest-foot:#68539c;}
body.vs27 .vs28-id-card[data-design=navratri]{--fest-1:#9e1a36;--fest-2:#e27514;--fest-bg:#fff0e5;--fest-foot:#9e1a36;}
body.vs27 .vs28-id-card[data-design=makar]{--fest-1:#2774b5;--fest-2:#f3a21a;--fest-bg:#e9f9ff;--fest-foot:#174e75;}
body.vs27 .vs28-id-card[data-design=independence]{--fest-1:#f56d00;--fest-2:#118d4d;--fest-bg:#efffed;--fest-foot:#145b38;}
body.vs27 .vs28-id-disclaimer{font-size:11px;color:#63756a;margin:5px 2px 14px;text-align:center;line-height:1.5;}
body.vs27 .vs28-id-dialog-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
body.vs27 .vs28-id-dialog-actions button{min-width:105px;}
@media(max-width:500px){body.vs27 .vs28-id-dialog{padding:12px;}body.vs27 .vs28-card-main{gap:8px;padding:9px 9px 16px;}body.vs27 .vs28-card-photo-wrap{flex-basis:22%;height:clamp(70px,19vw,104px);}body.vs27 .vs28-card-info{grid-template-columns:68px minmax(0,1fr);gap:4px;font-size:9px;padding:1px 0;}body.vs27 .vs28-card-copy>strong{font-size:15px;}body.vs27 .vs28-card-role{font-size:10px;margin-bottom:2px;}body.vs27 .vs28-card-foot{font-size:8px;padding:4px 8px;min-height:20px;}body.vs27 .vs28-card-top{padding:6px 9px;gap:6px;}body.vs27 .vs28-card-top img{width:26px;height:26px;}body.vs27 .vs28-card-top strong{font-size:12px;}body.vs27 .vs28-card-top small{font-size:8px;}body.vs27 .vs28-profile-actions button{font-size:12px;padding:8px;}}
html[data-theme=dark] body.vs27 .vs28-id-dialog{background:#18271f;color:#eef5ee;border-color:#486047;}
html[data-theme=dark] body.vs27 .vs28-id-select label,html[data-theme=dark] body.vs27 .vs28-id-disclaimer{color:#e3eee6;}
@media print{html body.vs27 #portal #bottomMenu.bottom-menu{display:none!important;}}
