/* RGPD.click — pictogrammes locaux, cohérents et sans dépendance externe. */
.rgpd-ui-icon {
  --rgpd-icon-color: #2563eb;
  --rgpd-icon-bg: rgba(37, 99, 235, .11);
  --rgpd-icon-border: rgba(37, 99, 235, .16);
  display: inline-grid;
  place-items: center;
  width: 1.65em;
  height: 1.65em;
  margin-inline-end: .38em;
  border: 1px solid var(--rgpd-icon-border);
  border-radius: .48em;
  color: var(--rgpd-icon-color);
  background: var(--rgpd-icon-bg);
  vertical-align: -.42em;
  line-height: 1;
  flex: 0 0 auto;
}

.rgpd-ui-icon svg {
  width: 1em;
  height: 1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}

.rgpd-icon--gold {
  --rgpd-icon-color: #c77a06;
  --rgpd-icon-bg: rgba(245, 158, 11, .12);
  --rgpd-icon-border: rgba(217, 119, 6, .2);
}

.rgpd-icon--blue {
  --rgpd-icon-color: #2563eb;
  --rgpd-icon-bg: rgba(37, 99, 235, .1);
  --rgpd-icon-border: rgba(37, 99, 235, .16);
}

.rgpd-icon--green {
  --rgpd-icon-color: #059669;
  --rgpd-icon-bg: rgba(5, 150, 105, .1);
  --rgpd-icon-border: rgba(5, 150, 105, .18);
}

.rgpd-icon--orange {
  --rgpd-icon-color: #d97706;
  --rgpd-icon-bg: rgba(217, 119, 6, .11);
  --rgpd-icon-border: rgba(217, 119, 6, .19);
}

.rgpd-icon--red {
  --rgpd-icon-color: #dc2626;
  --rgpd-icon-bg: rgba(220, 38, 38, .1);
  --rgpd-icon-border: rgba(220, 38, 38, .17);
}

html.dark-mode .rgpd-icon--gold,
body:not(.light-mode) .rgpd-icon--gold {
  --rgpd-icon-color: #fbbf24;
}

html.dark-mode .rgpd-icon--blue,
body:not(.light-mode) .rgpd-icon--blue {
  --rgpd-icon-color: #60a5fa;
}

html.dark-mode .rgpd-icon--green,
body:not(.light-mode) .rgpd-icon--green {
  --rgpd-icon-color: #34d399;
}

html.dark-mode .rgpd-icon--orange,
body:not(.light-mode) .rgpd-icon--orange {
  --rgpd-icon-color: #f59e0b;
}

html.dark-mode .rgpd-icon--red,
body:not(.light-mode) .rgpd-icon--red {
  --rgpd-icon-color: #f87171;
}

.hero-dest-icon .rgpd-ui-icon,
.task-card-icon .rgpd-ui-icon,
.droit-icon .rgpd-ui-icon {
  width: 2rem;
  height: 2rem;
  margin: 0;
  border-radius: .6rem;
  vertical-align: middle;
}

.task-card-icon .rgpd-ui-icon {
  width: 2.15rem;
  height: 2.15rem;
}

.legal-badge .rgpd-ui-icon,
.doc-badge .rgpd-ui-icon {
  width: 1.42em;
  height: 1.42em;
  margin-inline-end: .15em;
  color: currentColor;
  background: rgba(255, 255, 255, .08);
  border-color: currentColor;
  border-radius: .4em;
}

.minibloc-item.takeaways .rgpd-ui-icon { --rgpd-icon-color: #2563eb; --rgpd-icon-bg: rgba(37, 99, 235, .1); }
.minibloc-item.pitfall .rgpd-ui-icon { --rgpd-icon-color: #dc2626; --rgpd-icon-bg: rgba(220, 38, 38, .1); }
.minibloc-item.action .rgpd-ui-icon { --rgpd-icon-color: #059669; --rgpd-icon-bg: rgba(5, 150, 105, .1); }

.summary-header .rgpd-ui-icon,
.minibloc-item strong .rgpd-ui-icon,
.minibloc-sources .rgpd-ui-icon,
.option-name .rgpd-ui-icon,
.fc-prog-row .rgpd-ui-icon {
  width: 1.48em;
  height: 1.48em;
  border-radius: .42em;
}

.flash-btn > span > .rgpd-ui-icon,
.cookie-icon > .rgpd-ui-icon,
.theme-icon > .rgpd-ui-icon {
  margin: 0;
}

.cookie-icon > .rgpd-ui-icon {
  width: 2.1rem;
  height: 2.1rem;
}

.error-icon > .rgpd-ui-icon {
  width: 2.4rem;
  height: 2.4rem;
  margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
  a:hover .rgpd-ui-icon,
  button:hover .rgpd-ui-icon,
  .droit-card:hover .rgpd-ui-icon,
  .tool-task-card:hover .rgpd-ui-icon {
    transform: translateY(-1px) scale(1.04);
    transition: transform .2s cubic-bezier(.16, 1, .3, 1);
  }
}

@media (max-width: 680px) {
  .rgpd-ui-icon {
    width: 1.58em;
    height: 1.58em;
  }
}