body, ul, ol, h1,h2,h3,h4,h5,h6,form,li,p{margin:0;padding:0;margin-top: 0px;}
body {
  background: #efefef none repeat scroll 0 0;
  color: var(--cor_texto_site);
  font-family: var(--fonte_site) !important;
  font-size: var(--tam_texto_site) !important;
  font-weight: normal;
  line-height: 20px;
  margin: 0;
  padding: 0;
}

a{text-decoration:none; color:#333;}
* {margin:0; padding:0; list-style:none; vertical-align:baseline; margin:0;}
ol,li,ul {list-style:none;}

.container {width: 95% !important; max-width: var(--largura_maxima_site);}
.main-content{margin: 20px 0}

.page-header { margin: 0 0 25px; padding-bottom: 5px; border-bottom: 2px solid var(--cor5); }  
.page-header h1 { font-size: 24px; font-weight: 600; color: #333; margin: 0; }  

div.dataTables_wrapper div.dataTables_length select{float: left; margin-right: 10px}
div.dataTables_wrapper div.dataTables_length label{ line-height: 33px;  width: 50%;}
/* ---------------------- footer --------------------*/
.footer {
  background-color: #f5f5f5;
  padding: 20px 0;
  margin-top: 30px;
  border-top: 1px solid #e7e7e7;
}

/*----------- Botao model ---------------*/
.btn-model{background: var(--cor5); transition: background 0s; color:#fff !important;}
.btn-model:hover{ background: var(--cor7);  transition: background 0.5s; color:#fff;}


/* ---------------------- dashboard --------------------*/
/* Cards */  
#dashboard .dashboard-card { background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 25px; overflow: hidden; height: 100%; transition: transform 0.3s ease, box-shadow 0.3s ease; }  
#dashboard .dashboard-card:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0,0,0,0.15); }  
#dashboard .card-header { background-color: var(--cor5); color: white; padding: 15px 20px; font-weight: 500; font-size: 18px; display: flex; align-items: center; }  
#dashboard .card-header i { margin-right: 10px; font-size: 20px; }  
#dashboard .card-body { padding: 20px; }  
/* Perfil do usuário */  
#dashboard .profile-card { text-align: center; }  
#dashboard .profile-avatar { width: 120px; height: 120px; border-radius: 50%; background-color: #f5f5f5; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; font-size: 50px; color: #00a0e3; box-shadow: 0 3px 10px rgba(0,0,0,0.1); }  
#dashboard .profile-name { font-size: 22px; font-weight: 600; margin-bottom: 15px; color: #333; }  
#dashboard .profile-badges { margin-bottom: 20px; }  
#dashboard .badge { display: inline-block; padding: 5px 10px; margin: 0 3px 5px; border-radius: 30px; font-size: 12px; font-weight: 500; }  
#dashboard .badge-default { background-color: #777; color: white; }  
#dashboard .badge-primary { background-color: #00a0e3; color: white; }  
#dashboard .badge-warning { background-color: #f0ad4e; color: white; }  
#dashboard .badge-success { background-color: #5cb85c; color: white; }  
#dashboard .badge-danger { background-color: #d9534f; color: white; }  
#dashboard .profile-info { margin-top: 15px; padding-top: 15px; border-top: 1px solid #eee; }  
#dashboard .profile-info-item { margin-bottom: 10px; font-size: 14px; }  
#dashboard .profile-info-label { font-weight: 600; color: #555; }  
#dashboard .profile-discount { margin-top: 20px; padding: 10px; background-color: #f8f9fa; border-radius: 5px; }  
#dashboard .discount-badge { background-color: #28a745; color: white; padding: 5px 15px; border-radius: 30px; font-size: 16px; font-weight: 600; }  
/* Estatísticas */  
#dashboard .stats-container { display: flex; flex-wrap: wrap; margin: -10px; }  
#dashboard .stat-card { flex: 1 0 calc(50% - 20px); margin: 10px; padding: 20px; border-radius: 8px; text-align: center; transition: transform 0.3s ease; min-height: 130px; display: flex; flex-direction: column; justify-content: center; align-items: center; }  
#dashboard .stat-card:hover { transform: scale(1.03); }  
#dashboard .stat-orders { background-color: #f8f9fa; border-left: 5px solid #00a0e3; }  
#dashboard .stat-credits { background-color: #f8f9fa; border-left: 5px solid #28a745; }  
#dashboard .stat-pending { background-color: #f8f9fa; border-left: 5px solid #f0ad4e; }  
#dashboard .stat-debt { background-color: #f8f9fa; border-left: 5px solid #d9534f; }  
#dashboard .stat-value { font-size: 36px; font-weight: 700; margin-bottom: 5px; line-height: 1; }  
#dashboard .stat-orders .stat-value { color: #00a0e3; }  
#dashboard .stat-credits .stat-value { color: #28a745; }  
#dashboard .stat-pending .stat-value { color: #f0ad4e; }  
#dashboard .stat-debt .stat-value { color: #d9534f; }  
#dashboard .stat-label { font-size: 14px; color: #555; font-weight: 500; }  
/* Ações rápidas */  
#dashboard .action-buttons { margin-top: 20px; }  
#dashboard .btn-action { display: block; width: 100%; padding: 15px; margin-bottom: 15px; border-radius: 5px; text-align: center; font-weight: 600; font-size: 16px; transition: all 0.3s ease; text-decoration: none; border: none; }  
#dashboard .btn-primary { background-color: #00a0e3; color: white; }  
#dashboard .btn-primary:hover { background-color: #0089c3; color: white; text-decoration: none; }  
#dashboard .btn-success { background-color: #5cb85c; color: white; }  
#dashboard .btn-success:hover { background-color: #4cae4c; color: white; text-decoration: none; }  
/* Atividade recente */  
#dashboard .activity-list { list-style: none; padding: 0; margin: 0; }  
#dashboard .activity-item { padding: 15px 0; border-bottom: 1px solid #eee; display: flex; align-items: center; }  
#dashboard .activity-item:last-child { border-bottom: none; }  
#dashboard .activity-icon { width: 40px; height: 40px; border-radius: 50%; background-color: #f5f5f5; display: flex; align-items: center; justify-content: center; margin-right: 15px; color: #00a0e3; }  
#dashboard .activity-content { flex: 1; }  
#dashboard .activity-title { font-weight: 600; margin-bottom: 5px; color: #333; }  
#dashboard .activity-time { font-size: 12px; color: #777; }
  
/*--------------------------- Tela manutenção -------------------*/
#divManutencaoFull{position:absolute;width:100%;height:100%;background-color:#000;opacity:0.97;filter:alpha(opacity=97);z-index:900;display:none;}
#divManutencaoCenter{margin:0 auto;margin-top:180px;width:375px;height:150px;background-color:#FFF;border:1px solid #F30;border-radius:7px;z-index:901;padding:5px;}
#divManutencaoCenter .titulo{float:left;width: 375px;height:28px;line-height:28px;border-bottom:1px dotted #000;font-size:22px;color:#F30;font-weight:bold;margin-bottom:7px;}
#divManutencaoCenter .descricao{float:left;width: 375px;height:80px;line-height:100%;font-size:15px;color:#000;}
#divManutencaoCenter .botaoFecharAviso{text-align:center;margin-top:10px;width: 375px;float:left;font-weight:bold;text-decoration:underline;cursor:pointer}
#divManutencaoCenter .botaoFecharAviso:hover{color:#F30}

/*--------------------------- Pedidos list -------------------*/
#pedidos .card {
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  margin-bottom: 20px;
  overflow: hidden;
}
  
#pedidos .card-header {
  background-color: var(--cor5);
  color: white;
  padding: 15px;
  font-weight: 500;
  font-size: 16px;
}
  
#pedidos .card-body {
  padding: 15px;
}

/* Menu lateral */
#pedidos .sidebar-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
  
#pedidos .sidebar-menu li {
  border-bottom: 1px solid #eee;
}
  
