/* Nordic Homebase — Build 008F.1
   UI Foundation continuation: Nordic Scroll, Conversation and Calendar polish.
   Continue and expand. Never redesign. */

/* Nordic Scroll System — one calm visual language everywhere */
:root{
  --nordic-scroll-size:10px;
  --nordic-scroll-track:color-mix(in srgb,var(--panel) 28%,transparent);
  --nordic-scroll-thumb:color-mix(in srgb,var(--accent) 34%,var(--line));
  --nordic-scroll-thumb-hover:color-mix(in srgb,var(--accent) 58%,var(--line));
}
html{scrollbar-width:thin;scrollbar-color:var(--nordic-scroll-thumb) transparent}
*{scrollbar-width:thin;scrollbar-color:var(--nordic-scroll-thumb) transparent}
*::-webkit-scrollbar{width:var(--nordic-scroll-size);height:var(--nordic-scroll-size)}
*::-webkit-scrollbar-track{background:var(--nordic-scroll-track);border-radius:999px}
*::-webkit-scrollbar-thumb{
  min-height:42px;
  border:2px solid transparent;
  border-radius:999px;
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--accent) 48%,rgba(255,255,255,.22)),
    color-mix(in srgb,var(--accent) 26%,rgba(15,30,35,.5))) padding-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 12px rgba(0,0,0,.12);
}
*::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--accent) 70%,rgba(255,255,255,.28)),
    color-mix(in srgb,var(--accent) 42%,rgba(15,30,35,.48))) padding-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 0 14px color-mix(in srgb,var(--accent) 24%,transparent);
}
*::-webkit-scrollbar-corner{background:transparent}

/* Conversation polish */
.butler-chat-head{align-items:flex-start;min-width:0}
.butler-chat-head>div:last-child{min-width:0;flex:1}
.butler-chat-head h3{
  margin:3px 0 8px;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.18;
  font-size:clamp(1.15rem,2vw,1.55rem);
}
.butler-capability-chips{display:flex;flex-wrap:wrap;gap:7px}
.butler-capability-chip{
  display:inline-flex;align-items:center;min-height:27px;padding:5px 9px;
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));
  border-radius:999px;background:color-mix(in srgb,var(--accent) 7%,var(--solid));
  color:var(--muted);font-size:.72rem;letter-spacing:.015em;
}

/* Calendar desktop balance */
.calendar-layout{grid-template-columns:minmax(560px,1.18fr) minmax(360px,.82fr);align-items:stretch}
.calendar-main,.calendar-agenda{min-height:620px}
.calendar-main{padding:clamp(16px,2vw,24px)}
.calendar-agenda{padding:clamp(16px,2vw,24px)}
.calendar-toolbar{padding:4px 0 16px;margin-bottom:6px}
.calendar-toolbar h3{font-size:clamp(1.15rem,2vw,1.45rem)}
.calendar-weekdays span{padding:12px 8px;font-weight:650;letter-spacing:.04em}
.calendar-grid{gap:6px}
.calendar-day{
  min-height:118px;border-radius:14px;padding:10px;
  background:color-mix(in srgb,var(--solid) 76%,transparent);
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.calendar-day:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 34%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--solid))}
.calendar-day.today{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 76%,transparent),0 8px 24px rgba(0,0,0,.06)}
.calendar-day.selected{background:color-mix(in srgb,var(--accent) 11%,var(--solid));border-color:color-mix(in srgb,var(--accent) 48%,var(--line))}
.calendar-day-number{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:9px}
.calendar-day.today .calendar-day-number{background:var(--accent);color:white}
.calendar-event-dot{padding:5px 7px;border-radius:8px;line-height:1.2}
.agenda-list{max-height:526px;overflow:auto;padding-right:4px}
.agenda-item{padding:14px;border-radius:16px;background:color-mix(in srgb,var(--solid) 78%,transparent)}

/* Nordic field surface: remove legacy browser glyphs and use a quiet glass shell */
.nordic-input[type="date"],.nordic-input[type="time"]{padding-right:42px;background-image:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,transparent),transparent 62%);background-repeat:no-repeat}
.nordic-input[type="date"]::-webkit-calendar-picker-indicator,
.nordic-input[type="time"]::-webkit-calendar-picker-indicator{opacity:0;width:30px;height:100%;cursor:pointer}
label:has(>.nordic-input[type="date"]),label:has(>.nordic-input[type="time"]){position:relative}
label:has(>.nordic-input[type="date"])::after,label:has(>.nordic-input[type="time"])::after{
  content:"";position:absolute;right:13px;bottom:13px;width:17px;height:17px;pointer-events:none;opacity:.78;
  background:currentColor;mask-size:contain;mask-repeat:no-repeat;mask-position:center;
}
label:has(>.nordic-input[type="date"])::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M5 5h14v15H5zM8 3v4M16 3v4M5 9h14M9 13h2M13 13h2M9 16h2'/%3E%3C/svg%3E")}
label:has(>.nordic-input[type="time"])::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M12 7v5l3 2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

@media(max-width:1100px){.calendar-layout{grid-template-columns:minmax(0,1fr) minmax(300px,.72fr)}}
@media(max-width:980px){
  .calendar-layout{grid-template-columns:1fr}
  .calendar-main,.calendar-agenda{min-height:auto}
  .agenda-list{max-height:none}
}
@media(max-width:680px){
  :root{--nordic-scroll-size:7px}
  .calendar-grid{gap:3px}
  .calendar-day{min-height:78px;padding:6px;border-radius:10px}
  .butler-chat-head{display:grid;grid-template-columns:48px minmax(0,1fr)}
}
@media(pointer:coarse){*::-webkit-scrollbar{width:0;height:0}*{scrollbar-width:none}}
@media(prefers-reduced-motion:reduce){.calendar-day{transition:none}}
