import { css as n, LitElement as p, html as c } from "lit";
import { property as m } from "lit/decorators.js";
import { loc as f } from "./localization.js";
import { customElementSafe as h } from "./custom-element-safe.js";
var u = Object.defineProperty, y = Object.getOwnPropertyDescriptor, i = (d, r, o, l) => {
  for (var e = l > 1 ? void 0 : l ? y(r, o) : r, a = d.length - 1, s; a >= 0; a--)
    (s = d[a]) && (e = (l ? s(r, o, e) : s(e)) || e);
  return l && e && u(r, o, e), e;
};
let t = class extends p {
  constructor() {
    super(...arguments), this.headline = "", this.headlineLocalizedId = "";
  }
  render() {
    return c`
      ${f(this.headline, this.headlineLocalizedId)}
      <slot></slot>
    `;
  }
};
t.styles = n`
      :host {
        display: block;
        font: var(--md-sys-typescale-title-medium, 800 0.85rem / 1.25rem 'Roboto Flex', Roboto, sans-serif);
        letter-spacing: var(--md-sys-typescale-title-medium-letter-spacing, 0.00625rem);
        padding-left: 1.25rem;
        color: var(--md-sys-color-on-surface-variant);
      }
  `;
i([
  m({ attribute: "headline" })
], t.prototype, "headline", 2);
i([
  m({ attribute: "headline-localized-id" })
], t.prototype, "headlineLocalizedId", 2);
t = i([
  h("polyfea-md-drawer-label")
], t);
export {
  t as PolyfeaMdDrawerLabel
};
