/******************
    Alpine-Inspired Theme
    Based on shadcn.css design system
    ---------------

    This theme applies the warm, sophisticated Alpine color palette
    with refined typography and modern interactions
*/

/* ============================================
   IFRAME OPTIMIZATION - Import First
   ============================================ */
@import url('iframe-optimization.css');

/* ============================================
   SMOOTH SCROLL BEHAVIOR
   ============================================ */
html {
    scroll-behavior: smooth !important;
}

/* Scroll margin for group titles and first questions to avoid being stuck to top */
.group-title,
.group-name,
.group-description,
.question-container:first-of-type {
    scroll-margin-top: 1rem;
}

/* ============================================
   CSS VARIABLES - Alpine Color Palette
   ============================================ */
:root {
    /* Primary Colors - Designer Approved Clean Palette */
    --alpine-background: #FFFCF9;        /* Pergament - pur, zen background */
    --alpine-foreground: #3C3530;        /* Schmiedeeisen - Questions & Answers */
    --alpine-primary: #8B4A3B;           /* Kastanie-Mittel - DOAR Action Buttons */
    --alpine-secondary: #B8654F;         /* Kastanie-Hell - Helper Text */
    --alpine-accent: #507A5B;            /* Malachitgrün */
    
    /* Neutral Colors */
    --alpine-muted: #F9F6F1;             /* Morgenreif - Section Background */
    --alpine-muted-foreground: #CDC4BA;  /* Zimmermannseiche - Muted Elements */
    --alpine-border: #F0ECE6;            /* Steinmehl - Borders */
    
    /* Additional Colors */
    --alpine-wood: #B8654F;              /* Kastanie-Hell */
    --alpine-success: #507A5B;           /* Malachitgrün */
    --alpine-warning: #D4A76A;           /* Warm amber */
    --alpine-danger: #8B4A3B;            /* Kastanie-Mittel */
    
    /* Shadows */
    --alpine-shadow: rgba(60, 53, 48, 0.08);
    --alpine-shadow-md: rgba(60, 53, 48, 0.12);
    --alpine-shadow-lg: rgba(60, 53, 48, 0.16);
    
    /* Typography */
    --alpine-font-family: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --alpine-line-height: 1.618;         /* Golden ratio */
}

/* ============================================
   GLOBAL STYLES
   ============================================ */
body {
    background-color: #FFFCF9;          /* Pergament - pur, zen background */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    font-family: var(--alpine-font-family);
    line-height: var(--alpine-line-height);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding-top: 0 !important;          /* Remove all top padding */
    padding-bottom: 10px;
    margin-top: 0 !important;           /* Remove top margin */
}

/* ============================================
   TYPOGRAPHY
   ============================================ */
h1, .h1 {
    font-size: clamp(3.5rem, 5vw, 6rem) !important;        /* Dramatically increased */
    line-height: 0.95 !important;                          /* Tighter for impact */
    letter-spacing: -0.06em !important;                    /* Aggressive compression */
    font-weight: 300 !important;                           /* Light for sophistication */
    margin-bottom: 4rem !important;                        /* Doubled Ma spacing */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    text-rendering: optimizeLegibility;                     /* Perfect rendering */
    -webkit-font-smoothing: antialiased;                   /* Smooth on retina */
    -moz-osx-font-smoothing: grayscale;
}