#pedidos .sidebar-menu li:last-child {
  border-bottom: none;
}
  
#pedidos .sidebar-menu li a {
  display: block;
  padding: 12px 15px;
  color: #555;
  text-decoration: none;
  transition: all 0.3s ease;
}
  
#pedidos .sidebar-menu li a:hover {
  background-color: #f9f9f9;
  color: var(--cor5);
  padding-left: 20px;
}
  
#pedidos .sidebar-menu li a i {
  margin-right: 10px;
  width: 20px;
  text-align: center;
}

#pedidos .sidebar-menu .badge {
  background-color: var(--cor5);
  margin-top: 2px;
}

#pedidos .tit-lg {
  display: none;
  font-weight: bold;
  float: left;
  margin-right: 5px;
}

#pedidos .act-open-pedido{color:var(--cor9) ;text-decoration: underline;}
#pedidos .act-open-pedido:hover{color: var(--cor5); cursor: pointer}

#pedidos #table-pedidos{width: 100% !important}
#pedidos .dataTables_info{text-align: left !important; padding: 15px 0 !important}
#pedidos .pagination{float: right !important;} 
#pedidos .idssb{text-decoration: none}
#pedidos .idssb:hover{text-decoration: underline;}


/*--------------------------- Pedidos view -------------------*/
#pedidos-view .order-container { background-color: #fff;  border-radius: 8px;  box-shadow: 0 2px 10px rgba(0,0,0,0.1);  margin-bottom: 25px;  overflow: hidden;  }
#pedidos-view .order-header {background-color: var(--cor5); color: white; padding: 20px; position: relative; }
#pedidos-view .order-id {font-size: 28px;  font-weight: 700;  margin: 0;  }
#pedidos-view .order-date {  font-size: 14px; opacity: 0.9;  margin-top: 5px;  }
#pedidos-view .order-status {  background-color: var(--cor7);  border-left: 5px solid var(--cor1);  padding: 10px 15px;  font-weight: 600;  margin-top: -50px;  border-radius: 0 4px 4px 0;  float: right; }  
#pedidos-view .order-body {padding: 20px;}
#pedidos-view .section-title {font-size: 18px; font-weight: 600; color: #333; margin-bottom: 15px; padding-bottom: 5px; border-bottom: 2px solid var(--cor5);  }
/* Resumo do pedido */
#pedidos-view .order-summary {margin-bottom: 30px; }
#pedidos-view .summary-item {margin-bottom: 10px; display: flex; align-items: flex-start; }
#pedidos-view .summary-label {font-weight: 700; width: 180px; color: #555;}
#pedidos-view .summary-value {flex: 1; }
/* Tabela de produtos */
#pedidos-view .products-table {width: 100%; border-collapse: collapse; margin-bottom: 30px;}
#pedidos-view .products-table th { background-color: #f5f5f5; padding: 12px 15px; text-align: left; font-weight: 600; color: #333; border-bottom: 2px solid #ddd;}
#pedidos-view .products-table td {padding: 15px; border-bottom: 1px solid #eee; vertical-align: top;}
#pedidos-view .products-table tr:hover { background-color: #f9f9f9;}
#pedidos-view .product-image { max-width: 90px; max-height: 80px; object-fit: cover; border-radius: 4px;border: 1px solid #eee;}
#pedidos-view .product-name {font-weight: 600; font-size: 16px; margin-bottom: 5px; color: #333;}
#pedidos-view .product-details {margin-top: 8px;}
#pedidos-view .product-tag {display: inline-block; background-color: #f0f0f0; padding: 3px 8px; border-radius: 3px; margin-right: 5px; margin-bottom: 5px; font-size: 12px; color: #555;}
#pedidos-view .product-price { font-weight: 600; font-size: 16px; color: #333;}
#pedidos-view .price-original { text-decoration: line-through; color: #999; font-size: 14px;display: block;}
/* Status dos produtos */
#pedidos-view .status-badge { display: inline-block; padding: 0px 10px; border-radius: 4px; font-size: 12px; font-weight: 600; margin-bottom: 0px;}
#pedidos-view .status-waiting { background-color: #ffc107; color: #333;}
#pedidos-view .status-default { background-color: #ccc; color: 333;}
#pedidos-view .status-approved { background-color: #28a745; color: white;}
#pedidos-view .status-rejected { background-color: #dc3545; color: white;}
#pedidos-view .status-message { background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24;padding: 10px; border-radius: 4px; margin-bottom: 10px; font-size: 13px;}
/* Botões de ação */
#pedidos-view .action-buttons { margin-top: 10px;}
#pedidos-view .btn-action {display: inline-block; padding: 6px 12px; margin-right: 5px; margin-bottom: 5px; border-radius: 4px; font-size: 13px; font-weight: 500; text-align: center;cursor: pointer; border: none; transition: all 0.3s ease;}  
#pedidos-view .btn-primary {background-color: #00a0e3; color: white; }
#pedidos-view .btn-primary:hover {background-color: #0089c3; color: white;}
#pedidos-view .btn-success {background-color: #28a745; color: white;}
#pedidos-view .btn-success:hover {background-color: #218838; color: white;}
#pedidos-view .btn-danger {background-color: #dc3545; color: white;}
#pedidos-view .btn-danger:hover { background-color: #c82333; color: white;}
#pedidos-view .btn-secondary {background-color: #6c757d; color: white;}
#pedidos-view .btn-secondary:hover {background-color: #5a6268; color: white;}
#pedidos-view .btn-light {background-color: #f8f9fa; color: #333; border: 1px solid #ddd;}
#pedidos-view .btn-light:hover {background-color: #e2e6ea;color: #333;}
/* Informações de entrega e valores */
#pedidos-view .delivery-info, .order-values {background-color: #f8f9fa; border-radius: 4px; padding: 15px; margin-bottom: 20px;}
#pedidos-view .delivery-address {margin-top: 10px; padding: 10px; background-color: white; border-radius: 4px; border: 1px solid #eee;}
#pedidos-view .value-item { display: flex; justify-content: space-between; margin-bottom: 8px;}
#pedidos-view .value-label { font-weight: 500; color: #555;}
#pedidos-view .value-amount { font-weight: 600;}
#pedidos-view .total-value { font-size: 18px; font-weight: 700; color: var(--cor5); border-top: 1px solid #ddd; padding-top: 10px; margin-top: 10px;}

