/* ==========================================================================
   UPLOAD FORM (100% Theme Independent Compact UI)
   ========================================================================== */
.bp-ocr-container {
    display: block !important;
    margin: 40px auto !important; 
    padding: 30px !important; 
    background-color: #212121 !important; 
    color: #ffffff !important; 
    border-radius: 10px !important;
    border: 1px solid #333333 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    box-sizing: border-box !important;
}

.bp-ocr-container h3 {
    margin: 0 0 20px 0 !important;
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

/* Explicit element margins to control gaps without relying on Flexbox */
.bp-ocr-container input[type="text"],
.bp-ocr-container input[type="file"] {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important; 
    padding: 12px 14px !important;
    border: 1px solid #444444 !important;
    border-radius: 6px !important;
    background-color: #2f2f2f !important;
    color: #ffffff !important;
    font-size: 14px !important;
    height: auto !important;
    line-height: normal !important;
    box-shadow: none !important;
}

.bp-ocr-container input:focus {
    border-color: #3b82f6 !important;
    outline: none !important;
}

.bp-ocr-container input[type="file"] {
    cursor: pointer !important;
}

.bp-ocr-container button#bp_send_btn {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 8px 0 0 0 !important; 
    padding: 14px 20px !important;
    background-color: #3b82f6 !important; /* Unified Standard Blue */
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 15px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    text-align: center !important;
    line-height: normal !important;
    transition: background-color 0.2s ease !important;
}

.bp-ocr-container button#bp_send_btn:hover {
    background-color: #2563eb !important; /* Unified Hover Blue */
}

/* Strict Theme Resets to hide injected garbage */
.bp-ocr-container br,
.bp-ocr-container p:empty {
    display: none !important;
}

.bp-ocr-container p {
    margin: 0 !important;
    padding: 0 !important;
}

.bp-ocr-container #bp_form_msg {
    margin-top: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;
    font-size: 14px !important;
}


/* ==========================================================================
   ADMIN DASHBOARD & FRONTEND TABLE (Verification & Received Data)
   ========================================================================== */
.bp-ocr-admin-dash,
.bp-ocr-frontend-table-container {
    margin: 40px auto; 
    padding: 35px; 
    background-color: #212121 !important; 
    color: #ffffff !important; 
    border-radius: 12px;
    border: 1px solid #333333;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    box-sizing: border-box;
}

.bp-ocr-admin-dash h3,
.bp-ocr-frontend-table-container h3 {
    margin-top: 0;
    margin-bottom: 25px;
    color: #ffffff !important;
    font-size: 22px;
    font-weight: 600;
    border-bottom: 1px solid #333333;
    padding-bottom: 15px;
}

.bp-table-responsive-wrapper {
    overflow-x: auto;
    width: 100%;
}

.bp-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}

.bp-table th, .bp-table td {
    padding: 14px 15px;
    border-bottom: 1px solid #333333;
    text-align: left;
    font-size: 14px;
    color: #ffffff;
}

.bp-table th {
    background-color: #171717;
    font-weight: 600;
    color: #ffffff;
}

.bp-table tr:hover td {
    background-color: #2f2f2f;
}

.dash-section input[type="date"],
.dash-section input[type="file"],
.dash-section input[type="password"],
.bp-front-filter-form input,
.bp-admin-filter-form input {
    display: block; 
    width: 100%; 
    margin-bottom: 16px; 
    padding: 12px 14px;
    border: 1px solid #444444;
    border-radius: 6px;
    background-color: #2f2f2f !important; 
    color: #ffffff !important; 
    font-size: 14px;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.dash-section input:focus,
.bp-front-filter-form input:focus,
.bp-admin-filter-form input:focus {
    border-color: #3b82f6;
    outline: none;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3);
    background-color: #212121 !important;
}

::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

.bp-admin-filter-form {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}
.bp-admin-filter-form input,
.bp-admin-filter-form button,
.bp-admin-filter-form a {
    margin-bottom: 0 !important;
}

.bp-front-filter-form {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    align-items: center;
}
.bp-front-filter-form input {
    flex: 1;
    min-width: 130px;
    margin-bottom: 0 !important; 
}
.bp-front-filter-form input[type="text"] {
    flex: 2;
    min-width: 180px;
}

