 /*****************************************************************
 *
 * reveal.js-copycode for Reveal.js
 * Version 1.3.2
 *
 * @link
 * https://github.com/martinomagnifico/reveal.js-copycode
 *
 * @author: Martijn De Jongh (Martino), martijn.de.jongh@gmail.com
 * https://github.com/martinomagnifico
 *
 * @license
 * MIT
 *
 * Copyright (C) 2025 Martijn De Jongh (Martino)
 *
 ******************************************************************/


 :root {
   --cc-copy-bg: orange;
   --cc-copied-bg: green;
   --cc-copy-color: black;
   --cc-copied-color: white;
   --cc-scale: 1;
   --cc-offset: 0;
   --cc-radius: 0;
   --cc-borderwidth: 2;
   --cc-copyborder: 0;
   --cc-copiedborder: 0;
   --cssloaded-copycode: true;
   --cssimported-copycode: true
 }

 .reveal pre,
 .codeblock {
   width: 100%
 }

 .codeblock {
   margin: var(--r-block-margin) auto;
   position: relative
 }

 .sourceCode .codeblock {
   margin: 0
 }

 .codeblock pre .code-copy-button {
   display: none
 }

 .codeblock code.hljs {
   min-height: 1.2em
 }

 .codeblock>button {
   opacity: .5;
   z-index: 1;
   display: flex;
   position: absolute;
   max-height: 100%;
   right: 0;
   right: calc(var(--cc-offset, 0) * 1em);
   top: 0;
   top: calc(var(--cc-offset, 0) * 1em);
   background-color: var(--cc-copy-bg, orange);
   color: var(--cc-copy-color, black);
   border: var(--cc-copyborder, 0);
   margin: 0;
   padding: .2em .5em;
   font-family: inherit;
   font-size: 1.5rem;
   border-radius: 0;
   border-radius: calc(var(--cc-radius, 0) * 1em);
   font-size: calc(var(--cc-scale, 1) * 1.5rem);
   line-height: 1.25em;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   transform: translateZ(0);
   transition: background-color .25s ease-in-out, opacity .25s ease-in-out;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   cursor: pointer
 }

 .codeblock>button svg {
   fill: var(--cc-copy-color);
   height: 1.25em;
   width: .8em
 }

 .codeblock>button svg+span {
   margin-left: .25em
 }

 .codeblock>button svg:last-of-type {
   display: none
 }

 .codeblock>button[data-cc-display=icons] span {
   line-height: 1.25em;
   transform: translate3d(-100%, -50%, 1px);
   pointer-events: none;
   opacity: 0;
   transition: all .15s ease-in-out;
   font-size: 1.2rem;
   position: absolute;
   background: #000;
   padding: .25em .5em;
   left: 0;
   top: 50%;
   border-radius: .2em;
   color: #fff;
   margin-left: -.5em
 }

 .codeblock>button[data-cc-display=icons] span:after {
   content: "";
   display: block;
   width: .66em;
   height: .66em;
   background: #000;
   position: absolute;
   right: 0;
   top: 50%;
   transform: translate3d(45%, -50%, -1px) rotate(45deg)
 }

 .codeblock>button[data-cc=hover] {
   opacity: 0
 }

 @media (hover: none) {
   .codeblock>button[data-cc=hover] {
     opacity: 1
   }
 }

 .codeblock>button[data-cc=false] {
   display: none
 }

 .codeblock>button[disabled] {
   opacity: 1;
   background-color: var(--cc-copied-bg, green);
   color: var(--cc-copied-color, white);
   border: var(--cc-copiedborder, 0);
   cursor: default
 }

 .codeblock>button[disabled] svg {
   fill: var(--cc-copied-color, white)
 }

 .codeblock>button[disabled] svg:first-of-type {
   display: none
 }

 .codeblock>button[disabled] svg:last-of-type {
   display: inline-block
 }

 .codeblock>button[disabled][data-cc-display=icons] span {
   opacity: 1
 }

 .codeblock>button:focus {
   outline: 0
 }

 .codeblock:hover>button[data-cc=hover] {
   opacity: .5
 }

 .codeblock>button:hover,
 .codeblock>button[data-cc=hover]:hover,
 .codeblock>button[disabled],
 .codeblock:hover>button[disabled],
 pre>button:hover {
   opacity: 1
 }
