table.pretty {
    width: 100%;
}

table.pretty th, table.pretty td {
    border: 1px solid gainsboro;
    padding: 0.2em;
}

table.pretty caption {
    font-style: italic;
    font-weight: bold;
    margin-left: inherit;
    margin-right: inherit;
}

table.pretty thead tr th {
    border-bottom: 2px solid;
    font-weight: bold;
    text-align: center;
}

table.pretty thead tr th.empty {
    border: 0 none;
}

table.pretty tfoot tr th {
    border-bottom: 2px solid;
    border-top: 2px solid;
    font-weight: bold;
    text-align: center;
}

table.pretty tbody tr th {
    text-align: center;
}

table.pretty tbody tr td {
    border-top: 1px solid;
    text-align: center;
}

table.pretty tbody tr.odd td {
    background: none repeat scroll 0 0 #EBF4FB;
}

table.pretty tbody tr.even td {
    background: none repeat scroll 0 0 #BCEEEE;
}

table.pretty thead tr th.highlightcol {
    border-color: #2E6E9E #2E6E9E gainsboro;
    border-style: solid;
    border-width: 2px 2px 1px;
}

table.pretty tfoot tr th.highlightcol {
    border-left: 2px solid #2E6E9E;
    border-right: 2px solid #2E6E9E;
}

table.pretty thead tr th.lefthighlightcol, table.pretty tbody tr td.lefthighlightcol, table.pretty tfoot tr th.lefthighlightcol {
    border-left: 2px solid #2E6E9E;
}

table.pretty thead tr th.righthighlightcol, table.pretty tbody tr td.righthighlightcol, table.pretty tfoot tr th.righthighlightcol {
    border-right: 2px solid #2E6E9E;
}

table.pretty thead tr th.lefthighlightcolheader, table.pretty tbody tr td.lefthighlightcolheader, table.pretty tfoot tr th.lefthighlightcolheader {
    border-left: 2px solid #2E6E9E;
}

table.pretty thead tr th.righthighlightcolheader, table.pretty tbody tr td.righthighlightcolheader, table.pretty tfoot tr th.righthighlightcolheader {
    border-right: 2px solid #2E6E9E;
}

.strikethrough {
    text-decoration: line-through;
    color: red;
}

.month, .year {
    margin: 2px;
}

caption, th {
    text-align: left;
}


.font-11{
    font-size: 11px;
}

.style-0 {
    empty-cells: show;
    table-layout: fixed;
    width: 1315pt
}

.style-1 {
    color: white;
    padding-left: 10pt;
    font-size: 14pt;
    font-family: "Arial";
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    text-align: left;
    word-spacing: 0pt;
    letter-spacing: 0pt;
    background-color: #339933
}


.opacity-75 {
    opacity: 0.75;
    filter: alpha(opacity=75);
}
.opacity-50 {
    opacity: 0.5;
    filter: alpha(opacity=50);
}
.opacity-25 {
    opacity: 0.25;
    filter: alpha(opacity=25);
}
.opacity-0 {
    opacity: 0;
    filter: alpha(opacity=0);
}
.no-edge-top {
    top: 0;
}
.no-edge-bottom {
    bottom: 0;
}
.no-edge-left {
    left: 0;
}
.no-edge-right {
    right: 0;
}
.user_name{
    font-size:14px;
    font-weight: bold;
}
.comments-list .media{
    border-bottom: 1px dotted #ccc;
}

/* ==========================================================================
   Modern Pro Max UI/UX Login Page Styles
   ========================================================================== */

/* Custom Google Font */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

body.login-page {
    font-family: 'Outfit', sans-serif !important;
    background: radial-gradient(circle at 10% 20%, rgb(4, 159, 108) 0%, rgb(19, 41, 38) 90%) !important;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
    position: relative;
    padding: 40px 0;
}

/* Abstract Decorative Background Blurs */
body.login-page::before,
body.login-page::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    filter: blur(100px);
    z-index: 0;
    opacity: 0.5;
    pointer-events: none;
}

body.login-page::before {
    background: #00ffaa;
    top: 10%;
    left: 15%;
    animation: floatBubble 12s infinite alternate ease-in-out;
}

