/*************************************************/
/****   MODAL CSS VARIABLES - STANDARDIZED   *****/
/*************************************************/

:root {
    /* ============================================ */
    /* SUCCESS MODAL (Green theme)                 */
    /* ============================================ */
    --modal-success-header-bg: #198754;
    --modal-success-header-text: #ffffff;
    --modal-success-subheader-bg: #d1e7dd;
    --modal-success-subheader-text: #0f5132;
    --modal-success-body-bg: #d1e7dd;
    --modal-success-body-text: #0f5132;
    --modal-success-border: #198754;
    /* Success Modal Buttons */
    --modal-success-ok-bg: #198754;
    --modal-success-ok-text: #ffffff;
    --modal-success-ok-hover-bg: #146c43;
    --modal-success-cancel-bg: #6c757d;
    --modal-success-cancel-text: #ffffff;
    --modal-success-cancel-hover-bg: #5c636a;
    --modal-success-action-bg: #0d6efd;
    --modal-success-action-text: #ffffff;
    --modal-success-action-hover-bg: #0b5ed7;
    /* ============================================ */
    /* FAILURE/ERROR MODAL (Red theme)             */
    /* ============================================ */
    --modal-failure-header-bg: #dc3545;
    --modal-failure-header-text: #ffffff;
    --modal-failure-subheader-bg: #f8d7da;
    --modal-failure-subheader-text: #842029;
    --modal-failure-body-bg: #f8d7da;
    --modal-failure-body-text: #842029;
    --modal-failure-border: #dc3545;
    /* Failure Modal Buttons */
    --modal-failure-ok-bg: #dc3545;
    --modal-failure-ok-text: #ffffff;
    --modal-failure-ok-hover-bg: #bb2d3b;
    --modal-failure-cancel-bg: #6c757d;
    --modal-failure-cancel-text: #ffffff;
    --modal-failure-cancel-hover-bg: #5c636a;
    --modal-failure-action-bg: #dc3545;
    --modal-failure-action-text: #ffffff;
    --modal-failure-action-hover-bg: #bb2d3b;
    /* ============================================ */
    /* WARNING MODAL (Orange/Yellow theme)         */
    /* ============================================ */
    --modal-warning-header-bg: #fd7e14;
    --modal-warning-header-text: #ffffff;
    --modal-warning-subheader-bg: #fff3cd;
    --modal-warning-subheader-text: #664d03;
    --modal-warning-body-bg: #fff3cd;
    --modal-warning-body-text: #664d03;
    --modal-warning-border: #fd7e14;
    /* Warning Modal Buttons */
    --modal-warning-ok-bg: #fd7e14;
    --modal-warning-ok-text: #ffffff;
    --modal-warning-ok-hover-bg: #e96b02;
    --modal-warning-cancel-bg: #6c757d;
    --modal-warning-cancel-text: #ffffff;
    --modal-warning-cancel-hover-bg: #5c636a;
    --modal-warning-action-bg: #ffc107;
    --modal-warning-action-text: #000000;
    --modal-warning-action-hover-bg: #e0a800;
    /* ============================================ */
    /* CONFIRMATION MODAL (Blue theme)             */
    /* ============================================ */
    --modal-confirm-header-bg: #0d6efd;
    --modal-confirm-header-text: #ffffff;
    --modal-confirm-subheader-bg: #cfe2ff;
    --modal-confirm-subheader-text: #084298;
    --modal-confirm-body-bg: #ffffff;
    --modal-confirm-body-text: #212529;
    --modal-confirm-border: #0d6efd;
    /* Confirmation Modal Buttons */
    --modal-confirm-ok-bg: #0d6efd;
    --modal-confirm-ok-text: #ffffff;
    --modal-confirm-ok-hover-bg: #0b5ed7;
    --modal-confirm-cancel-bg: #6c757d;
    --modal-confirm-cancel-text: #ffffff;
    --modal-confirm-cancel-hover-bg: #5c636a;
    --modal-confirm-action-bg: #198754;
    --modal-confirm-action-text: #ffffff;
    --modal-confirm-action-hover-bg: #146c43;
    /* ============================================ */
    /* INFO MODAL (Cyan/Teal theme)                */
    /* ============================================ */
    --modal-info-header-bg: #0dcaf0;
    --modal-info-header-text: #000000;
    --modal-info-subheader-bg: #cff4fc;
    --modal-info-subheader-text: #055160;
    --modal-info-body-bg: #ffffff;
    --modal-info-body-text: #212529;
    --modal-info-border: #0dcaf0;
    /* Info Modal Buttons */
    --modal-info-ok-bg: #0dcaf0;
    --modal-info-ok-text: #000000;
    --modal-info-ok-hover-bg: #0bacce;
    --modal-info-cancel-bg: #6c757d;
    --modal-info-cancel-text: #ffffff;
    --modal-info-cancel-hover-bg: #5c636a;
    --modal-info-action-bg: #0d6efd;
    --modal-info-action-text: #ffffff;
    --modal-info-action-hover-bg: #0b5ed7;
    /* ============================================ */
    /* SHARED MODAL PROPERTIES                     */
    /* ============================================ */
    --modal-border-width: 3px;
    --modal-border-radius: 0.375rem;
    --modal-header-padding: 1rem 1.5rem;
    --modal-body-padding: 1.5rem;
    --modal-footer-padding: 1rem 1.5rem;
    --modal-icon-size: 1.25rem;
    --modal-title-font-size: 1.25rem;
    --modal-body-font-size: 1rem;
    --modal-footer-bg: inherit;
}