/* Estilos específicos para arquivos */
#pedidos-view .file-item {display: flex; align-items: center;background-color: #f8f9fa; border: 1px solid #ddd; border-radius: 4px; padding: 8px 12px; margin-bottom: 8px;}
#pedidos-view .file-icon {font-size: 18px; margin-right: 10px; color: #6c757d;}
#pedidos-view .file-name { flex: 1; font-size: 13px; color: #333;}
#pedidos-view .file-actions { display: flex;}
#pedidos-view .file-action {font-size: 12px; padding: 3px 8px; margin-left: 5px; border-radius: 3px;cursor: pointer;}
/* Estilos para observações */
#pedidos-view .observation {background-color: #fff3cd; border: 1px solid #ffeeba; color: #856404;padding: 5px 10px; border-radius: 4px; margin: 5px 0; font-size: 13px;}
/* Estilos para NFE */
#pedidos-view .nfe-button { display: inline-block; margin-top: 10px; padding: 8px 15px; background-color: #f8f9fa; border: 1px solid #ddd; border-radius: 4px; color: #333; font-weight: 600; text-decoration: none; transition: all 0.3s ease;}
#pedidos-view .nfe-button:hover { background-color: #e2e6ea;}
#pedidos-view .nfe-button i { margin-right: 5px; }
/* Breadcrumb */
#pedidos-view .breadcrumb { background-color: transparent; padding: 0; margin-bottom: 10px; margin-top: 30px;}
#pedidos-view .breadcrumb-item { font-size: 14px;}
#pedidos-view .breadcrumb-item a { color: #00a0e3; text-decoration: none; }
#pedidos-view .breadcrumb-item a:hover { text-decoration: underline; }
#pedidos-view .breadcrumb-item.active { color: #6c757d; }
#pedidos-view .breadcrumb-item + .breadcrumb-item::before { content: ">"; color: #6c757d; }
/* Resumo do Pedido - Layout Moderno */
#pedidos-view .summary-grid { display: flex; flex-wrap: wrap; margin: 0 -15px; }
#pedidos-view .summary-col { flex: 1; min-width: 300px; padding: 0 15px; }
#pedidos-view .info-group { margin-bottom: 25px; background-color: #f8f9fa; border-radius: 8px; padding: 15px; box-shadow: 0 1px 3px rgba(0,0,0,0.05);}
#pedidos-view .action-cards { display: flex; flex-direction: column; gap: 15px;}
#pedidos-view .action-card {background-color: #f8f9fa; border-radius: 8px; padding: 15px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
#pedidos-view .action-card-title { font-size: 14px; font-weight: 600; color: #6c757d; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #e9ecef;}
#pedidos-view .action-card-buttons { display: flex; flex-wrap: wrap; gap: 8px;}
#pedidos-view .action-card-buttons .btn-action {margin: 0;}
#pedidos-view .notification-card {background-color: #fff3cd; border-left: 4px solid #ffc107; display: flex; align-items: center;}
#pedidos-view .notification-icon { font-size: 24px; color: #ffc107; margin-right: 15px;}
#pedidos-view .notification-text {font-weight: 500; color: #856404;}
/* Melhorias nos botões de ação */
#pedidos-view .btn-action {display: inline-flex; align-items: center; justify-content: center;padding: 8px 16px; margin-right: 0; margin-bottom: 0; border-radius: 6px; font-size: 13px; font-weight: 500; text-align: center; cursor: pointer; border: none; transition: all 0.2s ease; }
#pedidos-view .btn-action i { margin-right: 8px; font-size: 14px;}
#pedidos-view .btn-primary { background-color: #00a0e3; color: white;}
#pedidos-view .btn-primary:hover { background-color: #0089c3; color: white; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1);}
#pedidos-view .btn-success { background-color: #28a745; color: white;}
#pedidos-view .btn-success:hover { background-color: #218838; color: white; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1);}
#pedidos-view .btn-danger { background-color: #dc3545; color: white;}
#pedidos-view .btn-danger:hover { background-color: #c82333; color: white; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1);}
#pedidos-view .btn-secondary { background-color: #6c757d; color: white;}
#pedidos-view .btn-secondary:hover { background-color: #5a6268; color: white; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1);}
#pedidos-view .btn-light { background-color: #f8f9fa; color: #333; border: 1px solid #ddd;}
#pedidos-view .btn-light:hover {background-color: #e2e6ea; color: #333; transform: translateY(-1px);box-shadow: 0 4px 6px rgba(0,0,0,0.05);}