body.login-page::after {
    background: #00ccff;
    bottom: 10%;
    right: 15%;
    animation: floatBubble 8s infinite alternate-reverse ease-in-out;
}

@keyframes floatBubble {
    0% { transform: translateY(0) scale(1); }
    100% { transform: translateY(-40px) scale(1.2); }
}

.login-box {
    width: 440px !important;
    margin: 0 !important;
    z-index: 10;
    padding: 20px;
}

.login-box .card {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
    overflow: hidden;
}

.login-box .login-logo {
    margin-bottom: 24px !important;
}

.login-box .login-logo a {
    color: #ffffff !important;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.login-box .login-logo img {
    max-height: 55px;
    filter: drop-shadow(0 4px 6px rgba(0,0,0,0.15));
    transition: transform 0.3s ease;
}

.login-box .login-logo img:hover {
    transform: scale(1.05);
}

.login-card-body {
    background: transparent !important;
    color: #ffffff !important;
    padding: 35px 30px !important;
}

.login-box-msg {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 15px !important;
    font-weight: 400;
    margin-bottom: 30px !important;
    padding: 0 !important;
}

/* Modern Form Controls */
.login-card-body .form-group {
    margin-bottom: 24px !important;
}

.login-card-body .form-label {
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    margin-bottom: 8px !important;
    display: block;
}

.login-card-body .form-control {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    font-size: 15px !important;
    padding: 12px 16px !important;
    height: auto !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.login-card-body .form-control:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: #00ffb7 !important;
    box-shadow: 0 0 0 4px rgba(0, 255, 183, 0.15) !important;
    color: #ffffff !important;
}

.login-card-body .form-control::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}

/* Custom Passcode Switch icon positioning */
.form-control-wrap {
    position: relative;
}

.form-control-wrap .passcode-switch {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, 0.5);
    z-index: 10;
    cursor: pointer;
    transition: color 0.2s;
}

.form-control-wrap .passcode-switch:hover {
    color: #00ffb7;
}

/* Forgot Password link */
.form-label-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-label-group .link-primary {
    color: #00ffb7 !important;
    font-size: 13px !important;
    font-weight: 500;
    text-decoration: none !important;
    transition: opacity 0.2s;
}

.form-label-group .link-primary:hover {
    opacity: 0.8;
    text-decoration: underline !important;
}

/* Remember Me Checkbox */
.custom-control-label {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 14px !important;
    cursor: pointer;
    user-select: none;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #00ffb7 !important;
    border-color: #00ffb7 !important;
}

.custom-checkbox .custom-control-label::before {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    border-radius: 4px !important;
}

/* Submit Button */
.login-card-body .btn-primary {
    background: linear-gradient(135deg, #00ffb7 0%, #00b386 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #061f18 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 14px 20px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 15px rgba(0, 255, 183, 0.25) !important;
    width: 100%;
}

.login-card-body .btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 255, 183, 0.4) !important;
    opacity: 0.95;
}

.login-card-body .btn-primary:active {
    transform: translateY(0) !important;
}

/* Register link */
.login-card-body a[href*="register"] {
    color: #00ffb7 !important;
    font-weight: 500;
    text-decoration: none !important;
    transition: opacity 0.2s;
}

.login-card-body a[href*="register"]:hover {
    opacity: 0.8;
    text-decoration: underline !important;
}

.login-card-body .mb-1 {
    margin-top: 25px !important;
    text-align: center;
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
}

/* ==========================================================================
   Modern Pro Max UI/UX Dashboard & Portal Styles
   ========================================================================== */

/* Apply Outfit font to the entire body when logged in */
body {
    font-family: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    background-color: #f8fafc !important;
}

.content-wrapper {
    background-color: #f8fafc !important;
}

/* Modern Top Navbar */
.main-header.navbar {
    background: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03) !important;
}

.navbar-light .navbar-nav .nav-link {
    color: #334155 !important;
    font-weight: 500;
    font-size: 14px;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #10b981 !important;
}

/* Sleek Modern Sidebar */
.main-sidebar {
    background: #0f172a !important; /* Dark Slate background */
    border-right: none !important;
    box-shadow: 4px 0 25px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease;
}

