/* Gemeinsame Styles für OCI Tester */

/* OCI Tester Layout */
.oci-tester-content {
    padding: 60px 0;
    background-color: #f8f9fa;
}

.oci-tester-form-container, .oci-tester-container {
    max-width: 800px;
    margin: 0 auto;
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

.oci-tester-container {
    max-width: 1200px;
}

/* Form Styles */
.form-group { margin-bottom: 25px; }
label { display: block; font-weight: 600; margin-bottom: 8px; color: #00121e; }
input[type="text"], select { 
    width: 100%; 
    padding: 12px; 
    border: 1px solid #ced4da; 
    border-radius: 4px; 
    box-sizing: border-box;
    font-size: 16px;
}

.info-box { 
    background-color: #eef2f5; 
    padding: 20px; 
    border-radius: 4px; 
    margin-bottom: 30px; 
    border-left: 4px solid #00121e;
}

code { background: #fff; padding: 4px 8px; border-radius: 3px; border: 1px solid #ddd; word-break: break-all; }

/* Button Styles */
.btn-submit { 
    background-color: #00121e; 
    color: white; 
    padding: 15px 30px; 
    border: none; 
    border-radius: 4px; 
    cursor: pointer; 
    font-weight: 600;
    font-size: 16px;
    transition: background-color 0.3s;
}
.btn-submit:hover { background-color: #002a45; }

.btn-print { 
    display: inline-block; 
    margin-top: 30px; 
    margin-right: 10px;
    background-color: #bccf00;
    color: #fff; 
    padding: 12px 25px; 
    border-radius: 4px; 
    text-decoration: none; 
    font-weight: 600; 
    border: none;
    cursor: pointer;
    vertical-align: middle;
    line-height: 1.5;
    height: 50px;
    box-sizing: border-box;
}
.btn-print:hover { background-color: #bccf00; color: #fff; text-decoration: underline; }

.btn-back { 
    display: inline-block; 
    margin-top: 30px; 
    background-color: #00121e; 
    color: #fff; 
    padding: 12px 25px; 
    border-radius: 4px; 
    text-decoration: none; 
    font-weight: 600;
    vertical-align: middle;
    line-height: 1.5;
    height: 50px;
    box-sizing: border-box;
}
.btn-back:hover { background-color: #002a45; color: #fff; }

/* Typography */
h1.oci-title, h1, h2 { margin-bottom: 30px; color: #00121e; font-size: 32px; font-weight: 700; }
h2 { font-size: 24px; margin-top: 40px; margin-bottom: 20px; }

/* Feedback Messages */
.error { color: #721c24; background-color: #f8d7da; border: 1px solid #f5c6cb; padding: 15px; border-radius: 4px; margin-bottom: 25px; }
.success { color: #fff; background-color: #bccf00; border: none; padding: 15px; border-radius: 4px; margin-bottom: 25px; }

/* Table Styles */
table { width: 100%; border-collapse: collapse; margin-top: 20px; }
th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
th { background-color: #00121e; color: #fff; }
.empty-field { color: #999; font-style: italic; }
.required-missing { color: #fff; background-color: #dc3545; padding: 2px 6px; border-radius: 3px; font-weight: bold; font-size: 12px; }
pre { background: #f4f4f4; padding: 15px; border-radius: 4px; overflow-x: auto; border: 1px solid #ddd; }

/* Tooltip Styles */
.info-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    background-color: #00121e;
    color: #fff;
    border-radius: 50%;
    font-size: 10px;
    font-family: serif;
    font-weight: bold;
    cursor: help;
    margin-right: 8px;
    position: relative;
    vertical-align: middle;
}
.info-i:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 10px;
    background-color: #333;
    color: #fff;
    padding: 8px 12px;
    border-radius: 4px;
    white-space: nowrap;
    z-index: 100;
    font-weight: normal;
    font-size: 14px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* Print Styles */
@media print {
    .btn-back, .btn-print, .no-print, .info-i, .footerLegalNavigation, .footerCopyright { display: none !important; }
    body { background-color: #fff !important; }
    .oci-tester-content { padding: 0 !important; background-color: #fff !important; }
    .oci-tester-container { box-shadow: none !important; padding: 0 !important; width: 100% !important; max-width: none !important; }
    header { border-bottom: 2px solid #00121e; padding-bottom: 10px; margin-bottom: 30px; }
    header img { filter: grayscale(0) !important; }
    .headerLogo { display: block !important; }
    .headerMain { border: none !important; }
    table { page-break-inside: auto; }
    tr { page-break-inside: avoid; page-break-after: auto; }
    thead { display: table-header-group; }
    h1, h2 { color: #00121e !important; }
    .success { border: 1px solid #bccf00 !important; color: #000 !important; background-color: #f8fff0 !important; }
    .error { border: 1px solid #dc3545 !important; color: #000 !important; }
    .required-missing { color: #dc3545 !important; background: none !important; border: 1px solid #dc3545 !important; }
    th { background-color: #eee !important; color: #000 !important; border: 1px solid #ddd !important; }
    td { border: 1px solid #ddd !important; }
}