@import url('https://fonts.googleapis.com/css2?family=Anton&family=Oswald:wght@500;700&display=swap');
body{margin:0;background:#111;font-family:Oswald,Arial,sans-serif}.poster{max-width:900px;min-height:1280px;margin:0 auto;color:#fff;position:relative;background:linear-gradient(rgba(0,0,0,.38),rgba(0,0,0,.62)),url('../../assets/img/default-bg.jpg') center/cover no-repeat;overflow:hidden}.poster-inner{padding:42px 42px 28px}.header{text-align:center;text-transform:uppercase;letter-spacing:12px}.logo{position:absolute;top:88px;left:85px;width:68px;height:68px;object-fit:contain;background:#fff}.subtitle{font-size:30px}.title{font-family:Anton,Arial;font-size:57px;letter-spacing:2px;color:var(--bank-color,var(--theme,#7ed321));line-height:1}.date{font-size:45px;letter-spacing:18px;margin-top:42px}.hijri{font-family:Georgia,serif;font-size:34px;font-weight:bold;letter-spacing:10px}.prayer-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:70px;text-align:center}.prayer-name{font-family:Anton,Arial;font-size:38px;text-shadow:2px 2px 3px #000}.imam-img{height:220px;width:100%;object-fit:cover;object-position:top center;margin-top:75px}.namebar{background:rgba(0,0,0,.58);color:var(--theme,#7ed321);font-family:Anton,Arial;font-size:20px;padding:6px 3px;text-transform:uppercase}.bilal-img{height:180px;width:100%;object-fit:cover;object-position:top center;background:var(--theme,#7ed321);margin-top:4px}.footer{display:grid;grid-template-columns:165px 1fr;gap:18px;margin-top:45px;align-items:start}.qr{width:165px;height:165px;object-fit:contain;background:#fff}.bank{font-family:Anton,Arial;font-size:42px;color:var(--theme,#7ed321);text-transform:uppercase;line-height:1}.acc{font-family:Anton,Arial;font-size:35px}.note{font-size:18px;color:var(--theme,#7ed321);text-transform:uppercase}.tnb{font-family:Anton,Arial;font-size:34px;margin-top:8px;display:flex;gap:12px;align-items:center}.tnbbox{background:#fff;color:#333;padding:6px 14px;border-radius:3px;font-family:Arial,sans-serif;font-size:16px}.missing{background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:#ddd}.public-nav{max-width:900px;margin:0 auto;padding:12px;background:#fff;display:flex;gap:8px}.public-nav input{padding:8px}.public-nav button{padding:8px 12px}@media(max-width:720px){.poster{min-height:auto}.poster-inner{padding:30px 18px}.subtitle{font-size:20px}.title{font-size:34px}.date{font-size:28px;letter-spacing:9px}.hijri{font-size:22px;letter-spacing:4px}.prayer-row{gap:5px;margin-top:35px}.prayer-name{font-size:22px}.imam-img{height:125px;margin-top:30px}.bilal-img{height:105px}.namebar{font-size:12px}.footer{grid-template-columns:95px 1fr}.qr{width:95px;height:95px}.bank{font-size:25px}.acc{font-size:20px}.tnb{font-size:20px}.logo{width:45px;height:45px;top:55px;left:22px}}
/* Hotfix: waktu solat, label Jumaat, dan spacing logo/title */
.header.has-logo .title{padding-left:105px;}
.prayer-time{font-family:Anton,Arial,sans-serif;font-size:24px;font-weight:400;letter-spacing:2px;color:#fff;text-shadow:2px 2px 3px #000;margin-top:6px;min-height:30px;text-transform:uppercase;}
.prayer-row .imam-img{margin-top:42px;}
@media(max-width:720px){.header.has-logo .title{padding-left:54px}.prayer-time{font-size:14px;letter-spacing:1px;min-height:18px;margin-top:3px}.prayer-row .imam-img{margin-top:22px}}
/* Hotfix: mobile responsive public poster */
*{box-sizing:border-box}
html,body{width:100%;overflow-x:hidden}
.public-nav{width:100%;box-sizing:border-box;align-items:center;flex-wrap:wrap}
.public-nav input,.public-nav button{font-family:inherit;font-size:16px}
.poster{width:100%;box-sizing:border-box}
.prayer-row>div{min-width:0}
@media(max-width:900px){
.poster,.public-nav{max-width:100%;}
.poster-inner{padding-left:28px;padding-right:28px;}
.subtitle{font-size:clamp(18px,4vw,30px);letter-spacing:clamp(4px,1.2vw,12px)}
.title{font-size:clamp(36px,7vw,57px);}
.date{font-size:clamp(28px,6vw,45px);letter-spacing:clamp(6px,2vw,18px)}
.hijri{font-size:clamp(22px,4.6vw,34px);letter-spacing:clamp(3px,1.3vw,10px)}
}
@media(max-width:640px){
body{background:#111;}
.public-nav{padding:10px;gap:10px;justify-content:center;}
.public-nav input{width:calc(100% - 90px);max-width:220px;}
.public-nav button{min-width:72px;}
.poster{margin:0 auto;min-height:auto;}
.poster-inner{padding:24px 16px 24px;}
.logo{position:static;display:block;width:64px;height:64px;margin:0 auto 10px;}
.header{text-align:center;letter-spacing:6px;}
.header.has-logo .title{padding-left:0;}
.subtitle{font-size:18px;letter-spacing:5px;line-height:1.2;}
.title{font-size:38px;line-height:1.05;letter-spacing:1px;}
.date{font-size:30px;letter-spacing:8px;margin-top:28px;}
.hijri{font-size:22px;letter-spacing:4px;line-height:1.2;}
.prayer-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:34px;}
.prayer-name{font-size:26px;line-height:1.1;}
.prayer-time{font-size:17px;letter-spacing:1px;min-height:22px;margin-top:4px;}
.prayer-row .imam-img{height:170px;margin-top:18px;}
.bilal-img{height:145px;}
.namebar{font-size:16px;line-height:1.15;padding:7px 4px;}
.footer{grid-template-columns:1fr;gap:12px;margin-top:28px;text-align:center;}
.qr{width:125px;height:125px;margin:0 auto;}
.bank{font-size:30px;line-height:1.05;}
.acc{font-size:25px;}
.note{font-size:15px;}
.tnb{font-size:24px;justify-content:center;flex-wrap:wrap;gap:8px;}
.tnbbox{font-size:14px;line-height:1.35;}
}
@media(max-width:420px){
.poster-inner{padding:20px 12px;}
.subtitle{font-size:16px;letter-spacing:4px;}
.title{font-size:32px;}
.date{font-size:25px;letter-spacing:6px;}
.hijri{font-size:19px;letter-spacing:3px;}
.prayer-row{grid-template-columns:1fr;gap:16px;}
.prayer-name{font-size:30px;}
.prayer-time{font-size:18px;}
.prayer-row .imam-img{height:220px;margin-top:14px;}
.bilal-img{height:190px;}
.namebar{font-size:18px;}
.bank{font-size:27px;}
.acc{font-size:23px;}
}
/* Hotfix: mobile date compact single line */
@media(max-width:640px){
.date{
font-family:Oswald,Arial,sans-serif;
font-size:clamp(22px,7vw,30px);
letter-spacing:2px;
word-spacing:4px;
white-space:nowrap;
line-height:1.15;
margin-top:24px;
}
.hijri{
font-family:Georgia,serif;
font-size:clamp(18px,5vw,22px);
letter-spacing:2px;
white-space:nowrap;
}
}
@media(max-width:420px){
.date{
font-size:23px;
letter-spacing:1px;
word-spacing:3px;
white-space:nowrap;
}
.hijri{
font-size:18px;
letter-spacing:1px;
white-space:nowrap;
}
}
/* Hotfix: compact poster display date + prevent mobile blank layout issues */
.date{
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 8px !important;
white-space: nowrap !important;
}
.date-label{letter-spacing:10px;}
.date-value{letter-spacing:4px;}
@media(max-width:720px){
.date{font-size:30px !important;letter-spacing:3px !important;white-space:nowrap !important;}
.date-label{letter-spacing:6px !important;}
.date-value{letter-spacing:1px !important;}
}
@media(max-width:430px){
.date{font-size:26px !important;letter-spacing:1px !important;}
.date-label{letter-spacing:4px !important;}
.date-value{letter-spacing:0 !important;}
}
/* Hotfix: uniform name box height + full year date support */
.namebar{
min-height:58px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
line-height:1.15;
white-space:normal;
}
.date-value{letter-spacing:0 !important;}
@media(max-width:720px){
.namebar{min-height:54px;}
.date{font-size:26px !important;letter-spacing:1px !important;}
.date-label{letter-spacing:4px !important;}
.date-value{letter-spacing:0 !important;}
}
@media(max-width:430px){
.namebar{min-height:58px;}
.date{font-size:22px !important;letter-spacing:0 !important;}
.date-label{letter-spacing:2px !important;}
}
/* Hotfix: revise poster date display for mobile - standard font, compact, no wrap */
.date,
.hijri{
font-family:Oswald,Arial,sans-serif !important;
text-transform:uppercase;
white-space:nowrap !important;
text-align:center;
}
.date{
letter-spacing:2px !important;
word-spacing:0 !important;
line-height:1.1;
}
.date-label,
.date-value{
letter-spacing:2px !important;
}
.hijri{
letter-spacing:2px !important;
line-height:1.12;
font-weight:700;
}
@media(max-width:720px){
.date{
font-size:clamp(21px,5.8vw,30px) !important;
letter-spacing:1px !important;
margin-top:22px;
}
.date-label,
.date-value{
letter-spacing:1px !important;
}
.hijri{
font-size:clamp(19px,5.3vw,25px) !important;
letter-spacing:1px !important;
}
}
@media(max-width:430px){
.date{
font-size:clamp(18px,5.6vw,23px) !important;
letter-spacing:0 !important;
}
.date-label,
.date-value{
letter-spacing:0 !important;
}
.hijri{
font-size:clamp(17px,5vw,20px) !important;
letter-spacing:0 !important;
}
}
@media(max-width:360px){
.date{font-size:17px !important;}
.hijri{font-size:16px !important;}
}
/* Hotfix: force mobile layout to match Chrome-style poster view on all mobile browsers */
@media(max-width:640px){
.poster{max-width:100%;min-height:auto;overflow:hidden;}
.poster-inner{padding:24px 18px 24px;}
.logo{position:absolute;display:block;width:52px;height:52px;top:70px;left:28px;margin:0;}
.header{letter-spacing:5px;text-align:center;}
.header.has-logo .title{padding-left:58px;}
.subtitle{font-size:clamp(18px,5vw,26px);letter-spacing:clamp(5px,1.8vw,9px);line-height:1.45;}
.title{font-size:clamp(34px,9vw,46px);line-height:1.02;letter-spacing:1px;}
.date{font-size:clamp(23px,6.5vw,33px) !important;margin-top:34px;line-height:1.15;}
.hijri{font-size:clamp(19px,5.4vw,28px) !important;line-height:1.15;}
.prayer-row{grid-template-columns:repeat(5,minmax(0,1fr)) !important;gap:6px !important;margin-top:44px;text-align:center;}
.prayer-name{font-size:clamp(18px,5.2vw,26px);line-height:1.05;white-space:nowrap;}
.prayer-time{font-size:clamp(13px,3.8vw,18px);line-height:1.1;letter-spacing:0;white-space:nowrap;}
.prayer-row .imam-img{height:clamp(130px,38vw,185px);margin-top:28px;}
.bilal-img{height:clamp(120px,35vw,170px);}
.namebar{font-size:clamp(11px,3.2vw,16px);min-height:54px;line-height:1.18;padding:5px 2px;}
.footer{grid-template-columns:130px 1fr;gap:14px;margin-top:38px;text-align:left;align-items:start;}
.qr{width:130px;height:130px;}
.bank{font-size:clamp(28px,8vw,42px);line-height:1.05;}
.acc{font-size:clamp(22px,6vw,34px);}
.note{font-size:clamp(14px,4vw,18px);}
.tnb{font-size:clamp(22px,6vw,34px);justify-content:flex-start;flex-wrap:nowrap;}
.tnbbox{font-size:clamp(12px,3.5vw,16px);}
}
@media(max-width:430px){
.poster-inner{padding-left:14px;padding-right:14px;}
.logo{width:46px;height:46px;top:72px;left:20px;}
.header.has-logo .title{padding-left:48px;}
.subtitle{font-size:20px;letter-spacing:5px;}
.title{font-size:36px;}
.date{font-size:24px !important;}
.hijri{font-size:20px !important;}
.prayer-row{grid-template-columns:repeat(5,minmax(0,1fr)) !important;gap:5px !important;margin-top:34px;}
.prayer-name{font-size:22px;}
.prayer-time{font-size:14px;}
.prayer-row .imam-img{height:130px;margin-top:26px;}
.bilal-img{height:122px;}
.namebar{font-size:12px;min-height:50px;}
.footer{grid-template-columns:108px 1fr;gap:12px;}
.qr{width:108px;height:108px;}
.bank{font-size:28px;}
.acc{font-size:22px;}
}
/* Hotfix v4: split bank name color from mosque account name */
.title{color:var(--theme,#7ed321)!important;}
.bank{color:var(--theme,#7ed321)!important;}
.bank .bank-name{color:var(--bank-color,var(--theme,#7ed321))!important;}
.bank .bank-account-name{color:var(--theme,#7ed321)!important;}
.acc{white-space:nowrap;}
/* Hotfix: TNB/JomPAY original style payment box */
.tnb{align-items:center!important;gap:10px!important;flex-wrap:nowrap!important;}
.tnb-label{line-height:1.05;white-space:nowrap;}
.tnbpaybox{display:inline-flex;align-items:center;background:#fff;color:#222;border:2px solid #777;border-radius:2px;padding:4px 10px 4px 4px;gap:6px;font-family:Arial,sans-serif;line-height:1.15;}
.tnb-icon,.jompay-icon{width:42px;height:42px;object-fit:contain;flex:0 0 auto;}
.tnb-info{display:flex;flex-direction:column;gap:2px;white-space:nowrap;font-size:17px;}
.tnb-info b{font-weight:700;}
.tnbbox{display:none!important;}
@media(max-width:720px){.tnb{gap:6px!important;}.tnbpaybox{padding:3px 6px 3px 3px;gap:4px;}.tnb-icon,.jompay-icon{width:34px;height:34px;}.tnb-info{font-size:12px;}}
/* Hotfix: BILL TNB single line on desktop, wrap only on mobile */
.tnb-label{display:inline-flex!important;align-items:center!important;white-space:nowrap!important;line-height:1!important;}
.tnb-mobile-break{display:inline!important;}
@media(max-width:720px){
.tnb-label{display:inline-flex!important;flex-direction:column!important;align-items:flex-start!important;white-space:normal!important;line-height:1.05!important;}
.tnb-mobile-break{display:block!important;}
}
/* Hotfix v3: mobile BILL/TNB label exactly 2 lines */
@media (max-width:720px){
.tnb{
align-items:center!important;
gap:6px!important;
}
.tnb-label{
display:inline-flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:center!important;
flex:0 0 auto!important;
width:auto!important;
max-width:none!important;
font-size:clamp(18px,5.2vw,24px)!important;
line-height:.95!important;
white-space:nowrap!important;
}
.tnb-label span{
display:block!important;
white-space:nowrap!important;
}
.tnb-mobile-break{
display:block!important;
}
.tnbpaybox{
min-width:0!important;
}
}
/* Hotfix v4: restore desktop spacing between BILL and TNB */
.tnb-label .tnb-mobile-break{margin-left:.22em!important;}
@media(max-width:720px){
.tnb-label .tnb-mobile-break{margin-left:0!important;}
}
.public-nav .pub-link{background:var(--theme,#7ed321);color:#07130b;border-radius:999px;padding:9px 13px;text-decoration:none;font-weight:800;display:inline-block}
/* Patch v4.12: standardize public filter controls like Tazkirah view */
.public-nav{
max-width:100% !important;
margin:0 auto !important;
padding:10px 12px !important;
background:rgba(6,18,12,.94) !important;
display:flex !important;
gap:10px !important;
justify-content:center !important;
align-items:center !important;
flex-wrap:wrap !important;
}
.public-nav input,
.public-nav select{
height:42px !important;
border:0 !important;
border-radius:999px !important;
padding:0 18px !important;
background:#fff !important;
color:#07130b !important;
font-family:Oswald,Arial,sans-serif !important;
font-size:15px !important;
font-weight:700 !important;
line-height:1 !important;
box-shadow:none !important;
}
.public-nav input[type="date"]{
width:220px !important;
max-width:calc(100vw - 120px) !important;
}
.public-nav button,
.public-nav .pub-link,
.public-nav a{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
min-height:42px !important;
padding:0 20px !important;
border:0 !important;
border-radius:999px !important;
background:var(--theme,#7ed321) !important;
color:#07130b !important;
font-family:Oswald,Arial,sans-serif !important;
font-size:15px !important;
font-weight:800 !important;
line-height:1 !important;
text-decoration:none !important;
white-space:nowrap !important;
cursor:pointer !important;
}
@media(max-width:520px){
.public-nav input[type="date"]{width:190px !important;max-width:100% !important;}
.public-nav button,.public-nav .pub-link,.public-nav a{padding:0 16px !important;font-size:14px !important;}
}
/* Patch v4.18.1: standardize public filter/button typography across Index & Tazkirah */
.public-nav input,
.public-nav select,
.public-nav button,
.public-nav .pub-link,
.public-nav a{
font-family: Arial, Helvetica, sans-serif !important;
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
}
.public-nav button,
.public-nav .pub-link,
.public-nav a{
height: 42px !important;
min-height: 42px !important;
padding: 0 20px !important;
border-radius: 999px !important;
}
@media(max-width:520px){
.public-nav input,
.public-nav select,
.public-nav button,
.public-nav .pub-link,
.public-nav a{
font-size: 14px !important;
}
}
/* Patch v4.23.1: Public index admin link responsive layout */
.public-nav .public-nav-links{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
gap:10px !important;
flex-wrap:nowrap !important;
}
.public-nav .admin-link{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:42px !important;
min-height:42px !important;
padding:0 20px !important;
border:0 !important;
border-radius:999px !important;
background:#ffffff !important;
color:#07130b !important;
font-family:Arial, Helvetica, sans-serif !important;
font-size:15px !important;
font-weight:700 !important;
line-height:1 !important;
text-decoration:none !important;
white-space:nowrap !important;
}
.public-nav .admin-link:hover{opacity:.9;}
@media(max-width:520px){
.public-nav .public-nav-links{
width:100% !important;
gap:12px !important;
}
.public-nav .admin-link{
background:transparent !important;
color:var(--theme,#7ed321) !important;
padding:0 !important;
height:auto !important;
min-height:0 !important;
border-radius:0 !important;
box-shadow:none !important;
font-size:14px !important;
}
}
/* Patch v4.24: Bilal missing-photo frame sama seperti Imam */
.imam-img.missing,
.bilal-img.missing{
background: rgba(255,255,255,.12) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
color: #ddd !important;
overflow: hidden !important;
}
.bilal-img.missing{
height: 180px !important;
width: 100% !important;
margin-top: 4px !important;
}
.prayer-row .bilal-img.missing{
background: rgba(255,255,255,.12) !important;
}
@media(max-width:720px){
.bilal-img.missing{height:105px !important;}
}
@media(max-width:640px){
.bilal-img.missing{height:clamp(120px,35vw,170px) !important;}
}
@media(max-width:430px){
.bilal-img.missing{height:122px !important;}
}
/* Patch v4.25: Buang background hijau pada gambar Bilal sebenar,
tetapi kekalkan frame lutsinar bila Tiada Gambar. */
.bilal-img:not(.missing),
.prayer-row .bilal-img:not(.missing){
background: transparent !important;
}
.bilal-img.missing,
.prayer-row .bilal-img.missing{
background: rgba(255,255,255,.12) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
color: #ddd !important;
}
/* Jumaat-only poster */
.poster-jumaat .poster-inner{padding-top:42px;}
.jumaat-time{margin:48px auto 0;text-align:center;font-family:Anton,Arial,sans-serif;text-transform:uppercase;text-shadow:2px 2px 3px #000;}
.jumaat-time div{font-size:30px;letter-spacing:5px;color:#fff;}
.jumaat-time strong{display:block;font-size:46px;letter-spacing:4px;color:var(--theme,#7ed321);line-height:1.1;}
.jumaat-duty-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;margin:42px auto 0;max-width:720px;text-align:center;}
.jumaat-role{font-family:Anton,Arial,sans-serif;font-size:54px;letter-spacing:3px;text-shadow:2px 2px 3px #000;color:#fff;line-height:1.05;}
.jumaat-img{width:100%;height:465px;object-fit:cover;object-position:top center;margin-top:14px;background:rgba(255,255,255,.12);}
.jumaat-name{font-size:32px;min-height:72px;}
.khutbah-box{max-width:760px;margin:38px auto 0;text-align:center;background:rgba(0,0,0,.58);border:2px solid rgba(255,255,255,.22);padding:18px 22px;text-transform:uppercase;}
.khutbah-box div{font-family:Oswald,Arial,sans-serif;font-size:24px;letter-spacing:4px;color:#fff;}
.khutbah-box strong{display:block;font-family:Anton,Arial,sans-serif;font-size:39px;letter-spacing:1px;line-height:1.12;color:var(--theme,#7ed321);margin-top:5px;}
.poster-jumaat .footer{margin-top:42px;}
@media(max-width:640px){
.poster-jumaat .header.has-logo .title{padding-left:58px;}
.jumaat-time{margin-top:34px;}
.jumaat-time div{font-size:clamp(18px,5vw,28px);letter-spacing:2px;}
.jumaat-time strong{font-size:clamp(30px,8vw,44px);}
.jumaat-duty-row{gap:12px;margin-top:28px;}
.jumaat-role{font-size:clamp(30px,9vw,48px);}
.jumaat-img{height:clamp(220px,64vw,380px);}
.jumaat-name{font-size:clamp(18px,5vw,28px);min-height:62px;}
.khutbah-box{margin-top:28px;padding:14px 12px;}
.khutbah-box div{font-size:clamp(16px,4.5vw,22px);letter-spacing:2px;}
.khutbah-box strong{font-size:clamp(24px,6.8vw,34px);}
}
@media(max-width:430px){
.jumaat-duty-row{grid-template-columns:1fr;max-width:300px;}
.jumaat-img{height:315px;}
}
/* Patch Jumaat poster fixes: keep main title, restore bg, compact centered layout */
.poster-jumaat{
background-position:center!important;
background-size:cover!important;
background-repeat:no-repeat!important;
}
.poster-jumaat .poster-inner{padding-top:42px;}
.poster-jumaat .subtitle{text-transform:uppercase;}
.jumaat-time{
width:100%;
margin:44px auto 0!important;
text-align:center!important;
display:flex;
justify-content:center;
align-items:baseline;
gap:12px;
font-family:Anton,Arial,sans-serif;
text-transform:uppercase;
text-shadow:2px 2px 3px #000;
}
.jumaat-time span{font-size:34px;letter-spacing:3px;color:#fff;line-height:1.1;}
.jumaat-time strong{display:inline-block;font-size:42px;letter-spacing:2px;color:var(--theme,#7ed321);line-height:1.1;}
.jumaat-duty-row{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:28px!important;
margin:34px auto 0!important;
max-width:620px!important;
text-align:center;
align-items:start;
}
.jumaat-role{font-family:Anton,Arial,sans-serif;font-size:42px!important;letter-spacing:3px;text-shadow:2px 2px 3px #000;color:#fff;line-height:1.05;}
.jumaat-img{width:100%;height:330px!important;object-fit:cover;object-position:top center;margin-top:12px;background:rgba(255,255,255,.12);}
.jumaat-name{font-size:25px!important;min-height:60px!important;}
.khutbah-box{
max-width:720px;
margin:32px auto 0!important;
text-align:center!important;
background:rgba(0,0,0,.58);
border:2px solid rgba(255,255,255,.22);
padding:16px 22px;
text-transform:uppercase;
}
.khutbah-box div{font-family:Anton,Arial,sans-serif;font-size:24px;letter-spacing:2px;color:#fff;}
.khutbah-box strong{display:block;font-family:Oswald,Arial,sans-serif;font-size:34px;letter-spacing:1px;color:var(--theme,#7ed321);line-height:1.15;margin-top:6px;}
.poster-jumaat .footer{margin-top:38px;}
@media(max-width:640px){
.poster-jumaat .header.has-logo .title{padding-left:58px;}
.jumaat-time{margin-top:30px!important;gap:7px;flex-wrap:wrap;}
.jumaat-time span{font-size:clamp(20px,5vw,28px);letter-spacing:1px;}
.jumaat-time strong{font-size:clamp(24px,6vw,34px);letter-spacing:1px;}
.jumaat-duty-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;max-width:100%!important;margin-top:26px!important;}
.jumaat-role{font-size:clamp(25px,7vw,36px)!important;}
.jumaat-img{height:clamp(190px,50vw,290px)!important;}
.jumaat-name{font-size:clamp(14px,4vw,22px)!important;min-height:52px!important;}
.khutbah-box{margin-top:24px!important;padding:12px 14px;}
.khutbah-box div{font-size:clamp(17px,4.5vw,22px);letter-spacing:1px;}
.khutbah-box strong{font-size:clamp(21px,5.6vw,30px);}
}
@media(max-width:430px){
.jumaat-duty-row{gap:8px!important;}
.jumaat-img{height:180px!important;}
.jumaat-name{font-size:13px!important;min-height:48px!important;}
}
/* Hotfix: pastikan background image poster harian & Jumaat kekal selepas deploy/export */
.poster{
background-position:center!important;
background-size:cover!important;
background-repeat:no-repeat!important;
}
/* Final fix: Jumaat duty cards side-by-side and smaller images */
.poster-jumaat .jumaat-duty-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important;max-width:560px!important;margin:30px auto 0!important;align-items:start!important;}
.poster-jumaat .jumaat-person{min-width:0!important;}
.poster-jumaat .jumaat-img{width:100%!important;height:280px!important;max-height:280px!important;object-fit:cover!important;object-position:top center!important;}
.poster-jumaat .jumaat-role{font-size:38px!important;}
.poster-jumaat .jumaat-name{font-size:22px!important;min-height:52px!important;}
@media(max-width:640px){.poster-jumaat .jumaat-duty-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;max-width:100%!important}.poster-jumaat .jumaat-img{height:clamp(150px,44vw,230px)!important;max-height:230px!important}.poster-jumaat .jumaat-role{font-size:clamp(22px,6.5vw,32px)!important}.poster-jumaat .jumaat-name{font-size:clamp(12px,3.8vw,18px)!important;min-height:44px!important}}
@media(max-width:430px){.poster-jumaat .jumaat-duty-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:100%!important}.poster-jumaat .jumaat-img{height:160px!important;max-height:160px!important}}
/* ===== Standardized UI: logo frame for public poster/index ===== */
.poster-logo-box{
position:absolute;
top:78px;
left:75px;
width:96px;
height:96px;
background:rgba(255,255,255,.94);
border-radius:18px;
padding:8px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.18);
z-index:3;
}
.poster-logo-img{
display:block;
max-width:94%;
max-height:94%;
width:auto!important;
height:auto!important;
object-fit:contain!important;
}
.logo{border-radius:18px;background:#fff;padding:8px;box-shadow:0 10px 30px rgba(0,0,0,.18);}
@media(max-width:640px){
.poster-logo-box{position:static;margin:0 auto 10px;width:86px;height:86px;}
}
/* ===== Hero full-system polish: prevent logo/title overlap on public index ===== */
.poster-hero{
display:flex;
align-items:center;
justify-content:center;
gap:28px;
width:100%;
box-sizing:border-box;
}
.poster-hero .header{
flex:1 1 auto;
min-width:0;
text-align:center;
}
.poster-hero .poster-logo-box{
position:static!important;
flex:0 0 112px;
width:112px!important;
height:112px!important;
margin:0!important;
box-sizing:border-box;
}
.poster-hero .poster-logo-img{
max-width:92%!important;
max-height:92%!important;
width:auto!important;
height:auto!important;
}
.poster-hero .subtitle{
letter-spacing:10px;
line-height:1.15;
overflow-wrap:anywhere;
}
.poster-hero .title{
padding-left:0!important;
letter-spacing:2px;
line-height:.98;
overflow-wrap:anywhere;
}
.poster-hero .date{
margin-top:34px;
}
@media(max-width:720px){
.poster-hero{
flex-direction:column;
gap:10px;
text-align:center;
}
.poster-hero .poster-logo-box{
width:82px!important;
height:82px!important;
flex-basis:82px;
}
.poster-hero .subtitle{
letter-spacing:5px;
}
.poster-hero .date{
margin-top:22px;
}
}
@media(min-width:721px) and (max-width:980px){
.poster-hero{gap:22px;}
.poster-hero .poster-logo-box{
width:96px!important;
height:96px!important;
flex-basis:96px;
}
.poster-hero .subtitle{font-size:26px;letter-spacing:8px;}
.poster-hero .title{font-size:50px;}
}
/* ===== v7 Jumaat perfect spacing + logo polish ===== */
.poster-jumaat .poster-inner{
display:flex;
flex-direction:column;
min-height:1280px;
box-sizing:border-box;
}
.poster-jumaat .jumaat-logo-box{
position:absolute;
top:78px;
left:72px;
width:148px;
height:148px;
background:rgba(255,255,255,.96);
border-radius:24px;
padding:10px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
box-shadow:0 14px 36px rgba(0,0,0,.24);
z-index:5;
box-sizing:border-box;
}
.poster-jumaat .jumaat-logo-img{
display:block;
max-width:96%!important;
max-height:96%!important;
width:auto!important;
height:auto!important;
object-fit:contain!important;
}
.poster-jumaat .header.has-logo .subtitle,
.poster-jumaat .header.has-logo .title{
padding-left:96px;
}
.poster-jumaat .header.has-logo .date,
.poster-jumaat .header.has-logo .hijri{
padding-left:0;
}
.poster-jumaat .khutbah-box{
min-height:112px;
box-sizing:border-box;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.poster-jumaat .khutbah-box.khutbah-empty{
visibility:hidden;
}
.poster-jumaat .footer{
margin-top:auto!important;
padding-top:34px;
}
.poster-jumaat .bank,
.poster-jumaat .acc,
.poster-jumaat .note,
.poster-jumaat .tnb{
text-wrap:balance;
}
.export-mode .poster-jumaat .jumaat-logo-box{
width:148px!important;
height:148px!important;
border-radius:24px!important;
}
.export-mode .poster-jumaat .jumaat-logo-img{
max-width:96%!important;
max-height:96%!important;
width:auto!important;
height:auto!important;
}
@media(max-width:720px){
.poster-jumaat .jumaat-logo-box{
position:static!important;
margin:0 auto 12px!important;
width:112px!important;
height:112px!important;
border-radius:20px;
}
.poster-jumaat .header.has-logo .subtitle,
.poster-jumaat .header.has-logo .title{
padding-left:0!important;
}
.poster-jumaat .khutbah-box{min-height:88px;}
.poster-jumaat .footer{padding-top:24px;}
}
@media(max-width:430px){
.poster-jumaat .jumaat-logo-box{
width:96px!important;
height:96px!important;
}
.poster-jumaat .khutbah-box{min-height:72px;}
}
/* ===== v8 Jumaat header redesign: logo separated from text, no overlap ===== */
.poster-jumaat .jumaat-hero-layout{
display:grid !important;
grid-template-columns:170px minmax(0,1fr) !important;
gap:26px !important;
align-items:center !important;
width:100% !important;
max-width:820px !important;
margin:12px auto 0 !important;
box-sizing:border-box !important;
}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{
position:relative !important;
top:auto !important;
left:auto !important;
width:170px !important;
height:170px !important;
margin:0 !important;
border-radius:24px !important;
padding:10px !important;
flex:0 0 auto !important;
z-index:2 !important;
}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-img{
max-width:96% !important;
max-height:96% !important;
width:auto !important;
height:auto !important;
object-fit:contain !important;
}
.poster-jumaat .jumaat-hero-layout .header{
min-width:0 !important;
width:100% !important;
text-align:left !important;
letter-spacing:0 !important;
padding:18px 24px !important;
border-left:5px solid var(--theme,#7ed321) !important;
background:linear-gradient(90deg,rgba(0,0,0,.46),rgba(0,0,0,.18)) !important;
box-sizing:border-box !important;
}
.poster-jumaat .jumaat-hero-layout .header.has-logo .subtitle,
.poster-jumaat .jumaat-hero-layout .header.has-logo .title,
.poster-jumaat .jumaat-hero-layout .header.has-logo .date,
.poster-jumaat .jumaat-hero-layout .header.has-logo .hijri{
padding-left:0 !important;
}
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:29px !important;
letter-spacing:9px !important;
line-height:1.05 !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:clip !important;
}
.poster-jumaat .jumaat-hero-layout .title{
font-size:54px !important;
letter-spacing:1px !important;
line-height:.95 !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:clip !important;
padding-left:0 !important;
}
.poster-jumaat .jumaat-hero-layout .date{
margin-top:28px !important;
text-align:center !important;
font-size:42px !important;
letter-spacing:2px !important;
}
.poster-jumaat .jumaat-hero-layout .hijri{
text-align:center !important;
font-size:33px !important;
letter-spacing:2px !important;
}
.export-mode .poster-jumaat .jumaat-hero-layout .jumaat-logo-box{
width:170px !important;
height:170px !important;
}
@media(max-width:720px){
.poster-jumaat .jumaat-hero-layout{
grid-template-columns:1fr !important;
gap:12px !important;
max-width:100% !important;
margin-top:0 !important;
text-align:center !important;
}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{
width:118px !important;
height:118px !important;
margin:0 auto !important;
}
.poster-jumaat .jumaat-hero-layout .header{
text-align:center !important;
border-left:0 !important;
border-top:4px solid var(--theme,#7ed321) !important;
padding:14px 12px !important;
}
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:clamp(17px,4.7vw,26px) !important;
letter-spacing:clamp(4px,1.4vw,8px) !important;
}
.poster-jumaat .jumaat-hero-layout .title{
font-size:clamp(32px,8.5vw,46px) !important;
white-space:normal !important;
}
.poster-jumaat .jumaat-hero-layout .date{
margin-top:18px !important;
font-size:clamp(23px,6.5vw,32px) !important;
}
.poster-jumaat .jumaat-hero-layout .hijri{
font-size:clamp(19px,5.2vw,25px) !important;
}
}
@media(max-width:430px){
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{width:102px !important;height:102px !important;}
.poster-jumaat .jumaat-hero-layout .subtitle{font-size:18px !important;letter-spacing:4px !important;}
.poster-jumaat .jumaat-hero-layout .title{font-size:34px !important;}
}
/* ===== v9 Jumaat perfect fit: one-page poster + compact HD export ===== */
.public-nav{
position:relative!important;
z-index:999!important;
flex-wrap:wrap!important;
align-items:center!important;
justify-content:center!important;
}
.public-nav .export-btn{
border:0!important;
border-radius:999px!important;
background:#2b3c33!important;
color:#fff!important;
font-weight:800!important;
padding:12px 22px!important;
text-decoration:none!important;
cursor:pointer!important;
}
.poster-jumaat{
width:900px!important;
height:1280px!important;
min-height:0!important;
max-width:900px!important;
overflow:hidden!important;
box-sizing:border-box!important;
}
.poster-jumaat .poster-inner{
height:100%!important;
min-height:0!important;
display:flex!important;
flex-direction:column!important;
box-sizing:border-box!important;
padding:34px 42px 26px!important;
}
.poster-jumaat .jumaat-hero-layout{
max-width:800px!important;
grid-template-columns:155px minmax(0,1fr)!important;
gap:24px!important;
margin:0 auto!important;
}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{
width:155px!important;
height:155px!important;
border-radius:23px!important;
padding:9px!important;
}
.poster-jumaat .jumaat-hero-layout .header{
padding:14px 22px!important;
min-height:178px!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
}
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:26px!important;
letter-spacing:8px!important;
line-height:1!important;
}
.poster-jumaat .jumaat-hero-layout .title{
font-size:47px!important;
line-height:.95!important;
letter-spacing:1px!important;
}
.poster-jumaat .jumaat-hero-layout .date{
margin-top:22px!important;
font-size:36px!important;
line-height:1!important;
}
.poster-jumaat .jumaat-hero-layout .hijri{
font-size:28px!important;
line-height:1.1!important;
}
.poster-jumaat .jumaat-time{
margin:36px auto 0!important;
line-height:1!important;
}
.poster-jumaat .jumaat-time span{
font-size:31px!important;
letter-spacing:3px!important;
}
.poster-jumaat .jumaat-time strong{
font-size:39px!important;
}
.poster-jumaat .jumaat-duty-row{
margin:30px auto 0!important;
max-width:560px!important;
gap:26px!important;
}
.poster-jumaat .jumaat-role{
font-size:39px!important;
line-height:1!important;
}
.poster-jumaat .jumaat-img{
height:252px!important;
max-height:252px!important;
margin-top:10px!important;
}
.poster-jumaat .jumaat-name{
font-size:22px!important;
min-height:46px!important;
line-height:1.05!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
}
.poster-jumaat .khutbah-box{
min-height:76px!important;
margin-top:22px!important;
padding:8px 16px!important;
box-sizing:border-box!important;
}
.poster-jumaat .khutbah-box.khutbah-empty{
visibility:hidden!important;
}
.poster-jumaat .footer{
margin-top:auto!important;
padding-top:20px!important;
grid-template-columns:142px 1fr!important;
gap:18px!important;
}
.poster-jumaat .qr{
width:142px!important;
height:142px!important;
}
.poster-jumaat .bank{
font-size:36px!important;
line-height:1!important;
}
.poster-jumaat .acc{
font-size:30px!important;
line-height:1.1!important;
}
.poster-jumaat .note{
font-size:16px!important;
line-height:1.15!important;
}
.poster-jumaat .tnb{
font-size:28px!important;
line-height:1.1!important;
margin-top:6px!important;
}
.export-mode .poster-jumaat,
.poster-jumaat.exporting{
width:1800px!important;
height:2560px!important;
max-width:none!important;
}
.export-mode .poster-jumaat .poster-inner,
.poster-jumaat.exporting .poster-inner{
transform-origin:top left!important;
}
@media print{
@page{size:A4 portrait;margin:0;}
html,body{margin:0!important;background:#fff!important;}
.public-nav,.export-panel{display:none!important;}
.poster-jumaat{width:100vw!important;height:100vh!important;max-width:none!important;margin:0!important;}
}
@media(max-width:940px){
.poster-jumaat{width:100%!important;height:auto!important;aspect-ratio:900/1280!important;}
.poster-jumaat .poster-inner{padding:3.7vw 4.6vw 2.8vw!important;}
}
@media(max-width:720px){
.poster-jumaat{aspect-ratio:auto!important;height:auto!important;min-height:1280px!important;}
.poster-jumaat .jumaat-hero-layout{grid-template-columns:1fr!important;gap:10px!important;}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{width:118px!important;height:118px!important;margin:0 auto!important;}
.poster-jumaat .jumaat-hero-layout .header{min-height:auto!important;text-align:center!important;}
}
/* ===== v10 export fix: capture poster at true 900x1280, upscale via canvas scale only ===== */
.poster-jumaat.export-capture,
.export-mode .poster-jumaat.export-capture{
width:900px!important;
height:1280px!important;
max-width:none!important;
min-height:0!important;
aspect-ratio:auto!important;
margin:0 auto!important;
overflow:hidden!important;
}
.poster-jumaat.export-capture .poster-inner,
.export-mode .poster-jumaat.export-capture .poster-inner{
width:100%!important;
height:100%!important;
min-height:0!important;
transform:none!important;
display:flex!important;
flex-direction:column!important;
padding:34px 42px 26px!important;
box-sizing:border-box!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout{
display:grid!important;
grid-template-columns:155px minmax(0,1fr)!important;
gap:24px!important;
max-width:800px!important;
margin:0 auto!important;
align-items:center!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout .jumaat-logo-box{
width:155px!important;
height:155px!important;
margin:0!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout .header{
min-height:178px!important;
padding:14px 22px!important;
text-align:center!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout .subtitle{font-size:26px!important;letter-spacing:8px!important;line-height:1!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .title{font-size:47px!important;line-height:.95!important;letter-spacing:1px!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .date{font-size:36px!important;margin-top:22px!important;line-height:1!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .hijri{font-size:28px!important;line-height:1.1!important;}
.poster-jumaat.export-capture .jumaat-time{margin:36px auto 0!important;line-height:1!important;}
.poster-jumaat.export-capture .jumaat-time span{font-size:31px!important;letter-spacing:3px!important;}
.poster-jumaat.export-capture .jumaat-time strong{font-size:39px!important;}
.poster-jumaat.export-capture .jumaat-duty-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;margin:30px auto 0!important;max-width:560px!important;gap:26px!important;}
.poster-jumaat.export-capture .jumaat-role{font-size:39px!important;line-height:1!important;}
.poster-jumaat.export-capture .jumaat-img{height:252px!important;max-height:252px!important;margin-top:10px!important;}
.poster-jumaat.export-capture .jumaat-name{font-size:22px!important;min-height:46px!important;line-height:1.05!important;}
.poster-jumaat.export-capture .khutbah-box{min-height:76px!important;margin-top:22px!important;padding:8px 16px!important;}
.poster-jumaat.export-capture .footer{margin-top:auto!important;padding-top:20px!important;grid-template-columns:142px 1fr!important;gap:18px!important;}
.poster-jumaat.export-capture .qr{width:142px!important;height:142px!important;}
.poster-jumaat.export-capture .bank{font-size:36px!important;line-height:1!important;}
.poster-jumaat.export-capture .acc{font-size:30px!important;line-height:1.1!important;}
.poster-jumaat.export-capture .note{font-size:16px!important;line-height:1.15!important;}
.poster-jumaat.export-capture .tnb{font-size:28px!important;line-height:1.1!important;margin-top:6px!important;}
@media print{
@page{size:A4 portrait;margin:0;}
html,body{width:210mm!important;height:297mm!important;margin:0!important;padding:0!important;overflow:hidden!important;background:#fff!important;}
.public-nav,.export-panel{display:none!important;}
.poster-jumaat{width:210mm!important;height:297mm!important;max-width:none!important;min-height:0!important;margin:0!important;overflow:hidden!important;page-break-inside:avoid!important;break-inside:avoid!important;}
}
/* ===== v11 Jumaat cinematic polish: spacing exactly like draft, one-page safe ===== */
.poster-jumaat{
width:900px!important;
height:1280px!important;
max-width:900px!important;
min-height:0!important;
overflow:hidden!important;
}
.poster-jumaat .poster-inner{
height:100%!important;
min-height:0!important;
display:flex!important;
flex-direction:column!important;
padding:48px 44px 28px!important;
box-sizing:border-box!important;
}
.poster-jumaat .jumaat-hero-layout{
max-width:820px!important;
grid-template-columns:170px minmax(0,1fr)!important;
gap:26px!important;
margin:0 auto!important;
align-items:center!important;
}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{
width:170px!important;
height:170px!important;
border-radius:24px!important;
padding:10px!important;
}
.poster-jumaat .jumaat-hero-layout .header{
min-height:150px!important;
padding:22px 26px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
}
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:29px!important;
letter-spacing:9px!important;
line-height:1!important;
white-space:nowrap!important;
}
.poster-jumaat .jumaat-hero-layout .title{
font-size:51px!important;
line-height:.94!important;
letter-spacing:1px!important;
white-space:nowrap!important;
}
.poster-jumaat .jumaat-date-block{
margin:66px auto 0!important;
padding:13px 38px 12px!important;
display:block!important;
width:max-content!important;
max-width:760px!important;
text-align:center!important;
background:linear-gradient(90deg,rgba(0,0,0,.42),rgba(28,44,55,.54))!important;
box-shadow:0 10px 32px rgba(0,0,0,.18)!important;
}
.poster-jumaat .jumaat-date-block .date{
margin:0!important;
font-size:40px!important;
letter-spacing:2px!important;
line-height:1.05!important;
color:#fff!important;
text-shadow:2px 2px 3px #000!important;
}
.poster-jumaat .jumaat-date-block .hijri{
margin:2px 0 0!important;
font-size:32px!important;
letter-spacing:2px!important;
line-height:1.05!important;
color:#fff!important;
text-shadow:2px 2px 3px #000!important;
}
.poster-jumaat .jumaat-time{
margin:22px auto 0!important;
line-height:1!important;
}
.poster-jumaat .jumaat-time span{
font-size:36px!important;
letter-spacing:3px!important;
}
.poster-jumaat .jumaat-time strong{
font-size:45px!important;
letter-spacing:2px!important;
}
.poster-jumaat .jumaat-duty-row{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
margin:52px auto 0!important;
max-width:650px!important;
gap:34px!important;
align-items:start!important;
}
.poster-jumaat .jumaat-role{
font-size:44px!important;
line-height:1!important;
margin-bottom:10px!important;
}
.poster-jumaat .jumaat-img{
width:100%!important;
height:330px!important;
max-height:330px!important;
object-fit:cover!important;
object-position:top center!important;
margin-top:0!important;
}
.poster-jumaat .jumaat-name{
font-size:25px!important;
min-height:52px!important;
line-height:1.05!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
}
.poster-jumaat .khutbah-box{
min-height:104px!important;
margin-top:62px!important;
padding:12px 22px!important;
box-sizing:border-box!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
}
.poster-jumaat .khutbah-box div{
font-size:25px!important;
letter-spacing:2px!important;
line-height:1!important;
}
.poster-jumaat .khutbah-box strong{
font-size:39px!important;
line-height:1.05!important;
}
.poster-jumaat .footer{
margin-top:auto!important;
padding-top:26px!important;
grid-template-columns:142px 1fr!important;
gap:18px!important;
}
.poster-jumaat .qr{width:142px!important;height:142px!important;}
.poster-jumaat .bank{font-size:36px!important;line-height:1!important;}
.poster-jumaat .acc{font-size:30px!important;line-height:1.05!important;}
.poster-jumaat .note{font-size:16px!important;line-height:1.15!important;}
.poster-jumaat .tnb{font-size:28px!important;line-height:1.05!important;margin-top:6px!important;}
.poster-jumaat.export-capture,
.export-mode .poster-jumaat.export-capture{
width:900px!important;height:1280px!important;max-width:none!important;min-height:0!important;aspect-ratio:auto!important;margin:0 auto!important;overflow:hidden!important;
}
.poster-jumaat.export-capture .poster-inner,
.export-mode .poster-jumaat.export-capture .poster-inner{
width:100%!important;height:100%!important;min-height:0!important;display:flex!important;flex-direction:column!important;padding:48px 44px 28px!important;box-sizing:border-box!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout{max-width:820px!important;grid-template-columns:170px minmax(0,1fr)!important;gap:26px!important;margin:0 auto!important;align-items:center!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .jumaat-logo-box{width:170px!important;height:170px!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .header{min-height:150px!important;padding:22px 26px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .subtitle{font-size:29px!important;letter-spacing:9px!important;line-height:1!important;}
.poster-jumaat.export-capture .jumaat-hero-layout .title{font-size:51px!important;line-height:.94!important;letter-spacing:1px!important;}
.poster-jumaat.export-capture .jumaat-date-block{margin:66px auto 0!important;padding:13px 38px 12px!important;}
.poster-jumaat.export-capture .jumaat-date-block .date{font-size:40px!important;line-height:1.05!important;}
.poster-jumaat.export-capture .jumaat-date-block .hijri{font-size:32px!important;line-height:1.05!important;}
.poster-jumaat.export-capture .jumaat-time{margin:22px auto 0!important;}
.poster-jumaat.export-capture .jumaat-time span{font-size:36px!important;letter-spacing:3px!important;}
.poster-jumaat.export-capture .jumaat-time strong{font-size:45px!important;letter-spacing:2px!important;}
.poster-jumaat.export-capture .jumaat-duty-row{margin:52px auto 0!important;max-width:650px!important;gap:34px!important;}
.poster-jumaat.export-capture .jumaat-role{font-size:44px!important;margin-bottom:10px!important;}
.poster-jumaat.export-capture .jumaat-img{height:330px!important;max-height:330px!important;margin-top:0!important;}
.poster-jumaat.export-capture .jumaat-name{font-size:25px!important;min-height:52px!important;}
.poster-jumaat.export-capture .khutbah-box{min-height:104px!important;margin-top:62px!important;padding:12px 22px!important;}
.poster-jumaat.export-capture .khutbah-box div{font-size:25px!important;}
.poster-jumaat.export-capture .khutbah-box strong{font-size:39px!important;}
.poster-jumaat.export-capture .footer{margin-top:auto!important;padding-top:26px!important;grid-template-columns:142px 1fr!important;gap:18px!important;}
.poster-jumaat.export-capture .qr{width:142px!important;height:142px!important;}
.poster-jumaat.export-capture .bank{font-size:36px!important;line-height:1!important;}
.poster-jumaat.export-capture .acc{font-size:30px!important;line-height:1.05!important;}
.poster-jumaat.export-capture .note{font-size:16px!important;line-height:1.15!important;}
.poster-jumaat.export-capture .tnb{font-size:28px!important;line-height:1.05!important;margin-top:6px!important;}
@media(max-width:940px){
.poster-jumaat{width:100%!important;height:auto!important;aspect-ratio:900/1280!important;}
}
@media(max-width:720px){
.poster-jumaat{aspect-ratio:auto!important;height:auto!important;min-height:1280px!important;}
.poster-jumaat .poster-inner{padding:30px 22px 24px!important;}
.poster-jumaat .jumaat-hero-layout{grid-template-columns:1fr!important;gap:12px!important;max-width:100%!important;}
.poster-jumaat .jumaat-hero-layout .jumaat-logo-box{width:120px!important;height:120px!important;margin:0 auto!important;}
.poster-jumaat .jumaat-hero-layout .header{min-height:auto!important;text-align:center!important;padding:14px 12px!important;}
.poster-jumaat .jumaat-date-block{margin-top:34px!important;max-width:100%!important;padding:10px 16px!important;}
.poster-jumaat .jumaat-date-block .date{font-size:28px!important;}
.poster-jumaat .jumaat-date-block .hijri{font-size:22px!important;}
}
/* ===== v12 final master: Jumaat header typography polish =====
- Smaller subtitle to avoid overlap with green accent line
- Move subtitle slightly upward and increase breathing room above mosque name
- Apply same values during PNG/PDF export capture
*/
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:24px!important;
letter-spacing:7px!important;
line-height:1!important;
margin-top:-10px!important;
margin-bottom:20px!important;
white-space:nowrap!important;
transform:translateY(-2px)!important;
}
.poster-jumaat .jumaat-hero-layout .title{
margin-top:0!important;
}
.poster-jumaat.export-capture .jumaat-hero-layout .subtitle,
.export-mode .poster-jumaat.export-capture .jumaat-hero-layout .subtitle{
font-size:24px!important;
letter-spacing:7px!important;
line-height:1!important;
margin-top:-10px!important;
margin-bottom:20px!important;
white-space:nowrap!important;
transform:translateY(-2px)!important;
}
@media(max-width:720px){
.poster-jumaat .jumaat-hero-layout .subtitle{
font-size:17px!important;
letter-spacing:4px!important;
margin-top:-6px!important;
margin-bottom:12px!important;
}
}
/* ===== v13 ultimate final: footer safe area + final one-page balance =====
- Raise khutbah section slightly to create footer breathing room
- Raise footer away from bottom crop area for screen, PNG and PDF export
- Keep same fixed poster ratio for stable one-page output
*/
.poster-jumaat .poster-inner{
padding-bottom:54px!important;
}
.poster-jumaat .khutbah-box{
margin-top:38px!important;
}
.poster-jumaat .footer{
padding-top:18px!important;
transform:translateY(-6px)!important;
}
.poster-jumaat .qr{
width:140px!important;
height:140px!important;
object-fit:contain!important;
}
.poster-jumaat .tnbpaybox{
display:inline-flex!important;
align-items:center!important;
min-height:44px!important;
}
.poster-jumaat.export-capture .poster-inner,
.export-mode .poster-jumaat.export-capture .poster-inner{
padding-bottom:54px!important;
}
.poster-jumaat.export-capture .khutbah-box,
.export-mode .poster-jumaat.export-capture .khutbah-box{
margin-top:38px!important;
}
.poster-jumaat.export-capture .footer,
.export-mode .poster-jumaat.export-capture .footer{
padding-top:18px!important;
transform:translateY(-6px)!important;
}
.poster-jumaat.export-capture .qr,
.export-mode .poster-jumaat.export-capture .qr{
width:140px!important;
height:140px!important;
object-fit:contain!important;
}
@media print{
.poster-jumaat .poster-inner{padding-bottom:54px!important;}
.poster-jumaat .khutbah-box{margin-top:38px!important;}
.poster-jumaat .footer{padding-top:18px!important;transform:translateY(-6px)!important;}
}
/* ===== v14 enterprise polish: robust TNB + JomPAY logos for screen, PNG and PDF export ===== */
.poster-jumaat .tnbpaybox{
display:inline-flex!important;
align-items:center!important;
gap:8px!important;
background:#fff!important;
color:#222!important;
border:2px solid rgba(80,80,80,.75)!important;
border-radius:2px!important;
padding:4px 10px 4px 6px!important;
min-height:46px!important;
line-height:1.12!important;
overflow:visible!important;
white-space:nowrap!important;
}
.poster-jumaat .bill-logos{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
flex:0 0 auto!important;
min-width:86px!important;
height:42px!important;
overflow:visible!important;
}
.poster-jumaat .tnb-icon,
.poster-jumaat .jompay-icon{
display:inline-block!important;
width:auto!important;
height:40px!important;
max-width:44px!important;
max-height:40px!important;
object-fit:contain!important;
object-position:center!important;
flex:0 0 auto!important;
visibility:visible!important;
opacity:1!important;
background:#fff!important;
}
.poster-jumaat .tnb-info{
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
gap:2px!important;
font-family:Arial,sans-serif!important;
font-size:17px!important;
font-weight:400!important;
line-height:1.12!important;
color:#222!important;
white-space:nowrap!important;
}
.poster-jumaat.export-capture .tnbpaybox,
.export-mode .poster-jumaat.export-capture .tnbpaybox{
gap:8px!important;
min-height:46px!important;
overflow:visible!important;
}
.poster-jumaat.export-capture .bill-logos,
.export-mode .poster-jumaat.export-capture .bill-logos{
display:inline-flex!important;
min-width:86px!important;
height:42px!important;
overflow:visible!important;
}
.poster-jumaat.export-capture .tnb-icon,
.poster-jumaat.export-capture .jompay-icon,
.export-mode .poster-jumaat.export-capture .tnb-icon,
.export-mode .poster-jumaat.export-capture .jompay-icon{
display:inline-block!important;
width:auto!important;
height:40px!important;
max-width:44px!important;
max-height:40px!important;
object-fit:contain!important;
visibility:visible!important;
opacity:1!important;
}
@media(max-width:720px){
.poster-jumaat .tnbpaybox{gap:5px!important;padding:3px 7px 3px 4px!important;min-height:38px!important;}
.poster-jumaat .bill-logos{min-width:70px!important;height:34px!important;gap:3px!important;}
.poster-jumaat .tnb-icon,.poster-jumaat .jompay-icon{height:32px!important;max-width:35px!important;max-height:32px!important;}
.poster-jumaat .tnb-info{font-size:12px!important;}
}
/* ===== Patch v4.33: Jumaat khutbah position + auto-fit title ===== */
.poster-jumaat .khutbah-box{
margin-top:8px!important;
min-height:116px!important;
padding:12px 22px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
}
.poster-jumaat .khutbah-label{
flex:0 0 auto!important;
}
.poster-jumaat .khutbah-title{
display:block!important;
width:100%!important;
max-width:100%!important;
line-height:1.05!important;
white-space:normal!important;
overflow-wrap:break-word!important;
word-break:normal!important;
text-wrap:balance;
}
.poster-jumaat.export-capture .khutbah-box,
.export-mode .poster-jumaat.export-capture .khutbah-box{
margin-top:8px!important;
min-height:116px!important;
padding:12px 22px!important;
}
.poster-jumaat .footer{
margin-top:auto!important;
padding-top:52px!important;
transform:none!important;
}
.poster-jumaat.export-capture .footer,
.export-mode .poster-jumaat.export-capture .footer{
margin-top:auto!important;
padding-top:52px!important;
transform:none!important;
}
@media(max-width:720px){
.poster-jumaat .khutbah-box{margin-top:8px!important;min-height:88px!important;padding:9px 14px!important;}
.poster-jumaat .footer{padding-top:42px!important;transform:none!important;}
}
@media print{
.poster-jumaat .khutbah-box{margin-top:8px!important;min-height:116px!important;padding:12px 22px!important;}
.poster-jumaat .footer{padding-top:52px!important;transform:none!important;}
}
/* ===== Patch v4.28: Index header banner layout alignment ===== */
.poster-topline-wrap{
width:100%;
display:flex;
justify-content:center;
align-items:center;
margin:0 auto 12px;
text-align:center;
}
.poster-topline{
width:min(760px,100%);
max-width:100%;
margin:0 auto!important;
padding:0 8px;
text-align:center!important;
font-family:Oswald,Arial,sans-serif!important;
font-size:clamp(18px,3.6vw,30px)!important;
letter-spacing:clamp(4px,1.4vw,11px)!important;
line-height:1.08!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:clip!important;
text-shadow:2px 2px 3px rgba(0,0,0,.75);
transform-origin:center center;
}
.poster-hero-banner{
display:grid!important;
grid-template-columns:150px minmax(0,1fr)!important;
gap:18px!important;
align-items:stretch!important;
justify-content:center!important;
width:100%!important;
max-width:820px!important;
margin:0 auto!important;
box-sizing:border-box!important;
}
.poster-hero-banner .poster-logo-box{
position:relative!important;
top:auto!important;
left:auto!important;
width:150px!important;
height:150px!important;
min-height:150px!important;
flex:0 0 auto!important;
margin:0!important;
border-radius:20px!important;
padding:10px!important;
background:rgba(255,255,255,.96)!important;
align-self:stretch!important;
box-sizing:border-box!important;
}
.poster-hero-banner .poster-logo-img{
max-width:96%!important;
max-height:96%!important;
width:auto!important;
height:auto!important;
object-fit:contain!important;
}
.poster-banner-frame{
position:relative;
height:150px!important;
min-height:150px!important;
width:100%;
overflow:hidden;
border-radius:20px;
background:rgba(255,255,255,.96);
border:3px solid rgba(255,255,255,.88);
box-shadow:0 12px 30px rgba(0,0,0,.22);
display:flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
}
.poster-banner-frame::after{
content:"";
position:absolute;
inset:0;
border-radius:17px;
border:2px solid rgba(6,70,32,.75);
z-index:4;
pointer-events:none;
}
.poster-banner-img{
display:block;
width:100%;
height:100%;
object-fit:contain!important;
object-position:center center!important;
background:#fff;
padding:6px 12px 34px;
box-sizing:border-box;
}
.poster-banner-mosque{
position:absolute;
left:22px;
right:22px;
bottom:8px;
z-index:2;
text-align:center;
font-family:Anton,Arial,sans-serif;
font-size:clamp(20px,3.5vw,35px);
line-height:1;
letter-spacing:2px;
text-transform:uppercase;
color:var(--theme,#7ed321);
text-shadow:2px 2px 2px rgba(0,0,0,.5);
white-space:nowrap;
overflow:hidden;
text-overflow:clip;
}
.poster-date-block{
width:100%;
max-width:760px;
margin:66px auto 0!important;
text-align:center!important;
display:block!important;
}
.poster-date-block .date{
margin-top:0!important;
text-align:center!important;
font-family:Oswald,Arial,sans-serif!important;
font-size:45px!important;
letter-spacing:2px!important;
line-height:1.05!important;
}
.poster-date-block .hijri{
text-align:center!important;
font-family:Oswald,Arial,sans-serif!important;
font-size:34px!important;
letter-spacing:2px!important;
line-height:1.08!important;
}
.poster-hero-banner + .poster-date-block + .prayer-row,
.poster-date-block + .prayer-row{
margin-top:48px!important;
}
.poster-hero-banner ~ .prayer-row .imam-img{
margin-top:42px;
}
@media(max-width:900px){
.poster-hero-banner{grid-template-columns:clamp(92px,18vw,138px) minmax(0,1fr)!important;gap:clamp(10px,2vw,18px)!important;max-width:100%!important;}
.poster-hero-banner .poster-logo-box{width:clamp(92px,18vw,138px)!important;height:clamp(92px,18vw,138px)!important;min-height:clamp(92px,18vw,138px)!important;}
.poster-banner-frame{height:clamp(92px,18vw,138px)!important;min-height:clamp(92px,18vw,138px)!important;}
.poster-banner-img{padding:5px 10px 28px;}
.poster-banner-mosque{font-size:clamp(16px,3.2vw,28px);bottom:7px;left:14px;right:14px;letter-spacing:1px;}
.poster-date-block{margin-top:clamp(38px,7vw,60px)!important;}
.poster-date-block .date{font-size:clamp(28px,6vw,42px)!important;}
.poster-date-block .hijri{font-size:clamp(22px,4.8vw,32px)!important;}
}
@media(max-width:640px){
.poster-topline-wrap{margin-bottom:10px;}
.poster-topline{font-size:clamp(15px,4.3vw,22px)!important;letter-spacing:clamp(2px,1.1vw,5px)!important;}
.poster-hero-banner{grid-template-columns:88px minmax(0,1fr)!important;gap:10px!important;}
.poster-hero-banner .poster-logo-box{width:88px!important;height:88px!important;min-height:88px!important;border-radius:16px!important;padding:7px!important;}
.poster-banner-frame{height:88px!important;min-height:88px!important;border-radius:16px!important;}
.poster-banner-frame::after{border-radius:13px;}
.poster-banner-img{padding:4px 7px 23px;}
.poster-banner-mosque{font-size:clamp(14px,4.2vw,20px);bottom:5px;left:10px;right:10px;letter-spacing:.5px;text-shadow:1px 1px 2px rgba(0,0,0,.6);}
.poster-date-block{margin-top:34px!important;}
.poster-date-block .date{font-size:clamp(24px,6.5vw,32px)!important;line-height:1.1!important;}
.poster-date-block .hijri{font-size:clamp(19px,5.4vw,26px)!important;line-height:1.1!important;}
.poster-date-block + .prayer-row{margin-top:38px!important;}
}
@media(max-width:430px){
.poster-hero-banner{grid-template-columns:76px minmax(0,1fr)!important;gap:8px!important;}
.poster-hero-banner .poster-logo-box{width:76px!important;height:76px!important;min-height:76px!important;border-radius:14px!important;padding:6px!important;}
.poster-banner-frame{height:76px!important;min-height:76px!important;border-radius:14px!important;}
.poster-banner-img{padding:3px 6px 20px;}
.poster-banner-mosque{font-size:clamp(12px,4vw,16px);bottom:4px;left:8px;right:8px;letter-spacing:.2px;}
.poster-date-block{margin-top:28px!important;}
}
/* ===== Patch v4.29: cleanup index header banner text clipping + mosque name overlap ===== */
.poster-topline{
line-height:1.35!important;
padding:4px 8px 8px!important;
overflow:visible!important;
text-overflow:clip!important;
}
.poster-banner-frame{
display:block!important;
overflow:hidden!important;
}
.poster-banner-img{
position:absolute!important;
top:7px!important;
left:12px!important;
right:12px!important;
bottom:auto!important;
width:calc(100% - 24px)!important;
height:calc(100% - 52px)!important;
padding:0!important;
object-fit:contain!important;
object-position:center center!important;
background:#fff!important;
z-index:1!important;
}
.poster-banner-mosque{
bottom:11px!important;
line-height:1!important;
height:34px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
background:rgba(255,255,255,.88)!important;
z-index:3!important;
}
@media(max-width:900px){
.poster-topline{line-height:1.34!important;padding:3px 8px 7px!important;}
.poster-banner-img{top:6px!important;left:10px!important;right:10px!important;width:calc(100% - 20px)!important;height:calc(100% - 43px)!important;}
.poster-banner-mosque{bottom:7px!important;height:28px!important;}
}
@media(max-width:640px){
.poster-topline{line-height:1.35!important;padding:3px 4px 7px!important;}
.poster-banner-img{top:5px!important;left:7px!important;right:7px!important;width:calc(100% - 14px)!important;height:calc(100% - 34px)!important;}
.poster-banner-mosque{bottom:5px!important;height:22px!important;background:rgba(255,255,255,.9)!important;}
}
@media(max-width:430px){
.poster-topline{line-height:1.35!important;padding:2px 2px 6px!important;}
.poster-banner-img{top:4px!important;left:6px!important;right:6px!important;width:calc(100% - 12px)!important;height:calc(100% - 29px)!important;}
.poster-banner-mosque{bottom:4px!important;height:18px!important;}
}
/* ===== Patch v4.30: keep uploaded banner aspect ratio in PNG/PDF export =====
Use CSS background-size: contain instead of ![]()
, because
html2canvas can stretch object-fit images during canvas rendering. */
.poster-banner-img{display:none!important;}
.poster-banner-art{
position:absolute!important;
top:7px!important;
left:12px!important;
right:12px!important;
height:calc(100% - 52px)!important;
background-image:var(--poster-banner-url)!important;
background-repeat:no-repeat!important;
background-position:center center!important;
background-size:contain!important;
background-color:#fff!important;
z-index:1!important;
}
@media(max-width:900px){
.poster-banner-art{top:6px!important;left:10px!important;right:10px!important;height:calc(100% - 43px)!important;}
}
@media(max-width:640px){
.poster-banner-art{top:5px!important;left:7px!important;right:7px!important;height:calc(100% - 34px)!important;}
}
@media(max-width:430px){
.poster-banner-art{top:4px!important;left:6px!important;right:6px!important;height:calc(100% - 29px)!important;}
}
/* ===== Patch v4.31: keep staff photos aspect-ratio stable in PNG/PDF export =====
Staff portraits now render as CSS background layers instead of ![]()
object-fit,
because html2canvas may stretch object-fit images during export. */
.staff-photo.imam-img,
.staff-photo.bilal-img,
.prayer-row .staff-photo.imam-img,
.prayer-row .staff-photo.bilal-img{
display:block!important;
background-image:var(--staff-photo-url)!important;
background-repeat:no-repeat!important;
background-position:top center!important;
background-size:cover!important;
overflow:hidden!important;
}
.staff-photo.imam-img,
.prayer-row .staff-photo.imam-img{
width:100%!important;
}
.staff-photo.bilal-img,
.prayer-row .staff-photo.bilal-img{
width:100%!important;
}
.export-mode .staff-photo.imam-img,
.export-mode .staff-photo.bilal-img,
.poster.export-capture .staff-photo.imam-img,
.poster.export-capture .staff-photo.bilal-img{
background-size:cover!important;
background-position:top center!important;
background-repeat:no-repeat!important;
}
/* ===== Patch v4.32: Index poster date panel + translucent staff image frames =====
Match Jumaat poster visual treatment: dark date box and soft clear photo boxes.
Index-only selectors are scoped through .poster-hero-banner to avoid changing jumaat.php. */
.poster-hero-banner ~ .poster-date-block{
width:fit-content!important;
max-width:min(760px,calc(100% - 24px))!important;
margin-left:auto!important;
margin-right:auto!important;
padding:10px 28px 12px!important;
background:rgba(0,0,0,.42)!important;
border-radius:0!important;
box-sizing:border-box!important;
text-align:center!important;
}
.poster-hero-banner ~ .poster-date-block .date,
.poster-hero-banner ~ .poster-date-block .hijri{
display:block!important;
margin:0!important;
padding:0!important;
text-shadow:2px 2px 3px rgba(0,0,0,.85)!important;
}
.poster-hero-banner ~ .prayer-row .staff-photo.imam-img,
.poster-hero-banner ~ .prayer-row .staff-photo.bilal-img,
.poster-hero-banner ~ .prayer-row .imam-img.missing,
.poster-hero-banner ~ .prayer-row .bilal-img.missing{
background-color:rgba(255,255,255,.14)!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)!important;
}
.poster-hero-banner ~ .prayer-row .staff-photo.imam-img,
.poster-hero-banner ~ .prayer-row .staff-photo.bilal-img{
background-blend-mode:normal!important;
}
.export-mode .poster-hero-banner ~ .poster-date-block,
.poster.export-capture .poster-hero-banner ~ .poster-date-block{
background:rgba(0,0,0,.42)!important;
padding:10px 28px 12px!important;
}
.export-mode .poster-hero-banner ~ .prayer-row .staff-photo.imam-img,
.export-mode .poster-hero-banner ~ .prayer-row .staff-photo.bilal-img,
.poster.export-capture .poster-hero-banner ~ .prayer-row .staff-photo.imam-img,
.poster.export-capture .poster-hero-banner ~ .prayer-row .staff-photo.bilal-img{
background-color:rgba(255,255,255,.14)!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)!important;
}
@media(max-width:900px){
.poster-hero-banner ~ .poster-date-block{
padding:9px 20px 11px!important;
max-width:calc(100% - 18px)!important;
}
}
@media(max-width:640px){
.poster-hero-banner ~ .poster-date-block{
padding:8px 14px 10px!important;
max-width:calc(100% - 12px)!important;
}
}
@media(max-width:430px){
.poster-hero-banner ~ .poster-date-block{
padding:7px 10px 9px!important;
}
}
/* ===== Mobile public navigation: keep every action reachable ===== */
@media(max-width:640px){
.public-nav{
display:grid!important;
grid-template-columns:minmax(0,1fr) 92px!important;
gap:10px!important;
width:100%!important;
padding:10px 12px 12px!important;
align-items:center!important;
overflow:visible!important;
}
.public-nav input[type="date"]{
width:100%!important;
max-width:none!important;
min-width:0!important;
margin:0!important;
}
.public-nav > button[type="submit"]{
width:92px!important;
min-width:92px!important;
padding:0 12px!important;
}
.public-nav .public-nav-links{
grid-column:1/-1!important;
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
width:100%!important;
gap:8px!important;
align-items:stretch!important;
justify-content:stretch!important;
overflow:visible!important;
}
.public-nav .public-nav-links > a,
.public-nav .public-nav-links > button{
width:100%!important;
min-width:0!important;
height:44px!important;
min-height:44px!important;
padding:0 10px!important;
margin:0!important;
font-size:14px!important;
line-height:1.1!important;
text-align:center!important;
white-space:normal!important;
border-radius:12px!important;
}
.public-nav .admin-link{
grid-column:1/-1!important;
display:inline-flex!important;
background:var(--theme,#7ed321)!important;
color:#07130b!important;
height:44px!important;
min-height:44px!important;
padding:0 12px!important;
border-radius:12px!important;
font-size:14px!important;
box-shadow:none!important;
}
}
@media(max-width:360px){
.public-nav{grid-template-columns:minmax(0,1fr) 82px!important;padding-left:8px!important;padding-right:8px!important;gap:8px!important}
.public-nav > button[type="submit"]{width:82px!important;min-width:82px!important}
.public-nav .public-nav-links > a,
.public-nav .public-nav-links > button{font-size:13px!important;padding:0 7px!important}
}