.brand-link {
    background: #0f172a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 15px 20px !important;
}

.brand-link .brand-text {
    font-weight: 700 !important;
    letter-spacing: -0.5px;
    color: #ffffff !important;
}

.sidebar {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* Sidebar Menu Items */
.nav-sidebar .nav-item {
    margin-bottom: 4px;
}

.nav-sidebar .nav-link {
    border-radius: 12px !important;
    padding: 10px 16px !important;
    color: #94a3b8 !important;
    font-weight: 500;
    font-size: 14px;
    transition: all 0.2s ease;
}

.nav-sidebar .nav-link:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.nav-sidebar .nav-item.menu-open > .nav-link,
.nav-sidebar .nav-link.active {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2) !important;
}

.nav-sidebar .nav-link i {
    font-size: 16px !important;
    margin-right: 10px !important;
}

/* Modernized Info Boxes (Fintech Widgets) */
.info-box {
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.03) !important;
    padding: 20px !important;
    display: flex;
    align-items: center;
    min-height: auto !important;
    margin-bottom: 24px !important;
    transition: transform 0.2s, box-shadow 0.2s;
}

.info-box:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.07) !important;
}

.info-box-icon {
    width: 56px !important;
    height: 56px !important;
    line-height: 56px !important;
    border-radius: 12px !important;
    font-size: 22px !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08) !important;
}

/* Dynamic Gradients for Info Box Icons */
.info-box-icon.bg-aqua, 
.info-box-icon.bg-info {
    background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%) !important;
}

.info-box-icon.bg-green, 
.info-box-icon.bg-success {
    background: linear-gradient(135deg, #34d399 0%, #059669 100%) !important;
}

.info-box-icon.bg-yellow, 
.info-box-icon.bg-warning {
    background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%) !important;
}

.info-box-icon.bg-red, 
.info-box-icon.bg-danger {
    background: linear-gradient(135deg, #f87171 0%, #dc2626 100%) !important;
}

.info-box-content {
    padding: 0 0 0 16px !important;
    display: flex;
    flex-direction: column;
}

.info-box-text {
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}

.info-box-number {
    color: #0f172a !important;
    font-size: 24px !important;
    font-weight: 700 !important;
}

/* Modern Card Layouts */
.card {
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.03) !important;
    margin-bottom: 24px !important;
    overflow: hidden;
}

.card-header {
    background-color: transparent !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 18px 24px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
}

.card-body {
    padding: 24px !important;
}

/* Custom Table Polish */
.table {
    width: 100% !important;
    margin-bottom: 0 !important;
}

.table th {
    background: #f8fafc !important;
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 14px 16px !important;
    border-bottom: 2px solid #e2e8f0 !important;
    border-top: none !important;
}

.table td {
    padding: 16px !important;
    vertical-align: middle !important;
    border-top: 1px solid #f1f5f9 !important;
    color: #334155 !important;
    font-size: 14px !important;
}

.table tbody tr:hover {
    background-color: #f8fafc !important;
}

/* Custom badges */
.badge {
    padding: 6px 12px !important;
    border-radius: 9999px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    display: inline-block;
}

.badge-success {
    background-color: #dcfce7 !important;
    color: #15803d !important;
}

.badge-warning {
    background-color: #fef9c3 !important;
    color: #a16207 !important;
}

.badge-danger {
    background-color: #fee2e2 !important;
    color: #b91c1c !important;
}

.badge-info {
    background-color: #e0f2fe !important;
    color: #0369a1 !important;
}

/* Buttons Polish */
.btn {
    border-radius: 10px !important;
    font-weight: 500 !important;
    padding: 8px 16px !important;
    font-size: 14px !important;
    transition: all 0.2s ease;
}

.btn-sm {
    padding: 6px 12px !important;
    font-size: 12px !important;
}

.btn-primary {
    background-color: #10b981 !important;
    border-color: #10b981 !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: #059669 !important;
    border-color: #059669 !important;
}

.btn-success {
    background-color: #10b981 !important;
    border-color: #10b981 !important;
    color: #ffffff !important;
}

.btn-success:hover {
    background-color: #059669 !important;
    border-color: #059669 !important;
}