/* 
 * Custom Styles - Converted from inline styles for CSP compliance
 * Generated on 2026-02-10
 */

/* Card Headers */
.card-header-white {
    background-color: white !important;
    font-size: 24px !important;
}

/* Table Column Widths */
.table-col-width-15 { width: 15%; }
.table-col-width-7 { width: 7%; }
.table-col-width-10 { width: 10%; }
.table-col-width-12em { width: 12em; }
.table-col-width-10em { width: 10em; }
.table-col-width-15em { width: 15em; }
.table-full-width { width: 100%; }

/* Button Styles */
.btn-submit-primary {
    width: 20% !important;
    font-family: calibri !important;
}

.btn-submit-wide {
    width: 50% !important;
    font-family: calibri !important;
}

/* Layout Margin */
.layout-main-container {
    margin-top: 5rem !important;
}

/* Text Helpers */
.text-italic-helper {
    font-style: italic;
    margin-left: 5px;
}

.text-small-12px {
    font-size: 12px;
}

.text-small-14px {
    font-size: 14px;
}

.text-justify {
    text-align: justify;
}

/* Background Colors */
.bg-light-gray {
    background-color: #F2F2F2;
}

/* Icon Colors */
.icon-error-red {
    color: #cc0000 !important;
}

.icon-success-green {
    color: #00a803 !important;
}

.icon-primary-green {
    color: #0f8f47 !important;
}

.icon-dark-blue {
    color: #213250 !important;
}

.icon-green {
    color: green !important;
}

.icon-red {
    color: red !important;
}

/* Lock Icon Dynamic Colors */
.lock-icon-dynamic {
    font-size: 1.25em;
}

/* Notification Badge */
.notification-badge-tomato {
    background: Tomato !important;
    font-weight: 900 !important;
}

/* Progress Bar */
.progress-thin {
    height: 7px;
}

.progress-bar-80 {
    width: 80%;
}

/* Report Header */
.report-header-margin {
    margin-bottom: 5px;
}

/* Email Styles */
.email-reset-button {
    width: 300px;
    text-align: center;
    padding: 12px 70px;
    background-color: #0E61C1;
    border-radius: 5px;
    color: white;
    text-decoration: none;
    margin-bottom: 50px;
}

.email-code-box {
    width: 300px;
    text-align: center;
    padding: 8px;
    background-color: #E7F2FF;
}

/* Toggle Buttons */
.toggle-button-pointer {
    cursor: pointer;
}

/* Landing Page Buttons */
.landing-btn-register {
    text-decoration: none !important;
    color: white !important;
    width: 20% !important;
    font-family: arial !important;
}

.landing-btn-login {
    text-decoration: none !important;
    color: white !important;
    width: 20% !important;
    font-family: arial !important;
}

.landing-card-link {
    text-decoration: none;
    color: inherit;
}

.landing-arrow-icon {
    color: green;
    transform: scale(1.5,1);
}

/* File Input Hidden */
.file-input-hidden {
    display: none;
}

/* Validation Indicators */
.validation-indicator-hidden {
    display: none;
    color: red;
    font-weight: bold;
}

.validation-indicator-red {
    color: red;
}

/* Lock Icon Colors */
.lock-icon-open {
    color: #0f8f47 !important;
}

.lock-icon-locked {
    color: #d10000 !important;
}

/* Mobile Indicator */
.mobile-indicator-error {
    display: none;
    color: red;
    font-weight: bold;
}

/* Required Field Asterisk */
.required-asterisk {
    color: red;
}

/* Editor Hidden (for commented styles) */
.editor-hidden {
    display: none;
}

.editor-height-15vh {
    height: 15vh;
}

.editor-height-10vh {
    height: 10vh;
}

/* Container Margins */
.container-margin-auto {
    margin: auto;
}

/* Table Striped Full Width */
.table-striped-full {
    width: 100%;
}

/* Visitor Counter */
.visitor-counter-green {
    color: green;
}

/* Settings Label Styles */
.settings-label-green {
    color: green !important;
    font-weight: bold;
}

.settings-description {
    text-align: justify;
    font-size: 14px;
}

/* Table Header Styles */
.table-header-gray {
    font-weight: 500 !important;
    background-color: #7C7C7C !important;
    vertical-align: middle !important;
    color: white !important;
}

.table-header-dark-gray {
    background-color: #858585 !important;
    color: white !important;
    vertical-align: middle !important;
}

/* Assessment Table Styles */
.assessment-row-white-text {
    color: white !important;
    font-size: 10px;
}

.assessment-header-gray {
    background-color: #858585 !important;
    color: white !important;
    text-align: center;
    vertical-align: middle;
}

/* Form Control Widths */
.form-control-20 {
    width: 20% !important;
}

/* Button Color Override */
.btn-primary-white-text {
    color: white !important;
}

/* Text Color Utilities */
.text-color-gray {
    color: #3D3D3D !important;
}

/* Scrollable Content */
.scrollable-20vh {
    max-height: 20vh;
    overflow-y: scroll;
}

.scrollable-50vh {
    max-height: 50vh;
    overflow-y: scroll;
}

/* Font Sizes */
.text-8px { font-size: 8px; }
.text-9px { font-size: 9px; }
.text-10px { font-size: 10px; }
.text-11px { font-size: 11px; }
.text-16px { font-size: 16px; }
.text-24px { font-size: 24px; }
.text-28px { font-size: 28px; }
.text-30px { font-size: 30px; }
.text-36px { font-size: 36px; }

/* Background Colors */
.bg-light-gray-f0 {
    background-color: #F0F0F0;
}

.bg-gray-858585 {
    background-color: #858585;
}

/* Width Utilities */
.width-10 { width: 10%; }
.width-30 { width: 30%; }
.width-40 { width: 40%; }
.width-50 { width: 50%; }
.width-53 { width: 53%; }
.width-5 { width: 5%; }
.width-7 { width: 7%; }

/* Height Utilities */
.height-20px { height: 20px; }
.height-30px { height: 30px; }
.height-30px { height: 30px; }

/* Display Utilities */
.display-none { display: none; }
.display-block { display: block; }
.display-true { display: true; }

/* Text Colors */
.text-white { color: white; }
.text-color-fff { color: #fff; }
.text-color-111 { color: #111; }
.text-color-667 { color: #666; }

/* Font Weight */
.font-weight-bold { font-weight: bold; }
.font-weight-500 { font-weight: 500; }

/* Text Alignment */
.text-center { text-align: center; }

/* Font Family */
.font-calibri { font-family: calibri; }

/* Cursor */
.cursor-pointer { cursor: pointer; }

/* Specific Color Combinations */
.text-white-bg-858585 {
    color: white;
    background-color: #858585;
    text-align: center;
    vertical-align: middle;
}

.font-28px-white {
    font-size: 28px;
    color: #fff;
}

.text-color-ffcf35 {
    color: #FFCF35;
}

.text-11px-white {
    font-size: 11px;
    color: #fff;
}

.text-12px-white {
    font-size: 12px;
    color: white;
}

.expired-text-white {
    color: white;
}