
    /* Calendar indicators */
    .cal-indicators { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
    @media (max-width: 575px) { .cal-indicators { grid-template-columns: 1fr; } }
    .cal-ind { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); background: var(--color-card-background); }
    .cal-ind strong { display: block; font-size: var(--font-size-sm, 14px); color: var(--color-secondary); margin-bottom: 4px; }
    .cal-ind p { margin: 0; font-size: var(--font-size-xs, 12px); color: var(--color-text-muted); line-height: 1.4; }
    .cal-ind-badge { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: var(--border-radius-sm); font-size: var(--font-size-base, 16px); font-weight: var(--font-weight-bold, 700); color: var(--color-white, var(--color-hero-text, #fff)); flex-shrink: 0; }
    .cal-ind-green { background: var(--color-success, var(--color-success, #34A853)); }
    .cal-ind-red { background: var(--color-error, var(--color-danger, #e74c3c)); }
    .cal-ind-orange { background: var(--color-warning, var(--color-warning, #F97316)); }
    .cal-ind-dark { background: var(--color-error-dark, var(--color-error-dark, #b71c1c)); }

    .api-endpoints { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
    .api-endpoint { padding: 16px; border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); background: var(--color-background); }
    .api-method { display: inline-block; padding: var(--spacing-xs) var(--spacing-sm); border-radius: 4px; font-weight: var(--font-weight-bold, 700); font-size: var(--font-size-xs, 12px); }
    .api-method--get { background: var(--color-success-bg); color: var(--color-success-dark); }
    .api-path { font-size: var(--font-size-sm, 14px); color: var(--color-primary); margin-left: var(--spacing-sm); }
    .api-params { margin-top: var(--spacing-sm); display: flex; flex-direction: column; gap: var(--spacing-xs); }
    .api-param { font-size: var(--font-size-xs, 12px); color: var(--color-text-muted); }
    .api-param code { color: var(--color-secondary); font-weight: var(--font-weight-semibold, 600); }
    .api-example { margin-top: 10px; }
    .api-example summary { cursor: pointer; font-size: var(--font-size-xs, 12px); color: var(--color-primary); font-weight: var(--font-weight-medium, 500); }
    .api-example pre { margin-top: var(--spacing-sm); padding: 12px; background: var(--color-secondary); color: var(--color-white, var(--color-hero-text, #fff)); border-radius: var(--border-radius-sm); overflow-x: auto; font-size: var(--font-size-xs, 12px); line-height: 1.5; }
    .api-example code { color: inherit; }
