@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
    font-family: 'primaryThemeFont';
    font-style: normal;
    src: local('PermanentMarker'), url(./Assets/fonts/PermanentMarker-Regular.ttf) format('truetype');
}

.themeFont {
    font-family: 'primaryThemeFont', sans-serif;
    font-weight: 500;
    line-height: 1.2;
}

.themeFontSecondary {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
    font-weight: 600;
    line-height: 1.5;
}

.fill{fill:#9614C8;stroke:none;}
.stroke{fill:none;stroke:#9614C8;}

.magicTextColor {
    color: rgba(175, 175, 255, 1);
    text-shadow: 0 0 7px rgba(155, 50, 255, 1),
    0 0 10px rgba(155, 50, 255, 1),
    0 0 21px rgba(150, 20, 200, 0.75);
    user-select: none;
}

.svgIconFill {
    fill:rgba(155, 155, 255, 1);
    stroke:none;
}

.svgIconGlow {
    filter: drop-shadow(0px 0px 30px rgba(150, 20, 200, 0.75));
}

.hourGlassGlow {
    fill: rgba(150, 20, 200, 1);
}

.hourGlassFill {
    fill: rgba(125, 125, 255, 1);
}
.hourGlass {
    fill: rgba(155, 155, 255, 1);
}

.magicTextColorGreen {
    color: rgb(50, 250, 50);
    text-shadow: 0 0 7px rgba(50, 230, 50, 1),
    0 0 10px rgba(100, 200, 50, 1),
    0 0 21px rgba(90, 150, 20, 0.75),
    0 0 42px rgba(90, 150, 20, 0.5);
    user-select: none;
}

.magicTextColorRed {
    color: rgb(250, 50, 50);
    text-shadow: 0 0 7px rgb(230, 50, 50),
    0 0 10px rgb(200, 50, 50),
    0 0 21px rgba(150, 20, 20, 0.75),
    0 0 42px rgba(150, 20, 20, 0.5);
    user-select: none;
}