/*************************************************/
/****   MODAL BASE CLASSES                   *****/
/*************************************************/

/* Success Modal */
.modal-success .modal-content {
    border: var(--modal-border-width) solid var(--modal-success-border);
    border-radius: var(--modal-border-radius);
}

.modal-success .modal-header {
    background-color: var(--modal-success-header-bg);
    color: var(--modal-success-header-text);
    padding: var(--modal-header-padding);
    border-bottom: none;
}

    .modal-success .modal-header .modal-title {
        font-size: var(--modal-title-font-size);
        font-weight: 600;
    }

    .modal-success .modal-header .btn-close {
        filter: brightness(0) invert(1);
    }

.modal-success .modal-subheader {
    background-color: var(--modal-success-subheader-bg);
    color: var(--modal-success-subheader-text);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

.modal-success .modal-body {
    background-color: var(--modal-success-body-bg);
    color: var(--modal-success-body-text);
    padding: var(--modal-body-padding);
    font-size: var(--modal-body-font-size);
}

.modal-success .modal-footer {
    background-color: var(--modal-success-body-bg);
    padding: var(--modal-footer-padding);
    border-top: none;
}

.modal-success .btn-modal-ok {
    background-color: var(--modal-success-ok-bg);
    color: var(--modal-success-ok-text);
    border: none;
}

    .modal-success .btn-modal-ok:hover {
        background-color: var(--modal-success-ok-hover-bg);
    }

.modal-success .btn-modal-cancel {
    background-color: var(--modal-success-cancel-bg);
    color: var(--modal-success-cancel-text);
    border: none;
}

    .modal-success .btn-modal-cancel:hover {
        background-color: var(--modal-success-cancel-hover-bg);
    }

.modal-success .btn-modal-action {
    background-color: var(--modal-success-action-bg);
    color: var(--modal-success-action-text);
    border: none;
}

    .modal-success .btn-modal-action:hover {
        background-color: var(--modal-success-action-hover-bg);
    }

/* Failure/Error Modal */
.modal-failure .modal-content,
.modal-error .modal-content {
    border: var(--modal-border-width) solid var(--modal-failure-border);
    border-radius: var(--modal-border-radius);
}

.modal-failure .modal-header,
.modal-error .modal-header {
    background-color: var(--modal-failure-header-bg);
    color: var(--modal-failure-header-text);
    padding: var(--modal-header-padding);
    border-bottom: none;
}

    .modal-failure .modal-header .modal-title,
    .modal-error .modal-header .modal-title {
        font-size: var(--modal-title-font-size);
        font-weight: 600;
    }

    .modal-failure .modal-header .btn-close,
    .modal-error .modal-header .btn-close {
        filter: brightness(0) invert(1);
    }

.modal-failure .modal-subheader,
.modal-error .modal-subheader {
    background-color: var(--modal-failure-subheader-bg);
    color: var(--modal-failure-subheader-text);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

.modal-failure .modal-body,
.modal-error .modal-body {
    background-color: var(--modal-failure-body-bg);
    color: var(--modal-failure-body-text);
    padding: var(--modal-body-padding);
    font-size: var(--modal-body-font-size);
}

.modal-failure .modal-footer,
.modal-error .modal-footer {
    background-color: var(--modal-failure-body-bg);
    padding: var(--modal-footer-padding);
    border-top: none;
}

.modal-failure .btn-modal-ok,
.modal-error .btn-modal-ok {
    background-color: var(--modal-failure-ok-bg);
    color: var(--modal-failure-ok-text);
    border: none;
}

    .modal-failure .btn-modal-ok:hover,
    .modal-error .btn-modal-ok:hover {
        background-color: var(--modal-failure-ok-hover-bg);
    }

.modal-failure .btn-modal-cancel,
.modal-error .btn-modal-cancel {
    background-color: var(--modal-failure-cancel-bg);
    color: var(--modal-failure-cancel-text);
    border: none;
}

    .modal-failure .btn-modal-cancel:hover,
    .modal-error .btn-modal-cancel:hover {
        background-color: var(--modal-failure-cancel-hover-bg);
    }

.modal-failure .btn-modal-action,
.modal-error .btn-modal-action {
    background-color: var(--modal-failure-action-bg);
    color: var(--modal-failure-action-text);
    border: none;
}

    .modal-failure .btn-modal-action:hover,
    .modal-error .btn-modal-action:hover {
        background-color: var(--modal-failure-action-hover-bg);
    }

/* Warning Modal */
.modal-warning .modal-content {
    border: var(--modal-border-width) solid var(--modal-warning-border);
    border-radius: var(--modal-border-radius);
}

.modal-warning .modal-header {
    background-color: var(--modal-warning-header-bg);
    color: var(--modal-warning-header-text);
    padding: var(--modal-header-padding);
    border-bottom: none;
}

    .modal-warning .modal-header .modal-title {
        font-size: var(--modal-title-font-size);
        font-weight: 600;
    }

    .modal-warning .modal-header .btn-close {
        filter: brightness(0) invert(1);
    }

.modal-warning .modal-subheader {
    background-color: var(--modal-warning-subheader-bg);
    color: var(--modal-warning-subheader-text);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

.modal-warning .modal-body {
    background-color: var(--modal-warning-body-bg);
    color: var(--modal-warning-body-text);
    padding: var(--modal-body-padding);
    font-size: var(--modal-body-font-size);
}

.modal-warning .modal-footer {
    background-color: var(--modal-warning-body-bg);
    padding: var(--modal-footer-padding);
    border-top: none;
}

.modal-warning .btn-modal-ok {
    background-color: var(--modal-warning-ok-bg);
    color: var(--modal-warning-ok-text);
    border: none;
}

    .modal-warning .btn-modal-ok:hover {
        background-color: var(--modal-warning-ok-hover-bg);
    }

.modal-warning .btn-modal-cancel {
    background-color: var(--modal-warning-cancel-bg);
    color: var(--modal-warning-cancel-text);
    border: none;
}

    .modal-warning .btn-modal-cancel:hover {
        background-color: var(--modal-warning-cancel-hover-bg);
    }

.modal-warning .btn-modal-action {
    background-color: var(--modal-warning-action-bg);
    color: var(--modal-warning-action-text);
    border: none;
}

    .modal-warning .btn-modal-action:hover {
        background-color: var(--modal-warning-action-hover-bg);
    }

/* Confirmation Modal */
.modal-confirm .modal-content {
    border: var(--modal-border-width) solid var(--modal-confirm-border);
    border-radius: var(--modal-border-radius);
}

.modal-confirm .modal-header {
    background-color: var(--modal-confirm-header-bg);
    color: var(--modal-confirm-header-text);
    padding: var(--modal-header-padding);
    border-bottom: none;
}

    .modal-confirm .modal-header .modal-title {
        font-size: var(--modal-title-font-size);
        font-weight: 600;
    }

    .modal-confirm .modal-header .btn-close {
        filter: brightness(0) invert(1);
    }

.modal-confirm .modal-subheader {
    background-color: var(--modal-confirm-subheader-bg);
    color: var(--modal-confirm-subheader-text);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

.modal-confirm .modal-body {
    background-color: var(--modal-confirm-body-bg);
    color: var(--modal-confirm-body-text);
    padding: var(--modal-body-padding);
    font-size: var(--modal-body-font-size);
}

.modal-confirm .modal-footer {
    background-color: var(--modal-confirm-body-bg);
    padding: var(--modal-footer-padding);
    border-top: 1px solid #dee2e6;
}

.modal-confirm .btn-modal-ok {
    background-color: var(--modal-confirm-ok-bg);
    color: var(--modal-confirm-ok-text);
    border: none;
}

    .modal-confirm .btn-modal-ok:hover {
        background-color: var(--modal-confirm-ok-hover-bg);
    }

.modal-confirm .btn-modal-cancel {
    background-color: var(--modal-confirm-cancel-bg);
    color: var(--modal-confirm-cancel-text);
    border: none;
}

    .modal-confirm .btn-modal-cancel:hover {
        background-color: var(--modal-confirm-cancel-hover-bg);
    }

.modal-confirm .btn-modal-action {
    background-color: var(--modal-confirm-action-bg);
    color: var(--modal-confirm-action-text);
    border: none;
}

    .modal-confirm .btn-modal-action:hover {
        background-color: var(--modal-confirm-action-hover-bg);
    }

/* Info Modal */
.modal-info .modal-content {
    border: var(--modal-border-width) solid var(--modal-info-border);
    border-radius: var(--modal-border-radius);
}

.modal-info .modal-header {
    background-color: var(--modal-info-header-bg);
    color: var(--modal-info-header-text);
    padding: var(--modal-header-padding);
    border-bottom: none;
}

    .modal-info .modal-header .modal-title {
        font-size: var(--modal-title-font-size);
        font-weight: 600;
    }

.modal-info .modal-subheader {
    background-color: var(--modal-info-subheader-bg);
    color: var(--modal-info-subheader-text);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

.modal-info .modal-body {
    background-color: var(--modal-info-body-bg);
    color: var(--modal-info-body-text);
    padding: var(--modal-body-padding);
    font-size: var(--modal-body-font-size);
}

.modal-info .modal-footer {
    background-color: var(--modal-info-body-bg);
    padding: var(--modal-footer-padding);
    border-top: 1px solid #dee2e6;
}

.modal-info .btn-modal-ok {
    background-color: var(--modal-info-ok-bg);
    color: var(--modal-info-ok-text);
    border: none;
}

    .modal-info .btn-modal-ok:hover {
        background-color: var(--modal-info-ok-hover-bg);
    }

.modal-info .btn-modal-cancel {
    background-color: var(--modal-info-cancel-bg);
    color: var(--modal-info-cancel-text);
    border: none;
}

    .modal-info .btn-modal-cancel:hover {
        background-color: var(--modal-info-cancel-hover-bg);
    }

.modal-info .btn-modal-action {
    background-color: var(--modal-info-action-bg);
    color: var(--modal-info-action-text);
    border: none;
}

    .modal-info .btn-modal-action:hover {
        background-color: var(--modal-info-action-hover-bg);
    }

/*************************************************/
/****   MODAL ICON CLASSES                   *****/
/*************************************************/

.modal-icon {
    font-size: var(--modal-icon-size);
    margin-right: 0.5rem;
    vertical-align: middle;
}

.modal-icon-lg {
    font-size: 1.5rem;
}

.modal-icon-xl {
    font-size: 2rem;
}

/*************************************************/
/****   TOAST CSS VARIABLES                  *****/
/*************************************************/

/* Warning Toast (Session Timeout) */
.toast-warning {
    background-color: var(--modal-warning-header-bg) !important;
    color: var(--modal-warning-header-text) !important;
}

.toast-success {
    background-color: var(--modal-success-header-bg) !important;
    color: var(--modal-success-header-text) !important;
}

.toast-failure,
.toast-error {
    background-color: var(--modal-failure-header-bg) !important;
    color: var(--modal-failure-header-text) !important;
}

.toast-info {
    background-color: var(--modal-info-header-bg) !important;
    color: var(--modal-info-header-text) !important;
}

/*************************************************/
/****   MODAL HELPER CLASSES                 *****/
/*************************************************/

/* Signature section styling */
.modal-signature-section {
    border: 1px solid var(--modal-success-border);
    border-radius: var(--modal-border-radius);
    background-color: #f8f9fa;
}

.modal-signature-image {
    height: 40px;
}

/* Alert overrides within modals */
.modal-failure .alert-info,
.modal-error .alert-info {
    background-color: #cfe2ff;
    border-color: #b6d4fe;
    color: #084298;
}

.modal-warning .alert-info {
    background-color: #cfe2ff;
    border-color: #b6d4fe;
    color: #084298;
}

.modal-success .alert-info {
    background-color: #cfe2ff;
    border-color: #b6d4fe;
    color: #084298;
}

/* Nested alert styling for contrast */
.modal-failure .alert-warning,
.modal-error .alert-warning {
    background-color: #fff3cd;
    border-color: #ffecb5;
    color: #664d03;
}


/* Add CSS for the Relaunch Button For logbook.aspx reset pincode */
/* Relaunch Signing Button Styling */
.alert-success .btn-success {
    background-color: #146c43;
    border-color: #146c43;
}

    .alert-success .btn-success:hover {
        background-color: #0f5132;
        border-color: #0f5132;
    }

/* Toast with relaunch button */
#pinResetSuccessToast .toast {
    min-width: 400px;
}

#pinResetSuccessToast .btn-light {
    background-color: rgba(255, 255, 255, 0.9);
    border: none;
    font-weight: 500;
}

    #pinResetSuccessToast .btn-light:hover {
        background-color: #ffffff;
    }












/*************************************************/
/****   BEGIN SEALEDGER BRANDING   ***************/
/*************************************************/
.text-black {
    color: #272d4f !important;
}
.text-danger {
    color: #eb5d4c !important;
}
a {
    color: #334fa0 !important;
}
.btn-primary {
    background-color: #334fa0 !important;
}
.bg-primary {
    background-color: #334fa0 !important;
}
.bg-off-white {background-color:#EFF4F9 ;}
.text-off-white {color:#EFF4F9 ;}

.login-container {
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    padding: 30px;
    max-width: 100%;
}

.bg-boot-green{                                                                                        background-color: #28a745;
}

/* Fix: Hide broken Bootstrap caret on avatar dropdown */
#userAccountDropdown::after {
    display: none;
}

/*************************************************/
/****   END SEALEDGER BRANDING   ***************/
/*************************************************/

/* ============================================
   SHIP MANAGEMENT TABS - Warning Button Styling
   ============================================ */
#pnl_tabs a.btn-outline-warning {
    color: rgb(255, 193, 7) !important;
    border-color: rgb(255, 193, 7) !important;
}

#pnl_tabs a.btn-outline-warning:hover {
    color: #000 !important;
    background-color: rgb(255, 193, 7) !important;
}

#pnl_tabs .btn-warning,
#pnl_tabs input.btn-warning {
    color: #000 !important;
    background-color: rgb(255, 193, 7) !important;
    border-color: rgb(255, 193, 7) !important;
}


