@import url('fonts/BrixSansRegular.css');
@import url('fonts/BrixSansBlack.css');

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
p, label, span, table{
	font-family: 'BrixSansRegular';
	font-size: 9pt;
}
.h2{
	font-family: 'BrixSansBlack';
	font-size: 16pt;
}



.page-header-safi {
    padding-bottom: 44%;
    margin: 40px 0 20px;
    border-bottom: 1px solid #eee;
}

.h21{
	font-family: 'sans-serif;';
	font-size: 36pt;
	background: #0a4661;
    color: #FFF;
    text-align: center;
    padding: 3px;
    margin-bottom: 5px;
}
.h3{
	font-family: 'BrixSansBlack';
	font-size: 12pt;
	display: block;
	background: #0a4661;
	color: #FFF;
	text-align: center;
	padding: 3px;
	margin-bottom: 5px;
}
.h31{
	font-family: 'BrixSansBlack';
	font-size: 20pt;
	/*display: block;*/
	background: #0a4661ab;
	color: #FFF;
	padding: 3px;
	margin-bottom: 5px;
	font-weight: bold;
}

#page_pdf{
	width: 95%;
	margin: 15px auto 10px auto;
}

#factura_head, #factura_cliente, #factura_detalle{
	width: 100%;
	margin-bottom: 10px;
}
.logo_factura{
	width: 25%;
	text-align: left;
}
.info_empresa{
	width: 50%;
	text-align: center;
}
.info_factura{
	width: 25%;
	text-align: right;
}
.info_cliente{
	width: 100%;
}
.datos_cliente{
	width: 100%;
}
.datos_cliente tr td{
	width: 50%;
}
.datos_cliente{
	padding: 10px 10px 0 10px;
}
.datos_cliente label{
	width: 75px;
	display: inline-block;
}
.datos_cliente p{
	display: inline-block;
}

.textright{
	text-align: right;
}
.textleft{
	text-align: left;
}
.textcenter{
	text-align: center;
}
.round{
	border-radius: 10px;
	border: 1px solid #0a4661;
	overflow: hidden;
	padding-bottom: 15px;
}
.round1{
	
	/*border: 1px solid #0a4661;*/
	overflow: hidden;
	padding-bottom: 15px;
}
.round2{
	
	border: 1px solid #0a4661;
	overflow: hidden;
	padding-bottom: 15px;
	text-align: right;
	font-size: 12pt;
}
.round3{
	
	
	overflow: hidden;
	padding-bottom: 15px;
	text-align: center;
	font-size: 12pt;
}

.size{
	font-size: 14pt;
}
}

.round p{
	padding: 0 15px;
}

#factura_detalle{
	border-collapse: collapse;
}
#factura_detalle thead th{
	background: #058167;
	color: #FFF;
	padding: 5px;
}
#detalle_productos tr:nth-child(even) {
    background: #ededed;
}
#detalle_totales span{
	font-family: 'BrixSansBlack';
}
.nota{
	font-size: 8pt;
}
.label_gracias{
	font-family: verdana;
	font-weight: bold;
	font-style: italic;
	text-align: center;
	margin-top: 20px;
}
.anulada{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
}

