/*
 * SPDX-FileCopyrightText: Fondation RERO+
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */

@import './variables';

a {
  @apply ui:no-underline;
}

a:not(.p-button):not(.p-ripple):not([role='button']):not([role='tab']) {
  color: var(--p-primary-500);
}

a:hover:not(.p-button):not(.p-ripple):not([role='button']):not([role='tab']) {
  color: var(--p-primary-600);
  @apply ui:text-primary-600 ui:underline;
}

// Force links in tag elements to keep the color defined by the tag
p-tag a {
  color: inherit !important;
}

dl.metadata {
  @apply ui:grid ui:grid-cols-4;
  dt {
    @apply ui:font-bold ui:mr-2;
  }
  dd {
    @apply ui:col-span-3;
  }
}

// CALLOUT
.callout {
  border: 1px solid var(--p-surface-300);
  border-left: 5px solid var(--p-surface-300);
  border-radius: 5px;
}

@each $variant in $callout-variants {
  .callout-#{$variant} {
    border: 1px solid rgba(var(--callout-color-#{$variant}), 0.3);
    border-left: 5px solid rgb(var(--callout-color-#{$variant}));
  }

  .callout-bg-#{$variant} {
    background-color: rgba(var(--callout-color-#{$variant}), 0.05);
  }
}