import { r as registerInstance, h, H as Host } from './index-442cf464.js';
import { c as createColorClasses } from './theme-a8bb96f5.js';

const cardCss = ":host{--lu-safe-area-left:0px;--lu-safe-area-right:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding:16px;display:block;position:relative;transform:translateZ(0);background:var(--background);color:var(--color);font-family:var(--lu-font-family, inherit);overflow:hidden}:host(.lu-color){background:var(--lu-color-base);color:var(--lu-color-contrast)}:host(.lu-color)::slotted(*) lu-card-header,:host(.lu-color)::slotted(*) lu-card-buttons,:host(.lu-color)::slotted(*) lu-card-button,:host(.lu-color)::slotted(*) lu-card-footer,:host(.lu-color)::slotted(*) lu-card-title{background:var(--lu-color-base);color:var(--lu-color-contrast)}";

const Card = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
  }
  hostData() {
    return {
      class: createColorClasses(this.color)
    };
  }
  __stencil_render() {
    return h("slot", null);
  }
  render() { return h(Host, this.hostData(), this.__stencil_render()); }
};
Card.style = cardCss;

export { Card as lu_card };

//# sourceMappingURL=lu-card.entry.js.map