/* New look · Calendar page (/calendar) and the dashboard Agenda box (components/calendar).
   The components take their colours from tokens on .pcal / .pcal-sheet / .pcal-box, so this file
   mostly remaps those tokens to the pp palette, then restyles the head, buttons, tabs and cards to
   the design (assets/calendar.css in pie-standard-premium). Layer colours stay as they are. */

html.pie-premium .pp-shell :is(.pcal, .pcal-sheet, .pcal-box) {
    --ink: var(--pp-ink); --ink-2: var(--pp-ink-2); --ink-3: var(--pp-ink-3);
    --line: var(--pp-line); --panel: var(--pp-panel); --panel-2: var(--pp-panel-2);
    --pp-btn-shadow: 0 1px 2px rgba(30, 38, 32, .05), 0 6px 16px -10px rgba(30, 40, 32, .25);
    /* Trips take the theme colour, not the classic blue */
    --l-trip: var(--pp-acc);
    font-family: var(--pp-sans);
}
/* Bold text uses the bold face, not a synthetic weight */
html.pie-premium .pp-shell :is(.pcal, .pcal-sheet, .pcal-box) :is(b, strong, h1, h2, h3, .pcal-st, .pcal-pill, .pcal-link,
    .pcal-views button.on, .pcal-rh, .pcal-mini .mh, .pcal-mini .mg button.td, .pcal-wd span, .pcal-dn, .pcal-trip span, .pcal-more,
    .pcal-ar .am, .pcal-tl-days .mo, .pcal-dr em, .pcal-tlist em, .pcal-sh-sec > small, .pcal-sheet > header small) {
    font-family: var(--pp-bold);
    font-weight: 400;
}
html.pie-premium .pp-shell :is(.pcal, .pcal-sheet, .pcal-box) button:focus-visible { outline-color: var(--pp-acc); }

/* Page frame */
html.pie-premium .pp-shell .calendar-dpage > .crm-page-content > .container-fluid {
    padding: 0 32px 32px;
}

/* Page head: eyebrow, 30px title, subtitle; view tabs on the right */
html.pie-premium .pp-shell .pcal-head {
    align-items: flex-end;
    gap: 16px 24px;
    margin: 0;
    padding: 18px 0 22px;
}
html.pie-premium .pp-shell .pcal-head h1 {
    color: var(--pp-ink);
    font: 30px/1.15 var(--pp-bold);
    letter-spacing: -.015em;
}
html.pie-premium .pp-shell .pcal-head h1::before {
    content: "Workspace";
    display: block;
    margin-bottom: 6px;
    color: var(--pp-acc);
    font: 11.5px var(--pp-bold);
    letter-spacing: .08em;
    text-transform: uppercase;
}
html.pie-premium .pp-shell .pcal-head p {
    margin-top: 4px;
    color: var(--pp-ink-3);
    font-size: 14px;
}

/* Full screen (CalendarPage toggleFullScreen adds .toggle-full-screen): the page background, same layout */
html.pie-premium .pp-shell .pcal.toggle-full-screen {
    padding: 0 32px 32px;
    background: var(--pp-bg);
}
html.pie-premium .pp-shell .pcal-fs {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    color: var(--pp-ink-3);
}
html.pie-premium .pp-shell .pcal-fs:hover { background: rgba(255, 255, 255, .9); color: var(--pp-ink); }

/* View tabs: glass capsule, open tab dark */
html.pie-premium .pp-shell .pcal-views {
    gap: 2px;
    max-width: 100%;
    padding: 4px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}
html.pie-premium .pp-shell .pcal-views::-webkit-scrollbar { display: none; }
html.pie-premium .pp-shell .pcal-views button {
    flex: none;
    height: 34px;
    padding: 0 13px;
    border-radius: 999px;
    color: var(--pp-ink-3) !important;
    font-size: 13.5px;
}
html.pie-premium .pp-shell .pcal-views button:hover { background: rgba(255, 255, 255, .9); color: var(--pp-ink) !important; }
html.pie-premium .pp-shell .pcal-views button.on {
    background: var(--pp-ink);
    color: #fff !important;
    box-shadow: 0 6px 14px -10px rgba(20, 24, 20, .6);
}

