#calendar{
   margin: 5em 10em; 
}
.table{
  --bs-body-color:rgb(252, 243, 243);
  --bs-table-color-type:initial;
  --bs-table-bg-type:initial;
  --bs-table-color-state:initial;
  --bs-table-bg-state:initial;
  --bs-table-color:var(--bs-body-color);
  --bs-table-bg:rgba(0, 61, 71, 0.3);
  --bs-table-border-color:var(--bs-border-color);
  --bs-table-accent-bg:transparent;
  --bs-table-striped-color:var(--bs-body-color);
  --bs-table-striped-bg:rgba(45, 51, 41, 0.46);
  --bs-table-hover-color:var(--bs-body-color);
  --bs-table-hover-bg:rgba(0, 0, 0, 0.075);
  align-items: center;
  justify-content: center;
  padding: 0px;
  font-size: 1.4em;
  text-align: center;
  border-bottom-width:var(--bs-border-width);
 }
.table>:not(caption)>*>*{padding:.5rem .5rem;
    color:var(--bs-table-color-state,var(--bs-table-color-type,var(--bs-table-color)));
    background-color:var(--bs-table-bg);
    box-shadow:inset 0 0 0 9999px var(--bs-table-bg-state,var(--bs-table-bg-type,var(--bs-table-accent-bg)))}
.btn-delete{
  border-radius: 5%;
  background:rgba(43, 93, 193, 0.57);
  color:#ffffff;
  font-size:0.8em;
  padding:5px 30px;
  text-decoration:none;
}
  .text-white {
    color: white;
  }
  .text-red{
    color:rgb(255, 0, 0);
  }
  /*不可預約*/
  .btn-danger{
    background-color: rgba(220, 38, 6, 0.537);
    backdrop-filter: blur(10px);
  }
  /*可預約*/
  .btn-success{
    background-color:rgba(2, 203, 5, 0.537);
    backdrop-filter: blur(10px);
  }
  .btn-success:hover{
    background-color:rgba(0, 255, 4, 0.686);
  }
 /* 上面的的< today > 鍵*/
  .btn-primary{
  align-items: center;
  justify-content: center;
  padding: 0px;
  font-size: 1.4em;
  text-align: center;

	color:#fff;
	background-color:#36433c;
	border-color:#42474d;
  }
  .btn-primary.focus,.btn-primary:hover{
	color:#fff;
	background-color:#787029;
	border-color:#204d74
  }
	
 /*上個月下個月按鍵*/

.table-bordered {
    margin-top: 20px;
}

.header {
    color: #fff;
}

.button-container {
    white-space:normal;
}

.changemonth {
    margin-right: 1px; /* Adjust as needed for spacing between buttons */
}


  .btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.dropdown-toggle.btn-primary.focus,.open>.dropdown-toggle.btn-primary:focus,.open>.dropdown-toggle.btn-primary:hover{color:#000000;background-color:#ffffff;border-color:#122b40}.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover{background-color:#337ab7;border-color:#2e6da4}.btn-primary .badge{color:#337ab7;background-color:#fff}
@media (max-width:500px) {
  #calendar {
    margin: 3rem auto; /* 5em 上下留白，auto 左右自動置中 */
  }
.table {
    font-size: 0.8rem; /* 在手機上進一步縮小字體大小 */
    padding: 0.2rem; /* 在手機上進一步縮小內間距 */
  }
.btn {
    font-size: 0.7rem; /* 在手機上進一步縮小字體大小 */
    padding: 0.2rem; /* 在手機上進一步縮小內間距 */
  }
}
 
/*  margin-bottom:20rem;
vertical-align:top; border-color:var(--bs-table-border-color)*/