/*************************************************/
/****   BEGIN BOOTSTRAP ICON SIZING   ************/
/*************************************************/
.icon-lg {
    font-size: 2rem;
}

.icon-xl {
    font-size: 3rem;
}

.icon-xxl {
    font-size: 4rem;
}

/*************************************************/
/****   END BOOTSTRAP ICON SIZING   ************/
/*************************************************/

/*
Step 1: Move @keyframes to a Separate CSS File
The @keyframes rules in your inline <style> block are causing Telerik's AJAX to choke. Move them to custom.css:
*/

/* Move these from logbook.aspx <style> to custom.css */

@keyframes pulse-glow-subtle {
    0%, 100% {
        box-shadow: 0 0 8px 3px rgba(40, 167, 69, 0.5),
                    0 0 15px 5px rgba(40, 167, 69, 0.25);
    }
    50% {
        box-shadow: 0 0 10px 4px rgba(40, 167, 69, 0.6),
                    0 0 20px 8px rgba(40, 167, 69, 0.35);
    }
}

@keyframes pulse-accept {
    0%, 100% {
        box-shadow: 0 0 10px 4px rgba(25, 135, 84, 0.6),
                    0 0 20px 8px rgba(25, 135, 84, 0.3);
    }
    50% {
        box-shadow: 0 0 14px 6px rgba(25, 135, 84, 0.75),
                    0 0 28px 12px rgba(25, 135, 84, 0.4);
    }
}

