﻿/* Container for ikon/tooltip */
    .rekl-indicator {
      display: inline-block;
      margin-left: -2px;
      font-size: 1em;
      vertical-align: middle;
      cursor: help;
      text-decoration: none;
      line-height: 1;
      -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;
      -moz-user-select: none; -ms-user-select: none; user-select: none;
    }

    /* Styling af selve informations-ikonet */
    .rekl-icon {
       color: #111518;
       text-decoration: none;
       transition: color 0.2s;
    }
    .rekl-indicator:hover .rekl-icon { color: #000; } /* Din hover farve */

    /* Tooltip Base - Klassen .tooltip anvendes på .rekl-indicator */
    .tooltip { position: relative; }

    /* Selve Tooltip Tekstboksen — rendres via CSS content:attr() i stedet for et
       tekst-<span>, så disclosure-teksten ikke er DOM-tekst (undgår at Google
       trækker 'Reklame for X' ind i søgeresultatets snippet). */
    .rekl-indicator.tooltip::after {
      content: attr(data-rekl-tooltip);
      visibility: hidden;
      width: auto;
      background-color: #333;
      color: #fff;
      text-align: center;
      font-size: 0.85em;
      line-height: 1.4;
      border-radius: 4px;
      padding: 6px 8px;
      position: absolute;
      z-index: 10;
      bottom: 140%;
      left: 50%;
      transform: translateX(-50%);
      opacity: 0;
      transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
      white-space: nowrap;
    }

    /* Lille pil under tooltip-boksen */
    .rekl-indicator.tooltip::before {
      content: "";
      visibility: hidden;
      opacity: 0;
      position: absolute;
      bottom: 140%;
      left: 50%;
      margin-left: -5px;
      margin-bottom: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: #333 transparent transparent transparent;
      z-index: 11;
      transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
    }

    /* Vis tooltip + pil ved hover på .rekl-indicator */
    .rekl-indicator.tooltip:hover::after,
    .rekl-indicator.tooltip:hover::before {
      visibility: visible;
      opacity: 1;
    }

    /* Produkt-blokkens CSS bor i product-block.php på blokkens eget style-handle,
       så den også injiceres i editorens canvas (ServerSideRender-preview). */
/*# sourceURL=bloggerspace-affiliate-inline-css */