/* Basic styling for the Mizics plugin */

.mizics-container {
  max-width: 600px;
  margin: 20px auto;
  padding: 20px;
  background: #ffffff;
  border: 1px solid #ddd;
  border-radius: 5px;
  font-family: Arial, sans-serif;
  color: #333;
}

.mizics-container h2,
.mizics-container h3 {
  color: #b5651d; /* Warm bronze color */
  margin-bottom: 10px;
}

.mizics-upload-section {
  margin-bottom: 20px;
}

.mizics-upload-section p {
  font-size: 16px;
  margin-bottom: 10px;
}

.mizics-upload-section input[type="file"] {
  margin-bottom: 10px;
}

#mizics-video {
  max-width: 100%;
  margin-bottom: 10px;
}

#mizics-canvas {
  display: none;
}

#mizics-results {
  margin-top: 20px;
}

.mizics-index {
  margin-bottom: 20px;
}

#mizics-action-buttons,
#mizics-download-prompt,
#mizics-thankyou {
  margin-top: 15px;
}


/* Mizics v21.1.0 – Facial analysis mask (toggleable) */
#mizics-face-mask {
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at center,
      transparent 0%,
      transparent 46%,
      rgba(0,0,0,0.55) 52%,
      rgba(0,0,0,0.7) 100%);
  z-index:10;
}


/* Mizics v21.1.1 – Video wrapper + facial analysis mask */
#mizics-video-wrap{
  position:relative;
  display:inline-block;
}
#mizics-face-mask{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at center,
      transparent 0%,
      transparent 46%,
      rgba(0,0,0,0.55) 52%,
      rgba(0,0,0,0.7) 100%);
  z-index:10;
}


.mizics-experimental-note {
    margin-top: 12px;
    font-size: 13px;
    color: #caa24a;
    font-style: italic;
}

#mizics-usage-panel{font-size:14px;line-height:1.5;}
#mizics-usage-panel strong{color:#1f5f2e;}

#mizics-usage-panel{font-size:14px;line-height:1.5;}
#mizics-usage-panel strong{color:#1f5f2e;}

.mizics-clinic-account-dashboard{max-width:980px;}
.mizics-clinic-account-dashboard h2{margin-top:0;}
.mizics-clinic-usage-table th{width:260px;}
.mizics-account-note{font-size:13px;color:#526052;}