/* QAQC v15 - giao dien noi bo thuc dung, it mau me, tuong thich Bootstrap 3 / WebForms */
html, body { font-family: Arial, Helvetica, sans-serif; color: #1f2933; }
body.bodycontent, body.admin-pro-body { background: #f3f5f8 !important; }
a { color: #1d4f91; }
a:hover, a:focus { color: #123b6d; }

/* Layout chung */
.navbar-inverse, .admin-topbar { background: #1f2937 !important; border-color: #1f2937 !important; box-shadow: none !important; }
.navbar-brand span, .admin-brand { color: #fff !important; font-weight: 700; letter-spacing: 0; }
.admin-brand small { color: #b8c2cc !important; font-weight: 400; }
.user-menu .dropdown-toggle, .admin-user-box { color: #e5e7eb !important; }
.sidebar, .admin-sidebar { background: #ffffff !important; border-right: 1px solid #d8dee8 !important; box-shadow: none !important; }
.sidebar .nav.menu > li > a, .sidebar .nav.menu > li .aspNetDisabled,
.admin-menu a, .admin-menu .aspNetDisabled { border-radius: 6px !important; border: 1px solid transparent !important; background: transparent !important; color: #263241 !important; padding: 9px 10px !important; }
.sidebar .nav.menu > li > a:hover, .sidebar .nav.menu > li > a:focus,
.admin-menu a:hover, .admin-menu a:focus { background: #f1f5f9 !important; border-color: #dbe3ee !important; color: #0f2942 !important; text-decoration: none !important; }
.sidebar .nav.menu > li > a i, .admin-menu i { color: #53667d !important; }
.sidebar .menu-section, .admin-section-title { color: #7a8796 !important; font-size: 11px !important; letter-spacing: .45px !important; font-weight: 700 !important; padding-top: 14px !important; }
.sidebar .menu-desc { color: #7f8b99 !important; font-size: 11px !important; }
.main, .admin-main { padding-top: 20px !important; }

/* Header page */
.pro-page, .admin-page { color: #1f2933; }
.pro-hero, .admin-page-header {
    background: #ffffff !important;
    color: #1f2933 !important;
    border: 1px solid #d8dee8 !important;
    border-left: 4px solid #1d4f91 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 16px 18px !important;
    margin-bottom: 16px !important;
}
.pro-hero h1, .admin-page-header h1 { font-size: 22px !important; line-height: 28px !important; margin: 0 0 5px 0 !important; color: #1f2933 !important; font-weight: 700 !important; }
.pro-hero p, .admin-page-header p, .pro-page-desc { color: #5f6b7a !important; font-size: 13px !important; line-height: 20px !important; margin: 0 !important; }
.pro-section-title, .section-title-plain { font-size: 16px !important; color: #1f2933 !important; font-weight: 700 !important; margin: 12px 0 10px 0 !important; }

/* Card thong tin */
.pro-card, .admin-page-card, .pro-form-card, .pro-stat-card, .action-panel, .form-panel, .data-panel {
    background: #ffffff !important;
    border: 1px solid #d8dee8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}
.admin-page-card { margin-bottom: 16px !important; }
.admin-page-card .card-head { background: #ffffff !important; border-bottom: 1px solid #e4e9f0 !important; padding: 15px 16px !important; }
.admin-page-card .card-body { padding: 16px !important; }
.pro-card { padding: 14px 15px !important; min-height: 96px !important; margin-bottom: 12px !important; }
.pro-card:hover, .pro-action:hover, .pro-action-card:hover { box-shadow: none !important; }
.pro-card .pro-icon, .pro-stat-icon, .pro-action i, .pro-action-card i {
    background: #eef2f6 !important;
    color: #53667d !important;
    border-radius: 6px !important;
}
.pro-card-title, .pro-stat-label { color: #6b7786 !important; font-size: 12px !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 700 !important; }
.pro-card-value, .pro-stat-value { color: #17202c !important; font-size: 19px !important; line-height: 26px !important; font-weight: 700 !important; }

/* Nut thao tac */
.pro-action, .pro-action-card, .quick-action {
    display: block;
    background: #ffffff !important;
    border: 1px solid #d8dee8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 13px 14px !important;
    margin-bottom: 10px !important;
    color: #1f2933 !important;
    text-decoration: none !important;
    min-height: 88px !important;
}
.pro-action:hover, .pro-action-card:hover, .quick-action:hover { background: #f8fafc !important; border-color: #b9c5d4 !important; }
.pro-action b, .pro-action-card b, .quick-action b { display: block; color: #17202c !important; font-size: 14px !important; line-height: 19px !important; margin-bottom: 3px !important; }
.pro-action span, .pro-action-card span, .quick-action span { color: #687789 !important; font-size: 12px !important; line-height: 17px !important; }
.quick-action.is-danger { border-color: #f0c5c5 !important; }
.quick-action.is-danger i { background: #fff1f1 !important; color: #b42318 !important; }
.quick-action.is-money i { background: #edf7ed !important; color: #237a3a !important; }
.quick-action.is-warning i { background: #fff7e6 !important; color: #936000 !important; }

/* Form */
.pro-form-card, .form-panel { padding: 18px !important; margin-bottom: 16px !important; }
.pro-form-card label, .form-panel label, .control-label { font-weight: 700 !important; color: #263241 !important; font-size: 13px !important; margin-bottom: 6px !important; }
.form-control, .pro-form-card .form-control, .form-panel .form-control {
    border-radius: 6px !important;
    border-color: #c8d1dd !important;
    box-shadow: none !important;
    height: 38px;
    color: #17202c;
}
.form-control:focus { border-color: #1d4f91 !important; box-shadow: 0 0 0 2px rgba(29,79,145,.12) !important; }
.help-text { color: #6b7786; font-size: 12px; line-height: 18px; margin-top: 5px; }
.form-actions { border-top: 1px solid #e4e9f0; padding-top: 14px; margin-top: 14px; }
.btn { border-radius: 6px !important; font-weight: 700 !important; }
.btn-primary { background: #1d4f91 !important; border-color: #1d4f91 !important; }
.btn-primary:hover, .btn-primary:focus { background: #173f75 !important; border-color: #173f75 !important; }
.btn-success { background: #237a3a !important; border-color: #237a3a !important; }
.btn-danger { background: #b42318 !important; border-color: #b42318 !important; }
.btn-warning { background: #b76e00 !important; border-color: #b76e00 !important; color: #fff !important; }
.btn-default { background: #fff !important; border-color: #c8d1dd !important; color: #263241 !important; }

/* Bang */
.pro-table-wrap, .table-responsive-soft { overflow-x: auto; }
.pro-table, table.pro-table, .table { background: #fff; }
.pro-table thead th, .table thead th {
    background: #f1f4f8 !important;
    color: #3f4c5d !important;
    border-bottom: 1px solid #d8dee8 !important;
    font-size: 12px;
    font-weight: 700;
    vertical-align: middle !important;
}
.pro-table tbody td, .table tbody td { border-top: 1px solid #e7ebf1 !important; vertical-align: middle !important; }
.table > tbody > tr:hover { background: #fafcff; }
.pro-toolbar, .filter-bar { background: #f8fafc !important; border: 1px solid #d8dee8 !important; border-radius: 8px !important; padding: 12px !important; margin-bottom: 12px !important; }
.pro-badge-ok, .pro-badge-lock, .pro-badge-muted, .status-badge { border-radius: 4px !important; padding: 4px 8px !important; font-size: 12px !important; font-weight: 700 !important; }
.pro-badge-ok { background: #e8f5ea !important; color: #237a3a !important; }
.pro-badge-lock { background: #fdecec !important; color: #b42318 !important; }
.pro-badge-muted { background: #eef2f6 !important; color: #53667d !important; }

/* Thong bao */
.pro-note, .notice-box {
    border: 1px solid #c8d8ee !important;
    border-left: 4px solid #1d4f91 !important;
    background: #f6f9fd !important;
    color: #27364a !important;
    border-radius: 6px !important;
    padding: 11px 12px !important;
    line-height: 19px !important;
    margin-bottom: 14px !important;
}
.pro-warning, .notice-warning { border-color: #edd9a3 !important; border-left-color: #b76e00 !important; background: #fffaf0 !important; color: #5f3d00 !important; }
.notice-danger { border-color: #f0c5c5 !important; border-left-color: #b42318 !important; background: #fff6f6 !important; color: #7a1d16 !important; }
.red { color: #b42318; }

/* Login */
.login-v15-body { background: #f3f5f8; }
.login-v15-wrap { max-width: 420px; margin: 46px auto; padding: 0 14px; }
.login-v15-card { background: #fff; border: 1px solid #d8dee8; border-radius: 8px; padding: 24px; box-shadow: 0 4px 18px rgba(31,41,55,.08); }
.login-v15-title { font-size: 22px; font-weight: 700; color: #17202c; margin: 0 0 6px 0; }
.login-v15-sub { color: #687789; font-size: 13px; margin-bottom: 18px; }
.login-v15-card label { display:block; font-weight:700; color:#263241; margin-bottom:6px; }
.login-v15-card .txt, .login-v15-card input[type=text], .login-v15-card input[type=password] { width:100%; height:38px; border:1px solid #c8d1dd; border-radius:6px; padding:7px 10px; box-shadow:none; }
.login-v15-actions { margin-top: 14px; overflow: hidden; }
.login-v15-note { margin-top: 12px; color:#6b7786; font-size:12px; line-height:18px; }

@media (max-width: 767px) {
    .main, .admin-main { padding: 12px !important; }
    .pro-hero, .admin-page-header { padding: 14px !important; }
    .pro-action, .pro-action-card, .quick-action { min-height: auto !important; }
    .pro-card { min-height: auto !important; }
    .form-actions .btn { display:block; width:100%; margin:8px 0 0 0 !important; }
    .text-right { text-align:left !important; }
}

/* QAQC v18 - dashboard quan tri va canh bao nguoi choi */
.pro-stat-compact { min-height: 82px !important; padding: 13px 15px !important; }
.pro-stat-compact .pro-stat-value { font-size: 21px !important; }
.admin-kpi-line { display:block; padding:8px 0; border-bottom:1px solid #e7ebf1; }
.admin-kpi-line:last-child { border-bottom:0; }
.admin-kpi-label { color:#687789; font-size:12px; }
.admin-kpi-value { color:#17202c; font-size:18px; font-weight:700; }
.data-alert-list { margin:0; padding:0; list-style:none; }
.data-alert-list li { padding:8px 0; border-bottom:1px solid #e7ebf1; }
.data-alert-list li:last-child { border-bottom:0; }
.table .btn-sm { padding:4px 8px !important; font-size:12px !important; }
.notice-box + .notice-box { margin-top: -4px; }
@media (max-width:767px) {
    .pro-stat-compact { min-height:auto !important; }
    .admin-page-card .card-body { padding:12px !important; }
}