/* /brands/ and /brands/{slug}/ use the tokila-calendar plugin's markup and stylesheet (calendar.css). This file only
   fits the Laravel additions into those pages: the brand's notices, products, stores, date links and the profile
   fields WordPress did not print. */
#tcal-page .tkl-brand-description { white-space: pre-line; }

/* The date pages of the brand's running events and next launch, as the chips of the initial index (.tcal-tabs). */
.tkl-brand-dates { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 16px 0 0; font-size: 13px; }
.tkl-brand-dates span { margin-right: 2px; font-weight: 700; color: var(--tc-sub); }
.tkl-brand-dates a { display: inline-grid; place-items: center; min-height: 34px; padding: 0 10px; border: 1px solid var(--tc-line); border-radius: 10px; text-decoration: none; }
.tkl-brand-dates a:hover { background: var(--tc-blush); }

/* Sections headed like the calendar box and the article list (.tcal-bcal h2, .tcal-articles h2). */
#tcal-page .tkl-brand-section h2, #tcal-page .brand-notices h2 { margin: 36px 0 6px; padding: 0; border: 0; background: none; font-size: 17px; font-weight: 700; line-height: 1.75; }
#tcal-page .tkl-brand-section ul, #tcal-page .tkl-brand-section li { margin: 0; list-style: none; }
#tcal-page .tkl-product-facets { margin: 8px 0 12px; }

#tcal-page .brand-notices { margin: 28px 0 0; padding: 0; border: 0; background: none; }
#tcal-page .brand-notices h2 { margin-top: 0; }
#tcal-page .brand-notice { margin: 10px 0 0; padding: 14px 16px; border: 1px solid var(--tc-line); border-radius: 16px; background: #fff; }
#tcal-page .brand-notice h3 { margin: 0 0 2px; padding: 0; border: 0; background: none; font-size: 15px; font-weight: 700; line-height: 1.5; }
#tcal-page .brand-notice-date { margin: 0 0 8px; font-size: 12px; color: var(--tc-sub); }
/* The body is markup (paragraphs, or nl2br for plain text), so the newlines between blocks are not shown as blank lines. */
#tcal-page .brand-notice-body { white-space: normal; }
#tcal-page .brand-notice-body > :first-child { margin-top: 0; }
#tcal-page .brand-notice-body > :last-child { margin-bottom: 0; }
#tcal-page .brand-notice .tkl-button { margin-top: 10px; }

#tcal-page a:focus-visible, #tcal-page summary:focus-visible { outline: 2px solid var(--tc-rose-ink); outline-offset: 2px; }