@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    color-scheme: light;
    --app-text: #2f3540;
    --app-text-muted: #626a75;
    --app-surface: rgba(255, 255, 255, 0.95);
    --app-surface-soft: #fff4e7;
    --app-primary-rgb: 248, 138, 1;
    --app-primary-dark-rgb: 207, 111, 0;
    --app-primary-soft-rgb: 255, 190, 103;
    --app-border: rgba(248, 138, 1, 0.26);
    --app-primary: #f88a01;
    --app-primary-dark: #cf6f00;
    --app-primary-soft: #ffbe67;
    --app-shadow: 0 20px 50px rgba(76, 82, 93, 0.14);
    --bs-primary: var(--app-primary);
    --bs-primary-rgb: var(--app-primary-rgb);
    --bs-link-color: var(--app-primary-dark);
    --bs-link-hover-color: var(--app-primary);
}

/* Override Telerik theme tokens from ne.css with the Island Air palette. */
html:root {
    --kendo-primary-10: #fff8ef;
    --kendo-primary-20: #ffefd6;
    --kendo-primary-30: #ffe2b3;
    --kendo-primary-40: #ffd48f;
    --kendo-primary-50: #ffc468;
    --kendo-primary-60: #ffb449;
    --kendo-primary-70: #ffa329;
    --kendo-primary-80: #ff9610;
    --kendo-primary-90: #fd8f06;
    --kendo-primary-100: var(--app-primary);
    --kendo-primary-110: #e77f00;
    --kendo-primary-120: var(--app-primary-dark);
    --kendo-primary-130: #b66000;
    --kendo-primary-140: #9b5200;
    --kendo-primary-150: #834500;
    --kendo-primary-160: #6c3900;
    --kendo-primary-170: #572e00;
    --kendo-primary-180: #442400;
    --kendo-primary-190: #321a00;
    --kendo-primary-200: #221100;
    --kendo-primary-210: #160b00;
    --kendo-primary-220: #0a0500;
    --kendo-link-text: var(--app-primary-dark);
    --kendo-link-hover-text: var(--app-primary);
    --kendo-floating-label-focus-text: var(--app-primary-dark);
    --kendo-list-item-focus-shadow: inset 0 0 0 1px rgba(var(--app-primary-rgb), 0.42);
    --kendo-table-focus-shadow: inset 0 0 0 1px rgba(var(--app-primary-rgb), 0.42);
    --kendo-input-solid-focus-border: var(--app-primary);
    --kendo-input-solid-hover-focus-border: var(--app-primary-dark);
    --kendo-input-outline-focus-border: var(--app-primary);
    --kendo-input-outline-hover-focus-border: var(--app-primary-dark);
    --kendo-input-flat-focus-border: var(--app-primary);
    --kendo-picker-solid-focus-border: var(--app-primary);
    --kendo-picker-solid-hover-focus-border: var(--app-primary-dark);
    --kendo-picker-outline-focus-border: var(--app-primary);
    --kendo-picker-outline-hover-focus-border: var(--app-primary-dark);
    --kendo-picker-flat-focus-border: var(--app-primary);
    --kendo-button-solid-primary-bg: var(--app-primary);
    --kendo-button-solid-primary-border: var(--app-primary);
    --kendo-button-solid-primary-hover-bg: var(--app-primary-dark);
    --kendo-button-solid-primary-hover-border: var(--app-primary-dark);
    --kendo-button-solid-primary-focus-bg: var(--app-primary);
    --kendo-button-solid-primary-focus-border: var(--app-primary);
    --kendo-button-solid-primary-focus-outline: rgba(var(--app-primary-rgb), 0.34);
    --kendo-button-solid-primary-active-bg: var(--app-primary-dark);
    --kendo-button-solid-primary-active-border: var(--app-primary-dark);
    --kendo-button-outline-primary-text: var(--app-primary-dark);
    --kendo-button-outline-primary-border: var(--app-primary);
}

html, body {
    font-family: Inter, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
    color: var(--app-text);
    background: #fff8ef;
}

body {
    margin: 0;
}

* {
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--app-text);
    letter-spacing: -0.03em;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: var(--app-primary-dark);
}

a:hover, .btn-link:hover {
    color: var(--app-primary);
}

.btn-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-soft));
    border-color: transparent;
    box-shadow: 0 16px 32px rgba(var(--app-primary-rgb), 0.28);
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.15rem white, 0 0 0 0.35rem rgba(var(--app-primary-rgb), 0.32);
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid rgba(var(--app-primary-rgb), 0.7);
}

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

.validation-message {
    color: #dc2626;
}

