/* Icon system (local sprite + icon buttons).
   Keep icons on our server (no external CDNs).
*/

.icons-sprite{
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}

.icon{
  width:16px;
  height:16px;
  display:block;
}

.iconbtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:none;
  border-radius:50%;
  background:transparent;
  text-decoration:none;
  cursor:pointer;
  padding:0;
  box-shadow:none;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.iconbtn:hover{
  transform: translateY(-2px);
  box-shadow:0 4px 12px rgba(0, 0, 0, 0.1);
}

.iconbtn:focus-visible{
  outline:3px solid var(--blue-weak);
  outline-offset:2px;
}

.iconbtn--apply{
  background:#D4E7F5;
  color:#5A8FB0;
}

.iconbtn--apply:hover{
  background:#BBD9EB;
  color:#4A7FA0;
}

.iconbtn--share,
.js-share{
  background:#c8e6c9;
  color:#2E7D32;
}

.iconbtn--share:hover,
.js-share:hover{
  background:#A5D6A7;
  color:#1B5E20;
}

.iconbtn--save{
  background:#F3E5F5;
  color:#9C27B0;
}

.iconbtn--save .icon {
  width: 20px;
  height: 20px;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
}

.iconbtn--save:hover{
  background:#E3C5E8;
  color:#7B1FA2;
}

.iconbtn--save.is-on{
  background:#AB47BC;
  color:#fff;
}

.iconbtn--save.is-on .icon {
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.25));
}

.iconbtn--save.is-on:hover{
  background:#9C27B0;
  color:#fff;
}

.iconbtn.is-disabled,
.iconbtn[aria-disabled="true"]{
  opacity:0.55;
  pointer-events:none;
}