@keyframes pulse-sign {
    0%, 100% {
        box-shadow: 0 0 8px 3px rgba(255, 193, 7, 0.6),
                    0 0 15px 5px rgba(255, 193, 7, 0.3);
    }
    50% {
        box-shadow: 0 0 10px 4px rgba(255, 193, 7, 0.75),
                    0 0 20px 8px rgba(255, 193, 7, 0.4);
    }
}

@keyframes pulse-success-ok {
    0%, 100% {
        box-shadow: 0 0 10px 4px rgba(25, 135, 84, 0.6),
                    0 0 20px 8px rgba(25, 135, 84, 0.3);
    }
    50% {
        box-shadow: 0 0 14px 6px rgba(25, 135, 84, 0.75),
                    0 0 28px 12px rgba(25, 135, 84, 0.4);
    }
}

@keyframes pulse-icon {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.1); }
}

@keyframes strikethrough {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideUp {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(-10px); }
}










/* Additional Tank Rows */
.additional-tank-row {
    border-left: 4px solid #28a745; /* Green accent for extra rows */
}

#btn_add_tank_row {
    transition: all 0.3s ease;
}

    #btn_add_tank_row:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    }
/* End Additional Tank Rows */


.first-row-entry {
    background-color: rgb(249, 249, 249) !important;
}

