.mansa-calendar-widget {
    overflow: hidden;
    border: 1px solid var(--mansa-border, #e5ebe8);
    border-radius: 8px;
    background: #fff;
}
.mansa-calendar-widget .info-widget-heading {
    display: flex; align-items: center; gap: 10px; min-height: 42px;
    padding: 8px 14px; background: var(--mansa-green, #08734c); color: #fff;
}
.mansa-calendar-widget .info-widget-heading h2 {
    margin: 0; color: #fff; font-size: 16px; font-weight: 850; line-height: 1.25;
}
.mansa-calendar-widget .info-widget-heading svg { flex: 0 0 auto; }
.mansa-calendar-body { padding: 10px 11px 12px; }
.mansa-calendar-year {
    margin: 0 0 8px; color: var(--mansa-muted, #69757d);
    font-size: 11px; font-weight: 750; text-align: center;
}
.mansa-calendar-month-nav {
    display: grid; grid-template-columns: 31px minmax(0, 1fr) 31px;
    align-items: center; gap: 7px; margin-bottom: 8px; padding: 5px 0;
    color: var(--mansa-green-dark, #07583d); text-align: center;
}
.mansa-calendar-month-nav strong { font-size: 13px; font-weight: 850; }
.mansa-calendar-nav-link {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 30px; height: 30px; border: 1px solid #dce9df;
    border-radius: 6px; background: #edf7f0; color: var(--mansa-green, #08734c);
    font-size: 23px; font-weight: 700; line-height: 1; text-decoration: none;
}
.mansa-calendar-nav-link:hover { background: var(--mansa-green, #08734c); color: #fff; }
.mansa-calendar-nav-link.is-disabled { opacity: .32; }
.mansa-calendar-grid {
    width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 3px;
    margin: 0; font-size: 11px;
}
.mansa-calendar-grid th {
    padding: 5px 0; border-radius: 4px; background: #f0f5f2;
    color: #35443c; font-size: 10px; font-weight: 850; text-align: center;
}
.mansa-calendar-grid th.is-sunday-heading { color: #b42323; }
.mansa-calendar-grid td {
    height: 29px; padding: 0; border: 1px solid #e8eeea; border-radius: 4px;
    background: #fff; color: #293741; text-align: center; vertical-align: middle;
}
.mansa-calendar-grid td > span {
    display: flex; align-items: center; justify-content: center; width: 100%;
    min-height: 27px; border-radius: 3px; line-height: 1;
}
.mansa-calendar-grid td.is-sunday:not(.is-marked) { color: #b42323; }
.mansa-calendar-grid td.is-empty { border-color: transparent; background: transparent; }
.mansa-calendar-grid td.is-marked { border-color: transparent; color: #243340; font-weight: 850; }
.mansa-calendar-grid td.cat-plm > span, .mansa-calendar-swatch.cat-plm { background: #f5e7ae; }
.mansa-calendar-grid td.cat-asas > span, .mansa-calendar-swatch.cat-asas { background: #62d52f; }
.mansa-calendar-grid td.cat-hasil > span, .mansa-calendar-swatch.cat-hasil { background: #d9ed45; }
.mansa-calendar-grid td.cat-semester > span, .mansa-calendar-swatch.cat-semester { background: #ef4bb7; }
.mansa-calendar-grid td.cat-idulfitri > span, .mansa-calendar-swatch.cat-idulfitri { background: #ffe326; }
.mansa-calendar-grid td.cat-ujian > span, .mansa-calendar-swatch.cat-ujian { background: #e4ed69; }
.mansa-calendar-grid td.cat-nasional > span, .mansa-calendar-swatch.cat-nasional { background: #f2382d; }
.mansa-calendar-legend { margin-top: 10px; padding-top: 9px; border-top: 1px solid #edf1ee; }
.mansa-calendar-legend summary {
    color: var(--mansa-green-dark, #07583d); cursor: pointer; font-size: 11px; font-weight: 800;
}
.mansa-calendar-legend ul {
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px;
    margin: 9px 0 0; padding: 0; list-style: none;
}
.mansa-calendar-legend li {
    display: grid; grid-template-columns: 15px minmax(0, 1fr); align-items: start;
    gap: 7px; color: #4d5c54; font-size: 10px; line-height: 1.35;
}
.mansa-calendar-swatch { display: block; width: 14px; height: 12px; margin-top: 1px; border-radius: 2px; }
.mansa-calendar-note { margin: 9px 0 0; color: var(--mansa-muted, #69757d); font-size: 10px; line-height: 1.45; }
.home-calendar-slot > .widget {
    margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none;
}

/* Warna tanggal dan legenda dapat diubah dari pengaturan widget. */
.mansa-calendar-grid td.is-marked > span {
    background: var(--mansa-calendar-mark-color, #e4ed69) !important;
}
.mansa-calendar-legend {
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid #edf1ee;
}
.mansa-calendar-legend-title {
    display: block;
    margin-bottom: 8px;
    color: var(--mansa-green-dark, #07583d);
    font-size: 11px;
    font-weight: 850;
}
.mansa-calendar-legend ul {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.mansa-calendar-legend .mansa-calendar-swatch {
    background: var(--mansa-calendar-mark-color, #e4ed69) !important;
}

/* AJAX navigation: show a subtle loading state without shifting the page. */
.mansa-calendar-widget.is-loading {
    opacity: .62;
    pointer-events: none;
    transition: opacity .15s ease;
}
.mansa-calendar-widget[aria-busy="true"] .mansa-calendar-month-nav strong::after {
    content: " …";
    color: var(--mansa-muted, #69757d);
}


/* ========================================
   PENANDA AKHIR PEKAN
   Ahad lebih tegas, Sabtu lebih terang
   ======================================== */

/* Header nama hari Ahad */
.mansa-calendar-grid th.is-sunday-heading {
    color: #b42323;
    background-color: #fee2e2;
}

/* Header nama hari Sabtu */
.mansa-calendar-grid th.is-saturday-heading {
    color: #9a4c50;
    background-color: #fff1f2;
}

/* Tanggal Ahad */
.mansa-calendar-grid td.is-sunday:not(.is-marked) {
    color: #b42323;
}

.mansa-calendar-grid td.is-sunday:not(.is-marked) > span {
    background-color: #fee2e2;
}

/* Tanggal Sabtu: lebih terang daripada Ahad */
.mansa-calendar-grid td.is-saturday:not(.is-marked) {
    color: #9a4c50;
}

.mansa-calendar-grid td.is-saturday:not(.is-marked) > span {
    background-color: #fff1f2;
}