h2, .h2 {
    font-size: clamp(2.5rem, 4vw, 3.5rem) !important;     /* Clear distinction */
    line-height: 1.1 !important;                          /* Optimized readability */
    letter-spacing: -0.04em !important;                   /* Mathematical progression */
    font-weight: 300 !important;                          /* Weight consistency */
    margin-bottom: 3rem !important;                       /* Ma breathing space */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h3, .h3 {
    font-size: clamp(1.8rem, 3vw, 2.5rem) !important;     /* Perfect hierarchy */
    line-height: 1.2 !important;                          /* Balanced proportions */
    letter-spacing: -0.02em !important;                   /* Subtle refinement */
    font-weight: 300 !important;                          /* Harmonized weight */
    margin-bottom: 2rem !important;                       /* Proportional spacing */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h4, .h4, h5, .h5 {
    font-weight: 500;
    letter-spacing: -0.01em;
    line-height: var(--alpine-line-height);
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    margin-bottom: 0.875rem;
}

p, .text-base {
    font-size: 1.125rem !important;                       /* 18px - Enhanced readability */
    line-height: 1.7 !important;                          /* Optimal reading rhythm */
    max-width: 65ch !important;                           /* Perfect reading measure */
    margin-bottom: 1.618rem !important;                   /* Golden ratio spacing */
    text-rendering: optimizeLegibility;
    hyphens: auto;                                         /* Elegant line breaks */
    hanging-punctuation: first last;                       /* Typographic refinement */
}

/* OVERRIDE: Zero margin for p inside question containers */
.question-title-container p,
.question-title-container .text-base,
.question-text-container p,
.question-text-container .text-base {
    margin: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
    max-width: none !important;         /* Remove 65ch limit - allow full width */
    width: 100% !important;             /* Use full container width */
}

.text-large {
    font-size: 1.25rem !important;                        /* 20px - Introduction text */
    line-height: 1.6 !important;                          /* Comfortable leading */
    max-width: 60ch !important;                           /* Narrower for large text */
    margin-bottom: 2rem !important;
}

.text-small {
    font-size: 0.875rem !important;                       /* 14px - Metadata */
    line-height: 1.5 !important;                          /* Compact but readable */
    letter-spacing: 0.02em !important;                    /* Small text clarity */
}

a {
    color: var(--alpine-secondary);
    text-decoration: underline;
    text-underline-offset: 4px;
    transition: all 0.2s ease;
}

a:hover {
    color: var(--alpine-primary);
    text-decoration: underline;
}

/* ============================================
   NAVIGATION BAR
   ============================================ */
.navbar {
    background-color: var(--alpine-background);
    border-bottom: 1px solid var(--alpine-border);
    box-shadow: 0 2px 8px var(--alpine-shadow);
}

.navbar-brand {
    color: var(--alpine-foreground) !important;
    font-weight: 500;
    letter-spacing: -0.01em;
}

.navbar-nav .nav-link {
    color: var(--alpine-foreground);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
    padding: 0.5rem 1rem;
    transition: all 0.2s ease;
}

.navbar-nav .nav-link:hover {
    color: var(--alpine-primary);
    transform: translateY(-1px);
}

.navbar-nav .nav-link.active {
    color: var(--alpine-primary);
}

/* ============================================
   PANELS & CARDS
   ============================================ */
.panel {
    background-color: var(--alpine-background);
    border: 1px solid var(--alpine-border);
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px var(--alpine-shadow);
    transition: all 0.3s ease;
}

.panel:hover {
    box-shadow: 0 4px 16px var(--alpine-shadow-md);
    transform: translateY(-2px);
}

.panel-heading {
    background-color: var(--alpine-muted);
    border-bottom: 1px solid var(--alpine-border);
    border-radius: 0.5rem 0.5rem 0 0;
    padding: 1rem 1.5rem;
}

.panel-title {
    color: var(--alpine-foreground);
    font-weight: 500;
    letter-spacing: -0.01em;
    margin: 0;
}

.panel-body {
    padding: 1.5rem;
}

/* Well/Card styles */
.well {
    background-color: var(--alpine-muted);
    border: 1px solid var(--alpine-border);
    border-radius: 0.5rem;
    box-shadow: inset 0 1px 3px rgba(60, 53, 48, 0.05);
}

/* ============================================
   BUTTONS
   ============================================ */
.btn {
    font-family: var(--alpine-font-family);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
    padding: 0.75rem 2rem;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    border: none;
    box-shadow: 0 2px 4px var(--alpine-shadow);
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px var(--alpine-shadow-md);
}

.btn:active {
    transform: translateY(0);
}

/* Primary button - Kastanie-Mittel */
.btn-primary {
    background-color: #8B4A3B;          /* Kastanie-Mittel - DOAR Action Buttons */
    color: #FFFCF9;                     /* Pergament - alb */
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #8B4A3B;          /* Same color, no change */
    color: #FFFCF9;                     /* Pergament - alb */
    opacity: 0.7;
}

/* Default/Secondary button - Clean Style */
.btn-default {
    background-color: transparent;
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    border: 2px solid #F0ECE6;          /* Steinmehl - Borders */
}

.btn-default:hover,
.btn-default:focus {
    background-color: #F9F6F1;          /* Morgenreif - Section Background */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    border-color: #F0ECE6;              /* Steinmehl - Borders */
}

/* Success button - Malachitgrün */
.btn-success {
    background-color: var(--alpine-accent);
    color: var(--alpine-background);
}

.btn-success:hover,
.btn-success:focus {
    background-color: #446950;
    color: var(--alpine-background);
}

/* Danger button */
.btn-danger {
    background-color: var(--alpine-danger);
    color: var(--alpine-background);
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: #B43927;
    color: var(--alpine-background);
}

/* Link button */
.btn-link {
    color: var(--alpine-secondary);
    text-decoration: underline;
    text-underline-offset: 4px;
    box-shadow: none;
}

.btn-link:hover {
    color: var(--alpine-primary);
    transform: none;
}

/* ============================================
   FORMS
   ============================================ */
.form-control {
    background-color: #FFFCF9;          /* Pergament - pur, zen background */
    border: 1px solid #F0ECE6;          /* Steinmehl - Borders */
    border-radius: 0.5rem;
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    font-family: var(--alpine-font-family);
    padding: 0.75rem 1rem;
    transition: all 0.2s ease;
}

.form-control:focus {
    background-color: #FFFCF9;          /* Pergament - pur, zen background */
    border-color: #8B4A3B;              /* Kastanie-Mittel - DOAR Action Buttons */
    box-shadow: 0 0 0 3px rgba(139, 74, 59, 0.1);
    outline: none;
}

.form-control::placeholder {
    color: #CDC4BA;                     /* Zimmermannseiche - Muted Elements */
}

/* Labels */
label {
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    font-weight: 500;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

/* Radio buttons and checkboxes - Kastanie ONLY for selection */
input[type="radio"],
input[type="checkbox"] {
    margin-right: 0.5rem;
}

/* Kastanie ONLY for radio selection */
input[type="radio"]:checked {
    accent-color: #8B4A3B;              /* Kastanie-Mittel */
}

input[type="checkbox"]:checked {
    accent-color: #8B4A3B;              /* Kastanie-Mittel */
}

/* Custom radio/checkbox styling */
.radio label,
.checkbox label {
    font-weight: 400;
}

/* Select dropdowns */
select.form-control {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%233C3530' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

/* ============================================
   ALERTS & MESSAGES
   ============================================ */
.alert {
    border-radius: 0.5rem;
    border: 1px solid;
    padding: 1rem 1.5rem;
    margin-bottom: 1.5rem;
}

.alert-success {
    background-color: rgba(80, 122, 91, 0.1);
    border-color: var(--alpine-accent);
    color: var(--alpine-accent);
}

.alert-info {
    background-color: rgba(44, 79, 118, 0.1);
    border-color: var(--alpine-secondary);
    color: var(--alpine-secondary);
}

.alert-warning {
    background-color: rgba(212, 167, 106, 0.1);
    border-color: var(--alpine-warning);
    color: #B8864A;
}

.alert-danger {
    background-color: rgba(200, 67, 47, 0.1);
    border-color: var(--alpine-primary);
    color: var(--alpine-primary);
}

/* ============================================
   PROGRESS BARS
   ============================================ */
.progress {
    background-color: #F0ECE6;          /* Steinmehl - Borders */
    border-radius: 0.5rem;
    box-shadow: inset 0 1px 3px rgba(60, 53, 48, 0.1);
}

.progress-bar {
    background-color: #8B4A3B;          /* Kastanie-Mittel - Primary Button */
    transition: width 0.6s ease;
}

/* ============================================
   SURVEY SPECIFIC
   ============================================ */
/* Survey container - Optimized for 3 questions view */
.survey-container {
    background-color: #F9F6F1;          /* Morgenreif - Section Background */
    border-radius: 0.5rem;
    padding: 1rem;                      /* Reduced padding */
    box-shadow: 0 4px 16px rgba(60, 53, 48, 0.12);
}

/* Ultra-tight for first group small window */
.group-1 .survey-container,
.first-page .survey-container,
.ls-group:first-child .survey-container {
    padding: 0.5rem !important;             /* Minimal container padding */
    background: transparent !important;      /* Remove background for cleaner look */
}

/* Designer-approved header spacing for first group */
.group-1 h1, .group-1 h2, .group-1 h3,
.first-page h1, .first-page h2, .first-page h3 {
    font-size: 1.25rem !important;          /* Proper header hierarchy */
    margin-bottom: 1rem !important;         /* Designer minimum */
    line-height: 1.5 !important;            /* Readability compliance */
}

/* Question container - COMPACT VERSION for all questions */
.question-container {
    background-color: #FFFCF9;          /* Pergament - pur, zen background */
    border: 1px solid #F0ECE6;          /* Steinmehl - Borders */
    border-radius: 0.5rem;
    padding: 0.75rem 1rem !important;   /* Compact padding */
    margin-bottom: 0.75rem !important;  /* Reduced margin between questions */
    transition: all 0.3s ease;
}

/* Remove excess spacing after last answer option */
.question-container .form-group:last-child,
.question-container .answer-item:last-child,
.question-container .radio:last-child,
.question-container .checkbox:last-child {
    margin-bottom: 0 !important;        /* No margin after last answer */
    padding-bottom: 0 !important;       /* No padding after last answer */
}

/* Force minimal spacing after last radio/checkbox in any question */
.answer-item:last-of-type,
.radio:last-of-type,
.checkbox:last-of-type {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;      /* Remove line after last radio button */
    box-shadow: none !important;         /* Remove any shadow lines */
}

/* Specifically target radio button lines */
.radio:last-child::after,
.checkbox:last-child::after,
.answer-item:last-child::after {
    display: none !important;            /* Hide any pseudo-element lines */
}

/* Remove lines from radio input elements */
input[type="radio"]:last-of-type,
input[type="checkbox"]:last-of-type {
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Shorten the vertical line on the left side of radio buttons */
.question-container {
    position: relative;
    border-left: none !important;        /* Remove original left border */
}

/* Remove the vertical connecting line between radio buttons */
.radio-list::before,
.checkbox-list::before,
.list-radio::before,
.answers-list::before,
.answer-item::before,
.ls-answers::before,
ul.radio-list::before,
ul.checkbox-list::before,
.question-container ul::before,
.question-container .answers::before {
    display: none !important;            /* Hide connecting line */
    content: none !important;
}

/* Also target any pseudo-elements that create vertical lines */
.radio-item::before,
.radio-item::after,
.answer-item::after,
.ls-answers ul::before,
.ls-answers ul::after {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
}

/* Remove vertical lines created by borders */
.ls-answers ul,
.radio-list,
.checkbox-list,
.answers-list {
    border-left: none !important;
    position: relative;
}

/* Override any background images that create lines */
.ls-answers,
.radio-list,
.answer-item,
.radio-item {
    background-image: none !important;
}

/* Target LimeSurvey specific vertical line connectors */
.ls-answers .answer-item::before,
.radio-list .radio::before,
.list-radio li::before {
    display: none !important;
    background: none !important;
    border: none !important;
}

/* AGGRESSIVE REMOVAL of radio button connecting lines */
.radio::before,
.radio::after,
.checkbox::before, 
.checkbox::after,
li.radio::before,
li.radio::after,
.answer-item:not(:last-child)::after,
.ls-answers li::before,
.ls-answers li::after,
.list-radio li:not(:last-child)::after {
    display: none !important;
    height: 0 !important;
    content: '' !important;
    border: none !important;
    background: none !important;
}

/* Remove any SVG or background lines */
.ls-answers,
.list-radio,
ul.ls-answers,
ul.list-radio {
    background: none !important;
    background-image: none !important;
}

/* Specific targeting for vertical connector lines */
.ls-answers li {
    position: relative;
}

.ls-answers li::before,
.ls-answers li::after,
.list-radio li::before,
.list-radio li::after {
    content: none !important;
    display: none !important;
}

/* Remove pseudo-elements that create vertical lines between items */
li.answer-item:not(:last-child)::after,
.radio:not(:last-child)::after {
    display: none !important;
}

/* Override any inline styles - EXCEPT for scale containers and answer containers */
[style*="border-left"]:not(.scale-5point-fixed):not(.ls-answers):not(.list-radio):not(.answer-container),
[style*="border-right"]:not(.scale-5point-fixed):not(.ls-answers):not(.list-radio):not(.answer-container) {
    border-left: none !important;
    border-right: none !important;
}

/* ULTRA-COMPACT SPACING FOR ALL QUESTIONS */
.question-container,
.group-1 .question-container,
.first-page .question-container,
[id*="group-0"] .question-container,
.ls-group .question-container {
    padding: 0.75rem 0.75rem 0.05rem 0.75rem !important; /* Half the bottom padding */
    margin-bottom: 0.75rem !important;      /* Reduced margin for all */
    border: 1px solid #F0ECE6 !important;   /* Keep container borders */
    border-left: none !important;           /* Remove left border for shortened line */
    background: #FFFCF9 !important;         /* Consistent background */
    position: relative !important;          /* For pseudo-element positioning */
}

/* Ultra-compact radio buttons for ALL questions */
.answer-item,
.group-1 .answer-item,
.first-page .answer-item {
    padding: 0.05rem 0 !important;          /* Ultra compact for all questions */
    margin: 0.05rem 0 !important;           /* Ultra minimal margin for all */
}

/* ADJUSTED: Last answer item - vertical line ends HERE */
.answer-item:last-child,
.radio:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Compact radio labels for ALL questions */
.radio label,
.checkbox label,
.answer-item label,
.group-1 .radio label,
.first-page .radio label {
    font-size: 0.875rem !important;         /* 14px - WCAG compliance */
    margin-bottom: 0.1rem !important;       /* Compact spacing for all */
    padding: 0.2rem 0 !important;           /* Compact padding for all */
    line-height: 1.3 !important;            /* Tight line height for all */
}

/* Compact form group spacing for ALL questions */
.form-group,
.group-1 .form-group,
.first-page .form-group {
    margin-bottom: 0.25rem !important;      /* Compact spacing for all */
}

/* Progressive disclosure for small screens */
@media (max-height: 600px) {
    /* Show one question at a time on very small screens */
    .group-1 .question-container:not(:first-child),
    .first-page .question-container:not(:first-child) {
        display: none;
    }
    
    /* Add "Next Question" indicator */
    .group-1 .question-container:first-child::after,
    .first-page .question-container:first-child::after {
        content: "Frage 1 von 3";
        display: block;
        text-align: center;
        color: #CDC4BA;
        font-size: 0.75rem;
        margin-top: 0.5rem;
    }
}

/* Question header - NO BROWN BLOCKS + FORCE LEFT ALIGNMENT */
.question-header,
.question-title,
.survey-question-header,
.ls-question-header,
h3.question-title,
.question-text-container,
.survey-question h3,
.question-container h3,
div[class*="question-header"],
div[class*="question-title"],
h1, h2, h3, h4, h5, h6,
.survey-title,
.survey-description,
.ls-survey h1,
.ls-survey h2,
.ls-survey h3 {
    background: transparent !important; /* NO BROWN BACKGROUNDS */
    background-color: transparent !important; /* FORCE OVERRIDE */
    padding: 0 !important;              /* No padding around headers */
    margin-bottom: 0.05rem !important;  /* Ultra minimal spacing */
    color: #3C3530 !important; /* Schmiedeeisen text */
    text-align: left !important; /* Force left alignment */
}

.question-container:hover {
    box-shadow: 0 2px 8px rgba(60, 53, 48, 0.08);
}

/* Question text - Clean typography hierarchy */
.question-text {
    color: #3C3530 !important;          /* Schmiedeeisen - clear authority */
    font-size: 1.125rem !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;        /* Reduced from 1.5 to minimize vertical space */
    margin-top: 0 !important;
    margin-bottom: 0 !important;        /* Zero margin - all spacing controlled below */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    text-align: left !important;        /* Force left alignment */
    width: 100% !important;             /* Full width */
    max-width: none !important;         /* Remove any max-width restrictions */
    display: block !important;          /* Block to use full width */
    word-break: break-word !important;  /* FIXED: Allow word breaking for long words */
    -webkit-hyphens: auto !important;   /* FIXED: Enable hyphenation - Safari */
    -moz-hyphens: auto !important;      /* FIXED: Enable hyphenation - Firefox */
    -ms-hyphens: auto !important;       /* FIXED: Enable hyphenation - IE */
    hyphens: auto !important;           /* FIXED: Enable hyphenation */
    overflow-wrap: break-word !important; /* FIXED: Break long words anywhere if needed */
    white-space: normal !important;     /* Allow wrapping but naturally */
}

/* Ensure parent containers don't add spacing */
.question-text-container,
.question-title-container,
h3.question-text,
div.question-text,
.ls-question-text-container {
    width: 100% !important;
    max-width: none !important;
    display: block !important;
    overflow: visible !important;
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;   /* ONLY spacing: consistent 8px to answers */
    padding: 0 !important;
    padding-top: 0 !important;          /* Explicit override theme.css padding-top: 1em */
    padding-bottom: 0 !important;       /* Explicit override theme.css padding-bottom: 1em */
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* NUCLEAR OPTION: Completely neutralize intermediate containers */
.question-help-container,
.question-valid-container,
.question-valid-message,
.ls-question-help-container,
div[class*="question-help"],
div[class*="question-valid"],
.bg-primary.question-help-container,
.bg-primary.question-valid-container,
div.question-help-container.col-12,
div.question-valid-container.col-12 {
    display: none !important;
    visibility: hidden !important;
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    line-height: 0 !important;
    border: none !important;
    border-width: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    position: absolute !important;
    left: -9999px !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

/* Question help text */
.question-help {
    color: #B8654F;                     /* Kastanie-Hell - gentle guidance */
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

/* Answer options - COMPACT for all questions */
.answer-item {
    padding: 0.15rem 0 !important;       /* Much tighter spacing */
    margin: 0.1rem 0 !important;         /* Minimal margin */
}

/* Radio button labels - compact */
.radio label,
.checkbox label {
    font-weight: 400;
    margin-bottom: 0.1rem !important;    /* Minimal spacing */
    padding: 0.25rem 0 !important;       /* Reduced padding */
    line-height: 1.3 !important;         /* Tighter line height */
}

.answer-item label {
    font-weight: 400;
    cursor: pointer;
    transition: color 0.2s ease;
    padding: 0.2rem 0 !important;       /* Compact padding */
    margin: 0.1rem 0 !important;        /* Minimal margin */
    line-height: 1.3 !important;        /* Tighter line height */
}

.answer-item label:hover {
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers (no kastanie) */
    opacity: 0.7;
}

/* Selected answer option styling */
.answer-item input[type="radio"]:checked + label {
    color: #8B4A3B;                     /* Kastanie-Mittel - selection confirmation */
    font-weight: 500;
}

/* Help text */
.help-block {
    color: #B8654F;                     /* Kastanie-Hell - Helper Text (ghidare caldă) */
    font-size: 0.875rem;
    margin-top: 0.5rem;
}

/* Survey navigation */
.survey-nav {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid var(--alpine-border);
}

/* Compact navigation for ALL questions */
.survey-nav {
    margin-top: 0.75rem !important;     /* Reduced from 2rem */
    padding-top: 0.75rem !important;    /* Reduced from 2rem */
}

/* Extra compact for first group */
.group-1 .survey-nav,
.first-page .survey-nav {
    margin-top: 0.5rem !important;
    padding-top: 0.5rem !important;
}

/* Remove extra spacing from radio groups */
.radio-list,
.checkbox-list {
    margin-bottom: 0.25rem !important;  /* Minimal spacing after options */
}

/* ============================================
   TABLES
   ============================================ */
.table {
    background-color: #FFFCF9;          /* Pergament - pur, zen background */
}

.table > thead > tr > th {
    background-color: #F9F6F1;          /* Morgenreif - Section Background */
    border-bottom: 2px solid #F0ECE6;   /* Steinmehl - Borders */
    color: #3C3530;                     /* Schmiedeeisen - Questions & Answers */
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
}

.table > tbody > tr > td {
    border-bottom: 1px solid #F0ECE6;   /* Steinmehl - Borders */
    padding: 1rem;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #F9F6F1;          /* Morgenreif - Section Background */
}

.table-hover > tbody > tr:hover {
    background-color: rgba(139, 74, 59, 0.05);
}

/* ============================================
   FOOTER
   ============================================ */
.footer {
    background-color: var(--alpine-muted);
    border-top: 1px solid var(--alpine-border);
    color: var(--alpine-muted-foreground);
    padding: 2rem 0;
    margin-top: 3rem;
}

/* ============================================
   UTILITY CLASSES
   ============================================ */
/* Text colors */
.text-primary { color: var(--alpine-primary) !important; }
.text-secondary { color: var(--alpine-secondary) !important; }
.text-success { color: var(--alpine-accent) !important; }
.text-danger { color: var(--alpine-danger) !important; }
.text-muted { color: var(--alpine-muted-foreground) !important; }

/* Background colors */
.bg-primary { background-color: var(--alpine-primary) !important; }
.bg-secondary { background-color: var(--alpine-secondary) !important; }
.bg-success { background-color: var(--alpine-accent) !important; }
.bg-muted { background-color: var(--alpine-muted) !important; }

/* CRITICAL FIX: Override padding for .bg-primary on question containers */
.bg-primary.question-title-container,
.bg-primary.question-text-container,
div.bg-primary.col-12.question-title-container {
    padding: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 0.5rem !important;
}

/* CRITICAL FIX: Remove margin from ALL children inside question-title-container */
.question-title-container *,
.question-title-container p,
.question-title-container .text-base,
.question-title-container h3,
.bg-primary.question-title-container * {
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Borders */
.border-primary { border-color: var(--alpine-primary) !important; }
.border-secondary { border-color: var(--alpine-secondary) !important; }
.border-muted { border-color: var(--alpine-border) !important; }

/* ============================================
   ANIMATIONS & TRANSITIONS
   ============================================ */
/* Fade in animation */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-in {
    animation: fadeIn 0.5s ease-out;
}

/* Focus ring */
*:focus {
    outline: none;
}

*:focus-visible {
    outline: 2px solid var(--alpine-secondary);
    outline-offset: 2px;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* ============================================
   RESPONSIVE ADJUSTMENTS
   ============================================ */
@media (max-width: 768px) {
    body {
        padding-top: 60px;
    }
    
    .btn {
        padding: 0.625rem 1.5rem;
    }
    
    .panel-body,
    .question-container {
        padding: 1rem;
    }
    
    h1, .h1 { font-size: 2rem; }
    h2, .h2 { font-size: 1.75rem; }
    h3, .h3 { font-size: 1.5rem; }
}

/* ============================================
   LIMESURVEY SPECIFIC OVERRIDES - NO KASTANIE BLOCKS
   ============================================ */

/* Hide LimeSurvey header completely and remove all top spacing */
.navbar,
.survey-header,
.ls-survey-header,
header,
.header,
.top-header,
.survey-navigation,
#lime-survey-header,
.progress-wrapper,
.survey-progress-bar,
.language-changer,
.container-fluid {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Force remove all top spacing from LimeSurvey */
html, body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Remove top spacing from survey wrapper */
.survey-wrapper,
.ls-survey,
#limesurvey {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* FORCE ALL TEXT TO BE LEFT-ALIGNED */
* {
    text-align: left !important;
}

/* Specific LimeSurvey elements that might be centered */
.survey-container *,
.ls-survey *,
.question-container *,
.survey-question *,
div[id*="question"] *,
.group-container *,
p, span, div, h1, h2, h3, h4, h5, h6 {
    text-align: left !important;
}

/* Add JavaScript for text replacement */

/* Eliminate ALL kastanie background blocks from survey questions */
.ls-answers,
.question-container,
.answer-container,
.survey-question,
.ls-survey .question-container,
.questionhelp,
.survey-question-text,
div[id*="question"],
.question,
.group-container,
.ls-question,
h1, h2, h3, h4, h5, h6 {
    background: transparent !important;
    background-color: transparent !important;
}

/* Force remove any kastanie backgrounds */
*[style*="background"] {
    background: transparent !important;
}

/* Specific LimeSurvey question selectors */
.ls-survey .question-header,
.ls-survey .question-title,
.ls-survey h3,
.survey-question-header,
.question-text-header {
    background: transparent !important;
    background-color: transparent !important;
    color: #3C3530 !important;
    padding: 0 !important;
    margin: 0 0 1rem 0 !important;
}

/* ============================================
   CUSTOM COMPONENTS
   ============================================ */
/* Badge component */
.badge {
    background-color: var(--alpine-secondary);
    color: var(--alpine-background);
    font-weight: 500;
    font-size: 0.75rem;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.badge-primary { background-color: var(--alpine-primary); }
.badge-success { background-color: var(--alpine-accent); }
.badge-danger { background-color: var(--alpine-danger); }

/* Breadcrumb */
.breadcrumb {
    background-color: var(--alpine-muted);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
}

.breadcrumb > li + li:before {
    color: var(--alpine-muted-foreground);
}

/* Pagination */
.pagination > li > a,
.pagination > li > span {
    color: var(--alpine-secondary);
    background-color: var(--alpine-background);
    border: 1px solid var(--alpine-border);
    transition: all 0.2s ease;
}

.pagination > li > a:hover,
.pagination > li > span:hover {
    color: var(--alpine-background);
    background-color: var(--alpine-secondary);
    border-color: var(--alpine-secondary);
}

.pagination > .active > a,
.pagination > .active > span {
    color: var(--alpine-background);
    background-color: var(--alpine-primary);
    border-color: var(--alpine-primary);
}

/* Loading spinner */
.spinner {
    border: 3px solid var(--alpine-muted);
    border-top: 3px solid var(--alpine-secondary);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Survey list specific */
.surveys-list {
    background-color: var(--alpine-background);
}

.surveys-list .list-group-item {
    background-color: var(--alpine-background);
    border: 1px solid var(--alpine-border);
    transition: all 0.3s ease;
}

.surveys-list .list-group-item:hover {
    background-color: var(--alpine-muted);
    transform: translateX(4px);
}

/* Print styles */
@media print {
    body {
        background-color: white;
        color: black;
    }
    
    .btn, .navbar, .footer {
        display: none !important;
    }
}

/* ============================================
   5-POINT SCALE RADIO BUTTONS - COMPREHENSIVE FIX
   ============================================ */

/* Import DEFINITIVE scale fix - CSS Grid approach */
/* Enhanced Scale Grid Fix - Import at top for proper cascade */
@import url('scale-grid-fix.css');

/* REMOVED - Broad scale container styles that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Individual scale item styles that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Radio button styles that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Label styles that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Hover and selected state styles that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Responsive adjustments that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */

/* REMOVED - Additional scale styling that affected all radio lists
   Now handled specifically by scale-grid-fix.css for confirmed 5-point scales only */


/* ============================================
   IFRAME HEIGHT OPTIMIZATION
   For embedding in main website
   CRITICAL: Must be at END of file for maximum priority
   ============================================ */

/* Eliminate ALL space before main content - minimal 8px breathing room */
html body {
    padding-top: 0 !important;          /* Remove 145px from theme.css */
    margin-top: 0 !important;
}

/* Minimal container padding at top */
.survey-container,
.group-container,
.top-container,
.group-outer-container {
    padding-top: 0.5rem !important;     /* Only 8px breathing room */
    margin-top: 0 !important;
}

/* Reduce spacing above and below main title - but NOT question text */
h1:not(.question-text), .h1:not(.question-text),
h2:not(.question-text), .h2:not(.question-text),
h3:not(.question-text), .h3:not(.question-text) {
    margin-top: 0.5rem !important;      /* Minimal 8px above title */
    margin-bottom: 1rem !important;     /* Reduced from 4rem (~48px saved) */
}

/* =============================================================================
   MOBILE TEXT WRAP FIX - Target h3 question titles correctly
   Restores functional solution from mobile-force-break-20251028-123657.zip
   ============================================================================= */

/* TARGETED FIX: Enable text wrapping for h3 elements in question containers
   This catches question titles that don't have the .question-text class */
.question-container h3,
.question-title-container h3,
.question-text-container h3,
div[class*="question"] h3,
h3.question-title {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: none !important;
}

/* FORCE BREAK on mobile: If text exceeds ~280px width, force line break
   Measured: "Eine Lösung die nahtlos mit Ihrer" = ~280px on mobile */
@media screen and (max-width: 768px) {
    .question-container h3,
    .question-title-container h3,
    .question-text-container h3,
    div[class*="question"] h3,
    h3.question-title,
    .question-text,
    [class*="question-title"],
    [class*="question-text"] {
        max-width: 100% !important;
        width: 100% !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        hyphens: auto !important;
        -webkit-hyphens: auto !important;
        display: block !important;
    }
}

/* Reduce overall survey container spacing */
.survey-container {
    padding: 1rem !important;           /* Reduced from 2rem */
}

/* Compact mode for answer options */
.answer-item {
    padding: 0.25rem 0 !important;      /* Reduced from 0.5rem */
}

/* Tighter radio button spacing */
.radio label,
.checkbox label {
    margin-bottom: 0.25rem !important;
    padding: 0.25rem 0 !important;
}

/* Reduce form group spacing */
.form-group {
    margin-bottom: 0.75rem !important;
}

/* Compact survey navigation */
.survey-nav {
    margin-top: 1rem !important;        /* Reduced from 2rem */
    padding-top: 1rem !important;       /* Reduced from 2rem */
}

/* Smaller buttons for compact view */
.btn {
    padding: 0.5rem 1.5rem !important;  /* Reduced from 0.75rem 2rem */
}

/* ============================================
   SHORTEN VERTICAL LINE - Make container fit content exactly
   ============================================ */

/* Make answer-container height match its content exactly */
.answer-container {
    /* Keep border-left as is - DON'T remove it */
    border-width: 0px 0px 0px 1px !important; /* Only left border, no right */
    padding-top: 0 !important;          /* No space at top - consistent spacing */
    padding-bottom: 0 !important;       /* No space at bottom */
    display: flex !important;           /* Flexbox makes container fit content */
    flex-direction: column !important;  /* Stack children vertically */
    /* CRITICAL FIX: Include borders in width calculation to prevent right border from being pushed outside viewport */
    box-sizing: border-box !important;  /* Borders included in width, not added to it */
    width: 100% !important;             /* Ensure container fits viewport */
    max-width: 100% !important;         /* Prevent overflow beyond viewport */
}

/* Ensure ls-answers fills container without extra space */
.answer-container .ls-answers {
    padding-top: 0 !important;          /* Remove 15px from theme.css - consistent spacing */
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    flex: 0 0 auto !important;          /* Don't grow, don't shrink */
}

/* Remove any extra space from ul inside */
.answer-container .ls-answers ul {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-left: none !important;       /* Remove left border from ul */
    border-left-width: 0 !important;    /* Force zero width */
}

/* Add extra padding for dropdown questions only */
.answer-container .ls-answers select,
.answer-container select.form-control {
    margin-bottom: 10px !important;     /* Extra 10px spacing below dropdown */
}

/* Fix for scale 1-5 question text wrapping */
.ls-label-question {
    text-wrap: wrap !important;
}