@import url("../tools/selectors.css");
@import url("../trumps/u-image-zoom.selectors.css");

@custom-selector :--c-card
    .c-card,
    /* So Portal nor its modals loads TACC card styles */
    /* CAVEAT: CMS can not load cards in modals (but it would not anyway) */
    /* TODO: When Portal does not load core-styles.cms.css remove the :not(…) */
    .card:where(:not(:--portal-content, .modal) *),
    [class*="card--"];

@custom-selector :--c-card--standard
    .c-card--standard,
    .card--standard;
@custom-selector :--c-card--standard-1
    .c-card--standard-1,
    .card--standard-1;
@custom-selector :--c-card--standard-2
    .c-card--standard-2,
    .card--standard-2;
@custom-selector :--c-card--standard-3
    .c-card--standard-3,
    .card--standard-3;
@custom-selector :--c-card--standard-N
    .c-card--standard-1,
    .c-card--standard-2,
    .c-card--standard-3;

@custom-selector :--c-card--plain
    .c-card--plain,
    .card--plain,
    [class*="card--plain-"];
@custom-selector :--c-card--plain-hr-top
    .c-card--plain-hr-top,
    .card--plain-hr-top;
@custom-selector :--c-card--plain-hr-bottom
    .c-card--plain-hr-bottom,
    .card--plain-hr-bottom;

@custom-selector :--c-card--image
    [class*="card--image-"];
@custom-selector :--c-card--image-top
    .c-card--image-top,
    .card--image-top;
@custom-selector :--c-card--image-bottom
    .c-card--image-bottom,
    .card--image-bottom;
@custom-selector :--c-card--image-left
    .c-card--image-left,
    .card--image-left;
@custom-selector :--c-card--image-right
    .c-card--image-right,
    .card--image-right;

@custom-selector :--c-card__image
    :--c-card > img,
    :--c-card__image-link,
    :--u-image-zoom,
    /* Bootstrap 4 (embed), Bootstrap 5 (ratio) */
    .embed-responsive,
    .ratio;
@custom-selector :--c-card__image-link
    :--c-card a:has(> img);