#app {
    min-height: 100vh;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgb3ZlcmZsb3c9ImhpZGRlbiI+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMCI+PHJlY3QgeD0iMjM1IiB5PSI1MSIgd2lkdGg9IjU2IiBoZWlnaHQ9IjQ5Ii8+PC9jbGlwUGF0aD48L2RlZnM+PGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTIzNSAtNTEpIj48cGF0aCBkPSJNMjYzLjUwNiA1MUMyNjQuNzE3IDUxIDI2NS44MTMgNTEuNDgzNyAyNjYuNjA2IDUyLjI2NThMMjY3LjA1MiA1Mi43OTg3IDI2Ny41MzkgNTMuNjI4MyAyOTAuMTg1IDkyLjE4MzEgMjkwLjU0NSA5Mi43OTUgMjkwLjY1NiA5Mi45OTZDMjkwLjg3NyA5My41MTMgMjkxIDk0LjA4MTUgMjkxIDk0LjY3ODIgMjkxIDk3LjA2NTEgMjg5LjAzOCA5OSAyODYuNjE3IDk5TDI0MC4zODMgOTlDMjM3Ljk2MyA5OSAyMzYgOTcuMDY1MSAyMzYgOTQuNjc4MiAyMzYgOTQuMzc5OSAyMzYuMDMxIDk0LjA4ODYgMjM2LjA4OSA5My44MDcyTDIzNi4zMzggOTMuMDE2MiAyMzYuODU4IDkyLjEzMTQgMjU5LjQ3MyA1My42Mjk0IDI1OS45NjEgNTIuNzk4NSAyNjAuNDA3IDUyLjI2NThDMjYxLjIgNTEuNDgzNyAyNjIuMjk2IDUxIDI2My41MDYgNTFaTTI2My41ODYgNjYuMDE4M0MyNjAuNzM3IDY2LjAxODMgMjU5LjMxMyA2Ny4xMjQ1IDI1OS4zMTMgNjkuMzM3IDI1OS4zMTMgNjkuNjEwMiAyNTkuMzMyIDY5Ljg2MDggMjU5LjM3MSA3MC4wODg3TDI2MS43OTUgODQuMDE2MSAyNjUuMzggODQuMDE2MSAyNjcuODIxIDY5Ljc0NzVDMjY3Ljg2IDY5LjczMDkgMjY3Ljg3OSA2OS41ODc3IDI2Ny44NzkgNjkuMzE3OSAyNjcuODc5IDY3LjExODIgMjY2LjQ0OCA2Ni4wMTgzIDI2My41ODYgNjYuMDE4M1pNMjYzLjU3NiA4Ni4wNTQ3QzI2MS4wNDkgODYuMDU0NyAyNTkuNzg2IDg3LjMwMDUgMjU5Ljc4NiA4OS43OTIxIDI1OS43ODYgOTIuMjgzNyAyNjEuMDQ5IDkzLjUyOTUgMjYzLjU3NiA5My41Mjk1IDI2Ni4xMTYgOTMuNTI5NSAyNjcuMzg3IDkyLjI4MzcgMjY3LjM4NyA4OS43OTIxIDI2Ny4zODcgODcuMzAwNSAyNjYuMTE2IDg2LjA1NDcgMjYzLjU3NiA4Ni4wNTQ3WiIgZmlsbD0iI0ZGRTUwMCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9nPjwvc3ZnPg==) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

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

.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

.loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: var(--app-primary);
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Loading");
}

.k-grid,
.k-card,
.k-window,
.k-tabstrip,
.k-toolbar,
.k-form,
.k-notification {
    border-radius: 20px !important;
    border-color: var(--app-border) !important;
    box-shadow: var(--app-shadow);
}

.k-grid,
.k-card,
.k-window-content,
.k-tabstrip,
.k-toolbar,
.k-form {
    background: var(--app-surface);
}

.k-grid .k-grid-header,
.k-tabstrip-items-wrapper,
.k-toolbar {
    background: linear-gradient(180deg, rgba(255, 248, 239, 0.96), rgba(255, 239, 220, 0.93));
}

.k-button,
.k-picker,
.k-input,
.k-textbox,
.k-textarea,
.k-dropdownlist,
.k-multiselect,
.k-numerictextbox {
    border-radius: 14px !important;
}

.k-button {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.k-button:hover {
    transform: translateY(-1px);
}

.k-input:focus,
.k-input.k-focus,
.k-input:focus-within,
.k-picker:focus,
.k-picker.k-focus,
.k-picker:focus-within {
    border-color: var(--app-primary) !important;
}

.k-input:focus::after,
.k-input.k-focus::after,
.k-input:focus-within::after,
.k-picker:focus::after,
.k-picker.k-focus::after,
.k-picker:focus-within::after {
    border-color: var(--app-primary) !important;
}

.k-primary,
.k-button-solid-primary,
.k-button.k-primary {
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-soft)) !important;
    border-color: transparent !important;
    box-shadow: 0 12px 26px rgba(var(--app-primary-rgb), 0.24);
}

.k-grid tr:hover {
    background: rgba(var(--app-primary-rgb), 0.08);
}

.access-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.6rem 0.8rem 0.6rem 1rem;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.8);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
}

.access-pill-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--app-primary-dark);
}

.access-pill-name {
    font-weight: 600;
    color: var(--app-text);
}

.access-pill-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: 0.5rem 0.95rem;
    border-radius: 999px;
    background: rgba(var(--app-primary-rgb), 0.12);
    color: var(--app-primary-dark);
    font-weight: 600;
}

.access-pill-link-standalone {
    border: 1px solid var(--app-border);
    background: rgba(255, 255, 255, 0.84);
}
