// v první verzi infopanelu byla jen barva $alertInfoPanel + bily text
// v zajmu zachovani zpetne kompatibility zustava promenna $alertInfoPanel
// v novych projektech ale pouzivej $alertInfopanelBg

$alertInfoPanel: $link-color !default;
$alertInfoPanelBg: $alertInfoPanel !default;
$alertInfoPanelColor: $white !default;
$alertInfoPanelIcon: url("/static/images/icon_infopanel.png") !default;
$alertInfoPanelBorder: 0 !default;

.alert.alert-info.infopanel {
   background: $alertInfoPanelBg;
   color: $alertInfoPanelColor;
   padding-top: 5px;
   padding-bottom: 5px;
   margin: 0;
   border: 0;
   border-bottom: $alertInfoPanelBorder;
   font-weight: 400;
   position: relative;
   z-index: 100;

   .close {
      color: $alertInfoPanelColor;
      opacity: .5;
      font-size: 24px;
      position: absolute;
      top: 50%;
      right: 1rem;
      margin-top: -.5em;


      &:hover,
      &:active,
      &:focus {
         opacity: 1;
         color: $alertInfoPanelColor;
      }
   }

   p {
      color: $alertInfoPanelColor;
      margin: 3px 0;
      padding: 0;
      line-height: 22px;
   }

   p:first-of-type::before {
      content: $alertInfoPanelIcon;
      display: inline-block;
      position: relative;
      bottom: -4px;
      margin-right: 7px;
   }

   a {
      color: inherit;
      text-decoration: underline;

      &:hover,
      &:active,
      &:focus {
         text-decoration: none;
         color: inherit;
      }
   }
}
