/* Desktop availability: month comparison alongside the selected room list. */
#app .cal-room-meta,#app .cal-room-rent,#app .cal-room-location,#app .cal-month-panel>h3,#app .cal-month-columns{display:none}
@media(max-width:600px){
 #app .cal-workspace,#app .cal-results{display:contents}
 #app .cal-month-panel{display:none}
}
@media(min-width:601px){
 #app .cal-card{padding:22px;background:#fff;scroll-margin-top:88px}
 #app .cal-overview-head{padding-bottom:20px;border-bottom:1px solid #d2dfeb;margin-bottom:20px}
 #app .cal-workspace{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start}
 #app .cal-results{min-width:0;display:flex;flex-direction:column}
 #app .cal-month-panel{position:sticky;top:16px;min-width:0;background:#f5f8fc;border:1.5px solid #afc2d8;border-radius:10px;overflow:hidden}
 #app .cal-month-panel>h3{display:block;margin:0;padding:14px 15px 8px;color:#173b63;font-size:18px;font-weight:700}
 #app .cal-month-columns{display:grid;grid-template-columns:minmax(0,1fr) 42px 66px;align-items:center;gap:5px;padding:8px 13px 10px;color:#3b5573;font-size:14px;line-height:1.5;border-bottom:1px solid #afc2d8}
 #app .cal-month-columns>span:not(:first-child){text-align:center}
 #app .cal-months{display:flex;flex-direction:column;gap:0;margin:0;padding:0;overflow:visible}
 #app .cal-month-card{display:grid;grid-template-columns:minmax(0,1fr) 42px 66px;align-items:center;gap:5px;min-height:44px;padding:9px 13px;border:0;border-bottom:1px solid #d7e1ed;border-radius:0;background:#fff;box-shadow:none}
 #app .cal-month-card:last-child{border-bottom:0}
 #app .cal-month-card.is-selected{padding:9px 13px;border:0;border-bottom:1px solid #c0d1e6;background:#e5efff;box-shadow:inset 4px 0 #2453b8}
 #app .cal-month-card:hover{background:#edf3fa}
 #app .cal-month-name{font-size:16px;gap:6px;white-space:nowrap}
 #app .cal-month-name>span{font-size:14px;color:#526983}
 #app .cal-month-value{justify-content:center;font-size:16px}
 #app .cal-month-value strong{font-size:19px;line-height:1.3;color:#126344}
 #app .cal-month-pending{display:block;width:auto;text-align:center;font-size:16px;line-height:1.5;color:#526983}
 #app .cal-month-pending b{font-weight:500}
 #app .cal-month-card.is-selected .cal-month-name{color:#173f8b}
 #app .cal-month-card.is-selected .cal-month-pending{font-weight:700;color:#173f8b}
 #app .cal-filters{order:0;margin:0 0 18px;padding:12px;gap:10px;background:#f5f8fc}
 #app .cal-filters>label{min-width:0;flex:1}
 #app .cal-amen-filter{flex-basis:100%;min-width:0;margin:0}
 #app .cal-amen-filter summary{font-size:14px;padding:8px 10px;min-height:40px}
 #app .cal-reset{margin:0;min-height:36px}
 #app .cal-selected{order:1;border:0;padding:0}
 #app .cal-selected-head{align-items:flex-start;flex-direction:column;gap:3px}
 #app .cal-selected-head h2{font-size:22px}
 #app .cal-selected-head>span{font-size:14px}
 #app .cal-status-filters{gap:7px;margin:14px 0 20px}
 #app .cal-status-filters button{font-size:14px;padding:9px 10px;min-height:44px}
 #app .cal-status-filters button:first-child{color:#126344;background:#eff8f3;border-color:#77a892}
 #app .cal-status-filters button:first-child.active{color:#fff;background:#126344;border-color:#126344}
 #app .cal-room-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 #app .cal-room-list .cal-room-group,#app .cal-room-list .cal-room-tiles{display:contents}
 #app .cal-room-list .cal-room-group h3{display:none}
 #app .cal-room-list>.cal-empty{grid-column:1/-1}
 #app .cal-room-tile{min-width:0;gap:4px;padding:12px 24px 12px 12px;background:#fff;border-width:1.5px}
 #app .cal-room-tile strong{font-size:22px;color:#173b63}
 #app .cal-room-tile .cal-room-location{display:inline;font-size:14px;color:#526983;font-weight:400;margin-left:8px}
 #app .cal-room-tile>span{font-size:14px}
 #app .cal-room-tile.is-cv{background:#f6fbf8}
 #app .cal-room-tile.is-may{background:#f7f9fc}
 #app .cal-room-tile>.cal-room-meta{display:block;color:#3b5573;padding-top:4px;line-height:1.5;overflow-wrap:anywhere}
 #app .cal-room-tile>.cal-room-rent{display:block;color:#173b63;font-weight:700;font-size:15px}
 #app .cal-room-rent small{display:inline;font-size:13px;font-weight:400;color:#526983}
 #app .cal-summary-note{order:2;display:block;padding:12px 0 0;border-top:1px solid #d2dfeb;margin-top:4px;line-height:1.7}
 #app .cal-summary-note>span{display:block;margin-top:4px}
 #app .cal-summary-note i{margin-right:5px}
 #app .cal-timeline{margin-top:22px}
}
@media(min-width:1101px){
 #app .cal-filters>label{flex:0 0 130px}
 #app .cal-amen-filter{flex:1;min-width:160px;margin-top:26px}
}
@media(min-width:601px) and (max-width:1100px){
 #app .cal-workspace{grid-template-columns:230px minmax(0,1fr);gap:16px}
 #app .cal-room-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 #app .cal-month-columns,#app .cal-month-card,#app .cal-month-card.is-selected{padding-left:10px;padding-right:10px;grid-template-columns:minmax(0,1fr) 35px 60px}
}
@media(min-width:601px) and (max-width:800px){
 #app .cal-workspace{grid-template-columns:minmax(0,1fr)}
 #app .cal-month-panel{position:static}
 #app .cal-months{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 #app .cal-month-columns{display:none}
 #app .cal-month-value::after{content:' ว่าง';font-size:13px;margin-left:3px}
 #app .cal-month-pending::after{content:' รอยืนยัน';font-size:12px}
 #app .cal-month-panel>h3::after{content:' · ว่าง / รอยืนยันต่อสัญญา';font-size:14px;font-weight:400}
}