
.pb0 { padding-bottom:0px; }
.pb15 { padding-bottom:15px; }

.m0 { margin:0px !important; }
.mb0 { margin-bottom:0px !important; }
.mb5 { margin-bottom:5px; }
.mb15 { margin-bottom:15px; }
.mb30 { margin-bottom:30px; }
.mt20 { margin-top:20px; }
.mt30 { margin-top:30px; }

.h168 { min-height: 168px; }
.alertify { 
    position: fixed;left: 0;right: 0;
    display: flex;align-items: center;justify-content: center;
    background: #FFFFFF;padding:15px 0px;font-size: 17px;
    -webkit-animation: alertify 0.3s forwards;
    -moz-animation: alertify 0.3s forwards;
    -o-animation: alertify 0.3s forwards;
    animation: alertify 0.3s forwards;

    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    
     
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown; 
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -o-animation-duration:1s;
    z-index: 999999999999;
}


.alertify .fa { display:inline-block; width:22px; height:22px; line-height: 22px; font-size:14px; margin-right:10px;text-align: center; border-radius: 100%; }

.alertify.success{ background: #27ae60;color:#FFFFFF; }
.alertify.success .fa { background: #FFFFFF;color:#27ae60; }

.alertify.error { background: #E74C3C;color:#FFFFFF; }
.alertify.error .fa { background: #FFFFFF;color:#E74C3C; }

.alertify.warning { background: #f39C12;color:#FFFFFF; }
.alertify.warning .fa { background: #FFFFFF;color:#f39C12; }




@-webkit-keyframes fadeInDown {
    from { top:-500px;  }
    to { top:0px; }
}
@-moz-keyframes fadeInDown {
    from { top:-500px;  }
    to { top:0px; }
}
@keyframes fadeInDown {
    from {  top:-500px;  }
    to {  top:0px; }
}

*::placeholder {
  color: #131313;
}

button[type=submit] .far { margin-right:10px;  }


.old_price { font-weight:normal;text-decoration:line-through ;font-style:normal;color:#999; }


.login {display: flex; align-items: center;justify-content: center;flex-direction:column; }
.login .logo { background: rgb(30, 157, 175);text-align:center;padding:30px;border-top-left-radius:6px;border-top-right-radius:6px;}

.login h1 { font-size:18px; color:rgb(43, 45, 59); padding-bottom:30px; }
.login h1 .fa { margin-right:5px; }

.login form { background:#FFF;padding:40px 30px;box-shadow: 0 3px 16px rgba(142,134,171,.05);border-bottom-left-radius:6px;border-bottom-right-radius:6px; }
.login .actions { display: flex;align-items: center;justify-content: center;color:rgb(101, 109, 154);margin-bottom:30px;margin-top:15px;font-weight:500; }
.login .actions a { margin-left:auto; color:rgb(150, 160, 181);font-weight:500; }

.login .info {  color:rgb(150, 160, 181); margin-top:15px;text-align: center;}



.register {display: flex; align-items: center;justify-content: center;flex-direction:column;height:100%;min-height:100%; }
.register .logo { background: rgb(30, 157, 175);text-align:center;padding:30px;border-top-left-radius:6px;border-top-right-radius:6px; width:768px;max-width:768px;min-width:768px; }

.register .logo img { width:250px;max-width:250px; }

.register h1 { font-size:18px; color:rgb(43, 45, 59); padding-bottom:30px; }
.register h1 .fa { margin-right:5px; }

.register form { background:#FFF;padding:40px 30px;box-shadow: 0 3px 16px rgba(142,134,171,.05);border-bottom-left-radius:6px;border-bottom-right-radius:6px; width:768px; }
.register .actions { display: flex;align-items: center;justify-content: center;color:rgb(101, 109, 154);margin-bottom:30px;margin-top:15px;font-weight:500; }
.register .actions a { margin-left:auto; color:rgb(150, 160, 181);font-weight:500; }

.register .info {  color:rgb(150, 160, 181); margin-top:15px;text-align: center; max-width:768px;min-width:768px;min-width:768px; color:rgb(150, 160, 181); margin-top:15px;text-align: center;}





.sidebar { position:fixed;top:0;left:0;bottom:0;width:270px;display:flex;flex-direction:column;background:rgb(32, 34, 33);color:#cdd5df;overflow-y: auto;-webkit-transition: left .3s linear;-moz-transition: left .3s linear;-o-transition: left .3s linear;transition: left .3s linear;z-index:15; }
.sidebar::-webkit-scrollbar { width: 6px; }
.sidebar::-webkit-scrollbar-track { background: transparent; }
.sidebar::-webkit-scrollbar-thumb {  background-color: rgba(255,255,255,.2); border-radius: 20px; }

.sidebar .logo {  background: rgb(30, 157, 175); padding:30px 0px;height:105px; text-align: center;  margin-bottom:15px;}
.sidebar .logo img { max-height:40px; }

.sidebar .open ul { display: block; }
.sidebar .open > a > .fa{ transform: rotate(180deg);}
.sidebar > ul > li { }

.sidebar ul li a { display:flex;align-items:center;color:rgb(205, 213, 223);font-size:14px;padding:15px 20px;font-weight:500;}
.sidebar ul li.active > a, .sidebar ul li a:hover { background: rgba(30, 157, 175,.1); color:rgb(30, 157, 175); }
.sidebar ul li a .far { width:25px;min-width:25px; }
.sidebar ul li a .fa-angle-down { margin-left:auto; }
.sidebar ul ul { display:none; }
.sidebar ul ul li a { padding-left:40px; }

.sidebar .label-badge { margin-left:auto; }

.sidebar ul li.profile { padding:0px;margin-top:-15px;border-bottom:1px solid rgba(30, 157, 200,.1);  }
.sidebar ul li.profile a{ background: none;color:rgb(30, 157, 175);padding:20px;}


.highlight { background-color: orange; }


.customers .item { display:flex;align-items:flex-start;justify-content:flex-start;position:relative;padding:15px;cursor:pointer;box-shadow: rgba(142, 134, 171, 0.05) 0px 3px 16px 0px;background:#FFF;border-radius:4px;  margin-top:15px; border:1px solid rgb(226, 231, 241);}



.customers .item .left { display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:100%;background:#F9F9F9;min-width:30px;min-height:30px;margin-right:15px;color:#DDDDDD; }
.customers .item.selected .left { background:#2ecc71;color:#FFF; }
.customers .item .code { display:block;font-size:13px; }

.customers .item .name { font-weight:bold; }


.products .form-control { padding:20px; }


.products .left { position:relative; }
.products .item { display:flex;align-items:center;justify-content:flex-start;position:relative;padding:20px;gap:20px;cursor:pointer;box-shadow: rgba(142, 134, 171, 0.05) 0px 3px 16px 0px;background:#FFF;border-radius:4px;  margin-top:15px; border:1px solid rgb(226, 231, 241); text-align: left; }



.products .item .left .fa { display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:4px;background:#EEE;min-width:30px;min-height:30px;color:#999; }
.products .item .left input { position: absolute;top:50%;left:50%;transform: translate(50%, 50%); width:1px;height:1px; }
.products .item .left input:checked ~ .fa{ background:#2ecc71;color:#FFF; }

.products .item .image { max-width:100px; }
.products .item .image img { max-width:100%;width:100%; }

.products .item .code { opacity:0.8; }

.products .item .name { font-weight:bold;margin-top:5px; font-size:14px; }





                  .dropdown-menu {
                        padding: 5px 0;
                        margin: 2px 0 0;
                        font-size: 14px;
                        text-align: left;
                        list-style: none;
                        background-color: #fff;
                        border-radius: 4px;
                        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
                        box-shadow: 0 6px 12px rgba(0,0,0,.175);
                        background-clip: padding-box;
                        max-height: 400px;
                        height: 400px;
                        overflow-y: auto;
                  }

                  .dropdown-menu > li > a {
                          display: block;
                          padding: 10px 15px;
                          color: #333;
                  }

                  .dropdown-menu > li > a:hover,
                  .dropdown-menu > li > a:focus {
                          color: #262626;
                          text-decoration: none;
                          background-color: #f5f5f5;
                  }




.selector { 

position: fixed;
    top: 0px;
    left: 270px;
    right: 0;
    padding: 0px 24px;
    height: 40px;
    min-height: 40px;
    font-size: 12px;
    background: #F5F5F5;
    border-left:1px solid rgba(255,255,255,.1);
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    z-index: 15;

     }




.tools { position: fixed;top: 40px;left:270px;right:0;padding: 0px 24px;height: 65px;min-height: 65px;background-color: #FFF;box-shadow: 0 .75rem 1.5rem #12263f08;display: flex;align-items: center;z-index: 15; }
.tools .left { font-size:18px;font-weight:bold;color:#121926; }
.tools .left span { color:#777;font-weight:400; }
.tools .left .fad { color:rgb(30, 157, 175);margin-right:5px; }


.tools .right { margin-left:auto;display:flex;align-items:center;justify-content:center;gap:10px; }

.mobile-header{ display:none; }

.menu { display:grid;grid-template-columns:repeat(2, minmax(0,50%)); gap:15px; }
.menu li a { display:block;background:#FFF;box-shadow:0 .75rem 1.5rem #12263f08;padding:30px 15px;text-align:center;height:100%;font-size:14px;border-radius:4px; }
.menu li a i { display:block;color:rgb(30, 157, 175);font-size:20px;margin-bottom:15px; }

.subtools { position: fixed;top: 72px;left:240px;right:0;padding: 14px 24px;background-color: #FFF;border-top:1px solid #e3e8ef;border-bottom:1px solid #e3e8ef;box-shadow: 0 .75rem 1.5rem #12263f08;z-index: 14; }
.subtools .label-danger { padding:8px 12px;font-weight:500;font-size:13px; }

.box { background:#FFF;border-radius:6px;box-shadow: rgba(142, 134, 171, 0.05) 0px 3px 16px 0px; }
.box-header { display:flex;align-items:center;justify-content:center;border-bottom:1px dashed rgb(226, 231, 241);padding:30px;}
.box-title { margin-bottom:15px;font-weight:bold; }
.box-price { font-size: 24px;font-weight:bold; }
.box-right { 
    background-color: rgb(244, 246, 249);
    border-radius: 100%;
    color: rgb(149, 160, 197);
    font-size: 24px;
    font-weight: 700;
    height: 60px;
    line-height: 60px;
    width: 60px;
    text-align: center;
    margin-left: auto;
}
.box-footer { padding:30px;color:rgb(150, 160, 181); }
.widget{ background:#FFF;border-radius:4px;box-shadow: rgba(142, 134, 171, 0.05) 0px 3px 16px 0px;margin-top:30px; border: 1px solid rgb(226, 231, 241);  }
.widget-title { font-weight: bold; padding:30px;border-bottom:1px solid #EEE; }
.widget-content { padding:30px; }
.widget-body { overflow-x:hidden;overflow-y:scroll;max-height:400px; }
.widget-item { background:#FFF;border-bottom:1px solid #EEE;padding:30px;}
.widget-header { font-weight: bold;font-size: 16px;margin-bottom: 5px; }
.widget-item p { font-size: 13px;color: #777; margin-bottom: 10px; }




    .switch {
      position: relative;
      display: inline-block;
      width: 60px;
      height: 30px;
    }

    .switch input {
      opacity: 0;
      width: 0;
      height: 0;
    }

   .switch .slider {
      position: absolute;
      cursor: pointer;
      top: 0; left: 0; right: 0; bottom: 0;
      background-color: #e74c3c; /* Pasif - kırmızı */
      transition: 0.3s;
      border-radius: 20px;
    }

   .switch .slider:before {
      position: absolute;
      content: "";
      height: 22px;
      width: 22px;
      left: 4px;
      top: 4px;
      background-color: #ffffff;
      transition: 0.3s;
      border-radius: 50%;
    }

    .switch input:checked + .slider {
      background-color: #2ecc71; /* Aktif - yeşil */
    }

   .switch input:checked + .slider:before {
      transform: translateX(30px);
    }


    .td-image img { max-height:50px; }

.checkbox  { display:flex;align-items:center;justify-content:flex-start; }
.checkbox input  { margin-right:5px; }


                        .nav-tabs { display:flex;align-items:center;justify-content:center;padding:30px;gap:15px;border-bottom:1px solid #EEE;}
                        .nav-tabs>li { flex:1;flex-grow:1; }
                        .nav-tabs>li>a { display:block;background:#EEE;padding:15px;font-weight:500;border-radius:4px;text-align:center; }
                        .nav-tabs>li+li>a{ border-left:1px solid rgb(226, 231, 241); }
                        .nav-tabs>li.active>a{ background:rgb(30, 157, 175);color:#FFF; }
                        .tab-content>.tab-pane { display:none; }
                        .tab-content>.tab-pane.active { display:block; }
                        .tab-content+.tab-content { margin-top:30px; }


.quantity { display:flex;align-items:center;justify-content:center;gap:15px;}
.quantity .form-control { max-width:100px; min-width:75px;text-align:center; }


table {   width: 100% !important; max-width:100% !important;border-collapse: separate;vertical-align:middle; border-spacing: 0;border-radius: 4px; background:#FFF;overflow: hidden; border: 1px solid rgb(226, 231, 241);}


table thead tr th { border-bottom:1px dashed #e2e7f1; }

table thead tr th, table tfoot tr th {  position: relative; padding: 20px 15px; font-weight: 500;background:#FFF; color: #000; text-align: left; vertical-align: middle; }

table tbody tr td {  vertical-align: middle; padding:20px 15px; color: #2b2d3b; overflow-wrap: break-word; box-sizing: border-box; border-bottom: 1px dashed #e2e7f1; background: #FFF; }


table thead tr th:last-child, table tbody tr td:last-child { text-align:right !important; }
table tbody tr td:last-child a:not([class*=btn-]) {  color:rgb(149, 160, 197); display: inline-block; overflow-wrap: break-word;  margin-left:10px;font-size:16px;}


table thead th.sorting:after, table thead th.sorting_asc:after, table thead th.sorting_desc:after { position: absolute; top: 50%; margin-top: -7px; right: 8px; display: block; font-family: 'FontAwesome'; }
table thead th.sorting:after { content: "\f0dc"; color: #ddd; font-size: 0.8em; }
table thead th.sorting_asc:after { content: "\f0de"; }
table thead th.sorting_desc:after { content: "\f0dd"; }


.borderless { border:none; }


.dataTables_wrapper { display:flex;flex-direction:column;gap:30px; }

.dataTables_wrapper table { box-shadow: rgba(142, 134, 171, 0.05) 0px 3px 16px 0px; }

.dataTables_wrapper table tbody { box-shadow:none; }



.dataTables_wrapper table thead tr th, .dataTables_wrapper table tfoot tr th {  background-color: #FFF;border-bottom:1px dashed #e2e7f1; }



.dataTables_wrapper table tfoot tr + tr th {  border-top: 1px dashed #e2e7f1; }


.dataTables_wrapper .form-control { padding:15px; }



.dataTables_top { display:grid;grid-template-columns:minmax(0,80%) minmax(0, 20%); 30px;gap:30px; }

.dataTables_bottom { display:grid;grid-template-columns:minmax(0, 50%) minmax(0, 50%); }


.dataTables_paginate { display:flex;align-items:center;justify-content:flex-end;gap:10px;text-align:right; }

.dataTables_paginate .paginate_button {
    display: inline-block;
    background: #FFF;
    padding: 5px 10px;
    text-align: center;
    cursor: pointer;
    color: #333;
    border:1px solid #EEE;
    border-radius: 4px;
    font-size:12px;
}

.dataTables_paginate .paginate_button.current, 
.dataTables_paginate .paginate_button.current:hover,
.dataTables_paginate .paginate_button.current:active,
.dataTables_paginate .paginate_button.current:focus {
    background: #34495e;
    color:#FFF;
}

.dataTables_paginate .paginate_button.disabled, 
.dataTables_paginate .paginate_button.disabled:hover, 
.dataTables_paginate .paginate_button.disabled:active,
.dataTables_paginate .paginate_button.disabled:focus {
    cursor: not-allowed;
    opacity: 0.6;
}
.dataTables_paginate .paginate_button:hover { cursor: hand; color: #333; background: #FFF; }

@media only screen and (min-width: 1024px) {



.login .logo { width:400px;max-width:400px;min-width:400px;}
.login .logo img { width:250px;max-width:250px; }


.login form { width:400px; }

.login .info { max-width:400px;min-width:400px;min-width:400px; color:rgb(150, 160, 181); margin-top:15px;text-align: center;}




    table thead tr th:first-child, table tbody tr td:first-child, table tfoot tr th:first-child { padding-left:30px !important; }

    table thead tr th:last-child, table tbody tr td:last-child, table tfoot tr th:last-child { padding-right:30px !important; }



    .dataTables_wrapper table thead tr th:first-child, .dataTables_wrapper .table tbody tr td:first-child, .dataTables_wrapper .table tfoot tr th:first-child { padding-left:15px !important; }

    .dataTables_wrapper table thead tr th:last-child, .dataTables_wrapper .table tbody tr td:last-child, .dataTables_wrapper . tabletfoot tr th:last-child { padding-right:15px !important; }


    .dataTables_wrapper table thead tr th, 
    .dataTables_wrapper table tbody tr td, 
    .dataTables_wrapper table tfoot tr th {  padding-right:25px !important; }



    .dataTables_wrapper table tbody tr:last-child td{ border-bottom:0px; }



}
@media only screen and (max-width: 1024px) {

    body { padding:0px 0px 100px 0px; }

    .login { align-items: center;padding:30px;height:100%; }
    .login .logo img { width:200px;max-width:200px; }
    .login .info{ font-size:12px; }

    .switch { height:24px;width:55px; }
    .switch .slider:before { height:18px;width:18px;top:3px;left:3px; }
    .selector, .tools { position:static; }

    .selector { display:none; }

    .mobile-header { position:relative;background:rgb(30, 157, 175);display:flex;align-items:center;justify-content:flex-start;padding:25px 15px;gap:15px; box-shadow: 0 .75rem 1.5rem #12263f08;margin-bottom:30px;color:#FFF; }
    .mobile-header .left { color:#FFF;font-size:24px;}
    .mobile-header .left i { display:block;height:2px;background:#FFF;width:20px; }
    .mobile-header .left i + i { margin-top:5px; }
    .mobile-header .center { position:relative;font-size: 16px;  font-weight: bold;margin-right:auto; text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
    .mobile-header .center span { font-weight:400;opacity:.7; }
    .mobile-header .right { display:block;color:#FFF;font-size:14px;background:rgba(255,255,255,.1);border-radius:4px;padding:5px 10px;transition:all .3s ease;white-space:nowrap; }
    .mobile-header .right:hover { background:#FFF;color:rgb(30, 157, 175); }
    .mobile-header .right .fa { margin-left:5px; }


    .tools  { position:fixed;top:auto;bottom:0;left:0;width:100%;display:block;background:#FFF;gap:0px; padding:0;height:auto;min-height:auto;z-index: 30; }
    .tools .left { display:none; }
    .tools .right { gap:0px; }
    .tools .right [class*=btn-] { flex:1;flex-grow:1;width:100%;border-radius:0px;padding:0px 15px;height:50px;line-height:50px;text-transform:uppercase;font-weight:bold;text-overflow:ellipsis;white-space:nowrap;overflow:hidden; }
    .tools .right [class*=btn-] + [class*=btn-] {border-left:1px solid rgba(255,255,255,.2); }
    .sidebar { display:none; }


    .content { padding:0 15px; }


    table { border:0px;background:none; }
    table thead {display: none;}
    table tbody tr{ display:block;border:1px solid rgb(226, 231, 241); border-radius:4px;overflow:hidden; }
    table tbody tr + tr { margin-top:15px; }
    table tbody tr td { display:flex;align-items:center;justify-content:center; }
    table tbody tr td { padding:10px;text-align:right; }
    table tbody tr td:before { content:attr(data-name);margin-right:auto;font-weight:bold;min-width:125px;max-width:250px;width:125px;text-align:left; }
    table tbody tr td:last-child { border-bottom:0px; }



    .products .item { padding:15px; }
.products .item .left .fa { width:20px;height:20px;min-width:20px;min-height:20px; }

    .products .item .image { max-width: 50px;width: 50px; min-width: 50px; }
    .products .item .image img{ max-width:100%;width:100%; }


    .panel-heading { padding:20px 15px; }
    .panel-body, .panel-list{ padding:20px 15px; }
    .form-control { padding:10px 15px; }
    .products .form-control { padding:15px; }

    .dataTables_wrapper { padding:0px;background:none; }
    .dataTables_top { margin-bottom:15px;gap:15px; }
    .dataTables_bottom { margin-top:30px;display: flex;align-items: center;justify-content: center; flex-direction: column;gap:15px;text-align: center;}
    .dataTables_paginate { display:flex;align-items:center;justify-content:center;gap:5px; }


}




