/* ========================================================================
   BayZiel OJS Stylesheet (DSGVO-konform / Cross-Platform-Optimized)
   
   Vorlage IJBiotech stylesheet by Joaquim Baeta, 
   https://github.com/jaybaeta/ojs-stylesheets/blob/master/ijbiotech/2019-01-26.css

   Ver 1.0; 24.10.2026, Erstellt mit Gemini AI
   (c) 2026 Marco Winzker, BayZiel
   ======================================================================== */

/* 1. Typografie & System-Font-Stacks */
html, body {
    font-size: 15px;
    /* Maßgeschneiderter Stack: Apple (San Francisco) -> Windows (Segoe UI) -> Android (Roboto) */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    background-color: #F8F9FA;
    color: #2D3748;
    
    /* Plattformübergreifendes Schriftrendering & Antialiasing */
    -webkit-font-smoothing: antialiased; /* macOS / iOS Smooth Rendering */
    -moz-osx-font-smoothing: grayscale;  /* Firefox auf Mac */
    text-rendering: optimizeLegibility;  /* Aktiviert Ligaturen auf allen Plattformen */
}

h1, h2, h3, h4, h5, h6 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    color: #0A3254; /* BayZiel Primärblau */
    font-weight: 700;
}

h1 { font-size: 2.2rem !important; }
h2 { font-size: 1.7rem !important; }
h3 { font-size: 1.4rem !important; }

#header h1 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-weight: 600 !important;
    font-size: 2em;
    color: #FFFFFF;
    padding: 20px !important;
    margin-top: 0;
}

/* Links mit systemunabhängiger, flüssiger Transition */
a:link, a:visited {
    color: #0A3254;
    text-decoration: none;
    transition: color 0.25s ease-in-out;
}

a:hover {
    color: #64A732 !important; /* BayZiel Akzentgrün */
}

p {
    line-height: 1.6;
    text-align: left;
}

/* 2. Struktur & Layout */
#container {
    width: 100% !important;
    min-width: 280px !important;
    background-color: #FFFFFF;
}

#body {
    background-color: #FFFFFF;
    width: 1140px !important;
    margin: 0 auto;
}

/* Performance-optimierte Media-Queries für mobile Betriebssysteme */
@media (max-width: 1140px) {
    #body { width: 100% !important; }
    #main { width: 75%; }
}

@media (max-width: 767px) {
    #body {
        display: flex;
        flex-direction: column;
    }
    #main {
        order: 1;
        width: 100%;
    }
}

#main > h2, #content {
    padding-left: 15px !important;
}

/* 3. Header & Navigation */
#header {
    background-color: #0A3254;
}

#navbar {
    background-color: #0A3254;
    margin-bottom: 30px;
    width: 1140px;
}

#navbar a, #navbar a:link, #navbar a:visited {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #FFFFFF;
    transition: all 0.25s ease-in-out;
}

#navbar a:hover {
    background-color: #0F426F;
    color: #64A732;
}

@media (max-width: 1140px) {
    #navbar { width: 100vw; }
}

/* 4. Breadcrumbs */
#breadcrumb {
    margin: 0 12px 1em 15px;
    padding: 0 0 0.5rem 0;
    border-bottom: 1px solid #E2E8F0;
    color: #718096;
    font-size: 0.9rem;
}

#breadcrumb a {
    color: #718096;
}

#breadcrumb a:hover {
    color: #0A3254 !important;
}

/* 5. Sidebar */
ul.sidemenu {
    padding-left: 0px !important;
}

ul.sidemenu li a {
    display: block;
    padding: 0.5rem 0.8rem;
    border-bottom: 1px solid #E2E8F0;
    background-color: #FFFFFF;
    color: #0A3254;
}

ul.sidemenu li a:hover {
    background-color: #F8F9FA;
    color: #64A732;
}

#leftSidebar div.block span.blockTitle, 
#rightSidebar div.block span.blockTitle {    
    padding: 0 0 10px 0;
    border-bottom: 2px solid #64A732;
    color: #0A3254;
    font-size: 1.15em;
    font-weight: 700;
}

#rightSidebar {
    width: 220px;
    padding-left: 20px;
    margin-top: 40px;
}

@media (max-width: 767px) {
    #sidebar { order: 2; }
    #rightSidebar {
        width: 100%;
        padding: 20px;
    }
}

/* 6. Buttons & Eingabefelder (Bereinigt von plattformspezifischen OS-Standard-Styles) */
.btn-ijb, input[type="submit"], input[type="button"] {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 4px;
    background-color: #0A3254;
    color: #FFFFFF !important;
    font-weight: 400;
    border: none;
    transition: background-color 0.25s ease-in-out;
    cursor: pointer;
    /* Verhindert unschöne native Ausseh-Overlays auf Android/iOS */
    -webkit-appearance: none;
    appearance: none; 
}

.btn-ijb:hover, input[type="submit"]:hover, input[type="button"]:hover {
    background-color: #64A732 !important;
}

input.textField, select.selectMenu, textarea.textArea, input.uploadField {
    border-radius: 4px;
    padding: .5em;
    border: 1px solid #CBD5E0;
    color: #4A5568;
    background-color: #FFFFFF;
    -webkit-appearance: none;
    appearance: none;
}

/* 7. Table of Contents */
.tocArticle {
    width: 100%;
    padding: 15px 0;
    border-bottom: 1px solid #E2E8F0;
}

.tocAuthors {
    color: #718096;
    font-size: 0.95rem;
}

/* 8. Trennlinien & Boxen */
.separator {
    border-bottom: 1px solid #E2E8F0 !important;
}

.object-description-left {
    text-align: right;
    border-right: 2px solid #64A732; 
    padding-right: 10px;
    font-weight: bold;
    color: #0A3254;
}

/* Zustandsboxen mit hoher Lesbarkeit und plattformunabhängigem Kontrast */
.warn    { background: #FEFCBF; color: #744210; padding: 10px; border-radius: 4px; }
.note    { background: #EBF8FF; color: #2B6CB0; padding: 10px; border-radius: 4px; }
.error   { background: #FED7D7; color: #9B2C2C; padding: 10px; border-radius: 4px; }
.correct { background: #C6F6D5; color: #22543D; padding: 10px; border-radius: 4px; }

/* 9. Footer */
#footer {
    border-top: 3px solid #64A732;
    padding: 20px 0;
    background-color: #FFFFFF;
}