:root {
    --kors-primary: var(--theme-palette-color-1, #0073aa);
    --kors-secondary: var(--theme-palette-color-2, #005177);
    --kors-accent: var(--theme-palette-color-3, #28a745);
    --kors-accent-hover: var(--theme-palette-color-4, #218838);
    --kors-text-dark: var(--theme-text-color, #333);
    --kors-text-light: var(--theme-text-light-color, #666);
    --kors-bg-light: var(--theme-background-color, #f9f9f9);
    --kors-white: var(--theme-content-background-color, #ffffff);
    --kors-hero-bg: linear-gradient(135deg, var(--kors-primary) 0%, var(--kors-secondary) 100%);
    --kors-radius-sm: var(--theme-button-radius, 4px);
    --kors-radius-lg: var(--theme-border-radius, 8px);
    --kors-shadow: var(--theme-box-shadow, 0 4px 12px rgba(0,0,0,0.05));
    --font-family-base: var(--theme-font-family, var(--theme-body-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif));
    --kors-header-height: var(--theme-header-height, var(--header-height, 72px));
}

body {
    font-family: var(--font-family-base);
    color: var(--kors-text-dark);
    background-color: var(--kors-bg-light);
    margin: 0;
    padding: 0;
}

button,
input,
select,
textarea {
    font-family: var(--font-family-base);
}

/* --- Shared Header (P1-BRAND-01) --- */
.korsmann-header {
    background: var(--kors-white);
    padding: 0;
    box-shadow: var(--kors-shadow);
    position: sticky;
    top: 0;
    z-index: 100;
}

.korsmann-container:not(.ct-container) {
    max-width: var(--theme-container-width, var(--theme-normal-container-max-width, 1140px));
    width: min(100%, var(--theme-container-width, var(--theme-normal-container-max-width, 1140px)));
    margin: 0 auto;
    padding: 0 var(--theme-content-spacing, 20px);
}

.nav-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: var(--kors-header-height);
}

.nav-logo {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--kors-primary);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
}

.nav-links {
    display: flex;
    gap: 20px;
    align-items: center;
}

.nav-menu {
    display: flex;
    gap: 20px;
    align-items: center;
    flex-wrap: wrap;
    font-family: var(--theme-menu-font-family, var(--theme-font-family, var(--theme-body-font-family, var(--font-family-base))));
}

.nav-link {
    text-decoration: none;
    color: var(--theme-menu-link-initial-color, var(--theme-link-initial-color, #333));
    font-weight: var(--theme-menu-font-weight, 500);
    font-size: var(--theme-menu-font-size, 15px);
    font-family: var(--theme-menu-font-family, var(--theme-font-family, var(--theme-body-font-family, var(--font-family-base))));
}

.nav-link:hover {
    color: var(--theme-menu-link-hover-color, var(--theme-link-hover-color, var(--kors-primary)));
}

.nav-btn {
    background: var(--kors-primary);
    color: #fff;
    padding: 8px 16px;
    border-radius: var(--kors-radius-sm);
    text-decoration: none;
    font-weight: bold;
    cursor: pointer;
    border: none;
    font-size: 1rem;
    transition: background 0.3s;
    font-family: var(--theme-button-font-family, var(--theme-menu-font-family, var(--theme-font-family, var(--theme-body-font-family, var(--font-family-base)))));
}

.nav-btn:hover {
    background: var(--kors-secondary);
}

.nav-btn.outline {
    background: transparent;
    border: 1px solid var(--kors-primary);
    color: var(--kors-primary);
}

.nav-btn.outline:hover {
    background: #f0f7fb;
}

.kors-profile-banner {
    background: #e6f7ff;
    border-bottom: 1px solid #91d5ff;
}

.kors-profile-banner-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    color: #0050b3;
    font-size: 0.95rem;
}

.kors-profile-banner-inner .nav-btn {
    padding: 6px 12px;
    font-size: 0.9rem;
}

/* --- App Layout --- */
.kors-app-layout {
    padding: 40px 0;
    min-height: calc(100vh - 140px);
}

.kors-workspace-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

@media (min-width: 768px) {
    .kors-workspace-grid {
        grid-template-columns: 300px 1fr;
    }
}

/* --- Sidebar / User Area --- */
.kors-user-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: var(--kors-radius-lg);
    padding: 20px;
    box-shadow: var(--kors-shadow);
}

.user-profile-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.user-avatar {
    width: 40px;
    height: 40px;
    background: var(--kors-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    margin-right: 15px;
}

.user-info .email {
    font-weight: bold;
    font-size: 0.9rem;
    display: block;
}

.user-info .plan {
    font-size: 0.8rem;
    color: var(--kors-text-light);
    text-transform: uppercase;
    background: #eee;
    padding: 2px 6px;
    border-radius: var(--kors-radius-sm);
}

.kors-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

@media (max-width: 767px) {
    .kors-plan-grid {
        grid-template-columns: 1fr;
    }
}

.quota-stats {
    margin-bottom: 20px;
}

.quota-bar-bg {
    height: 6px;
    background: #eee;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 5px;
}

.quota-bar-fill {
    height: 100%;
    background: var(--kors-accent);
}

/* --- Tool Card --- */
.kors-tool-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: var(--kors-radius-lg);
    padding: 40px;
    box-shadow: var(--kors-shadow);
}

.kors-tool-header {
    margin-bottom: 30px;
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}

.kors-tool-header h1 {
    margin: 0;
    color: var(--kors-primary);
    font-size: 1.8rem;
}

/* --- Form Elements --- */
.korsmann-form-group {
    margin-bottom: 20px;
}

.korsmann-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
}

.korsmann-form-group select,
.korsmann-form-group input {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.korsmann-submit-btn {
    width: 100%;
    padding: 14px;
    background: var(--kors-accent);
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
}

.korsmann-submit-btn:hover {
    background: var(--kors-accent-hover);
}

.korsmann-submit-btn:disabled {
    background: #ccc;
    cursor: not-allowed;
}

/* --- Footer --- */
.korsmann-footer {
    background: #fff;
    border-top: 1px solid #eee;
    padding: 20px 0;
    text-align: center;
    font-size: 0.9rem;
    color: #999;
}

.footer-menu {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.footer-menu a {
    color: var(--theme-menu-link-initial-color, var(--theme-link-initial-color, #666));
    text-decoration: none;
    font-weight: 500;
}

.footer-menu a:hover {
    color: var(--theme-menu-link-hover-color, var(--theme-link-hover-color, var(--kors-primary)));
}

.footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.footer-copy {
    text-align: right;
    margin-left: auto;
}