/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Feb 24, 2016, 9:21:01 AM
    Author     : Petrus Hanafi
*/
.myinput{
    width:100%;
    margin:1px;
    height:1.8em;
}
.myinput_high{
    font-family: arial;
    width:100%;
    padding:0.2em;
    font-size:1.1em;
    margin:5px;
}
.pos_div{
    font-family: arial;
    padding:0.1em;
    font-size:0.9em;
}
.highlight_row{
    
}
.highlight_row :hover{
    cursor:pointer;
    font-weight:bold;
}
.even_row{
    background-color: #E0E0E0;
}
.myinput_textarea{
    width:100%;
    margin:1px;
}
.numinput{
    text-align:right;
}
.mysearch{
    border-bottom:0.2em solid #264A6D;
    height:3em;
    padding:0.5em;
}
.colheader{
    text-align:right;
    font-weight:bold;
}
.lbllink{
    color:blue;
    text-decoration:underline;
}
.lbllink:hover{
    cursor:pointer;
}
.bs-glyphicons{margin:0 -10px 20px;overflow:hidden}
.bs-glyphicons-list{padding-left:0;list-style:none}
.bs-glyphicons li{
    float:left;
    width:25%;
    height:125px;
    padding:10px;
    font-size:10px;
    line-height:1.4;
    text-align:center;
    background-color:#f9f9f9;
    border:1px solid #fff}
.bs-glyphicons .glyphicon{
    margin-top:5px;
    margin-bottom:10px;
    font-size:24px}
.bs-glyphicons .glyphicon-class{
    display:block;
    text-align:center;
    word-wrap:break-word}
.bs-glyphicons li:hover{color:#fff;
      background-color:#563d7c;
      cursor:pointer}
@media (min-width:768px){
    .bs-glyphicons{margin-right:0;margin-left:0}
    .bs-glyphicons li{width:12.5%;font-size:12px}}
/******************************************************************************/
.mynavcontainer{
    border-bottom:0.2em solid #264A6D;
}
.mynavcontainer_fixed{
    border-bottom:0.2em solid #264A6D;
    position:fixed;
    top:0;
    width:95%;
    height:67px;
    left:4%;
    background-color:white;
    z-index:5005;
}
.bsi-glyphicons{margin:0 -10px 0px;overflow:hidden;}
.bsi-glyphicons-list{padding-left:0;list-style:none}
.bsi-glyphicons li{
    float:left;
    width:70px;
    height:65px;
    padding:1px;
    font-size:10px;
    line-height:1;
    text-align:center;
    background-color:#f9f9f9;
    border:1px solid #fff;}
.bsi-glyphicons .glyphicon{
    margin-top:1px;
    margin-bottom:5px;
    font-size:24px}
.bsi-glyphicons .glyphicon-class{
    display:block;
    text-align:center;
    word-wrap:break-word}
.bsi-glyphicons li:hover{color:#fff;
      background-color:#563d7c;
      cursor:pointer}
@media (min-width:768px){
    .bsi-glyphicons{margin-right:0;margin-left:0}
    .bsi-glyphicons li{width:70px;font-size:11px}}
.bsibutton{
    height:55px !important;
    color:black !important;
    background-color:#f9f9f9 !important;
    border:1px solid #fff !important;
}
.bsibutton .glyphicon{
    margin-top:1px;
    margin-bottom:5px;
    font-size:12px}
.bsibutton:hover{
        color:#fff;
      background-color:#563d7c;
      cursor:pointer;
}
.mydropdown{
    float:left !important;
}
.mydropdown:hover{
      color:#fff;
      background-color:#563d7c;
      cursor:pointer;
}
.mybtn{
  padding: 3px 12px !important;
  border-radius: 2px !important;
}
.input-xs-left {
  padding: 2px 5px !important;
  font-size: 12px !important;
  border-radius: 3px 0px 0px 3px !important;
  height:30px !important;
}
.input-xs-right {
  padding: 2px 5px !important;
  font-size: 12px !important;
  border-radius: 0px 3px 3px 0px !important;
  height:30px !important;
}
.mytable{
    font-size:1em;
}
.mytable td{
    font-size:1em;
}
.mybutton{
    border-radius: 0px !important;
    min-width:150px;
}
.file_browse{
margin-left:-145px;
opacity:0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}
.mybadge{
    border-radius: 0px !important;
    min-width:50px;
}
.due0{
    background-color:#5ACC38;
}
.due1{
    background-color:#FFCD20;
}
.due30{
    background-color:#FF9E11;
}
.due60{
    background-color:#F76D08;}
.due90{
    background-color:#E83B00;}
.due120{
    background-color:#D60000;}
pre{
    border-radius:0px !important;
}
.img-responsive{
    width:100%;
}
.infoline{
    color:blue;
    font-size:0.9em;
    font-style:italic;
}
.infoline-fail{
    color:red;
    font-size:0.9em;
    font-style:italic;
}
.menu_row{
    background-color:#03A9F4;
    margin-top:0 !important;
}
.menu_icon_left{
    font-size:1.5em;
}
.menu_icon_left:hover{
    cursor:pointer;
}
.menu_icon_right{
    font-size:1.5em;
    float:right;
        margin-left:15px;
}
.menu_icon_right:hover{
    cursor:pointer;
}
.deletedtd{
    font-style:italic;
    text-decoration: line-through;
}
.main-header .logo .ci-brand-icon{
    height:32px;
    width:32px;
    object-fit:contain;
    vertical-align:middle;
}
.ci-logo-fallback{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    background:#3c8dbc;
    color:#fff;
    font-size:12px;
    font-weight:700;
    border-radius:6px;
    vertical-align:middle;
}
.p-page{
    padding:16px 18px 28px;
}
.p-page-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
    flex-wrap:wrap;
}
.p-page-head h1{
    margin:0;
    font-size:26px;
    font-weight:700;
    color:#102442;
    letter-spacing:-.02em;
}
.p-page-head p{
    margin:3px 0 0;
    color:#64748b;
    font-size:15px;
}
.p-page-actions{
    display:flex;
    align-items:center;
    gap:8px;
}
.p-btn-primary{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:6px;
    height:40px;
    padding:0 16px !important;
    border:0 !important;
    border-radius:8px !important;
    background:#2563eb !important;
    color:#fff !important;
    font-size:15px;
    font-weight:600;
    box-shadow:none !important;
}
.p-btn-primary:hover,
.p-btn-primary:focus{
    background:#1d4ed8 !important;
    color:#fff !important;
}
.p-card{
    background:#fff;
    border-radius:16px;
    padding:14px 16px 16px;
    box-shadow:0 12px 32px rgba(16,36,66,.06);
}
.p-dt-tools{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
    flex-wrap:wrap;
}
.p-dt-tools .dataTables_length,
.p-dt-tools .dataTables_filter{
    float:none !important;
    margin:0 !important;
}
.p-dt-tools label{
    margin:0;
    color:#64748b;
    font-weight:500;
    font-size:15px;
}
.p-dt-tools select,
.p-dt-tools input[type="search"]{
    height:40px;
    border-radius:10px !important;
    border:1px solid #e2e8f0 !important;
    box-shadow:none !important;
    margin-left:6px;
    background:#fff;
    font-size:15px;
}
.p-dt-tools input[type="search"]{
    min-width:240px;
    padding:0 12px;
}
.p-page table.dataTable,
.p-page table.dataTable th,
.p-page table.dataTable td{
    box-sizing:border-box;
}
.p-page table.dataTable{
    margin:0 !important;
    border-collapse:separate !important;
    border-spacing:0;
}
.p-table thead th,
.p-page .dataTables_scrollHead th{
    border-bottom:1px solid #e2e8f0 !important;
    border-top:0 !important;
    color:#64748b;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    background:#f8fafc !important;
    white-space:nowrap;
    padding:6px 8px !important;
    vertical-align:middle !important;
}
.p-table tbody td,
.p-page .dataTables_scrollBody td{
    vertical-align:middle !important;
    color:#0f172a;
    border-color:#f1f5f9 !important;
    padding:6px 8px !important;
    font-size:12px;
}
.p-table tbody tr:hover,
.p-page .dataTables_scrollBody tbody tr:hover{
    background:#f8fafc;
}
.p-page .dataTables_scroll{
    border:0;
}
.p-page .dataTables_scrollHead,
.p-page .dataTables_scrollBody{
    border:0 !important;
}
.p-icon-btn{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:26px;
    height:26px;
    font-size:12px;
    padding:0 !important;
    border:0 !important;
    border-radius:8px !important;
    background:#e2e8f0 !important;
    color:#102442 !important;
    box-shadow:none !important;
    line-height:1;
}
.p-icon-btn:hover,
.p-icon-btn:focus{
    background:#cbd5e1 !important;
    color:#102442 !important;
}
.p-code{
    display:inline-block;
    padding:1px 5px;
    border-radius:6px;
    background:#eff6ff;
    color:#1d4ed8;
    font-family:Consolas,Monaco,monospace;
    font-size:11px;
    font-weight:600;
}
.p-chip{
    display:inline-block;
    padding:1px 6px;
    border-radius:999px;
    background:#f1f5f9;
    color:#334155;
    font-size:11px;
    font-weight:600;
}
.p-name{
    font-weight:600;
    color:#102442;
}
.p-stock{
    display:inline-block;
    min-width:42px;
    padding:2px 8px;
    border-radius:999px;
    background:#ecfdf5;
    color:#047857;
    font-size:11px;
    font-weight:700;
    text-align:center;
    cursor:pointer;
}
.p-stock:hover{
    background:#d1fae5;
}
.p-stock-low{
    background:#fef3c7;
    color:#b45309;
}
.p-stock-low:hover{
    background:#fde68a;
}
.p-meta{
    color:#64748b;
    font-size:11px;
    white-space:nowrap;
}
.p-child-cell{
    padding-left:18px;
    font-style:italic;
    color:#64748b;
    font-weight:400;
}
.p-is-child td{
    background:#fcfcfd;
}
.p-dt-foot{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:12px;
    flex-wrap:wrap;
}
.p-dt-foot .dataTables_info{
    float:none !important;
    padding:0 !important;
    color:#64748b;
    font-size:15px;
}
.p-dt-foot .dataTables_paginate{
    float:none !important;
    margin:0 !important;
    text-align:right;
}
.p-dt-foot .pagination{
    margin:0;
}
.p-dt-foot .pagination > li > a,
.p-dt-foot .pagination > li > span{
    border-radius:8px !important;
    border:1px solid #e2e8f0 !important;
    background:#fff !important;
    color:#334155 !important;
    margin-left:4px;
    padding:6px 12px;
    font-size:14px;
}
.p-dt-foot .pagination > .active > a,
.p-dt-foot .pagination > .active > span,
.p-dt-foot .paginate_button.current{
    background:#2563eb !important;
    border-color:#2563eb !important;
    color:#fff !important;
}
.p-page .dataTables_processing{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:10px;
    box-shadow:0 8px 20px rgba(16,36,66,.08);
    color:#64748b;
    padding:8px 14px;
}
.p-modal{
    z-index:4000;
}
.p-modal-backdrop{
    z-index:3990;
}
.p-modal .modal-content{
    border:0;
    border-radius:12px;
    box-shadow:0 18px 40px rgba(16,36,66,.16);
}
.p-modal .modal-header,
.p-modal .modal-footer{
    border-color:#e2e8f0;
    padding:14px 18px;
}
.p-modal .modal-title{
    font-weight:700;
    color:#102442;
    font-size:20px;
}
.p-modal .modal-body{
    padding:18px 18px 8px;
    max-height:70vh;
    overflow:auto;
}
.p-modal .modal-footer{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
}
.p-modal .modal-footer .btn{
    float:none;
}
.p-btn-danger{
    height:40px;
    min-width:90px;
    font-size:15px;
    border:0 !important;
    border-radius:8px !important;
    background:#dc2626 !important;
    color:#fff !important;
    font-weight:600;
    box-shadow:none !important;
}
.p-btn-danger:hover,
.p-btn-danger:focus{
    background:#b91c1c !important;
    color:#fff !important;
}
.p-form .p-field{
    margin-bottom:14px;
}
.p-form .p-field label{
    display:block;
    margin-bottom:5px;
    color:#334155;
    font-size:14px;
    font-weight:600;
}
.p-form .form-control{
    height:40px;
    border-radius:8px;
    border-color:#e2e8f0;
    box-shadow:none;
    font-size:15px;
}
.p-form .form-control:focus{
    border-color:#93c5fd;
    box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.p-form .p-num{
    text-align:right;
}
.p-form .p-readonly{
    min-height:36px;
    padding:7px 10px;
    border:1px solid #e2e8f0;
    border-radius:8px;
    background:#f8fafc;
    color:#334155;
    font-weight:600;
}
.p-form .p-req{
    color:#dc2626;
}
.um-acl{
    margin-top:6px;
    border:1px solid #e2e8f0;
    border-radius:12px;
    overflow:hidden;
    background:#fff;
}
.um-acl-head,
.um-acl-row{
    display:grid;
    grid-template-columns:minmax(150px,1.6fr) repeat(4,minmax(72px,1fr));
    align-items:center;
}
.um-acl-head{
    background:#f8fafc;
}
.um-acl-head span{
    padding:11px 8px;
    color:#64748b;
    font-size:11px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    text-align:center;
}
.um-acl-head span:first-child{
    padding-left:16px;
    text-align:left;
}
.um-acl-row{
    border-top:1px solid #eef2f7;
}
.um-acl-row:hover{
    background:#f8fafc;
}
.um-acl-name{
    padding:13px 16px;
    color:#102442;
    font-size:14px;
    font-weight:600;
}
.um-acl-cell{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:46px;
}
.p-form .p-field .um-acl-cell label{
    display:flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    margin:0;
    cursor:pointer;
    position:relative;
}
.p-form .p-field .um-acl-cell input{
    position:absolute;
    opacity:0;
    width:20px;
    height:20px;
    margin:0;
}
.p-form .p-field .um-acl-cell span{
    width:20px;
    height:20px;
    border:2px solid #cbd5e1;
    border-radius:6px;
    background:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.p-form .p-field .um-acl-cell label:hover span{
    border-color:#93c5fd;
}
.p-form .p-field .um-acl-cell input:focus + span{
    box-shadow:0 0 0 3px rgba(37,99,235,.18);
}
.p-form .p-field .um-acl-cell input:checked + span{
    background:#2563eb;
    border-color:#2563eb;
}
.p-form .p-field .um-acl-cell input:checked + span:after{
    content:"";
    width:5px;
    height:9px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    transform:rotate(45deg);
    margin-top:-2px;
}
.p-form .p-check{
    display:flex;
    align-items:center;
    gap:8px;
    margin:8px 0 0;
    font-weight:500;
    font-size:15px;
    color:#334155;
    cursor:pointer;
}
.p-form .p-check input{
    margin:0;
}
.p-alert{
    margin:0 0 14px;
    padding:8px 10px;
    border-radius:8px;
    background:#eff6ff;
    color:#1d4ed8;
    font-size:15px;
}
.p-alert-ok{
    background:#ecfdf5;
    color:#047857;
}
.p-alert-fail{
    background:#fef2f2;
    color:#b91c1c;
}
.p-void{
    text-decoration:line-through;
    color:#94a3b8;
    font-weight:600;
}