/*
 * PublisherKits DiaryDesk - front end.
 *
 * Inherits the theme's fonts and text colour. Every colour is a custom property so a
 * theme (or Settings > Display > Brand accent) can restyle it:
 *   --pkdiary-accent     brand colour: timeline dots, calendar and planner highlights.
 *                     Settings > Display > Colours chooses: Theme (the block theme's primary
 *                     or accent preset, then a tagDiv theme's --td_theme_color, then navy),
 *                     Brand accent, or Light (a neutral grey).
 *   --pkdiary-line       hairlines, derived from the text colour so dark themes work.
 *   --pkdiary-confirmed / -provisional / -calculated / -estimated / -unverified
 *                     certainty badges. These carry MEANING, so they keep their own
 *                     defaults rather than following the brand colour.
 */
.pkdiary {
	--pkdiary-accent: var(--pkdiary-brand, var(--wp--preset--color--primary, var(--wp--preset--color--accent, var(--td_theme_color, #1b2a4a))));
	--pkdiary-accent-tint: rgba(27, 42, 74, .06);
	--pkdiary-line: rgba(0, 0, 0, .1);
	--pkdiary-confirmed: #1a6e3b;
	--pkdiary-provisional: #8a5a00;
	--pkdiary-calculated: #1f4e8c;
	--pkdiary-estimated: #6b3fa0;
	--pkdiary-unverified: #8c1d1d;
	margin: 1.5em 0;
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.pkdiary {
		--pkdiary-accent-tint: color-mix(in srgb, var(--pkdiary-accent) 8%, transparent);
		--pkdiary-line: color-mix(in srgb, currentColor 14%, transparent);
	}
}
.pkdiary-title { margin-bottom: .5em; }
.pkdiary-group { margin: 1.2em 0 .4em; font-size: 1.05em; }
.pkdiary-list { list-style: none; margin: 0; padding: 0; }
.pkdiary-item { padding: .45em 0; border-bottom: 1px solid var(--pkdiary-line); }
/* The date as a column, so titles line up; it stacks on narrow screens and in narrow slots. */
.pkdiary-list > .pkdiary-item { display: grid; grid-template-columns: 9.6em 1fr; column-gap: .9em; align-items: baseline; }
.pkdiary-list > .pkdiary-item > .pkdiary-date { grid-column: 1; margin-right: 0; white-space: nowrap; }
.pkdiary-list > .pkdiary-item > :not(.pkdiary-date) { grid-column: 2; }
.pkdiary-list > .pkdiary-item > .pkdiary-badge, .pkdiary-list > .pkdiary-item > .pkdiary-source, .pkdiary-list > .pkdiary-item > .pkdiary-verified { justify-self: start; margin: .2em 0 0; }
@container (max-width: 420px) { .pkdiary-list > .pkdiary-item { grid-template-columns: 1fr; } .pkdiary-list > .pkdiary-item > * { grid-column: 1 !important; } }
@media (max-width: 480px) { .pkdiary-list > .pkdiary-item { grid-template-columns: 1fr; } .pkdiary-list > .pkdiary-item > * { grid-column: 1 !important; } }
.pkdiary-date { font-weight: 600; margin-right: .4em; }
.pkdiary-legal .pkdiary-name { font-weight: 600; }
.pkdiary-source, .pkdiary-verified { font-size: .85em; opacity: .85; margin-left: .3em; }
.pkdiary-badge { display: inline-block; font-size: .72em; line-height: 1.5; padding: 0 .55em; border-radius: 999px; border: 1px solid currentColor; vertical-align: middle; white-space: nowrap; }
.pkdiary-badge-confirmed { color: var(--pkdiary-confirmed); }
.pkdiary-badge-provisional, .pkdiary-badge-needs_recheck { color: var(--pkdiary-provisional); }
.pkdiary-badge-calculated { color: var(--pkdiary-calculated); }
.pkdiary-badge-estimated { color: var(--pkdiary-estimated); }
.pkdiary-badge-unverified { color: var(--pkdiary-unverified); }
.pkdiary-table-wrap { overflow-x: auto; }
.pkdiary-table { width: 100%; border-collapse: collapse; }
.pkdiary-table th, .pkdiary-table td { text-align: left; padding: .45em .6em; border-bottom: 1px solid var(--pkdiary-line); vertical-align: top; }
.pkdiary-ics, .pkdiary-disclaimer { font-size: .85em; margin-top: .8em; }
.pkdiary-more { margin-top: .8em; font-weight: 600; }
.pkdiary-more a { color: var(--pkdiary-accent-text, var(--pkdiary-accent)); }
@media (prefers-reduced-motion: no-preference) { .pkdiary a { transition: opacity .15s; } }

/*
 * Theme-proof lists. Themes style content lists with selectors like ".entry-content ul"
 * (Divi adds bullets, numbering and left padding), which outrank a single class. These
 * selectors are deliberately one step more specific so DiaryDesk lists stay unmarked. Divi sets
 * the indent through an ID selector (#left-area ul), which no class can outrank, so list-style and
 * padding-left carry !important - on DiaryDesk's own lists only.
 */
.pkdiary ul.pkdiary-list,
.pkdiary ol.pkdiary-timeline,
.pkdiary ol.pkdiary-timeline ol,
.pkdiary ul.pkdiary-compact,
.pkdiary ul.pkdiary-dir-list,
.pkdiary .pkdiary-grid ul { list-style: none !important; margin-left: 0; padding-left: 0 !important; padding-bottom: 0; }
.pkdiary ul.pkdiary-list > li,
.pkdiary ol.pkdiary-timeline li,
.pkdiary ul.pkdiary-compact > li,
.pkdiary ul.pkdiary-dir-list > li,
.pkdiary .pkdiary-grid ul > li { list-style: none; }
.pkdiary ol.pkdiary-timeline li::marker,
.pkdiary ul.pkdiary-list > li::marker { content: none; }

/*
 * Box styles (Settings > Display > Box style, or box="..." on any display).
 * They use the same accent and line colours, so they follow the Colours setting.
 */
.pkdiary { container-type: inline-size; }
.pkdiary-box-border, .pkdiary-box-tint, .pkdiary-box-card { padding: 1em 1.25em; border-radius: 8px; }
.pkdiary-box-border { border: 1px solid var(--pkdiary-line); }
.pkdiary-box-tint { background: var(--pkdiary-accent-tint); }
.pkdiary-box-card { border: 1px solid var(--pkdiary-line); border-top: 4px solid var(--pkdiary-accent); background: var(--pkdiary-surface, transparent); box-shadow: 0 1px 3px rgba(0, 0, 0, .06); }
.pkdiary-box-border > .pkdiary-title, .pkdiary-box-tint > .pkdiary-title, .pkdiary-box-card > .pkdiary-title { margin-top: 0; }
.pkdiary-box-border .pkdiary-item:last-child, .pkdiary-box-tint .pkdiary-item:last-child, .pkdiary-box-card .pkdiary-item:last-child { border-bottom: 0; }
.pkdiary-group { color: var(--pkdiary-accent-text, var(--pkdiary-accent)); font-size: .85em; text-transform: uppercase; letter-spacing: .06em; }
/* Themes that number ordered lists with counters in ::before (some Divi layouts). */
.pkdiary ol.pkdiary-timeline > li::before, .pkdiary ol.pkdiary-timeline ol > li::before { content: none !important; display: none !important; }
.pkdiary ol.pkdiary-timeline, .pkdiary ol.pkdiary-timeline ol { counter-reset: none !important; }

/* Label key: the labels a display uses, with their meaning. */
.pkdiary-legend { font-size: .8em; opacity: .9; margin: .9em 0 0; display: flex; flex-wrap: wrap; gap: .35em 1.1em; }
.pkdiary-legend-item { white-space: normal; }
.pkdiary-badge[title] { cursor: help; }

/* Status dots: shape carries the status as well as colour (filled, half, dashed). */
.pkdiary .pkdiary-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50% !important; box-sizing: border-box; border: 2px solid var(--pkdiary-accent); background: var(--pkdiary-accent); vertical-align: middle; flex: none; }
.pkdiary .pkdiary-dot-calculated { background: linear-gradient(90deg, var(--pkdiary-accent) 50%, transparent 50%); }
.pkdiary .pkdiary-dot-provisional, .pkdiary .pkdiary-dot-estimated, .pkdiary .pkdiary-dot-unverified { background: transparent; border-style: dashed; border-color: rgba(0, 0, 0, .55); }
.pkdiary .pkdiary-dot-needs_recheck { background: transparent; }
.pkdiary-legend-item { display: inline-flex; align-items: center; gap: 6px; }

/* Header and foot: title with a count or "All N dates"; key line with "Show N more". */
.pkdiary-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: .4em; }
.pkdiary-head .pkdiary-title { margin: 0; }
.pkdiary-count { font-size: 13px; opacity: .75; }
.pkdiary-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: .8em; padding-top: .8em; border-top: 1px solid var(--pkdiary-line); }
.pkdiary-foot .pkdiary-legend { margin: 0; }
.pkdiary-all, .pkdiary-show-more { background: none; border: 0; padding: 0; font: inherit; font-size: 14px; font-weight: 600; color: var(--pkdiary-accent-text, var(--pkdiary-accent)); text-decoration: underline; cursor: pointer; }
.pkdiary .pkdiary-extra { display: none !important; }
.pkdiary-now { display: inline-block; margin-top: 4px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--pkdiary-accent-text, var(--pkdiary-accent)); background: var(--pkdiary-accent-tint); padding: 2px 8px; border-radius: 999px !important; }

/* Panel: a plain white card with no accent rule, for pages that use one accent overall. */
.pkdiary-box-panel { background: var(--pkdiary-surface, #fff); border: 1px solid var(--pkdiary-line); border-radius: 12px; padding: 24px; }
.pkdiary-box-panel > .pkdiary-head .pkdiary-title { font-size: 1.5em; font-weight: 400; }
.pkdiary-box-panel .pkdiary-item:last-child { border-bottom: 0; }

/* Rows the browser drops (past dates on a page served from cache) and sections left empty. */
.pkdiary[hidden], .pkdiary [hidden], .wp-block-button[hidden] { display: none !important; }
.pkdiary-admin-note { padding: 8px 12px; border: 1px dashed rgba(0, 0, 0, .3); font-size: 13px; color: #555; }

/* Section jump buttons (a core Buttons block with class pkdiary-jump): classic themes give the
   Buttons block no bottom margin, so the buttons sat flush on the first card. */
.pkdiary-jump { margin-bottom: 24px !important; gap: 8px; }