/*--------------------------- comprovantes -------------------*/
#comprovantes .comprovantes-container{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 25px; overflow: hidden}
/* Tabs estilizadas */
#comprovantes .nav-tabs-custom{background: #f8f9fa; border-bottom: 2px solid #ccc; margin-bottom: 10px}
#comprovantes .nav-tabs-custom > li{margin-bottom: 0px; background-color: #dfdfdf}
#comprovantes .nav-tabs-custom > li > a{color: #555; font-weight: 600; padding: 15px 20px; border: none; border-bottom: 2px solid transparent; border-radius: 0; transition: all 0.3s ease}
#comprovantes .nav-tabs-custom > li > a:hover{background-color: #f0f0f0; border-color: transparent; color: #111}
#comprovantes .nav-tabs-custom > li.active > a, #comprovantes .nav-tabs-custom > li.active > a:hover, #comprovantes .nav-tabs-custom > li.active > a:focus{color: #fff; background-color: var(--cor5); border: none; border-bottom: 2px solid var(--cor8)}
/* Conteúdo das tabs */
#comprovantes .tab-content{padding: 20px}
#comprovantes .tab-pane{min-height: 320px}
/* Tabelas */
#comprovantes .table{width: 100% !important; margin-bottom: 20px; border-collapse: separate; border-spacing: 0}
#comprovantes .table > thead > tr > th{background-color: #f5f5f5; color: #333; font-weight: 600; padding: 12px 15px; border-bottom: 2px solid #ddd}
#comprovantes .table > tbody > tr > td{padding: 12px 15px; vertical-align: middle; border-top: 1px solid #eee; color: #555; font-weight: normal}
#comprovantes .table > tbody > tr:hover{background-color: #f9f9f9}
/* Status badges */
#comprovantes .status-badge{display: inline-block; padding: 5px 10px; border-radius: 4px; font-size: 12px; font-weight: 600}
#comprovantes .status-pending{background-color: #ffc107; color: #333}
#comprovantes .status-confirmed{background-color: #28a745; color: white}
/* Botões de ação */
#comprovantes .btn-action{display: inline-flex; align-items: center; justify-content: center; padding: 8px 16px; border-radius: 4px; font-size: 13px; font-weight: 500; cursor: pointer; border: none; transition: all 0.2s ease; background-color: #00a0e3; color: white; float: right}
#comprovantes .btn-action:hover{background-color: #0089c3; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#comprovantes .btn-action i{margin-right: 8px}
#comprovantes #products{margin-top: 30px}
/* Estilos para status de linha */
#comprovantes .text-active{background-color: #fff3cd !important}
#comprovantes .text-info{background-color: #d1ecf1 !important}
/* Mensagem de vazio */
#comprovantes .dataTables_empty{padding: 30px !important; text-align: center !important; font-weight: 600 !important; color: #777 !important}
/* Contador de registros */
#comprovantes .dataTables_info{margin-top: 15px !important; color: #777 !important; text-align: left !important}
#comprovantes .dataTables_paginate{text-align: right !important}

