/* error.css */
:root {
    --theme: #E10000;
    --theme-rgb: 225, 0, 0;
    --dark: #0C0C0E;
    --dark-rgb: 12, 12, 14;
    --white: #ffffff;
    --white-rgb: 255, 255, 255;
    --black: #000000;
    --black-rgb: 0, 0, 0;
    --gray: #e2e8f0;
    --gray-rgb: 226, 232, 240;
    --body-bg: #ffffff;
    --body-font: Inter, -apple-system, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    --base-font-size: 1rem;
    --base-font-weight: 400;
    --base-line-height: 1.5;
    --base-body-color: #000;
    --border-color: #dbdbdb;
    --h1-font-size: 2.5rem;
    --h2-font-size: 2rem;
    --h3-font-size: 1.75rem;
    --h4-font-size: 1.5rem;
    --h5-font-size: 1.25rem;
    --h6-font-size: 1rem;
}


body {
    margin: 0;
    padding: 0;
    background-color: black;
    color: var(--theme);
    font-family: Arial, sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    text-align: center;
}

.error-container {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    align-items: center; /* Center items horizontally */
    justify-content: center; /* Center items vertically */
}

.opaas-icon {
    width: 250px; /* Size of the company logo */
    margin-bottom: 50px; /* Space between the logo and the text */
}

.error-msg {
    display: flex;
    flex-direction: column; /* Stack text items vertically */
    align-items: center; /* Center text horizontally */
    gap: 10px; /* Space between the title and subtitle */
}

.error-msg h1{
    margin: 0;
    font-size: 24px;
    color: var(--theme);
}

.error-msg h2 {
    margin: 0;
    font-size: 18px;
    color: var(--theme);
}