/* Add Gilroy font family variations */
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-ExtraBoldItalic.ttf') format('truetype');
    font-weight: 800;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Heavy.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-HeavyItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-RegularItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-UltraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'Gilroy';
    src: url('/admin/source/fonts/Gilroy-UltraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

/* Body Styling */
body {
    margin: 0;
    font-family: 'Gilroy', Arial, sans-serif;
    background-color: #FDFFF5;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

body::-webkit-scrollbar {
    display: none;
}

html {
    overflow-y: scroll;
}

header.show-shadow {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.back-button {
   position: absolute;
   top: 20px;
   left: 20px;
   background: white;
   border: none;
   cursor: pointer;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
   outline: none;
}

.back-button .back-icon {
   width: 20px;
   height: 20px;
}

/* Prevent blue outline/border */
.back-button:focus,
.back-button:hover,
.back-button:active {
   outline: none;
   box-shadow: none;
}

.zigzag-line {
    width: 100%;
    height: 12px; /* Adjust height for visibility */
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="12" viewBox="0 0 200 12" preserveAspectRatio="none"><path d="M0 6 Q 5 0, 10 6 T 20 6 T 30 6 T 40 6 T 50 6 T 60 6 T 70 6 T 80 6 T 90 6 T 100 6 T 110 6 T 120 6 T 130 6 T 140 6 T 150 6 T 160 6 T 170 6 T 180 6 T 190 6 T 200 6" stroke="white" fill="transparent" stroke-width="2"/></svg>');
    background-repeat: repeat-x;
    background-size: 100% auto;
    margin-top: 10px;
    margin-bottom: 10px;
}