.dash-section button,
.bp-btn-primary {
    background-color: #3b82f6 !important; 
    color: #ffffff !important; 
    border: none; 
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer; 
    border-radius: 6px; 
    display: inline-block;
    transition: all 0.2s ease;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 10px;
}

.dash-section button:hover,
.bp-btn-primary:hover {
    background-color: #2563eb !important;
    opacity: 0.9;
}

.bp-front-filter-form .bp-btn-primary {
    width: auto;
    margin: 0;
}

.bp-btn-secondary {
    background-color: transparent !important;
    color: #ffffff !important;
    border: 1px solid #555555;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 6px;
    display: inline-block;
    transition: all 0.2s ease;
    width: auto;
    margin: 0;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
}
.bp-btn-secondary:hover {
    background-color: #333333 !important;
    border-color: #666666;
}

.bp-pagination-container {
    margin-top: 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #aaaaaa;
    font-weight: 500;
}
.bp-pagination-links {
    display: flex;
    gap: 8px;
}
.bp-pagination-links a {
    padding: 8px 16px;
    background-color: #171717;
    color: #ffffff;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 1px solid #444444;
}
.bp-pagination-links a:hover {
    background-color: #333333;
    border-color: #555555;
}

.dash-section { 
    margin-bottom: 25px; 
    padding-bottom: 20px; 
    border-bottom: 1px dashed #444444; 
}
.dash-section:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.dash-section label { 
    display: block; 
    font-weight: 600; 
    margin-bottom: 10px; 
    color: #ffffff !important;
    font-size: 14px;
}
.dash-date-group {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}
.dash-date-group input {
    margin-bottom: 0 !important;
}

#dash_msg { 
    margin-top: 20px; 
    font-weight: 600; 
    padding: 15px;
    border-radius: 8px;
    text-align: center;
    font-size: 15px;
    display: empty; 
}
#dash_msg:empty {
    display: none;
}
#dash_msg[style*="color:green"] { color: #4ade80 !important; }
#dash_msg[style*="color:red"] { color: #f87171 !important; }
#dash_msg[style*="color:#2563eb"],
#dash_msg[style*="color:orange"] { color: #60a5fa !important; }


/* ==========================================================================
   Mobile Responsiveness (Hardened against external Themes)
   ========================================================================== */
@media(max-width: 768px) {
    .wp-list-table th, .wp-list-table td { 
        display: block !important; 
        width: 100% !important; 
        text-align: left !important; 
    }
    .wp-list-table thead { display: none !important; }
    .wp-list-table tr { 
        border-bottom: 2px solid #333333 !important; 
        display: block !important; 
        margin-bottom: 10px !important; 
    }
    .dash-date-group {
        flex-direction: column !important;
    }
    .bp-admin-filter-form, .bp-front-filter-form {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .bp-admin-filter-form input,
    .bp-admin-filter-form button,
    .bp-admin-filter-form a,
    .bp-front-filter-form input,
    .bp-front-filter-form button,
    .bp-front-filter-form a {
        width: 100% !important;
        margin-bottom: 8px !important;
        text-align: center !important;
    }
    
    /* Frontend Table "Card Style" Responsiveness */
    .bp-table thead { display: none !important; }
    .bp-table, .bp-table tbody, .bp-table tr, .bp-table td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .bp-table tr {
        margin-bottom: 15px !important;
        border: 1px solid #333333 !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        background-color: #212121 !important;
    }
    .bp-table td {
        text-align: right !important; 
        padding: 12px 15px 12px 45% !important; /* Explicitly enforce padding */
        position: relative !important;
        border-bottom: 1px solid #2f2f2f !important;
        min-height: 44px !important;
        word-wrap: break-word !important; /* Stop text from breaking layout */
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
    }
    .bp-table td:last-child {
        border-bottom: none !important;
    }
    .bp-table td::before {
        content: attr(data-label) !important;
        position: absolute !important;
        left: 15px !important;
        top: 12px !important; /* Anchored to match top padding */
        width: 40% !important; /* Prevents overlap with data */
        padding-right: 10px !important;
        white-space: normal !important; /* Allow label wrapping if needed */
        text-align: left !important;
        font-weight: 600 !important;
        color: #aaaaaa !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        display: block !important;
    }
    
    /* Fix the status select dropdown width on mobile */
    .bp-table td .bp-status-select {
        max-width: 100% !important;
        margin: 0 !important;
    }
}