html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
 /* margin-bottom: 60px;*/
}

.nav-sidebar {
    background: #0e2337;
    position:-webkit-sticky;
    position: sticky !important;
    top:0;
    height:100vh;
}
    .nav-sidebar.a {
        color: #9ea9b4;
    }
        .nav-sidebar.a:active {
            color: #00bac7;
        }

.main {
    background: #f1f5f7;
    overflow-y: auto;
}
.nav-link {
    color: #9ea9b4 !important;
}
    .nav-link:hover {
        color: #00bac7 !important;
    }

.theme-color {
    color: var(--theme-color);
}
/*Create a variable of the theme color*/
:root {
    --theme-color: #00bac7;
}

.card-shadow {
box-shadow:0 0.1875rem 0.1875rem 0 rgba(14, 34, 56, .07)
}
.dt-input {
    width: 300px; /* Set the width */
    border: 2px solid #007BFF; /* Border color */
    border-radius: 5px; /* Rounded corners */
    padding: 5px; /* Padding inside the input */
    font-size: 16px; /* Font size */
    margin-left:5px;
}

.pointer {
cursor:pointer;
}

.nw.o2 {
    color: #0058fa;
}
.nw.vodafone {
    color: #e60000;
}
nw.unknown {
    color: #4e4848;
}

.oalnk {
    text-decoration: none;
    color: #fff;
}
    .oalnk:hover {
        color: #fff;
    }

.homecard {
    background: linear-gradient(135deg, #0e2436, #2595c1, #3c696c);
    border-radius: 5px;
    align-items: center !important;
}

.blinking {
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0.3;
    }
}

.nav-link.active {
    color: #5be1eb !important;
    font-weight: 400;
}

.bg-oa {
    background: #c7e9eb;
}
    .bg-oa .list-group-item {
        background-color: inherit;
        color: inherit;
       
    }

.oa-badge {
    display: inline-block;
    padding: 0.35em 1em;
    font-size: 0.85em;
    font-weight: normal;
    line-height: 1;
    color: #ffffff;
    background-color: #103f42;
    text-align: center;
    white-space: normal; /* Allow text to wrap if needed */
    vertical-align: baseline;
    line-height: 1.25em;
    /* border-radius: 50rem; */ /* Uncomment if pill shape is desired */
}

.bg-rejected {
    background: #8d3f32;
}
.bg-duplicate {
    background: #ff5722;
}

.filter.active {
    outline: 3px solid rgba(48, 115, 124, 1);
    outline-offset: 2px;
}

.product {
   

   padding: 0.4em;
   margin: 0.1em;
 
}

    .product.suggestion {
        color: #198754;
        border: solid #198754 1px;
        border-radius: 3px;
    }
    .product.current {
        color: #000;
        border:solid #494f54 1px;
        border-radius:3px;
 
    }
/*
    .product.bolton {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-bootstrap' viewBox='0 0 16 16'%3E%3Cpath d='M5.062 12h3.475c1.804 0 2.888-.908 2.888-2.396 0-1.102-.761-1.916-1.904-2.034v-.1c.832-.14 1.482-.93 1.482-1.816 0-1.3-.955-2.11-2.542-2.11H5.062zm1.313-4.875V4.658h1.78c.973 0 1.542.457 1.542 1.237 0 .802-.604 1.23-1.764 1.23zm0 3.762V8.162h1.822c1.236 0 1.887.463 1.887 1.348 0 .896-.627 1.377-1.811 1.377z'/%3E%3Cpath d='M0 4a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4zm4-3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V4a3 3 0 0 0-3-3z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: top;
        background-size: 1em 1em;
    }*/

.table-compact > :not(caption) > * > * {
    padding: 0.25rem 0.25rem;
}

/* Sidebar default state */
.nav-sidebar {
    transition: all 0.3s ease;
}

    /* Collapsed state */
    .nav-sidebar.collapsed {
        width: 60px !important;
    }

        .nav-sidebar.collapsed .nav-link span,
        .nav-sidebar.collapsed .sidebar-label {
            display: none;
        }

    .nav-sidebar .nav-link {
        white-space: nowrap;
        overflow: hidden;
    }

        .nav-sidebar .nav-link svg {
            margin-right: 8px;
        }

    .nav-sidebar.collapsed .nav-link {
        text-align: center;
    }
    .nav-sidebar.collapsed .sidebar-label {
        display: none;
    }
    /* Show full brand info in expanded mode */
    .nav-sidebar:not(.collapsed) .sidebar-full {
        display: inline !important;
    }

    /* Hide in collapsed mode */
    .nav-sidebar.collapsed .sidebar-full {
        display: none !important;
    }

    /* Show short version only in collapsed */
    .nav-sidebar:not(.collapsed) .sidebar-collapsed {
        display: none !important;
    }

    .nav-sidebar.collapsed .sidebar-collapsed {
        display: inline !important;
    }
.note-box {
    background: #b8d9ca;
    border: 1px solid #9ebfb0;
    padding: 10px;
    border-radius: 5px;
    margin: 5px 0 5px 0;
    outline: none;
    box-shadow: none;
    min-height: 5em;
}
    .note-box:focus {
        border: 1px solid #007bff; /* Blue border on focus */
        box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); /* Optional subtle glow */
    }

.checked {
    background-color: #bdfdc8 !important;
}
.bg-success-nb {
    background-color: #c7dbd2;
    color:#000;

    --bs-table-striped-bg: --bs-table-striped-color: #000;
    --bs-table-active-bg: #bcd0c7;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #c1d6cc;
    --bs-table-hover-color: #000;
    border-color: #bcd0c7;
}
.nav-sidebar .nav-link i
 {
    margin-right: 8px;
}
.bg-verylight {
    background-color: #e8f1f9;
}

.dashboard-circle {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    box-shadow: 0 0 10px rgba(0,0,0,0.15);
    text-align: center;
    margin: 10px;
    padding: 10px;
}

.dashboard-value {
    font-size: 1.5rem;
}

.dashboard-label {
    font-size: 0.85rem;
}
tr.reversal > td {
    background-color: #a7c3fb !important;
}
.halo-card {
    position: relative;
    border-radius: 0.5rem; /* match card's border-radius */
    box-shadow: 0 0 15px 3px #80e0ed; /* glow halo */
    transition: box-shadow 0.3s ease-in-out;
}

    .halo-card:hover {
        box-shadow: 0 0 25px 10px #80e0ed; /* stronger glow on hover */
    }