.status-pending {
    background-color: #ff0 !important;
    color: #000;
}

.status-verified {
    background-color: #008000 !important;
    color: #fff;
}

.no-padding {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.no-padding-all {
    padding: 0 0 0 0 !important;
}

.no-margin, .no-gutters {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.no-margin-all {
    margin: 0 0 0 0 !important;
}

.w-75 {
    width: 75% !important;
}

.w-20 {
    width: 20% !important;
}

.rounded-4 {
    border-radius: .4rem !important;
}

.rounded-5 {
    border-radius: .5rem !important;
}

.checkout_payment-buttons {
    background-color: #1d83c2 !important;
    color: #fff !important;
}

.checkout_payment-buttons-selected {
    /*background: #1D83C2;*/
    background-color: #ffd104 !important;
    color: #000 !important;
}

/****************************************************************************************
    *  Custom classes for missed entry
*/
.muted-entry {
    font-size: .9rem;
    color: #6c757d !important;
    font-weight: 400 !important;
}

.bg-missed-entry {
    background-color: #e8e8e8 !important;
}

.recommends-color {
    color: #de1e2c;
}

.tiny-error {
    /*margin-top: -10px;*/
    max-height: 18px;
    margin: 0,0,-10px,0;
    padding: 0;
    font-size: .75rem;
    color: #b80000;
    /*font-weight: 600;*/
}

.forth-year-text {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.2;
    color: rgb(59,59,59);
}

.clear-error {
    display: none;
}

.err {
    /*margin-top: -10px;*/
    /*  max-height: 18px;*/
    /*  margin: 0px,0px,-10px,0px;*/
    padding: 0;
    font-size: 1.1rem;
    color: #b80000;
    /*font-weight: 600;*/
}

.flexslider {
    margin: 0 0 20px !important;
}

.flex-stuff {
    height: 350px;
}

.flex-viewport {
    max-height: 425px !important;
}

.flex-direction-nav a {
    width: 40px;
    height: 50px !important;
}

.flex-direction-nav a:hover {
    text-decoration: none !important;
}

/******************************************/
/****   SUMMARY   *************************/
/******************************************/
.subtotal-col1 {
    width: 100px;
}

.subtotal-col2 {
    width: 150px;
    text-align: right;
}













.status-pending {
    background-color: #ff0 !important;
    color: #000;
}

.status-verified {
    background-color: #008000 !important;
    color: #fff;
}

/****************************************************************************************
 * CUSTOM NAVBAR STYLES FOR LOG-DOWNLOADS.ASPX
 * Override Material Dashboard default styles to achieve top-aligned buttons
 */

#sl-headerlogo_login {
    /*max-width: 400px;*/
}

#sl-headerlogo {
    max-width: 300px;
}
/*
.custom-nav-container {
    position: relative !important;
    min-height: 150px !important;
    background: url('/images/settings_tanker_ship.png') right -30px !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-color: rgba(255,255,255,.6) !important;
    background-blend-mode: saturation !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 0px 20px !important;
}
*/
.custom-nav-container2 {
    position: relative !important;
    min-height: 260px !important;
    background: url('/images/bow_w_spray_260x1300.webp') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-color: rgba(255,255,255,.6) !important;
    background-blend-mode: saturation !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 10px 20px !important;
}

