h1{
    font-size: 30px;
    color: #04009A;
    text-shadow: #C06014 2px 2px;
}
th{width:auto;height: 50px;  
    font-size: 20px;
      }
   td{width:auto;height: 80px;  }
   th{background-color: #B1E1FF;
  
  }
   #tb_calendar, #main{ width : 100%; table-layout: fixed; background-color: #1a1a2e; }
   #tb_calendar th { vertical-align: middle; height: 40px; background-color: #16213e; color: #fff; border-color: #0f3460; }
   #tb_calendar td { vertical-align: top; height: auto; min-height: 60px; background-color: #1a1a2e; border-color: #0f3460; }
   #main{ border : 0px solid #46A5E0; }
   #nav{
    background: linear-gradient(135deg, #2193b0, #6dd5ed);
    min-height: 30px;
    padding: 10px;
    text-align: center;
    color : white;
    border-radius: 20px;
   }
   .navLeft{float: left; }
   .navRight{float: right;}
   .title{float: left; text-align: center; width: 300px;}
  
   .center {
    line-height: 100px;
    height: 100px;
     text-align: center;
  
  }
  div.b {
    position: absolute;
    left: auto;
    width: 200px;
  } 
  
  #rcorners1 {
      border-radius: 25px;
      background: #73AD21;
      padding: 20px; 
      width: 200px;
      height: 150px;    
  }
  
  #rcorners2 {
      border-radius: 25px;
      border: 2px solid #73AD21;
      padding: 20px; 
      width: 200px;
      height: 150px;    
  }
  
  #rcorners3 {
      border-radius: 25px;
      background: url(paper.gif);
      background-position: left top;
      background-repeat: repeat;
      padding: 20px; 
      width: 200px;
      height: 150px;    
  }
  table {
      border-collapse: separate;
      border-spacing: 0;
  
  }
  table, th {
      border: 1px solid black;
      border-radius: 5px;
      -moz-border-radius: 5px;
      padding: 2px;
      /*background: #000;*/
      border-color:#C06014;
      color:#04009A;
  }
  table, td {
      border: 1px solid black;
      border-radius: 5px;
      -moz-border-radius: 5px;
      padding: 2px;
      border-color:#C06014;
  }
  .daycss{
    font-size: 20px;
    /*color: #C06014;*/
    background-color: rgb(80, 241, 241);
    border-radius: 10px;
    padding-right: 10px;
  }
  /* ===== ปุ่มจอง เช้าว่าง / บ่ายว่าง — สดใส ไม่มีเส้นใต้ ===== */
  #boxad,
  .boxad {
    background: transparent;
    border: none;
    padding: 0;
    margin: 4px 0;
    cursor: pointer;
  }
  #boxad a,
  .boxad a,
  #boxad a:link,
  #boxad a:visited,
  .boxad a:link,
  .boxad a:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
    color: #fff !important;
    text-decoration: none !important;
    border: 1px solid rgba(255,255,255,.6);
    background: linear-gradient(135deg, #34D399 0%, #10B981 45%, #059669 100%);
    box-shadow: 0 4px 12px rgba(16,185,129,.40), inset 0 1px 0 rgba(255,255,255,.45);
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
    transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
  }
  /* เช้าว่าง — โทนพระอาทิตย์ขึ้น ส้มทองสดใส */
  #boxad.box-morning a,
  .boxad.box-morning a {
    background: linear-gradient(135deg, #FFD54F 0%, #FF9800 55%, #FF5722 100%);
    box-shadow: 0 4px 12px rgba(255,152,0,.45), inset 0 1px 0 rgba(255,255,255,.55);
    border-color: rgba(255,255,255,.65);
  }
  /* บ่ายว่าง — โทนฟ้าสดใส */
  #boxad.box-afternoon a,
  .boxad.box-afternoon a {
    background: linear-gradient(135deg, #4FC3F7 0%, #2196F3 55%, #1565C0 100%);
    box-shadow: 0 4px 12px rgba(33,150,243,.45), inset 0 1px 0 rgba(255,255,255,.55);
    border-color: rgba(255,255,255,.65);
  }
  #boxad a:hover,
  .boxad a:hover {
    filter: brightness(1.08) saturate(1.1);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.55);
    color: #fff !important;
    text-decoration: none !important;
  }
  #boxad a:active,
  .boxad a:active {
    transform: translateY(0) scale(.98);
    filter: brightness(.97);
  }
  /* ไอคอนประกอบปุ่มอัตโนมัติ */
  #boxad.box-morning a::before,
  .boxad.box-morning a::before {
    content: "\2600\FE0F";
  }
  #boxad.box-afternoon a::before,
  .boxad.box-afternoon a::before {
    content: "\2728";
  }

/* ===== Old Booking Card (วันเก่า) — ชมพูอ่อนสีเดียวกับทุกโมดูล ===== */
.old-booking-card {
    background: linear-gradient(135deg, #FDF2F8 0%, #FCE7F3 100%);
    border: 1px solid #F9A8D4;
    border-radius: 10px;
    padding: 10px 12px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    min-width: 90px;
    box-shadow: 0 4px 15px rgba(236, 72, 153, 0.3);
    transition: box-shadow 0.2s;
}
.old-booking-card:hover {
    /* ห้ามใช้ transform: จะทำให้โมดูลลูก (fixed modal) กระพริบย่อขยาย */
    box-shadow: 0 6px 20px rgba(236, 72, 153, 0.5);
}
.old-booking-row {
    display: flex;
    align-items: center;
    gap: 6px;
}
.old-booking-icon {
    font-size: 18px;
}
.old-booking-count {
    font-size: 22px;
    font-weight: bold;
    color: #9D174D;
}
.old-booking-link {
    color: #9D174D;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    padding: 3px 10px;
    background: #FBCFE8;
    border: 1px solid #F9A8D4;
    border-radius: 12px;
    transition: background 0.2s;
}
.old-booking-link:hover {
    background: #F9A8D4;
    color: #831843;
}