/* =========================================================
   PIRANTI ATTENDANCE
   MY SCHEDULE - MOBILE CALENDAR FINAL
   ========================================================= */

@media(max-width:700px){

  .my-schedule-panel .attendance-calendar-head{
    padding:0 10px !important;
    margin:14px 0 10px !important;
  }

  .my-schedule-panel .attendance-calendar-nav{
    display:grid !important;
    grid-template-columns:34px 1fr 34px !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
  }

  .my-schedule-panel .attendance-calendar-nav strong{
    min-width:0 !important;
    text-align:center !important;
    font-size:13px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  .my-schedule-panel .attendance-calendar-nav button{
    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;
    height:34px !important;
    min-height:34px !important;
    padding:0 !important;
    margin:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border:1px solid #dbe3ec !important;
    border-radius:9px !important;
    background:#fff !important;

    font-size:20px !important;
    line-height:1 !important;
  }


  /* Calendar wrapper */

  .my-schedule-panel .attendance-calendar{
    width:auto !important;
    margin:0 6px 12px !important;

    border:1px solid #e2e8f0 !important;
    border-radius:12px !important;

    overflow:hidden !important;
  }


  /* 7 hari tetap penuh */

  .my-schedule-panel .attendance-calendar-weekdays,
  .my-schedule-panel .attendance-calendar-grid{
    display:grid !important;
    grid-template-columns:repeat(7,minmax(0,1fr)) !important;
    width:100% !important;
  }

  .my-schedule-panel
  .attendance-calendar-weekdays > div{
    min-width:0 !important;
    height:28px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:0 !important;

    color:#64748b !important;

    font-size:7.5px !important;
    font-weight:800 !important;
  }


  /* Cell */

  .my-schedule-panel .attendance-calendar-cell{
    position:relative !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;
    min-width:0 !important;

    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;

    padding:4px 2px !important;
    margin:0 !important;

    box-sizing:border-box !important;

    border:0 !important;
    border-right:1px solid #edf1f5 !important;
    border-bottom:1px solid #edf1f5 !important;
    border-radius:0 !important;

    background:#fff !important;

    overflow:hidden !important;

    box-shadow:none !important;
  }

  .my-schedule-panel
  .attendance-calendar-cell:nth-child(7n){
    border-right:0 !important;
  }


  /* Nomor tanggal */

  .my-schedule-panel .attendance-calendar-day{
    position:static !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:21px !important;
    height:21px !important;

    flex:0 0 21px !important;

    padding:0 !important;
    margin:0 auto 3px !important;

    border-radius:50% !important;

    font-size:9px !important;
    font-weight:800 !important;
    line-height:1 !important;
  }


  /* today */

  .my-schedule-panel
  .attendance-calendar-cell.is-today
  .attendance-calendar-day{
    background:#eef2ff !important;
    color:#3730a3 !important;
  }


  /* selected */

  .my-schedule-panel
  .attendance-calendar-cell.is-selected{
    background:#fff7fa !important;
    box-shadow:
      inset 0 0 0 2px #8b1e46 !important;
    z-index:2 !important;
  }

  .my-schedule-panel
  .attendance-calendar-cell.is-selected
  .attendance-calendar-day{
    background:#8b1e46 !important;
    color:#fff !important;
  }


  /* =======================================================
     Isi jadwal
     hanya kode singkat: OH / SF1 / SF2 / SF3 / OFF
     ======================================================= */

  .my-schedule-panel
  .attendance-calendar-cell span:not(.attendance-calendar-day){
    display:block !important;

    max-width:100% !important;

    margin:0 !important;
    padding:2px 3px !important;

    border-radius:5px !important;

    overflow:hidden !important;

    text-align:center !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;

    font-size:7px !important;
    font-weight:800 !important;
    line-height:1.1 !important;
  }


  /* Hilangkan jam/deskripsi panjang di cell.
     Detail tetap tersedia di bawah calendar. */

  .my-schedule-panel
  .attendance-calendar-cell small{
    display:none !important;
  }


  /* apabila ada line break bawaan */
  .my-schedule-panel
  .attendance-calendar-cell br{
    display:none !important;
  }


  /* Badge count/dot lama tidak diperlukan */

  .my-schedule-panel
  .attendance-calendar-count,
  .my-schedule-panel
  .attendance-calendar-dot{
    display:none !important;
  }


  /* Detail tanggal */

  .my-schedule-panel .attendance-calendar-selected{
    margin:10px 6px 14px !important;
    padding:12px !important;

    border:1px solid #e2e8f0 !important;
    border-radius:11px !important;

    background:#fff !important;
  }

  .my-schedule-panel
  .attendance-calendar-selected-head strong{
    font-size:13px !important;
  }

  .my-schedule-panel
  .attendance-calendar-selected-head span,
  .my-schedule-panel
  .attendance-calendar-selected-head small{
    font-size:9px !important;
  }
}


@media(max-width:380px){

  .my-schedule-panel .attendance-calendar-cell{
    height:54px !important;
    min-height:54px !important;
    max-height:54px !important;
  }

}
