import { component_styles_default } from "./chunk.K23QWHWK.js"; import { i } from "./chunk.CXZZ2LVK.js"; // src/components/card/card.styles.ts var card_styles_default = i` ${component_styles_default} :host { --border-color: var(--sl-color-neutral-200); --border-radius: var(--sl-border-radius-medium); --border-width: 1px; --padding: var(--sl-spacing-large); display: inline-block; } .card { display: flex; flex-direction: column; background-color: var(--sl-panel-background-color); box-shadow: var(--sl-shadow-x-small); border: solid var(--border-width) var(--border-color); border-radius: var(--border-radius); } .card__image { display: flex; border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); margin: calc(-1 * var(--border-width)); overflow: hidden; } .card__image::slotted(img) { display: block; width: 100%; } .card:not(.card--has-image) .card__image { display: none; } .card__header { display: block; border-bottom: solid var(--border-width) var(--border-color); padding: calc(var(--padding) / 2) var(--padding); } .card:not(.card--has-header) .card__header { display: none; } .card:not(.card--has-image) .card__header { border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); } .card__body { display: block; padding: var(--padding); } .card--has-footer .card__footer { display: block; border-top: solid var(--border-width) var(--border-color); padding: var(--padding); } .card:not(.card--has-footer) .card__footer { display: none; } `; export { card_styles_default };