/* ----------------------- creditos ---------------------*/
#creditos .creditos-container{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 25px; overflow: hidden}
/* Cards */
#creditos .card{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 20px; overflow: hidden}
#creditos .card-header{padding: 15px 20px; border-bottom: 1px solid #eee; font-weight: 600; font-size: 16px; color: #fff}
#creditos .card-body{padding: 20px}
/* Saldo de crédito */
#creditos .credit-balance-card{text-align: center; padding: 20px; background-color: #f8f9fa; border-radius: 8px; margin-bottom: 20px}
#creditos .credit-balance-label{font-size: 14px; color: #555; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px}
#creditos .credit-balance-value{font-size: 28px; font-weight: 700; color: var(--cor4)}
/* Botão de adicionar crédito */
#creditos .btn-add-credit{display: flex; align-items: center; justify-content: center; color: white; border: none; border-radius: 8px; padding: 15px 20px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; text-align: center; width: 100%; margin-bottom: 20px}
#creditos .btn-add-credit:hover{transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.1)}
#creditos .btn-add-credit i{margin-right: 10px; font-size: 18px}
/* Alerta de comprovante pendente */
#creditos .alert-pending{background-color: #fff3cd; border-left: 4px solid #ffc107; color: #856404; padding: 15px; border-radius: 4px; margin-bottom: 20px; display: flex; align-items: center}
#creditos .alert-pending i{font-size: 24px; margin-right: 15px; color: #ffc107}
#creditos .alert-pending a{color: #856404; font-weight: 600; text-decoration: underline}
/* Tabela de extrato */
#creditos .table-extrato{width: 100%; border-collapse: separate; border-spacing: 0; margin-bottom: 20px}
#creditos .table-extrato th{background-color: #f5f5f5; color: #333; font-weight: 600; padding: 12px 15px; text-align: left; border-bottom: 2px solid #ddd}
#creditos .table-extrato td{padding: 12px 15px; border-bottom: 1px solid #eee; vertical-align: middle}
#creditos .table-extrato tr:hover{background-color: #f9f9f9}
/* Entradas e saídas */
#creditos .credit-in{color: #28a745; font-weight: 600}
#creditos .credit-out{color: #dc3545; font-weight: 600}
/* Filtros de extrato */
#creditos .extrato-filters{display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; padding-top: 15px; border-top: 1px solid #eee}
#creditos .filter-btn{padding: 8px 15px; border-radius: 20px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s ease; background-color: #f0f0f0; color: #555; border: none}
#creditos .filter-btn:hover{background-color: #e0e0e0; color: #333}
#creditos .filter-btn.active{background-color: var(--cor7); color: white}
/* Saldo anterior */
#creditos .saldo-anterior{background-color: #f8f9fa; font-weight: 600}
/* Botão de comprovantes */
#creditos .btn-comprovantes{display: inline-flex; align-items: center; justify-content: center; background-color: #f8f9fa; color: #333; border: 1px solid #ddd; border-radius: 8px; padding: 12px 20px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; text-align: center; width: 100%; margin-bottom: 20px}
#creditos .btn-comprovantes:hover{background-color: #e9ecef; border-color: #ccc}
#creditos .btn-comprovantes i{margin-right: 10px; font-size: 16px}
/* Conteúdo das tabs */
#creditos .tab-content{padding: 20px}
#creditos .tab-pane{min-height: 320px}
/* Tabelas */
#creditos .table{width: 100% !important; margin-bottom: 20px; border-collapse: separate; border-spacing: 0}
#creditos .table > thead > tr > th{background-color: #f5f5f5; color: #333; font-weight: 600; padding: 12px 15px; border-bottom: 2px solid #ddd}
#creditos .table > tbody > tr > td{padding: 12px 15px; vertical-align: middle; border-top: 1px solid #eee; color: #555; font-weight: normal}
#creditos .table > tbody > tr:hover{background-color: #f9f9f9}