.custom-nav-container-admin {
    position: relative !important;
    min-height: 150px !important;
    background: url('/images/settings_tanker_ship.png') right -30px !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-color: rgba(255,255,255,.6) !important;
    background-blend-mode: saturation !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 10px 20px !important;
}

.custom-nav-top-row {
    display: flex !important;
    align-items: flex-start !important;
    /* justify-content: space-between !important; */
    width: 100% !important;
    margin-bottom: auto !important;
    padding-top: 0 !important;
}

.custom-nav-brand {
    flex-shrink: 0 !important;
    align-self: flex-start !important;
}

.custom-nav-buttons {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.custom-nav-button {
    background-image: url('/images/rivet-button.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 110px !important;
    height: 35px !important;
    font-size: 11px !important;
    border: none !important;
    color: white !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    cursor: pointer !important;  /* ADD THIS */
}

.custom-nav-button * {
    pointer-events: none !important;  /* ADD THIS - prevents child elements from blocking clicks */
    cursor: pointer !important;       /* ADD THIS - ensures pointer on all children */
}

.custom-nav-button.active {
    color: #eb5d4c !important;
}

.custom-nav-button:hover {
    color: white !important;
    text-decoration: none !important;
    transform: scale(1.05) !important;
    transition: transform .2s ease !important;
    cursor: pointer !important;  /* ADD THIS */
}


/*
.custom-nav-button {
    background-image: url('/images/rivet-button.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 110px !important;
    height: 35px !important;
    font-size: 11px !important;
    border: none !important;
    color: white !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}
.custom-nav-button.active {
    color: #eb5d4c !important;
}
.custom-nav-button:hover {
    color: white !important;
    text-decoration: none !important;
    transform: scale(1.05) !important;
    transition: transform .2s ease !important;
}
*/
.custom-nav-title {
    /*position: absolute !important;
    bottom: 15px !important;*/
    left: 50% !important;
    transform: translateX(-50%) !important;
    color: #272D4F !important;
    font-weight: bold !important;
    font-size: 2.0rem !important;
    /*text-shadow: 2px 2px 4px rgba(0,0,0,.7) !important;*/
    margin: 0 !important;
}


.custom-nav-user {
    margin-left: 15px !important;
    align-self: flex-start !important;
}

.custom-nav-user .bi-person-circle {
    /*font-size: 2.4rem !important;*/
    /*color: cornflowerblue !important;*/
    
}


/* Override Bootstrap navbar defaults */
.navbar.navbar-expand-lg {
    padding: 0 !important;
}

.navbar-brand.mansalva-regular {
    margin-right: 0 !important;
    padding: 0 !important;
    font-size: 2.2rem !important;
}
.panel-select-btns{padding-top: 4px !important; padding-bottom: 4px !important;}
/****************************************************/
/* Small devices (landscape phones, 576px and up)   */
/****************************************************/
@media (min-width: 576px) {
    .h1 {
        font-family: 'Montserrat', sans-serif !important;
        font-weight: 700 !important;
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }

    .login-container {
       
        max-width: 400px;
    }

    .custom-nav-container {
        min-height: 120px !important;
        padding: 0px 15px !important;
    }

    .custom-nav-button {
        width: 90px !important;
        height: 28px !important;
        font-size: 9px !important;
    }

    .custom-nav-title {
        font-size: 1.3rem !important;
        bottom: 8px !important;
    }

    .custom-nav-container-admin {
        min-height: 60px !important;
        padding: 8px 15px !important;
    }
}

/****************************************************/
/* Medium devices (tablets, 768px and up)*/
/****************************************************/
@media (min-width: 768px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
        font-size: 1.0rem;
        font-weight: 600 !important;
    }

    .h6 {
    }

    .custom-nav-buttons {
        flex-direction: row !important;
        align-items: flex-end !important;
        gap: 5px !important;
    }

    .custom-nav-button {
        width: 100px !important;
        height: 32px !important;
        font-size: 11px !important;
    }

    .custom-nav-title {
        font-size: 1.5rem !important;
        bottom: 10px !important;
    }
}

/****************************************************/
/*Large devices (desktops, 992px and up)*/
/****************************************************/
@media (min-width: 992px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}

/****************************************************/
/*X-Large devices (large desktops, 1200px and up)*/
/****************************************************/
@media (min-width: 1200px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}

/****************************************************/
/*XX-Large devices (larger desktops, 1400px and up)*/
/****************************************************/
@media (min-width: 1400px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}


/*html{

}
body {

}

.first-row-entry {
    background-color: rgb(249, 249, 249) !important;
}

.status-pending {
    background-color: #FFFF00 !important;
    color: #000000;
}

.status-verified {
    background-color: #008000 !important;
    color: #FFFFFF;
}
.no-padding{padding-left: 0px !important; padding-right: 0px !important;}
.no-padding-all{padding: 0px 0px 0px 0px !important;}

.no-margin, .no-gutters{margin-left: 0 !important; margin-right: 0 !important;}
.no-margin-all{margin: 0px 0px 0px 0px !important;}

.w-75 {width: 75% !important;}
.w-20 {width: 20% !important;}

.rounded-4{
  border-radius: .4rem !important;
}
.rounded-5{
  border-radius: .5rem !important;
}

.checkout_payment-buttons {
    background-color: #1D83C2 !important;
    color: #fff !important;
}

.checkout_payment-buttons-selected {*/
/*background: #1D83C2;*/
/*background-color: #FFD104 !important;
    color: #000 !important;
}*/

/****************************************************************************************
    *  Custom classes for missed entry
*/
/*.muted-entry{font-size: .9rem; color: #6c757d !important; font-weight: 400 !important;}
.bg-missed-entry {
    background-color: #E8E8E8 !important;
}

.recommends-color {
    color: #de1e2c;
}
.tiny-error{*/
/*margin-top: -10px;*/
/*max-height: 18px;
    margin: 0px,0px,-10px,0;
    padding: 0;
    font-size: .75rem;
    color: #B80000;*/
/*font-weight: 600;*/
/*}

.forth-year-text {
    font-size: 1.1rem;
    font-weight: 700;
    line-height:1.2;
    color: rgb(59,59,59);
}
.clear-error{
    display: none;
}

.err {*/
/*margin-top: -10px;*/
/*  max-height: 18px;*/
/*  margin: 0px,0px,-10px,0px;*/
/*padding: 0;
    font-size: 1.1rem;
    color: #B80000;*/
/*font-weight: 600;*/
/*}

.flexslider {
    margin: 0 0 20px !important;
}
    .flex-stuff {
    height: 350px;
}

.flex-viewport {
    max-height: 425px !important;
}

.flex-direction-nav a {
    width: 40px;
    height: 50px !important;

}
    .flex-direction-nav a:hover {
        text-decoration: none !important;
    }*/

/******************************************/
/****   SUMMARY   *************************/
/******************************************/
/*.subtotal-col1{width: 100px;}
.subtotal-col2 {
    width: 150px;
    text-align: right;
}

.h1{}
.h2{}
.h3{}
.h4{}
.h5{}
.h6{}

.status-pending {
    background-color: #FFFF00 !important;
    color: #000000;
}
.status-verified {
    background-color: #008000 !important;
    color: #FFFFFF;
   }*/


/****************************************************/
/* Small devices (landscape phones, 576px and up)   */
/****************************************************/
/*@media (min-width: 576px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}*/

/****************************************************/
/* Medium devices (tablets, 768px and up)*/
/****************************************************/
/*@media (min-width: 768px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {font-size: 1.0rem; font-weight: 600 !important;
    }

    .h6 {
    }
}*/

/****************************************************/
/*Large devices (desktops, 992px and up)*/
/****************************************************/
/*@media (min-width: 992px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}*/

/****************************************************/
/*X-Large devices (large desktops, 1200px and up)*/
/****************************************************/
/*@media (min-width: 1200px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}*/

/****************************************************/
/*XX-Large devices (larger desktops, 1400px and up)*/
/****************************************************/
/*@media (min-width: 1400px) {
    .h1 {
    }

    .h2 {
    }

    .h3 {
    }

    .h4 {
    }

    .h5 {
    }

    .h6 {
    }
}*/