/* This file contains all the custom fonts and colors for the dollmaker */


html {
    scrollbar-color: #bfeaff #3f8fd8; /* Fancy scrollbar stylings */
}



/* Use custom fonts for stuff that you wanna use it for */


a:link, a:active, a:visited
{color: #eee;
font-size: 10px;
text-align:center;
text-decoration:none;}

a:hover
{color: #847bbd;}

button {
font-family:calibri;
color: #eee;  
font-size:13px;
}

/* Button hover styling */
button:hover {
    background-color: #3f8fd8;
    color: #eee;
    outline: 1px solid white;
    border: 0;
}


#bodyArea,#swatchesArea,.ui-tabs-panel {
    outline: 1px solid #5f5598; /* Switched border with outline, to prevent offset issues on mobile */
    background: #9fd9ff;


}

#tabsbar li a {
   border: 1px solid #5f5598;
   border-bottom: 3px solid #5f5598;
   background-color: #3f8fd8;
   color: #eee;
}

/* Tabs hover styling, only for unselected tabs */
#tabsbar .ui-state-default a:hover {
    border-bottom: 1px solid #5f5598;
    background-color: #3f8fd8;
}

#tabsbar .ui-state-active a,#tabsbar .ui-state-active a:hover {
    border-bottom: 1px solid #5f5598;
    background-color: #3f8fd8;
}

/* ✨ CUSTOM BUTTON STYLE (FOR FLASH / DOWNLOAD / RESET) */
button,
input[type="button"] {
  background: #3f8fd8 !important;   /* soft blue */
  color: #ffffff !important;

  border: 2px solid #ffffff !important;
  border-radius: 8px;

  padding: 6px 10px;
  margin: 4px 0;

  cursor: pointer;

  box-shadow: 0 0 6px rgba(255,255,255,0.5);
}

/* ✨ HOVER EFFECT */
button:hover,
input[type="button"]:hover {
  background: #66b8ff !important;
}

/* ✨ TEXT INPUTS + DROPDOWNS */
input,
select {
  background: #dff4ff !important;   /* soft light blue */
  color: #2c2c2c !important;

  border: 2px solid #3f8fd8 !important;
  border-radius: 6px;

  padding: 4px;
}

/* ✨ SMALL COLOR BOXES */
input[type="color"] {
  border-radius: 4px;
  border: 2px solid #3f8fd8;
}