/* ------------------ creditos > comprovantes ----------------*/
#cred-comprov .comprovantes-container{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 25px; overflow: hidden}
#cred-comprov .page-content{padding: 20px}
/* Tabela de comprovantes */
#cred-comprov .table-comprovantes{width: 100%; border-collapse: separate; border-spacing: 0; margin-bottom: 20px}
#cred-comprov .table-comprovantes th{background-color: #f5f5f5; color: #333; font-weight: 600; padding: 12px 15px; text-align: left; border-bottom: 2px solid #ddd}
#cred-comprov .table-comprovantes td{padding: 12px 15px; border-bottom: 1px solid #eee; vertical-align: middle}
#cred-comprov .table-comprovantes tr:hover{background-color: #f9f9f9}
/* Status badges */
#cred-comprov .status-badge{display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; text-transform: uppercase}
#cred-comprov .status-pending{background-color: #ffc107; color: #333}
#cred-comprov .status-sent{background-color: #17a2b8; color: white}
#cred-comprov .status-confirmed{background-color: #28a745; color: white}
/* Botões de ação */
.btn-action{display: inline-flex; align-items: center; justify-content: center; padding: 8px 12px; border-radius: 4px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; margin-left: 5px; border: none}
#cred-comprov .btn-primary{background-color: #00a0e3; color: white}
#cred-comprov .btn-primary:hover{background-color: #0089c3; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#cred-comprov .btn-danger{background-color: #dc3545; color: white}
#cred-comprov .btn-danger:hover{background-color: #c82333; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#cred-comprov .btn-secondary{background-color: #6c757d; color: white}
#cred-comprov .btn-secondary:hover{background-color: #5a6268; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#cred-comprov .btn-light{background-color: #f8f9fa; color: #333; border: 1px solid #ddd}
#cred-comprov .btn-light:hover{background-color: #e2e6ea; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.05)}
#cred-comprov .btn-info{background-color: #17a2b8; color: white}
#cred-comprov .btn-info:hover{background-color: #138496; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#cred-comprov .btn-action i{margin-right: 5px}
/* Estilos para status de linha */
#cred-comprov .text-active{background-color: #fff3cd !important}
#cred-comprov .text-info{background-color: #d1ecf1 !important}
/* Conteúdo das tabs */
#cred-comprov .tab-content{padding: 20px}
#cred-comprov .tab-pane{min-height: 320px}
/* Tabelas */
#cred-comprov .table{width: 100% !important; margin-bottom: 20px; border-collapse: separate; border-spacing: 0}
#cred-comprov .table > thead > tr > th{background-color: #f5f5f5; color: #333; font-weight: 600; padding: 12px 15px; border-bottom: 2px solid #ddd}
#cred-comprov .table > tbody > tr > td{padding: 12px 15px; vertical-align: middle; border-top: 1px solid #eee; color: #555; font-weight: normal}
#cred-comprov .table > tbody > tr:hover{background-color: #f9f9f9}
/* Mensagem de vazio */
#cred-comprov .dataTables_empty{padding: 30px !important; text-align: center !important; font-weight: 600 !important; color: #777 !important}
/* Contador de registros */
#cred-comprov .dataTables_info{margin-top: 15px !important; color: #777 !important; text-align: left !important}
#cred-comprov .dataTables_paginate{text-align: right !important}
/* Botões de ação agrupados */
#cred-comprov .action-buttons{display: flex; justify-content: flex-end; flex-wrap: wrap}

