﻿.listCols th {
    cursor: pointer;
}

@page {
    size: A4 landscape;
}

@media print {
    .navbar-default {
        display: none;
    }
}

@media (min-width: 768px) {
    .ten-columns > .col-lg-2 {
        width: 20%;
    }
}

/* Primary color override */
.btn-primary {
    background-color: #09639a;
    border-color: #09639a;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    background-color: #074f7c;
    border-color: #074f7c;
}
.btn-primary.disabled,
.btn-primary[disabled] {
    background-color: #09639a;
    border-color: #09639a;
}
.label-primary {
    background-color: #09639a;
}
.label-success,
.badge-success {
    background-color: #1ab394;
}
a {
    color: #09639a;
}
a:hover,
a:focus {
    color: #074f7c;
}
.navbar-minimalize {
    background-color: #09639a !important;
    border-color: #09639a !important;
}
.nav > li.active {
    border-left: 4px solid #09639a;
}
body.mini-navbar .nav-header {
    background-color: #09639a;
}
.progress-bar {
    background-color: #09639a;
}

/* Mobile responsive card table */
@media screen and (max-width: 768px) {
    .ibox-content {
        overflow-x: hidden !important;
    }
    table.table-responsive-card {
        display: block !important;
        width: 100% !important;
        table-layout: fixed !important;
        border: none !important;
    }
    table.table-responsive-card > thead {
        display: block !important;
        width: 100% !important;
    }
    table.table-responsive-card > thead > tr {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        padding: 4px 0 !important;
    }
    table.table-responsive-card > thead > tr > th {
        border: none !important;
        padding: 4px 12px !important;
        box-sizing: border-box !important;
    }
    table.table-responsive-card > thead > tr > th:empty {
        display: none !important;
    }
    table.table-responsive-card > thead > tr:last-child {
        display: none !important;
    }
    table.table-responsive-card > tbody {
        display: block !important;
        width: 100% !important;
    }
    table.table-responsive-card > tbody > tr {
        display: block !important;
        margin-bottom: 15px;
        border: 1px solid #e7eaec;
        border-radius: 4px;
        background: #fff;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        overflow: hidden;
    }
    table.table-responsive-card > tbody > tr > td {
        display: block !important;
        padding: 8px 12px !important;
        border: none !important;
        border-bottom: 1px solid #f1f1f1 !important;
        text-align: left;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden;
        word-wrap: break-word;
        overflow-wrap: break-word;
        word-break: break-word;
    }
    table.table-responsive-card > tbody > tr > td:last-child {
        border-bottom: none !important;
    }
    table.table-responsive-card > tbody > tr > td::before {
        content: attr(data-label);
        display: block;
        font-weight: 700;
        text-align: left;
        color: #676a6c;
        margin-bottom: 2px;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }
    table.table-responsive-card > tbody > tr > td[data-label=""]::before {
        display: none;
    }
    table.table-responsive-card > tbody > tr > td .btn-group {
        width: 100%;
    }
    table.table-responsive-card > tbody > tr > td .btn-group a {
        width: 100%;
        text-align: center;
    }
    table.table-responsive-card > tfoot {
        display: block !important;
    }
    table.table-responsive-card > tfoot > tr,
    table.table-responsive-card > tfoot > tr > th {
        display: block !important;
        width: 100% !important;
    }
    /* Thead dropdown menu fix */
    table.table-responsive-card > thead .btn-group {
        position: relative;
    }
    table.table-responsive-card > thead .dropdown-menu {
        right: 0 !important;
        left: auto !important;
    }
    /* Dashboard responsive */
    .dashboard-title-responsive {
        display: flex;
        flex-direction: column;
    }
    .dashboard-title-responsive > .pull-right {
        float: none !important;
        padding: 10px 0 0 0 !important;
    }
    .dashboard-title-responsive .input-daterange {
        flex-wrap: wrap;
    }
    .ten-columns > [class*="col-"] {
        margin-bottom: 10px;
    }
    .stat-percent {
        font-size: 11px !important;
    }
    /* Navigation responsive */
    .navbar-top-links {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        float: none !important;
        padding: 0 10px;
    }
    .navbar-top-links > li {
        float: none !important;
    }
    .navbar-top-links .welcome-message {
        display: none;
    }
    /* Sidebar mobile: hidden by default, slide in from left */
    .navbar-default.navbar-static-side {
        position: fixed !important;
        z-index: 2001;
        width: 220px;
        height: 100% !important;
        overflow-y: auto;
        left: 0;
        top: 0;
        transform: translateX(-220px);
        transition: transform 0.3s ease;
        background-color: #2f4050 !important;
    }
    body:not(.mini-navbar) .navbar-default.navbar-static-side {
        transform: translateX(0);
    }
    /* Sidebar overlay - controlled via JS inline styles */
    /* Page wrapper full width on mobile */
    #page-wrapper {
        margin-left: 0 !important;
    }
    .navbar-static-side .sidebar-collapse a[href="https://www.akuple.com/"] {
        position: static !important;
        display: block;
        text-align: center;
        padding: 15px 0;
    }
    .navbar-static-side .sidebar-collapse a[href="https://www.akuple.com/"] img {
        position: static !important;
        max-width: 120px !important;
    }
    /* Wrapper overflow control */
    .wrapper-content,
    .wrapper.wrapper-content {
        overflow-x: hidden !important;
    }
}