/* Cards */
html.pie-premium .pp-shell :is(.pcal, .pcal-box) .pcal-panel,
html.pie-premium .pp-shell .pcal-box.pcal-panel {
    border: 0;
    border-radius: var(--pp-r-card);
    background: var(--pp-panel);
    box-shadow: var(--pp-shadow);
}
html.pie-premium .pp-shell .pcal-split { grid-template-columns: 248px minmax(0, 1fr); gap: 20px; }
html.pie-premium .pp-shell .pcal-rail { padding: 16px 12px 14px; top: 84px; }
html.pie-premium .pp-shell .pcal-loading::after { border-radius: var(--pp-r-card); background: rgba(255, 255, 255, .5); }

/* Rail: mini month, layers, quick views */
html.pie-premium .pp-shell .pcal-mini .mh { padding: 0 2px 8px; color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-mini .mh button { border-radius: 999px; }
html.pie-premium .pp-shell .pcal-mini .mh button:hover,
html.pie-premium .pp-shell .pcal-mini .mg button:hover { background: var(--pp-hover); }
html.pie-premium .pp-shell .pcal-mini .mg i { color: var(--pp-muted); }
html.pie-premium .pp-shell .pcal-mini .mg button { height: 28px; border-radius: 8px; color: var(--pp-ink-2); }
html.pie-premium .pp-shell .pcal-mini .mg button.off { color: var(--pp-muted); }
html.pie-premium .pp-shell .pcal-mini .mg button.td { background: var(--pp-acc); color: #fff !important; }
html.pie-premium .pp-shell .pcal-mini .mg button.td::after { background: #fff; }
html.pie-premium .pp-shell .pcal-rh { margin: 18px 6px 6px; color: var(--pp-muted); font-size: 11px; letter-spacing: .08em; }
html.pie-premium .pp-shell .pcal-rh button { color: var(--pp-acc) !important; font: 12px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-lr { height: 34px; padding: 0 6px; font-size: 13.5px; color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-lr:hover { background: var(--pp-hover); }
html.pie-premium .pp-shell .pcal-lr:not(.on) { color: var(--pp-ink-3); }
html.pie-premium .pp-shell .pcal-lr .ck { width: 18px; height: 18px; border-radius: 5px; }
html.pie-premium .pp-shell .pcal-lr small { color: var(--pp-muted); font: 11.5px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-saved { padding: 0 4px; }
html.pie-premium .pp-shell .pcal-saved button {
    height: 30px;
    padding: 0 12px;
    border: 0 !important;
    border-radius: 999px;
    background: var(--pp-panel-2) !important;
    color: var(--pp-ink-2) !important;
    font-size: 12.5px;
}
html.pie-premium .pp-shell .pcal-saved button:hover { background: var(--pp-hover) !important; color: var(--pp-ink) !important; }
html.pie-premium .pp-shell .pcal-saved button.on { background: var(--pp-ink) !important; color: #fff !important; }

/* Toolbar: round icon buttons, pill Today, ask box, advisor select */
html.pie-premium .pp-shell .pcal-bar { gap: 10px 12px; margin-bottom: 14px; }
html.pie-premium .pp-shell .pcal-nav h2 { margin-left: 8px; color: var(--pp-ink); font: 20px var(--pp-bold); letter-spacing: -.01em; }
html.pie-premium .pp-shell :is(.pcal, .pcal-box, .pcal-sheet) .pcal-ibtn {
    width: 40px;
    height: 40px;
    border: 0 !important;
    border-radius: 999px;
    background: #fff !important;
    box-shadow: var(--pp-btn-shadow);
    color: var(--pp-ink-2) !important;
}
html.pie-premium .pp-shell :is(.pcal, .pcal-box, .pcal-sheet) .pcal-ibtn:hover,
html.pie-premium .pp-shell .pcal-tbtn:hover { background: color-mix(in srgb, var(--pp-acc) 8%, #fff) !important; }
html.pie-premium .pp-shell .pcal-tbtn {
    height: 40px;
    padding: 0 18px;
    border: 0 !important;
    border-radius: 999px;
    background: #fff !important;
    box-shadow: var(--pp-btn-shadow);
    color: var(--pp-ink) !important;
    font: 13.5px var(--pp-bold);
    letter-spacing: 0;
}
html.pie-premium .pp-shell .pcal-tbtn.on { background: var(--pp-ink) !important; color: #fff !important; }
html.pie-premium .pp-shell .pcal-ask {
    height: 40px;
    padding: 0 8px 0 14px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: #fff;
    box-shadow: var(--pp-btn-shadow);
}
html.pie-premium .pp-shell .pcal-ask:focus-within { border-color: var(--pp-acc-line); box-shadow: 0 0 0 3px var(--pp-acc-soft); }
html.pie-premium .pp-shell .pcal-ask > i { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-ask input { font-family: var(--pp-sans); }
html.pie-premium .pp-shell .pcal-ask input::placeholder { color: var(--pp-muted); }
html.pie-premium .pp-shell .pcal-ask kbd { border: 0; border-radius: 6px; background: var(--pp-panel-2); color: var(--pp-muted); font: 11px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-select {
    height: 40px;
    padding: 0 30px 0 14px;
    border: 0;
    border-radius: 999px;
    background-color: #fff;
    box-shadow: var(--pp-btn-shadow);
    color: var(--pp-ink);
    font: 13.5px var(--pp-sans);
}
html.pie-premium .pp-shell .pcal-seg { gap: 2px; padding: 3px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .72); }
html.pie-premium .pp-shell .pcal-seg button { height: 30px; padding: 0 12px; border-radius: 999px; color: var(--pp-ink-3); }
html.pie-premium .pp-shell .pcal-seg button + button { border-left: 0 !important; }
html.pie-premium .pp-shell .pcal-seg button.on { background: var(--pp-ink); color: #fff !important; font-family: var(--pp-bold); }

/* Agenda view layer chips: on = ink text with a solid dot, off = dimmed (design .cl-layers) */
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #fff !important;
    box-shadow: 0 0 0 1px var(--pp-line);
    color: var(--pp-ink-3) !important;
}
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button .pcal-dot { opacity: .35; }
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button.on { box-shadow: 0 0 0 1px var(--pp-line-2); color: var(--pp-ink) !important; }
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button.on .pcal-dot { opacity: 1; }
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved small { color: var(--pp-muted); font: 11px var(--pp-bold); }
/* common.css: button:focus { box-shadow: none !important } wipes the chip's ring while it keeps focus after a click. Same rings again for a focused chip. */
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button:focus { box-shadow: 0 0 0 1px var(--pp-line) !important; }
html.pie-premium .pp-shell .pcal-agwrap .pcal-saved button.on:focus { box-shadow: 0 0 0 1px var(--pp-line-2) !important; }

/* Agenda view "Narrow down" / sub-type tag row: soft tags, the chosen one in the accent tint */
html.pie-premium .pp-shell .pcal-subs .lb { color: var(--pp-muted); font: 11px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-subs button {
    height: 28px;
    padding: 0 11px;
    border: 0 !important;
    border-radius: 999px;
    background: var(--pp-panel-2) !important;
    color: var(--pp-ink-2) !important;
    font-size: 12.5px;
}
html.pie-premium .pp-shell .pcal-subs button:hover { background: var(--pp-hover) !important; color: var(--pp-ink) !important; }
html.pie-premium .pp-shell .pcal-subs button.on {
    background: var(--pp-acc-soft) !important;
    box-shadow: 0 0 0 1px var(--pp-acc-line);
    color: var(--pp-acc) !important;
    font-family: var(--pp-bold);
}
html.pie-premium .pp-shell :is(.pcal-agwrap .pcal-saved, .pcal-subs) small {
    background: rgba(23, 23, 26, .06);
    color: var(--pp-ink-2);
    font: 10.5px/1 var(--pp-bold);
    opacity: 1;
}
html.pie-premium .pp-shell .pcal-subs button.on small { background: color-mix(in srgb, var(--pp-acc) 12%, transparent); color: inherit; }
html.pie-premium .pp-shell .pcal-subs button.back { padding-left: 2px; background: transparent !important; color: var(--pp-acc) !important; font-family: var(--pp-bold); }

/* Ask result, suggestions, notes, insights */
html.pie-premium .pp-shell .pcal-q { border-radius: 12px; background: var(--pp-acc-soft); color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-q > i { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-q em { border-radius: 999px; box-shadow: 0 0 0 1px var(--pp-acc-line); color: var(--pp-ink); font: 12px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-q b { color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-sug button {
    height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: #fff !important;
    box-shadow: 0 0 0 1px var(--pp-line);
    color: var(--pp-ink-2) !important;
}
html.pie-premium .pp-shell .pcal-sug button:hover { background: #fff !important; box-shadow: 0 0 0 1px var(--pp-acc-line); color: var(--pp-acc) !important; }
html.pie-premium .pp-shell .pcal-note { border-radius: 12px; }
html.pie-premium .pp-shell .pcal-brief {
    padding: 8px 8px 8px 14px;
    border: 0;
    border-radius: 14px;
    background: var(--pp-panel);
    box-shadow: var(--pp-shadow);
}
html.pie-premium .pp-shell .pcal-brief > b i { color: var(--pp-acc); }
html.pie-premium .pp-shell :is(.pcal-brief .sc, .pcal-box .brief) button {
    height: 30px;
    padding: 0 11px;
    border-radius: 9px;
    background: var(--pp-panel-2) !important;
    color: var(--pp-ink-2);
}
html.pie-premium .pp-shell :is(.pcal-brief .sc, .pcal-box .brief) button:hover { background: var(--pp-hover) !important; color: var(--pp-ink); }

/* Month grid */
html.pie-premium .pp-shell .pcal-wd span { padding: 10px 12px; color: var(--pp-muted); font-size: 11px; letter-spacing: .08em; }
html.pie-premium .pp-shell .pcal-wk { min-height: 128px; }
html.pie-premium .pp-shell .pcal-cell { transition: background .12s; }
html.pie-premium .pp-shell .pcal-cell.we { background: color-mix(in srgb, var(--pp-panel-2) 60%, transparent); }
html.pie-premium .pp-shell .pcal-cell.off { background: var(--pp-panel-2); }
html.pie-premium .pp-shell .pcal-cell:hover { background: var(--pp-hover); }
html.pie-premium .pp-shell .pcal-cell.td { background: color-mix(in srgb, var(--pp-acc) 5%, var(--pp-panel)); }
html.pie-premium .pp-shell .pcal-dn { min-width: 26px; height: 26px; margin: 6px 0 2px 8px; padding: 0 7px; border-radius: 13px; color: var(--pp-ink-2); }
html.pie-premium .pp-shell .pcal-dn.off { color: var(--pp-muted) !important; font-family: var(--pp-sans); }
html.pie-premium .pp-shell .pcal-dn.td { background: var(--pp-acc); color: #fff !important; }
html.pie-premium .pp-shell .pcal-trip { height: 24px; border-radius: 7px; background: color-mix(in srgb, var(--l-trip) 13%, var(--pp-panel)); color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-trip.now { background: var(--l-trip); color: #fff; }
html.pie-premium .pp-shell .pcal-trip.prop { background: var(--pp-panel) repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, var(--l-trip) 9%, transparent) 6px 8px); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--l-trip) 55%, transparent); }
html.pie-premium .pp-shell .pcal-trip.cs { box-shadow: none; }
html.pie-premium .pp-shell .pcal-chip { height: 24px; padding: 0 7px; border-radius: 7px; font-size: 12px; color: var(--pp-ink-2); }
html.pie-premium .pp-shell .pcal-chip:hover { background: color-mix(in srgb, var(--c) 12%, var(--pp-panel)); color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-chip b { color: var(--pp-ink); font: 11.5px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-more { color: var(--pp-ink-3) !important; }
html.pie-premium .pp-shell .pcal-legend { margin-top: 12px; gap: 8px 18px; font-size: 12.5px; color: var(--pp-ink-3); }
html.pie-premium .pp-shell .pcal-legend .k { background: color-mix(in srgb, var(--l-trip) 13%, var(--pp-panel)); }
html.pie-premium .pp-shell .pcal-legend .k.now { background: var(--l-trip); }
html.pie-premium .pp-shell .pcal-legend .k.prop { background: var(--pp-panel); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--l-trip) 55%, transparent); }

/* Agenda list (page and dashboard box) */
html.pie-premium .pp-shell .pcal-ag header { padding: 9px 14px; border-radius: 12px; background: var(--pp-panel-2); }
html.pie-premium .pp-shell .pcal-ag header b { color: var(--pp-ink); font-size: 14.5px; }
html.pie-premium .pp-shell .pcal-ag header.td { background: var(--pp-acc-soft); }
html.pie-premium .pp-shell .pcal-ag header.td b { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-ar { padding: 10px 14px; }
html.pie-premium .pp-shell .pcal-ar:hover { background: var(--pp-hover); }
html.pie-premium .pp-shell .pcal-ar .tm { color: var(--pp-ink-2); font: 12.5px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-ar .tx b { color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-ar.dn .tx b { color: var(--pp-ink-3); }
html.pie-premium .pp-shell .pcal-ar .grp { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-st { height: 22px; padding: 0 9px; font-size: 11.5px; }
html.pie-premium .pp-shell .pcal-link { color: var(--pp-acc) !important; }

/* Side panels (agenda, money, year) */
html.pie-premium .pp-shell .pcal-agwrap,
html.pie-premium .pp-shell .pcal-mwrap,
html.pie-premium .pp-shell .pcal-ywrap { gap: 20px; }
html.pie-premium .pp-shell .pcal-side { gap: 16px; }
html.pie-premium .pp-shell .pcal-side section { padding: 16px 18px; }
html.pie-premium .pp-shell .pcal-side header b { color: var(--pp-ink); font-size: 14.5px; }
html.pie-premium .pp-shell .pcal-side header small { color: var(--pp-muted); }
html.pie-premium .pp-shell .pcal-kp div { padding: 10px 12px; border-radius: 12px; }
html.pie-premium .pp-shell .pcal-kp b { font-size: 19px; letter-spacing: -.01em; }
html.pie-premium .pp-shell .pcal-rk.info > i { background: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-rk b { font-size: 13.5px; }
html.pie-premium .pp-shell .pcal-rk small { font-size: 12.5px; line-height: 1.45; }

/* Week */
html.pie-premium .pp-shell .pcal-wh button small { color: var(--pp-muted); }
html.pie-premium .pp-shell .pcal-wh button b { min-width: 32px; height: 32px; line-height: 32px; border-radius: 16px; font-size: 18px; color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-wh button.td b { background: var(--pp-acc); color: #fff; }
html.pie-premium .pp-shell .pcal-wc.td { background: color-mix(in srgb, var(--pp-acc) 4%, transparent); }
html.pie-premium .pp-shell .pcal-blk { border-radius: 8px; font-size: 12px; }
html.pie-premium .pp-shell .pcal-now,
html.pie-premium .pp-shell .pcal-now::before { background: var(--pp-acc); }

/* Trip timeline */
html.pie-premium .pp-shell .pcal-tl-lab { padding: 10px 14px; }
html.pie-premium .pp-shell .pcal-tl-lab b { color: var(--pp-ink); font-size: 13.5px; }
html.pie-premium .pp-shell .pcal-tl-lane .we { background: color-mix(in srgb, var(--pp-panel-2) 70%, transparent); }
html.pie-premium .pp-shell .pcal-tl-lane .nw { background: var(--pp-acc); opacity: .8; }
html.pie-premium .pp-shell .pcal-tl-days .dn.td { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-tl-bar { border-radius: 9px; background: color-mix(in srgb, var(--l-trip) 15%, var(--pp-panel)); color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-tl-bar.now { background: var(--l-trip); }
html.pie-premium .pp-shell .pcal-tl-key { padding: 12px 16px; font-size: 12.5px; }

/* Money + Year KPI cards */
html.pie-premium .pp-shell .pcal-kpis { gap: 16px; margin-bottom: 16px; }
html.pie-premium .pp-shell .pcal-kpi { padding: 16px 18px; }
html.pie-premium .pp-shell .pcal-kpi b { font: 26px var(--pp-bold); letter-spacing: -.01em; color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-kpi.od b { color: var(--danger); }
html.pie-premium .pp-shell .pcal-yg { gap: 14px; padding: 18px; }
html.pie-premium .pp-shell .pcal-ym { padding: 10px; border-radius: 14px; }
html.pie-premium .pp-shell .pcal-ym.cur { background: color-mix(in srgb, var(--pp-acc) 4%, transparent); box-shadow: inset 0 0 0 1.5px var(--pp-acc-line); }
html.pie-premium .pp-shell .pcal-ym.cur .mh b { color: var(--pp-acc); }
html.pie-premium .pp-shell .pcal-ym .g button.td { box-shadow: 0 0 0 2px var(--pp-acc); }
html.pie-premium .pp-shell .pcal-yl { padding: 0 18px 16px; font-size: 12.5px; }
html.pie-premium .pp-shell .pcal-yb path { fill: color-mix(in srgb, var(--pp-acc) 35%, var(--pp-panel)); }
html.pie-premium .pp-shell .pcal-yb path.cur { fill: var(--pp-acc); }

/* Detail sheet: floating card like the design */
html.pie-premium .pp-shell .pcal-ov { background: rgba(17, 17, 26, .28); }
html.pie-premium .pp-shell .pcal-sheet {
    top: 12px;
    right: 12px;
    bottom: 12px;
    width: min(440px, calc(100vw - 24px));
    border-radius: 20px;
    box-shadow: var(--pp-shadow-2), 0 0 0 1px var(--pp-line);
}
html.pie-premium .pp-shell .pcal-sheet > header { padding: 20px 20px 14px; }
html.pie-premium .pp-shell .pcal-sheet > header small { color: var(--pp-acc); font-size: 11px; letter-spacing: .08em; }
html.pie-premium .pp-shell .pcal-sheet > header h2 { margin-top: 4px; color: var(--pp-ink); font-size: 20px; line-height: 1.25; }
html.pie-premium .pp-shell .pcal-sh-body { padding: 18px 20px 24px; }
html.pie-premium .pp-shell .pcal-sh-sec > small { color: var(--pp-muted); font-size: 11px; letter-spacing: .08em; }
html.pie-premium .pp-shell .pcal-facts div { padding: 10px 12px; border-radius: 12px; }
html.pie-premium .pp-shell .pcal-sh-acts .btn {
    height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    box-shadow: var(--pp-btn-shadow);
    color: var(--pp-ink);
    font: 13.5px var(--pp-bold);
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
html.pie-premium .pp-shell .pcal-sh-acts .btn:hover { background: color-mix(in srgb, var(--pp-acc) 8%, #fff); color: var(--pp-ink); }
html.pie-premium .pp-shell .pcal-sh-acts .btn.btn-primary {
    background: linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, 0)), var(--pp-acc);
    color: #fff;
    box-shadow: 0 8px 18px -12px color-mix(in srgb, var(--pp-acc) 80%, #000);
}

/* Dashboard Agenda box: same head as the other dashboard panels */
html.pie-premium .pp-shell .pcal-box { margin-bottom: 20px; }
html.pie-premium .pp-shell .pcal-box > header { gap: 10px; padding: 18px 20px 12px; }
html.pie-premium .pp-shell .pcal-box > header h3 { color: var(--pp-ink); font: 18px var(--pp-bold); letter-spacing: -.01em; }
html.pie-premium .pp-shell .pcal-box > header .sub { color: var(--pp-ink-3); }
html.pie-premium .pp-shell .pcal-box > header .pcal-ibtn { width: 34px; height: 34px; }
html.pie-premium .pp-shell .pcal-box > header .go { color: var(--pp-acc) !important; font: 13px var(--pp-bold); }
html.pie-premium .pp-shell .pcal-box .flt { gap: 8px; padding: 12px 20px; }
html.pie-premium .pp-shell .pcal-box .flt button {
    height: 34px;
    padding: 0 14px;
    border: 0 !important;
    border-radius: 999px;
    background: #fff;
    box-shadow: var(--pp-btn-shadow), 0 0 0 1px var(--pp-line);
    color: var(--pp-ink-2);
    font-size: 13.5px;
}
html.pie-premium .pp-shell .pcal-box .flt button.on {
    background: var(--pp-ink);
    color: #fff !important;
    box-shadow: 0 6px 14px -10px rgba(20, 24, 20, .6);
}
/* Sub-type tags: smaller, soft; the chosen one in the accent tint */
html.pie-premium .pp-shell .pcal-box .flt:has(+ .subs) { padding-bottom: 6px; }
html.pie-premium .pp-shell .pcal-box .flt.subs { gap: 6px; padding-top: 2px; }
html.pie-premium .pp-shell .pcal-box .flt.subs button {
    height: 28px;
    padding: 0 11px;
    background: var(--pp-panel-2) !important;
    box-shadow: none;
    color: var(--pp-ink-2) !important;
    font-size: 12.5px;
}
html.pie-premium .pp-shell .pcal-box .flt.subs button:hover { background: var(--pp-hover) !important; color: var(--pp-ink) !important; }
html.pie-premium .pp-shell .pcal-box .flt.subs button.on {
    background: var(--pp-acc-soft) !important;
    box-shadow: 0 0 0 1px var(--pp-acc-line);
    color: var(--pp-acc) !important;
    font-family: var(--pp-bold);
}
html.pie-premium .pp-shell .pcal-box .flt.subs small { color: inherit; opacity: .7; }
html.pie-premium .pp-shell .pcal-box .brief { padding: 10px 20px 0; }
html.pie-premium .pp-shell .pcal-box .scroll { padding: 10px 14px 14px; }

@media (max-width: 1100px) {
    html.pie-premium .pp-shell .pcal-split { grid-template-columns: minmax(0, 1fr); }
    html.pie-premium .pp-shell .pcal-rail { position: static; }
}
@media (max-width: 915px) {
    html.pie-premium .pp-shell .calendar-dpage > .crm-page-content > .container-fluid { padding: 0 16px 24px; }
    html.pie-premium .pp-shell .pcal-head h1 { font-size: 24px; }
}
@media (max-width: 640px) {
    html.pie-premium .pp-shell .pcal-views button { padding: 0 10px; }
    html.pie-premium .pp-shell .pcal-nav h2 { font-size: 17px; }
    html.pie-premium .pp-shell .pcal-wk { min-height: 92px; }
    html.pie-premium .pp-shell .pcal-kpi b { font-size: 20px; }
    html.pie-premium .pp-shell .pcal-box .flt { padding: 10px 14px; }
}