.btn2{

  color: #fff;
  /*background-color: #386399;*/
  border-color: #386399;
  box-shadow: none;
  margin-left: 600px;
  margin-right: 600px;
  height: 40px;
  width: 15%;
  font-family: 'BrixSansBlack';
  font-size: 12pt;
  display: block;
  background: #0a4661;
  text-align: center;
    padding: 3px;
    margin-bottom: 5px;
}
.main-raised-safi {
                         margin: 20px 30px; 
                         padding: 30px; 
                         background: #fff; 
                         border-radius: 15px; 
                         box-shadow: 0 8px 25px rgba(0,0,0,0.05); 
                     }
    .header-safi { 
                        display: flex; 
                        justify-content: space-between; 
                        align-items: flex-start; 
                        border-bottom: 2px solid #f4f7f6; 
                        padding-bottom: 15px; 
                        margin-bottom: 25px; 
                    }
    .title-safi { 
                        font-weight: 900; 
                        color: #2e5984; 
                        text-transform: uppercase; 
                        margin: 0; 
                    }
    .btn-pago { 
                        background: #27ae60; 
                        color: white; 
                        border-radius: 6px; 
                        padding: 6px 12px; 
                        font-weight: 700; 
                        border: none; 
                        font-size: 11px; 
                        transition: 0.3s; 
                    }
    .btn-pago:hover { 
                        background: #219150; 
                        transform: scale(1.05); 
                    }
    .total-cliente-badge { 
                        background: #e74c3c; 
                        color: white; 
                        padding: 15px 25px; 
                        border-radius: 10px; 
                        text-align: right; 
                        box-shadow: 0 4px 10px rgba(231, 76, 60, 0.2); 
                    }
    .info-box-safi { 
                        background: #f8fafc; 
                        padding: 15px; 
                        border-radius: 10px; 
                        border-left: 5px solid #2e5984; 
                    }
    .btn-whatsapp { 
                        background: linear-gradient(135deg, #2e5984 0%, #4a90e2 100%); 
                        border: none; border-radius: 10px; 
                        padding: 12px 20px; font-weight: bold; 
                        color: white; box-shadow: 0 4px 15px rgba(46, 89, 132, 0.2); 
                        display: inline-flex; 
                        align-items: center; 
                        gap: 8px; 
                        transition: 0.3s; 
                        text-decoration: none !important; 
                    }
    .btn-whatsapp:hover { 
                        transform: translateY(-2px); 
                        box-shadow: 0 6px 20px rgba(46, 89, 132, 0.3); 
                        color: white; 
                    }
    .table-striped tbody tr:hover {
                        background-color: #f0f9ff !important;
                        transition: 0.2s;
                    }
    @page { 
                    size: letter landscape; 
                    margin: 0.8cm; 
              }
        body { 
                    font-family: 'Helvetica', sans-serif; 
                    color: #333; 
                    font-size: 10px; 
             }
        .header-table { 
                        width: 100%; 
                        border-bottom: 2px solid #2e5984; 
                        margin-bottom: 15px; 
                      }
        .logo-safi { 
                        font-size: 20px; 
                        font-weight: bold; 
                        color: #7f8c8d; 
                        text-align: left; 
                        width: 25%; 
                    }
        .center-title { 
                        text-align: center; 
                        width: 50%; 
                      }
        .logo-espiga { 
                        font-size: 20px; 
                        font-weight: bold; 
                        color: #2e5984; 
                        text-align: right; 
                        width: 25%; 
                    }
        .info-box {     width: 100%; 
                        background: #f8fafc; 
                        padding: 10px; 
                        border: 1px solid #e2e8f0; 
                        border-radius: 5px; 
                        margin-bottom: 10px; 
                    }
        .section-header { 
                        background: #2e5984; 
                        color: white; 
                        padding: 4px 10px; 
                        font-weight: bold; 
                        margin-top: 15px; 
                        text-transform: uppercase; 
                    }
        .header-pagos { 
                        background: #16a34a; 
                      }
        .header-anticipos { 
                        background: #0891b2; 
                     }
        table { 
                        width: 100%; 
                        border-collapse: collapse; 
                        margin-top: 5px; 
                    }
       
        td {            padding: 5px; 
                        border-bottom: 1px solid #f1f5f9; 
                    }
        .text-right { 
                        text-align: right; 
                    }
        .totales-container { 
                        float: right; 
                        width: 300px; 
                        margin-top: 20px; 
                        border: 1px solid #2e5984; 
                        border-radius: 5px; 
                        overflow: hidden; 
                    }
        .total-item {   
                        display: flex; 
                        justify-content: space-between; 
                        padding: 5px 10px; 
                        background: white; 
                    }
        .total-final-box { 
                        background: #1e293b; 
                        color: white; 
                        padding: 8px 10px; 
                        text-align: right; 
                    }