/* ------------------------ perfil ----------------------------*/
#perfil .perfil-container{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); margin-bottom: 25px; overflow: hidden}
#perfil .page-content{padding: 0px}
/* Cards de seção */
#perfil .section-card{background-color: #fff; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); margin-bottom: 20px; overflow: hidden}
#perfil .section-header{background-color: var(--cor5); padding: 15px 20px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center}
#perfil .section-title{font-size: 16px; font-weight: 600; color: #fff; margin: 0}
#perfil .section-body{padding: 20px}
/* Campos de dados */
#perfil .data-field{margin-bottom: 15px}
#perfil .data-label{font-size: 12px; color: #777; margin-bottom: 5px; text-transform: uppercase; font-weight: 600}
#perfil .data-value{background-color: #f8f9fa; border: 1px solid #ddd; border-radius: 4px; padding: 10px 12px; font-size: 14px; color: #333; min-height: 38px; display: flex; align-items: center}
#perfil .data-value.highlight{background-color: #e3f2fd; border-color: #00a0e3; font-weight: 600; color: #00a0e3}
#perfil .data-value.status-active{background-color: #d4edda; border-color: #28a745; color: #155724; font-weight: 600}
#perfil .data-value.status-inactive{background-color: #f8d7da; border-color: #dc3545; color: #721c24; font-weight: 600}
#perfil .data-value.status-warning{background-color: #fff3cd; border-color: #ffc107; color: #856404; font-weight: 600}
#perfil .data-value.status-info{background-color: #d1ecf1; border-color: #17a2b8; color: #0c5460; font-weight: 600}
/* Badges de tipo de conta */
#perfil .account-type-badge{display: inline-block; padding: 6px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; text-transform: uppercase}
#perfil .account-type-client{background-color: #e3f2fd; color: #1976d2}
#perfil .account-type-reseller{background-color: #fff3e0; color: #f57c00}
/* Botões de ação */
#perfil .btn-action{display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border-radius: 4px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; margin-left: 10px; border: none; text-decoration: none}
#perfil .btn-primary{background-color: #00a0e3; color: white}
#perfil .btn-primary:hover{background-color: #0089c3; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#perfil .btn-danger{background-color: #dc3545; color: white}
#perfil .btn-danger:hover{background-color: #c82333; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#perfil .btn-secondary{background-color: #6c757d; color: white}
#perfil .btn-secondary:hover{background-color: #5a6268; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.1)}
#perfil .btn-light{background-color: #f8f9fa; color: #333; border: 1px solid #ddd}
#perfil .btn-light:hover{background-color: #e2e6ea; transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0,0,0,0.05)}
#perfil .btn-action i{margin-right: 8px}
/* API Section */
#perfil .api-section{display: none; margin-bottom: 20px}
#perfil .api-field{margin-bottom: 15px}
#perfil .api-field label{font-size: 12px; color: #777; margin-bottom: 5px; text-transform: uppercase; font-weight: 600; display: block}
#perfil .api-field input{background-color: #f8f9fa; border: 1px solid #ddd; border-radius: 4px; padding: 8px 12px; font-size: 13px; color: #333; width: 100%; font-family: monospace}
/* Área de ações */
#perfil .actions-area{background-color: #f8f9fa; border-top: 1px solid #eee; padding: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap}
#perfil .actions-left{display: flex; flex-wrap: wrap}
#perfil .actions-right{display: flex; flex-wrap: wrap}
/* Toggle button para API */
#perfil .api-toggle{background-color: #f8f9fa; border: 1px solid #ddd; color: #555; font-size: 12px; padding: 6px 12px}
#perfil .api-toggle:hover{background-color: #e9ecef; color: #333}
#perfil .api-toggle i{margin-right: 5px}
