
/*
 * ShareHome Calendar Views v15
 * Separate renderers for week/day/30-day/agenda views.
 * Loaded after mobile-calendar-v14 so this file is the final authority for non-month views.
 */

.calendar-view-shell{
  border:1px solid #e3e9f1;
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 30px rgba(31,47,70,.045);
  overflow:hidden;
}
.calendar-view-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:18px 20px;
  border-bottom:1px solid #e8edf3;
  background:linear-gradient(180deg,#fff 0%,#fbfcff 100%);
}
.calendar-view-heading h2{margin:3px 0 0!important;font-size:1.22rem!important;color:#24344b!important}
.calendar-view-heading>small{color:#7b899a!important;line-height:1.8!important;max-width:360px}

/* Week: a genuine seven-column planning grid on desktop. */
.calendar-week-view-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:0;
  background:#e8edf3;
}
.week-view-day{
  appearance:none;
  min-width:0;
  min-height:320px;
  padding:0;
  border:0;
  border-left:1px solid #e8edf3;
  background:#fff;
  color:#27384f;
  text-align:right;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  transition:background .15s ease,box-shadow .15s ease;
}
.week-view-day:last-child{border-left:0}
.week-view-day:hover{background:#fbfcff;box-shadow:inset 0 0 0 2px #e3eaff}
.week-view-day.today{background:#f7f9ff;box-shadow:inset 0 3px 0 #6684d5}
.week-view-day.holiday{background:#fffafa}
.week-view-date{
  display:grid;
  gap:2px;
  justify-items:center;
  min-height:92px;
  padding:14px 8px 12px;
  border-bottom:1px solid #edf1f5;
}
.week-view-date small{font-weight:850!important;color:#6b7a8e!important}
.week-view-date strong{font-size:1.55rem!important;line-height:1.15;color:#25374f}
.week-view-date span{font-size:.82rem!important;color:#8793a3!important}
.week-view-items{display:grid;gap:7px;padding:12px 9px;align-content:start}
.week-view-item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:2px 7px;
  align-items:start;
  padding:8px 9px;
  border:1px solid #edf1f6;
  border-radius:11px;
  background:#fafbfd;
}
.week-view-item>i{grid-row:1/3;width:7px;height:7px;border-radius:50%;margin-top:6px;background:#aab4c0}
.week-view-item b{min-width:0;font-size:.8rem!important;line-height:1.65;color:#33445b;white-space:normal}
.week-view-item small{font-size:.72rem!important;color:#8290a0!important}
.week-view-item.occasion{background:#fffaf0;border-color:#f1e7ca}.week-view-item.occasion>i{background:#c9a45c}
.week-view-item.period{background:#f4f9fc;border-color:#dcecf5}.week-view-item.period>i{background:#70afd4}
.week-view-item.event{background:#f8f6ff;border-color:#e8e1fb}.week-view-item.event>i{background:#8b79cf}
.week-view-empty{padding:18px 6px;text-align:center;color:#9aa5b3;font-size:.78rem!important}
.week-view-more{padding:5px 7px;text-align:center;color:#67768a;font-size:.72rem!important;font-weight:800}

/* Day: one focused day with three semantic sections. */
.day-view-heading{align-items:center}
.day-view-counters{display:flex;gap:8px;flex-wrap:wrap}
.day-view-counters span{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 10px;border:1px solid #e4eaf2;border-radius:999px;background:#fff;
  color:#68788d;font-size:.78rem!important;font-weight:800;
}
.day-view-counters i,.next30-counts i{
  width:7px;height:7px;border-radius:50%;display:inline-block;
}
.day-view-counters .occasion,.next30-counts .occasion{background:#c9a45c}
.day-view-counters .period,.next30-counts .period{background:#70afd4}
.day-view-counters .event,.next30-counts .event{background:#8b79cf}
.day-view-sections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px}
.day-view-section{
  border:1px solid #e6ebf2;border-radius:16px;background:#fbfcfe;padding:15px;min-width:0;
}
.day-view-section h3{display:flex;align-items:center;gap:8px;margin:0 0 12px!important;font-size:.95rem!important}
.day-view-section h3 i{width:9px;height:9px;border-radius:50%;display:inline-block}
.day-view-section h3 i.occasion{background:#c9a45c}.day-view-section h3 i.period{background:#70afd4}.day-view-section h3 i.event{background:#8b79cf}
.day-view-record{display:grid;gap:3px;padding:10px 0;border-bottom:1px solid #edf1f5}
.day-view-record:last-child{border-bottom:0}
.day-view-record b{font-size:.88rem!important;line-height:1.75;color:#304159}
.day-view-record small{font-size:.76rem!important;color:#7f8c9c!important}
.day-view-empty{margin:0;padding:18px 8px;text-align:center;color:#98a3b1;font-size:.78rem!important}

/* 30-day: dense overview instead of oversized agenda rows. */
.next30-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  padding:14px;
  background:#fafbfd;
}
.next30-day{
  appearance:none;min-width:0;min-height:128px;padding:12px;
  border:1px solid #e4eaf2;border-radius:15px;background:#fff;color:#2d3e55;
  text-align:right;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;
  cursor:pointer;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease;
}
.next30-day:hover{transform:translateY(-2px);border-color:#cfdaf0;box-shadow:0 10px 24px rgba(31,47,70,.07)}
.next30-day.today{border-color:#b9c8ed;background:#f8faff}
.next30-day.holiday{background:#fffafa}
.next30-day.quiet{background:#fcfdfd}
.next30-date{display:grid;align-content:start;justify-items:center;min-width:48px;padding-left:10px;border-left:1px solid #edf1f5}
.next30-date strong{font-size:1.45rem!important;line-height:1;color:#283a52}
.next30-date span{font-size:.78rem!important;margin-top:6px;color:#4d5d71}
.next30-date small{font-size:.7rem!important;color:#8c98a7!important}
.next30-summary{display:grid;align-content:start;gap:9px;min-width:0}
.next30-counts{display:flex;align-items:center;gap:5px;color:#64748b}
.next30-counts b{font-size:.76rem!important;margin-left:4px}
.next30-summary em{font-style:normal;font-size:.78rem!important;line-height:1.7;color:#4c5d72;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.next30-summary em.free{color:#9aa5b3}

/* Agenda: compact records only, intentionally different from week/day/30-day. */
.agenda-compact-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;background:#fafbfd}
.agenda-compact-day{
  display:grid;grid-template-columns:78px minmax(0,1fr);min-width:0;
  border:1px solid #e4eaf2;border-radius:14px;background:#fff;overflow:hidden;cursor:pointer;
}
.agenda-compact-day.holiday{border-right:3px solid #d98787}
.agenda-compact-date{display:grid;place-items:center;align-content:center;gap:2px;padding:12px 8px;background:#f8fafc;border-left:1px solid #edf1f5}
.agenda-compact-date strong{font-size:1.4rem!important;color:#2d3f57}.agenda-compact-date span{font-size:.78rem!important}.agenda-compact-date small{font-size:.7rem!important;color:#8b98a8!important}
.agenda-compact-records{display:grid;padding:9px 12px;align-content:start}
.agenda-compact-record{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 7px;padding:7px 0;border-bottom:1px solid #f0f3f6;min-width:0}
.agenda-compact-record:last-child{border-bottom:0}
.agenda-compact-record i{grid-row:1/3;width:7px;height:7px;border-radius:50%;margin-top:7px;background:#aab4c0}
.agenda-compact-record b{font-size:.8rem!important;line-height:1.65;color:#34465e;white-space:normal}
.agenda-compact-record small{font-size:.72rem!important;color:#8491a1!important}
.agenda-compact-record.occasion i{background:#c9a45c}.agenda-compact-record.period i{background:#70afd4}.agenda-compact-record.event i{background:#8b79cf}

@media(max-width:1180px){
  .next30-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .calendar-week-view-grid{overflow:auto;grid-template-columns:repeat(7,minmax(180px,1fr))}
}

@media(max-width:900px){
  .calendar-view-shell{border-radius:18px}
  .calendar-view-heading{padding:15px 16px;display:grid;gap:8px}
  .calendar-view-heading>small{max-width:none}
  .calendar-week-view-grid{
    display:flex;overflow-x:auto;gap:10px;padding:12px;background:#fafbfd;
    scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;
  }
  .week-view-day{
    flex:0 0 min(78vw,360px);min-height:250px;border:1px solid #e4eaf2!important;border-radius:16px;overflow:hidden;
    scroll-snap-align:center;
  }
  .week-view-date{min-height:74px;grid-template-columns:auto auto auto;justify-content:center;align-items:center;gap:8px;padding:10px}
  .week-view-date strong{font-size:1.35rem!important}.week-view-date span,.week-view-date small{font-size:.82rem!important}
  .week-view-items{padding:10px}
  .day-view-counters{width:100%}
  .day-view-sections{grid-template-columns:1fr;padding:12px;gap:10px}
  .day-view-section{padding:13px}
  .next30-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px}
  .next30-day{min-height:118px;padding:10px;grid-template-columns:auto 1fr}
  .agenda-compact-list{grid-template-columns:1fr;padding:10px}
  .agenda-compact-day{grid-template-columns:72px 1fr}
  .calendar-view-shell{margin-bottom:calc(86px + env(safe-area-inset-bottom))}
}

@media(max-width:520px){
  .next30-grid{grid-template-columns:1fr 1fr}
  .next30-day{min-height:112px;gap:7px}
  .next30-date{min-width:42px;padding-left:7px}
  .next30-date strong{font-size:1.3rem!important}
  .next30-summary em{font-size:.76rem!important}
}

@media(max-width:390px){
  .next30-grid{grid-template-columns:1fr}
  .next30-day{min-height:96px}
}
