@font-face {
    font-family: "Proxima Nova Bold";
    src: url("/fonts/Proxima Nova Bold.eot");
    src: local("☺"), url("/fonts/Proxima Nova Bold.woff") format("woff"), url("/fonts/Proxima Nova Bold.ttf") format("truetype"), url("/fonts/Proxima Nova Bold.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Proxima Nova Bold It";
    src: url("/fonts/Proxima Nova Bold It.eot");
    src: local("☺"), url("/fonts/Proxima Nova Bold It.svg") format("svg"), url("/fonts/Proxima Nova Bold It.ttf") format("truetype"), url("/fonts/Proxima Nova Bold It.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Proxima Nova Light";
    src: url("/fonts/Proxima Nova Light.eot");
    src: local("☺"), url("/fonts/Proxima Nova Light.svg") format("svg"), url("/fonts/Proxima Nova Light.ttf") format("truetype"), url("/fonts/Proxima Nova Light.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Proxima Nova Light It";
    src: url("/fonts/Proxima Nova Light It.eot");
    src: local("☺"), url("/fonts/Proxima Nova Light It.svg") format("svg"), url("/fonts/Proxima Nova Light It.ttf") format("truetype"), url("/fonts/Proxima Nova Light It.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Proxima Nova Reg";
    src: url("/fonts/Proxima Nova Reg.eot");
    src: local("☺"), url("/fonts/Proxima Nova Reg.svg") format("svg"), url("/fonts/Proxima Nova Reg.ttf") format("truetype"), url("/fonts/Proxima Nova Reg.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Proxima Nova Reg It";
    src: url("/fonts/Proxima Nova Reg It.eot");
    src: local("☺"), url("/fonts/Proxima Nova Reg It.svg") format("svg"), url("/fonts/Proxima Nova Reg It.ttf") format("truetype"), url("/fonts/Proxima Nova Reg It.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

/* Preferred default font */
body { font-family: 'Proxima Nova Reg', 'Trebuchet MS', 'Roboto', 'Helvetica Neue', 'Arial', sans-serif !important; }

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;


    margin: 0; /* Remove default margin */
    padding: 0; /* Remove default padding */
    height: 100%; /* Make html and body occupy full viewport height */
    display: flex;
    flex-direction: column;
    /* Keep scrollbars consistent without forcing gutters on both edges */
    scrollbar-gutter: auto;
}


/* Ensure main app containers provide visible scrollbars and reserve gutter */
body {
    min-height: 100vh;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

/*.blazor-error-boundary {*/
/*    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;*/
/*    padding: 1rem 1rem 1rem 3.7rem;*/
/*    color: white;*/
/*}*/

/*    .blazor-error-boundary::after {*/
/*        content: "An error has occurred."*/
/*    }*/

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.mud-button {
    border-radius: 8px !important; /* Daha yuvarlak köşeler */
    transition: transform 0.2s ease-in-out !important;
}

.mud-button:hover {
    transform: translateY(-2px);
}

.mud-input {
    border-radius: 8px !important;
}

.mud-card {
    border-radius: 12px !important;
}

/* Optionally, you can add a gradient background */
.MudLayout {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}
.menu-item:hover {
    color: #1E3A8A; /* Dark blue color */
}


.text-dark-mode {
    color: white;
}

.text-light-mode {
    color: black;
}
/* Responsive: Small devices (max-width: 768px) */
@media (max-width: 768px) {
    .mud-appbar {
        width: 100% !important; /* Small screens: %100 width */
    }
}

/* Responsive: Large devices (min-width: 769px) */
@media (min-width: 769px) {
    .mud-appbar {
        width: " + (_drawerOpen ? "calc(100% - 240px)" : "100%") + " !important; /* Large screens: width depends on Drawer state */
    }
}

/* Log popup cell scroll */
.log-popup .scroll-cell {
    max-height: 100px;
    overflow: auto;
}

.e-de-viewercontainer {
    width: 100% !important;
}

.e-de-background canvas {
    width: 100% !important;
}


/* ---------------------------------------------------------------------------
   Interactive rule colours (form designer -> Conditions -> "Apply to")

   A colour action can only write an inline style onto the field container, so
   colours aimed at the input or the label travel as CSS custom properties on
   that container and are projected onto the descendants here.

   Why this is needed at all: <input>/<textarea> do not inherit `color` from an
   ancestor (the UA gives form controls their own colour), so a container-level
   `color:red` used to paint the label and leave the value black. That was the
   whole of the "Text Color does nothing" report -- sgtest form 412 /
   RMCChecklist, field OverallRiskLevel.

   Each class is emitted by FormGridCell.GetRuleStyleClasses ONLY when the
   matching custom property is present, so var() is always defined here. Do not
   relax that: an undefined var() makes `color` compute to unset -- i.e. inherit
   -- which would silently repaint every input on every form.

   !important is required because the editor components write their own inline
   styles (EvolveFieldBase.GetInputStyle, Syncfusion themes); a conditional rule
   is meant to win over the field's static styling.
   --------------------------------------------------------------------------- */

.evolve-rule-input-color input,
.evolve-rule-input-color textarea,
.evolve-rule-input-color select,
.evolve-rule-input-color .e-input,
.evolve-rule-input-color .e-input-group input,
.evolve-rule-input-color .e-input-group textarea,
.evolve-rule-input-color .e-richtexteditor .e-content,
.evolve-rule-input-color .mud-input-slot {
    color: var(--evolve-rule-input-color) !important;
}

.evolve-rule-input-bg input,
.evolve-rule-input-bg textarea,
.evolve-rule-input-bg select,
.evolve-rule-input-bg .e-input,
.evolve-rule-input-bg .e-input-group,
.evolve-rule-input-bg .e-input-group input,
.evolve-rule-input-bg .e-input-group textarea,
.evolve-rule-input-bg .e-richtexteditor .e-content,
.evolve-rule-input-bg .mud-input-slot {
    background-color: var(--evolve-rule-input-bg) !important;
}

.evolve-rule-input-border input,
.evolve-rule-input-border textarea,
.evolve-rule-input-border select,
.evolve-rule-input-border .e-input,
.evolve-rule-input-border .e-input-group,
.evolve-rule-input-border .e-richtexteditor {
    border-color: var(--evolve-rule-input-border) !important;
}

.evolve-rule-label-color .evolve-field-label {
    color: var(--evolve-rule-label-color) !important;
}

.evolve-rule-label-bg .evolve-field-label {
    background-color: var(--evolve-rule-label-bg) !important;
}

.evolve-rule-label-border .evolve-field-label {
    border-color: var(--evolve-rule-label-border) !important;
}