.suci{
background:linear-gradient(135deg,#0ea5e9,#0369a1);
}

.boleh-haid{
background:linear-gradient(135deg,#22c55e,#15803d);
}

.timeline{
display:grid;
grid-template-columns:repeat(7,1fr);
gap:6px;
margin-top:12px;
}

.timeline-day{
padding:8px;
border-radius:10px;
font-size:12px;
text-align:center;
font-weight:600;
}

.suci{
background:linear-gradient(135deg,#0ea5e9,#0369a1);
}

.boleh-haid{
background:linear-gradient(135deg,#22c55e,#15803d);
}

.fiqh-calendar{
display:grid;
grid-template-columns:repeat(7,1fr);
gap:6px;
margin-top:15px;
}

.cal-head{
text-align:center;
font-size:12px;
opacity:.7;
}

.cal-day{
padding:8px;
border-radius:10px;
text-align:center;
font-size:13px;
font-weight:600;
background:#020617;
}

.suci{
background:linear-gradient(135deg,#0ea5e9,#0369a1);
}

.boleh{
background:linear-gradient(135deg,#22c55e,#15803d);
}

.today{
border:2px solid white;
box-shadow:
0 0 10px white,
0 0 20px rgba(255,255,255,.6);
}

.legend-quru{
margin-top:10px;
display:flex;
gap:14px;
font-size:13px;
opacity:.8;
}

.legend-quru span{
width:14px;
height:14px;
border-radius:4px;
display:inline-block;
margin-right:4px;
}

.box-suci{background:#0284c7;}
.box-next{background:#16a34a;}
.box-today{background:white;}

.footer{

margin-top:60px;

background:#020617;

border-top:1px solid rgba(255,255,255,.08);

padding:20px 10px;

}

.footer-container{

max-width:900px;

margin:auto;

display:flex;

flex-direction:column;

align-items:center;

gap:8px;

text-align:center;

}

.footer-menu{

display:flex;

gap:18px;

flex-wrap:wrap;

font-size:14px;

}

.footer-menu a{

color:#94a3b8;

text-decoration:none;

transition:.2s;

}

.footer-menu a:hover{

color:#7cff6b;

}

.footer-copy{

font-size:12px;

color:#64748b;

}

@media(max-width:768px){

.footer-container{

padding:30px 15px;

}

.footer-menu{

gap:12px;

font-size:13px;

}

}