/* --- Estructura 3 Columnas (Adaptada) --- */
.negocios-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 15px;
    font-family: Arial, sans-serif;
}
.user_details_derecha.column {
    position: -webkit-sticky;
    position: sticky;
    top: 65px;
    align-self: flex-start;
}
.user_details_izquierda.column {
    position: -webkit-sticky;
    position: sticky;
    top: 65px; 
    align-self: flex-start; 
}
.ad-placeholder-left {
    padding: 20px;
    background: #f0f2f5;
    border: 1px dashed #ccc;
    text-align: center;
    color: #999;
    font-weight: bold;
    border-radius: 8px;
    min-height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Estilos de la Página de Negocios --- */
.page-title {
    color: #333;
    text-align: center;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
    margin-bottom: 15px;
    font-size: 1.8em;
}
.form-message {
    padding: 12px;
    margin-bottom: 15px;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
    font-size: 0.95em;
}
.form-success { background-color: #d4edda; color: #155724; }
.form-error { background-color: #f8d7da; color: #721c24; }


/* --- Formulario Principal Compacto --- */
.negocios-form {
    background: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 25px;
}

/* Sección para el Nombre del Negocio (dentro del form) */
.business-name-section {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: flex-end;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e0e0e0;
}
.business-name-section .form-group {
    margin: 0; 
}
.business-name-section label {
    font-weight: bold;
    margin-bottom: 5px;
    color: #555;
    display: block;
    font-size: 0.9em;
}
.business-name-section input[type="text"] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 15px;
    box-sizing: border-box; 
}
.business-name-section button {
    background-color: #6c757d;
    color: white;
    padding: 8px 12px;
    border: none;
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    white-space: nowrap;
}
.business-name-section button:hover {
    background-color: #5a6268;
}

/* Título de sección para "Agregar Producto" */
.form-section-title {
    margin: 5px 0 10px 0;
    text-align: center;
    color: #0056b3;
    font-size: 1.2em;
}

/* Formulario de Producto (Campos más pequeños) */
.form-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.form-group { display: flex; flex-direction: column; }
.form-group label { font-weight: bold; margin-bottom: 5px; color: #555; font-size: 0.9em; }
.form-group input[type="text"],
.form-group input[type="number"] {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 15px;
}
.form-group input[type="number"]::-webkit-outer-spin-button,
.form-group input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.form-group input[type="number"] { -moz-appearance: textfield; }
.form-group-full { grid-column: 1 / -1; }
.submit-btn {
    grid-column: 1 / -1; background-color: #007bff; color: white;
    padding: 10px;
    border: none; border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer; transition: background-color 0.3s;
    margin-top: 5px;
}
.submit-btn:hover { background-color: #0056b3; }
.submit-btn.update { background-color: #28a745; }
.submit-btn.update:hover { background-color: #218838; }


/* Resumen de Totales (Barra Lateral) */
.summary-container { 
    display: grid; 
    grid-template-columns: 1fr;
    gap: 15px; 
    margin-bottom: 20px;
}
.summary-box {
    background: #fff; border: 1px solid #ddd; border-radius: 8px;
    padding: 20px; text-align: center; box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.summary-box h3 { margin-top: 0; color: #555; font-size: 1.1em; }
.summary-box .amount { font-size: 24px; font-weight: bold; }
.summary-gastos { color: #dc3545; }
.summary-ganancia { color: #28a745; }

/* Resumen de Totales (Al final de la página) */
.summary-container-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 30px 0;
    border-top: 2px solid #007bff;
    padding-top: 20px;
}

/* Wrapper para tabla responsiva */
.table-responsive-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Estilos de la Tabla de Inventario */
.inventory-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.inventory-table thead {
    background-color: #f7f7f7;
}
.inventory-table th {
    padding: 15px 10px;
    text-align: left;
    font-size: 14px;
    color: #333;
    border-bottom: 2px solid #ddd;
}
.inventory-table tbody tr {
    border-bottom: 1px solid #e0e0e0; 
}
.inventory-table tbody tr:last-child {
    border-bottom: none;
}
.inventory-table td {
    padding: 15px 10px;
    font-size: 15px;
    color: #333;
    vertical-align: middle;
}
.inventory-table .product-name {
    font-weight: bold;
    color: #0056b3;
    font-size: 16px;
}
.inventory-table .total-profit {
    font-weight: bold;
    font-size: 16px;
}
.profit-positive { color: #28a745; }
.profit-negative { color: #dc3545; }
.inventory-table .actions-cell {
    text-align: right;
    white-space: nowrap;
}
.inventory-table .actions-cell .edit-btn,
.inventory-table .actions-cell .delete-btn {
    display: inline-block;
    padding: 5px;
    font-size: 18px;
    text-decoration: none;
}
.inventory-table .actions-cell .edit-btn { color: #007bff; margin-right: 5px; }
.inventory-table .actions-cell .edit-btn:hover { color: #0056b3; }
.inventory-table .actions-cell .delete-btn { color: #dc3545; }
.inventory-table .actions-cell .delete-btn:hover { color: #a71d2a; }


/* Título y botón de imprimir */
.report-header { /* Renombrado de .inventory-header */
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    flex-wrap: wrap; /* Para que se ajuste en móviles */
    gap: 10px;
}

/* ########## INICIO: CSS REESTRUCTURADO ########## */

/* ¡NUEVO! Contenedor para todas las acciones */
.report-actions-container {
    display: flex;
    flex-direction: column; /* Apila las filas (compartir, acciones) */
    align-items: flex-end; /* Alinea todo a la derecha */
    flex-grow: 1; /* Ocupa el espacio */
    gap: 10px; /* Espacio entre la fila de compartir y la de acciones */
}

/* ¡NUEVO! Fila de botones de compartir */
.share-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: flex-end; /* Alinea a la derecha */
}
.share-actions span {
    font-size: 0.9em;
    font-weight: bold;
    color: #555;
}
/* Estilos para los botones de compartir (reusando .print-button) */
.share-actions .print-button {
    padding: 6px 10px; /* Un poco más pequeños */
    font-size: 13px;
}


/* ¡MODIFICADO! Contenedor de acciones (Ir a Ventas, Archivar, Imprimir) */
.report-actions {
    display: flex;
    flex-wrap: wrap; /* Permitir que los botones bajen a otra línea si no caben */
    gap: 10px;
    align-items: center;
    justify-content: flex-end; /* Alinear acciones a la derecha */
    /* flex-grow: 1; <-- Eliminado, ahora está en el .report-actions-container */
}
/* ########## FIN: CSS REESTRUCTURADO ########## */


.print-button {
    background-color: #6c757d;
    color: white;
    padding: 8px 12px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
}
.print-button:hover { background-color: #5a6268; }
.print-button i { margin-right: 5px; }

/* Responsivo */
@media (max-width: 768px) {
    .business-name-section {
        grid-template-columns: 1fr;
    }
    .form-grid { grid-template-columns: 1fr; }
   /* .summary-container-bottom { grid-template-columns: 1fr; }*/
    
    .report-header { 
        gap: 10px;
        justify-content: center; /* Centrar el título "Inventario Actual" si se queda solo */
    }
    
    /* ########## INICIO: CSS REESTRUCTURADO (MÓVIL) ########## */
    /* ¡NUEVO! */
    .report-actions-container {
        align-items: center; /* Centrar todo en móvil */
        width: 100%;
    }
    .share-actions {
        justify-content: center; /* Centrar botones de compartir */
    }
    .report-actions {
        justify-content: center; /* Centrar botones de acciones */
        width: 100%;
    }
    
    /* ¡MODIFICADO! Ajustar el form de archivar en móvil */
    .report-action-form {
        flex-wrap: wrap; /* Ahora sí permitir que se rompa */
        justify-content: center;
        width: 100%;
        gap: 5px; /* Volver a poner gap en móvil */
    }
    .report-action-form input.archive-name-input {
        width: 100%;
        border-radius: 5px !important; /* Restaurar bordes */
        border-right: 1px solid #ccc !important;
        text-align: center;
    }
    .report-action-form .print-button {
        width: 100%;
        border-radius: 5px !important; /* Restaurar bordes */
    }
    /* ########## FIN: CSS REESTRUCTURADO (MÓVIL) ########## */

    
    .inventory-table {
        min-width: 700px;
    }
}


/* --- Estilos para ventas.php --- */
.sale-select {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 15px;
    width: 100%;
    background-color: #fff;
    box-sizing: border-box;
}

/* ¡NUEVO! Barra de Navegación de Filtros */
.filter-nav {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}
.filter-nav a {
    text-decoration: none;
    padding: 8px 15px;
    border: 1px solid #ddd;
    background-color: #fff;
    color: #007bff;
    font-weight: bold;
    border-radius: 5px;
}
.filter-nav a:hover {
    background-color: #f0f2f5;
}
.filter-nav a.active {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}


/* --- SECCIÓN DE IMPRESIÓN (Solo para negocios.php) --- */

/* ¡NUEVO! Estilos para el Historial */

/* ¡MODIFICADO! Formulario de archivar (para agrupar input y botón) */
.report-action-form {
    display: flex;
    /* gap: 5px; <-- Eliminado para que se peguen */
    align-items: center;
}
.report-action-form input.archive-name-input {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 14px;
    
    /* ¡NUEVO! */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: none;
    position: relative;
    z-index: 1;
}
.report-action-form .print-button {
     /* ¡NUEVO! */
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    z-index: 2;
    margin-left: -1px; /* Solapa el borde */
}


.historial-item {
    margin-bottom: 30px;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #f9f9f9;
}


/* (Movimos los estilos de impresión de ventas.php a ese mismo archivo) */
@media print {
    /* --- REGLAS PARA IMPRIMIR EL INVENTARIO EN VIVO (body.print-inventory) --- */
    body.print-inventory .top_bar,
    body.print-inventory .user_details_izquierda.column,
    body.print-inventory .user_details_derecha.column,
    body.print-inventory .negocios-form,
    body.print-inventory .form-message,
    body.print-inventory .print-button,
    body.print-inventory .historial-wrapper, /* ¡NUEVO! Oculta el historial */
    body.print-inventory .report-action-form, /* ¡NUEVO! Oculta el form de archivar */
    body.print-inventory .report-actions-container /* ¡NUEVO! Oculta todo el contenedor de acciones */ { 
        display: none !important;
    }
    body.print-inventory { background: #fff !important; }
    body.print-inventory .wrapper { padding-top: 0 !important; background: #fff !important; }
    body.print-inventory .main_column.column {
        width: 100% !important; margin: 0 !important; padding: 0 !important;
        border: none !important; box-shadow: none !important;
    }
    body.print-inventory .negocios-wrapper { max-width: 100% !important; padding: 0 !important; }
    body.print-inventory .inventory-table {
        width: 100%;
        border: 1px solid #999 !important;
        box-shadow: none !important;
    }
    body.print-inventory .inventory-table th, 
    body.print-inventory .inventory-table td {
        color: #000 !important;
        padding: 8px 5px;
        font-size: 10pt;
    }
    body.print-inventory .inventory-table thead { background-color: #eee !important; }
    body.print-inventory .inventory-table tbody tr {
        border-bottom: 1px solid #ccc !important;
        page-break-inside: avoid;
    }
    body.print-inventory .actions-cell {
        display: none !important;
    }
    body.print-inventory .inventory-table th:last-child,
    body.print-inventory .inventory-table td:last-child {
        display: none !important;
    }
    body.print-inventory .summary-container-bottom {
        grid-template-columns: 1fr 1fr;
        border-top: 2px solid #000 !important;
    }
    body.print-inventory .page-title {
        text-align: left; border: none; font-size: 24pt; margin-bottom: 20px;
    }
    body.print-inventory .report-header h2 { font-size: 18pt; }
    
    
    /* --- ¡NUEVO! REGLAS PARA IMPRIMIR UN ARCHIVO ESPECÍFICO (body.print-archive-mode) --- */
    body.print-archive-mode {
        background: #fff !important;
    }
    /* Ocultar todo lo que no sea el área principal */
    body.print-archive-mode .top_bar,
    body.print-archive-mode .user_details_izquierda.column,
    body.print-archive-mode .user_details_derecha.column,
    body.print-archive-mode .negocios-form,
    body.print-archive-mode .form-message,
    body.print-archive-mode .report-header, /* Oculta cabecera del inventario vivo */
    body.print-archive-mode .table-responsive-wrapper:first-of-type, /* Oculta tabla del inventario vivo */
    body.print-archive-mode .summary-container-bottom:first-of-type { /* Oculta resumen del inventario vivo */
        display: none !important;
    }
    body.print-archive-mode .wrapper { padding-top: 0 !important; background: #fff !important; }
    body.print-archive-mode .main_column.column {
        width: 100% !important; margin: 0 !important; padding: 0 !important;
        border: none !important; box-shadow: none !important;
    }
    body.print-archive-mode .negocios-wrapper { max-width: 100% !important; padding: 0 !important; }

    /* Ocultar todos los items del historial por defecto */
    body.print-archive-mode .historial-item {
        display: none !important;
    }
    
    /* Mostrar SOLO el item que tiene la clase 'print-this-one' */
    body.print-archive-mode .historial-item.print-this-one {
        display: block !important;
        border: none !importan;
        padding: 0 !important;
        background: #fff !important;
        page-break-before: auto;
    }
    
    /* Ocultar el botón de "Imprimir Archivo" dentro del bloque que SÍ se va a imprimir */
    body.print-archive-mode .historial-item.print-this-one .report-header .print-button {
        display: none !important;
    }
    /* Ajustar estilos del historial para impresión */
    body.print-archive-mode .historial-item.print-this-one .report-header {
        justify-content: flex-start;
    }
    body.print-archive-mode .historial-item.print-this-one .inventory-table {
        /* Los mismos estilos de la tabla de inventario en vivo */
        width: 100%;
        border: 1px solid #999 !important;
        box-shadow: none !important;
    }
    body.print-archive-mode .historial-item.print-this-one .inventory-table th, 
    body.print-archive-mode .historial-item.print-this-one .inventory-table td {
        color: #000 !important; padding: 8px 5px; font-size: 10pt;
    }
    body.print-archive-mode .historial-item.print-this-one .inventory-table thead { background-color: #eee !important; }
    body.print-archive-mode .historial-item.print-this-one .inventory-table tbody tr {
        border-bottom: 1px solid #ccc !important;
        page-break-inside: avoid;
    }
    body.print-archive-mode .historial-item.print-this-one .summary-container-bottom {
        border-top: 2px solid #000 !important;
    }
}



/* --- ¡NUEVO! Estilos para ventas.php --- */
.sale-select {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 15px;
    width: 100%;
    background-color: #fff;
    box-sizing: border-box;
}

/* Pestañas para Venta Rápida/Manual */
.form-toggle-tabs {
    display: flex;
    gap: 5px;
    margin-bottom: 15px;
    border-bottom: 1px solid #ddd;
}
.form-toggle-tabs a {
    text-decoration: none;
    padding: 8px 12px;
    color: #007bff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
    border: 1px solid transparent;
    border-bottom: none;
    position: relative;
    top: 1px; /* Para que parezca conectado al contenido */
}
.form-toggle-tabs a:hover {
    background-color: #f0f2f5;
}
.form-toggle-tabs a.active {
    background-color: #fff;
    border-color: #ddd;
    border-bottom-color: #fff;
}

/* Formulario de Edición de Venta */
.edit-sale-form {
    border-color: #ffc107;
    background-color: #fffbeb;
}
.cancel-edit-link {
    display: block;
    text-align: center;
    margin-top: 10px;
    color: #777;
    text-decoration: none;
    font-weight: bold;
}
.cancel-edit-link:hover {
    color: #333;
} 



/* (El resto de tu CSS va aquí) */
.historial-header-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap; /* Para móviles */
    padding: 5px 0;
    gap: 10px;
}
.historial-trigger {
    cursor: pointer;
    margin: 0;
    flex-grow: 1; /* Ocupa el espacio disponible */
    color: #007bff;
    font-size: 1.25em;
}
.historial-trigger:hover {
    color: #0056b3;
}
.historial-actions {
    display: flex;
    flex-wrap: wrap; /* Permitir que los formularios/botones se apilen en móviles */
    gap: 10px; /* Espacio entre elementos */
    margin-left: 15px; /* Separación del título */
}
/* Ocultar contenido por defecto */
.historial-content {
    display: none;
    padding-top: 10px;
    border-top: 1px solid #eee;
    margin-top: 10px;
}
/* Estilo para el botón de eliminar */
.historial-actions .delete-btn {
    background-color: #dc3545;
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.9em;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: none;
    cursor: pointer;
}
.historial-actions .delete-btn:hover {
    background-color: #c82333;
}
/* Estilo para el nuevo formulario de restaurar */
.restore-form {
    display: flex;
    gap: 5px;
    align-items: center;
}
.restore-form input[type="password"] {
    padding: 8px;
    font-size: 0.9em;
    border: 1px solid #ccc;
    border-radius: 4px;
    max-width: 120px; /* Evitar que sea muy ancho */
}
.restore-form .restore-btn {
    background-color: #28a745;
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.9em;
}
.restore-form .restore-btn:hover {
    background-color: #218838;
}


/* ¡NUEVO! Para ocultar texto en botones en móvil */
.desktop-only {
    display: inline-block;
}

/* ########## INICIO: NUEVOS ESTILOS PARA ICONOS DE COMPARTIR ########## */
.negocios-wrapper {
    position: relative; /* Contexto para los botones */
    padding-top: 5px; /* Pequeño espacio arriba */
}
.page-share-buttons {
    position: absolute;
    top: 50%; /* ¡CAMBIADO! */
    right: 10px; /* Ajustar al gusto */
    display: flex;
    gap: 8px;
    z-index: 10;
    transform: translateY(-50%); /* ¡NUEVO! Centra verticalmente */
}
.page-share-buttons .share-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%; /* Círculo */
    text-decoration: none;
    color: white;
    font-size: 18px; /* Tamaño del ícono */
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    transition: transform 0.2s;
}
.page-share-buttons .share-icon:hover {
    transform: scale(1.1);
}
.page-share-buttons .share-whatsapp { background-color: #25D366; }
.page-share-buttons .share-facebook { background-color: #1877F2; }

/* Ajustar el título principal para que esté centrado */
.main-title-header {
    display: flex; /* Sigue siendo flex para centrar */
    justify-content: center; /* Centrar el título */
    padding-top: 60px; /* Más espacio arriba para los botones */
    margin-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
    position: relative; /* ¡NUEVO! Para ser el "padre" de los iconos */
}
.main-title-header .page-title {
     padding-top: 5px;
    margin-bottom: 0; 
    border-bottom: none; 
    padding-bottom: 0; 
    text-align: center;
    flex-grow: 0; /* No necesita crecer */
}

/* Eliminar estilos de .share-actions que estaban dentro del título */
.share-actions {
    /* Ya no es necesario aquí */
}
/* ########## FIN: NUEVOS ESTILOS ########## */


@media (max-width: 768px) {
    .desktop-only {
        display: none;
    }
    .historial-actions .print-button,
    .historial-actions .delete-btn,
    .restore-form .restore-btn {
        padding: 8px 10px; /* Ajustar padding */
    }
    .restore-form {
        width: 100%; /* Hacer que el formulario ocupe todo el ancho */
        justify-content: space-between;
    }
    .restore-form input[type="password"] {
        flex-grow: 1; /* El campo de contraseña ocupa el espacio */
        max-width: none;
    }
    
    /* ########## INICIO: CSS MOVIDO (MÓVIL) ########## */
    .main-title-header {
        /* padding-top: 45px; ¡ELIMINADO! Ya no necesitamos este espacio */
        padding-right: 100px; /* <-- ¡AÑADE ESTA LÍNEA! */
        box-sizing: border-box; /* <-- (Buena práctica para que el padding funcione bien) */
    }
    .page-share-buttons {
    /* ########## FIN: CSS MOVIDO (MÓVIL) ########## */
}

/* ######################################################## */
/* --- ¡INICIO DE LA CORRECCIÓN! ESTILOS DE IMPRESIÓN --- */
/* ######################################################## */

@media print {
    /* Regla 1: Ocultar todo por defecto CUANDO se imprime con la clase */
    body.print-inventory > * {
        display: none !important;
    }

    /* Regla 2: Mostrar el .wrapper y sus padres */
    body.print-inventory, 
    body.print-inventory .wrapper {
        display: block !important;
        background: #fff; /* Fondo blanco */
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Regla 3: Mostrar el .main_column y .negocios-wrapper */
    body.print-inventory .main_column,
    body.print-inventory .negocios-wrapper {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        box-shadow: none !important;
    }
    
    /* Regla 4: Ocultar todo DENTRO del .negocios-wrapper por defecto */
    body.print-inventory .negocios-wrapper > * {
        display: none !important;
    }
    
    /* Regla 5: Mostrar SÓLO las partes deseadas del inventario */
    body.print-inventory .main-title-header,
    body.print-inventory .report-header h2,
    body.print-inventory .table-responsive-wrapper,
    body.print-inventory .summary-container-bottom {
        display: block !important;
    }
    
    /* Regla 6: Ajustes finos de impresión */
    body.print-inventory .main-title-header {
         border-bottom: 2px solid #000;
         padding-bottom: 10px;
    }
    body.print-inventory .page-title {
         text-align: center;
         width: 100%;
    }
     body.print-inventory .table-responsive-wrapper {
        overflow: visible !important;
    }
    body.print-inventory .inventory-table {
        width: 100%;
        font-size: 10pt;
    }
    /* Ocultar la columna de acciones (Editar/Borrar) */
    body.print-inventory .actions-cell,
    body.print-inventory .inventory-table th:last-child {
        display: none !important;
    }
    body.print-inventory .summary-container-bottom {
        page-break-inside: avoid; /* Evitar que se corte el resumen */
        border-top: 1px solid #ccc;
        padding-top: 15px;
    }
}
/* ######################################################## */
/* --- ¡FIN DE LA CORRECCIÓN! ESTILOS DE IMPRESIÓN --- */
/* ######################################################## */


/* --- ESTILOS DE IMPRESIÓN PARA OCULTAR BANNER (Tu regla original) --- */
@media print {
    #smart-banner {
        display: none !important;
    }
}






/** css ventas unicos extras */


    /* Estilos del formulario de cerrar ventas */
    .report-action-form {
        display: flex;
        /* gap: 5px; <-- Eliminado para agrupar */
        align-items: center;
    }
    .archive-name-input {
        padding: 8px 10px;
        border: 1px solid #ccc;
        border-radius: 5px;
        font-size: 14px;
        /* ¡NUEVO! */
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-right: none;
        position: relative;
        z-index: 1;
    }
    /* ¡NUEVO! */
    .report-action-form .print-button {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        z-index: 2;
        margin-left: -1px; /* Solapa el borde */
    }
    
    .historial-item {
        margin-bottom: 20px; /* Reducido un poco */
        padding: 15px;
        border: 1px solid #ddd;
        border-radius: 8px;
        background: #f9f9f9;
    }

    /* --- ¡NUEVO! Estilos para el historial colapsable (Copiado de negocios.php) --- */
    .historial-header-bar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap; 
    }
    .historial-trigger {
        cursor: pointer;
        margin: 0;
        flex-grow: 1; 
        color: #007bff;
        font-size: 1.25em; /* Un poco más grande */
    }
    .historial-trigger:hover {
        color: #0056b3;
    }
    .historial-actions {
        display: flex;
        gap: 10px; 
        margin-left: 15px; 
    }
    .historial-content {
        display: none; /* Oculto por defecto */
        padding-top: 10px;
        border-top: 1px solid #eee;
        margin-top: 10px;
    }
    
    /* ¡NUEVO! Estilos de botones de acción del historial */
    .historial-actions .action-btn {
        color: white;
        padding: 8px 12px;
        border-radius: 4px;
        text-decoration: none;
        font-size: 0.9em;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        border: none;
        cursor: pointer;
    }
    .historial-actions .delete-btn {
        background-color: #dc3545;
    }
    .historial-actions .delete-btn:hover {
        background-color: #c82333;
    }
    .historial-actions .restore-btn {
        background-color: #28a745;
    }
    .historial-actions .restore-btn:hover {
        background-color: #218838;
    }
    
    .desktop-only { /* Para ocultar texto en móvil si es necesario */
        display: inline-block;
    }
    
    /* ########## INICIO: CSS AÑADIDO PARA COMPARTIR ########## */
    .report-actions-container {
        display: flex;
        flex-direction: column; 
        align-items: flex-end; 
        flex-grow: 1;
        gap: 10px; 
    }
    
    /* ########## INICIO: NUEVOS ESTILOS PARA ICONOS DE COMPARTIR ########## */
    .negocios-wrapper {
        position: relative; /* Contexto para los botones */
        padding-top: 5px; /* Pequeño espacio arriba */
    }

    /* --- ¡INICIO CORRECCIÓN ICONOS PC! --- */
    .page-share-buttons {
        position: absolute;
        top: 50%; /* Centrado verticalmente */
        right: 10px; /* A la derecha */
        display: flex;
        gap: 8px;
        z-index: 10;
        transform: translateY(-50%); /* Ajuste fino para centrar */
    }
    /* --- ¡FIN CORRECCIÓN ICONOS PC! --- */

    .page-share-buttons .share-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 50%; /* Círculo */
        text-decoration: none;
        color: white;
        font-size: 18px; /* Tamaño del ícono */
        box-shadow: 0 1px 3px rgba(0,0,0,0.2);
        transition: transform 0.2s;
    }
    .page-share-buttons .share-icon:hover {
        transform: scale(1.1);
    }
    .page-share-buttons .share-whatsapp { background-color: #25D366; }
    .page-share-buttons .share-facebook { background-color: #1877F2; }

    /* --- ¡INICIO CORRECCIÓN ICONOS PC! --- */
    .main-title-header {
        display: flex; 
        justify-content: center; /* Centrar el título */
        padding-top: 20px; /* Espacio arriba (reducido de 60px) */
        margin-bottom: 15px;
        border-bottom: 2px solid #f0f0f0;
        padding-bottom: 10px;
        position: relative; /* Padre para los botones absolutos */
    }
    /* --- ¡FIN CORRECCIÓN ICONOS PC! --- */

    .main-title-header .page-title {
        margin-bottom: 0; 
        border-bottom: none; 
        padding-bottom: 0; 
        text-align: center;
        flex-grow: 0; /* No necesita crecer */
    }
    
    .share-actions {
        /* Ya no es necesario aquí */
    }
    /* ########## FIN: NUEVOS ESTILOS ########## */
    
    .report-actions {
        display: flex;
        flex-wrap: wrap; 
        gap: 10px;
        align-items: center;
        justify-content: flex-end; 
    }
    /* ########## FIN: CSS AÑADIDO PARA COMPARTIR ########## */


    /* --- ¡NUEVO! Ajustes para formulario de Venta Rápida --- */
    /* En móvil, forzar 1 columna para todo */
    #form-venta-rapida .form-grid {
        grid-template-columns: 1fr; 
    }
    
    /* En desktop, hacer que Cantidad y Botón estén en línea si es posible */
    @media (min-width: 769px) {
         #form-venta-rapida .form-grid {
            grid-template-columns: 3fr 1fr; /* Columna de producto más ancha (ahora es select), cantidad más angosta */
            gap: 10px;
         }
         #form-venta-rapida .form-grid .form-group-full {
            grid-column: 1 / -1; /* El select de producto ocupa todo el ancho */
         }
         #form-venta-rapida .form-grid .submit-btn {
            grid-column: 1 / -1; /* El botón ocupa todo el ancho */
            margin-top: 5px;
         }
    }
    /* --- Fin de Ajustes --- */


    @media (max-width: 768px) {
        .report-action-form {
            flex-direction: column;
            align-items: stretch;
            /* ¡NUEVO! */
            flex-wrap: nowrap;
            width: 100%;
        }
        .archive-name-input {
            width: 100%;
            box-sizing: border-box; 
            /* ¡NUEVO! */
            border-radius: 5px !important;
            border-right: 1px solid #ccc !important;
            text-align: center;
            margin-bottom: 5px; /* Separar del botón */
        }
        /* ¡NUEVO! */
        .report-action-form .print-button {
             border-radius: 5px !important;
             width: 100%;
        }
        
        /* ¡NUEVO! Ocultar texto en botones en móvil */
        .desktop-only {
            display: none;
        }
        .historial-actions .print-button,
        .historial-actions .action-btn { /* Aplicar a todos los botones de acción */
            padding: 8px 10px; /* Ajustar padding */
        }
        
        /* ########## INICIO: CSS AÑADIDO (MÓVIL) ########## */
        
        /* ¡NUEVO! Ajustes para el título y compartir en móvil */
        .main-title-header {
            padding-top: 40px; /* Espacio para que los botones no tapen el título */
            padding-right: 100px; /* Espacio a la derecha para que no choquen */
            justify-content: flex-start; /* Alinear título a la izquierda */
            box-sizing: border-box;
        }
        .page-share-buttons {
            top: 8px; /* Posición fija en móvil (como estaba) */
            right: 8px;
            transform: none; /* Resetear la transformación de PC */
        }
        
        .report-actions-container {
            align-items: center; /* Centrar todo en móvil */
            width: 100%;
        }
        .report-actions {
            justify-content: center; /* Centrar botones de acciones */
            width: 100%;
        }
        /* ########## FIN: CSS AÑADIDO (MÓVIL) ########## */
    }
    
    
    /* --- ESTILOS DE IMPRESIÓN --- */
    @media print {
        @page {
            size: auto;
            margin: 1cm; 
            @bottom-center { content: ""; }
            @top-center { content: ""; }
        }

        /* ######################################################## */
        /* --- INICIO CORRECCIÓN 2: REGLAS DE IMPRESIÓN PARA VENTAS --- */
        /* ######################################################## */

        /* Regla 1: Ocultar todo por defecto */
        body.print-sales-report > * {
            display: none !important;
        }

        /* Regla 2: Mostrar el .wrapper y sus padres */
        body.print-sales-report, 
        body.print-sales-report .wrapper {
            display: block !important;
            background: #fff;
            padding: 0 !important;
            margin: 0 !important;
        }

        /* Regla 3: Mostrar el .main_column y .negocios-wrapper */
        body.print-sales-report .main_column,
        body.print-sales-report .negocios-wrapper {
            display: block !important;
            width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            border: none !important;
            box-shadow: none !important;
        }
        
        /* Regla 4: Ocultar todo DENTRO del .negocios-wrapper por defecto */
        body.print-sales-report .negocios-wrapper > * {
            display: none !important;
        }
        
        /* Regla 5: Mostrar SÓLO las partes deseadas del reporte */
        body.print-sales-report .main-title-header, /* El título del negocio */
        body.print-sales-report .report-header,      /* El 'div' que contiene el h2 */
        body.print-sales-report .report-header h2,   /* El título 'Ventas de Hoy' */
        body.print-sales-report .table-responsive-wrapper,
        body.print-sales-report .summary-container-bottom {
            display: block !important;
        }

        /* Regla 6: Ocultar las acciones DENTRO del .report-header */
        body.print-sales-report .report-header .report-actions-container {
            display: none !important;
        }
        
        /* ¡NUEVO! Ocultar botones de compartir al imprimir */
        body.print-sales-report .page-share-buttons {
            display: none !important;
        }

        /* Regla 7: Ajustes finos de impresión */
        body.print-sales-report .main-title-header {
             border-bottom: 2px solid #000;
             padding-top: 0 !important;
             padding-bottom: 10px;
             position: static !important; /* Resetear posición */
        }
        body.print-sales-report .page-title {
             text-align: center;
             width: 100%;
        }
        body.print-sales-report .report-header h2 {
             text-align: left;
             font-size: 18pt;
             margin-bottom: 20px;
        }
        body.print-sales-report .table-responsive-wrapper { overflow: visible !important; }
        body.print-sales-report .inventory-table {
            width: 100%;
            border: 1px solid #999 !important;
            box-shadow: none !important;
        }
        body.print-sales-report .inventory-table th, 
        body.print-sales-report .inventory-table td {
            color: #000 !important; padding: 8px 5px; font-size: 10pt;
        }
        body.print-sales-report .inventory-table thead { background-color: #eee !important; }
        body.print-sales-report .inventory-table tbody tr {
            border-bottom: 1px solid #ccc !important;
            page-break-inside: avoid;
        }
        /* Ocultar la columna de acciones (Editar/Borrar) */
        body.print-sales-report .actions-cell,
        body.print-sales-report .inventory-table th:last-child {
            display: none !important;
        }
        body.print-sales-report .summary-container-bottom {
            page-break-inside: avoid; 
            border-top: 1px solid #ccc;
            padding-top: 15px;
        }
        
        /* ######################################################## */
        /* --- FIN CORRECCIÓN 2: REGLAS DE IMPRESIÓN PARA VENTAS --- */
        /* ######################################################## */
        
        
        /* IMPRIMIR UN ARCHIVO (body.print-sales-archive-mode) */
        body.print-sales-archive-mode {
            background: #fff !important;
        }
        body.print-sales-archive-mode .top_bar,
        body.print-sales-archive-mode .user_details_izquierda.column,
        body.print-sales-archive-mode .user_details_derecha.column,
        body.print-sales-archive-mode .negocios-form,
        body.print-sales-archive-mode .form-message,
        body.print-sales-archive-mode .report-header, 
        body.print-sales-archive-mode .table-responsive-wrapper:first-of-type, 
        body.print-sales-archive-mode .summary-container-bottom:first-of-type,
        body.print-sales-archive-mode .main-title-header, /* ¡NUEVO! Ocultar nuevo header */
        body.print-sales-archive-mode .page-share-buttons, /* ¡NUEVO! Ocultar iconos de compartir */
        body.print-sales-archive-mode .report-actions-container /* ¡NUEVO! Ocultar contenedor */ {
            display: none !important;
        }
        body.print-sales-archive-mode .wrapper { padding-top: 0 !important; background: #fff !important; }
        body.print-sales-archive-mode .main_column.column {
            width: 100% !important; margin: 0 !important; padding: 0 !important;
            border: none !important; box-shadow: none !important;
        }
        body.print-sales-archive-mode .negocios-wrapper { max-width: 100% !important; padding: 0 !important; }

        body.print-sales-archive-mode .historial-item {
            display: none !important;
        }
        body.print-sales-archive-mode .historial-item.print-this-one {
            display: block !important;
            border: none !important; /* Corrección de '!importan' */
            padding: 0 !important;
            background: #fff !important;
            page-break-before: auto;
        }
        /* ¡NUEVO! Ocultar barra de acciones al imprimir archivo */
        body.print-sales-archive-mode .historial-item.print-this-one .historial-header-bar {
            justify-content: flex-start;
        }
        body.print-sales-archive-mode .historial-item.print-this-one .historial-actions {
             display: none !important;
        }
        /* ¡NUEVO! Asegurarse de que el contenido sea visible */
        body.print-sales-archive-mode .historial-item.print-this-one .historial-content {
            display: block !important;
        }
        
        body.print-sales-archive-mode .historial-item.print-this-one .inventory-table {
            width: 100%;
            border: 1px solid #999 !important;
            box-shadow: none !important;
        }
        body.print-sales-archive-mode .historial-item.print-this-one .inventory-table th, 
        body.print-sales-archive-mode .historial-item.print-this-one .inventory-table td {
            color: #000 !important; padding: 8px 5px; font-size: 10pt;
        }
        body.print-sales-archive-mode .historial-item.print-this-one .inventory-table thead { background-color: #eee !important; }
        body.print-sales-archive-mode .historial-item.print-this-one .inventory-table tbody tr {
            border-bottom: 1px solid #ccc !important;
            page-break-inside: avoid;
        }
        body.print-sales-archive-mode .historial-item.print-this-one .summary-container-bottom {
            border-top: 2px solid #000 !important;
        }
        
        /* ¡NUEVO! Ocultar el banner de la app al imprimir */
        #smart-banner {
            display: none !important;
        }
    }
}

/* =================================================== */
/* === INICIO: Estilos ÚNICOS para Header de Negocio === */
/* =================================================== */

/* 1. Anula 'style.css' para la barra principal */
/* (Le dice que use 'flex' en lugar de 'inline-flex') */
.top_bar.top_bar-negocio {
    display: flex !important;
    justify-content: space-between; /* Logo a la izq, nav a la der */
    align-items: center;
    padding: 0 15px; /* Espacio en los bordes */
}

/* 2. Anula 'style.css' para el contenedor <nav> */
/* (Le quita el 'position: absolute' y 'float: right') */
#negocio_nav_container nav {
    position: relative !important;
    float: none !important;
    right: auto !important;
    margin: 0 !important;
}

/* 3. Estilos NUEVOS y LIMPIOS para tu menú */
/* (Estos reemplazan la regla de .dropdown-menu en <head>) */
.negocio-dropdown-menu {
    display: none; /* Oculto por defecto (el JS lo mostrará) */
    position: absolute;
    background-color: white;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    top: 45px; /* Distancia desde la barra azul (ajusta si es necesario) */
    right: 0;  /* Alineado a la derecha de su contenedor */
    z-index: 1000;
    max-height: 80vh; /* Altura máxima */
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 0;
    width: 280px; /* Ancho del menú (ajusta si es necesario) */
}

/* 4. Estilos para los enlaces dentro de tu nuevo menú */
.negocio-dropdown-menu a,
.negocio-dropdown-menu p {
    padding: 10px 15px;
    display: block;
    text-decoration: none;
    color: black;
    margin: 0;
    font-size: 15px; /* Tamaño de letra legible */
}

.negocio-dropdown-menu a:hover {
    background-color: #f1f1f1;
}

/* =================================================== */
/* === FIN: Estilos ÚNICOS para Header de Negocio === */
/* =================================================== */


/* =================================================================== */
/* === INICIO: NUEVOS ESTILOS DE ENCABEZADO PROFESIONAL === */
/* =================================================================== */

/* 1. Anulamos el padding-top que sobraba en el wrapper */
.negocios-wrapper {
    padding-top: 0;
}

/* 2. Creamos la "Tarjeta" principal para el título */
.main-title-header {
    /* Quitamos los estilos antiguos */
    border-bottom: 1px solid #eee;
    padding-top: 0; /* <-- Arregla el espacio vacío */
    margin-bottom: 0; /* Lo pegamos al subtítulo */

    /* Nuevos estilos de tarjeta */
    background-color: #ffffff;
    padding: 20px 25px 15px 25px;
    border: 1px solid #ddd;
    border-radius: 8px 8px 0 0; /* Esquinas superiores redondeadas */
    box-shadow: 0 2px 4px rgba(0,0,0,0.03);

    /* Flexbox para alinear título (izq) y botones (der) */
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

/* 3. Ajustamos el título principal (Ej. "Registro de Ventas") */
.main-title-header .page-title {
    /* Quitamos estilos antiguos */
    padding: 0;
    margin: 0;
    border: none;
    
    /* Nuevos estilos */
    text-align: left; /* Alineamos a la izquierda */
    font-size: 1.7em; /* Un poco más grande */
    color: #222;
    flex-grow: 1; /* Ocupa el espacio disponible */
}

/* 4. Estilizamos el subtítulo (Ej. "tienda rivas") */
.page-subtitle {
    /* Nuevos estilos de tarjeta (para unirse al de arriba) */
    background-color: #ffffff; /* Mismo fondo */
    border: 1px solid #ddd;
    border-top: none; /* Quitamos el borde de arriba para que se unan */
    border-radius: 0 0 8px 8px; /* Esquinas inferiores redondeadas */
    box-shadow: 0 2px 4px rgba(0,0,0,0.03);
    
    /* Posicionamiento */
    margin-top: 0; /* <-- Se pega al bloque del título */
    margin-bottom: 25px; /* Espacio antes del formulario */
    padding: 0px 25px 15px 25px; /* Padding para alinear */
    
    /* Estilos de texto */
    text-align: left;
    font-size: 1.1em;
    color: #555;
    font-weight: bold;
}

/* 5. Integramos los botones de compartir (Facebook/WhatsApp) */
.page-share-buttons {
    /* Quitamos el posicionamiento absoluto */
    position: static;
    transform: none;
    
    /* Ajustes de Flex */
    flex-shrink: 0; /* Evita que se encojan */
    align-self: center; /* Los centramos verticalmente */
}

/* 6. Ajustes para la vista en MÓVIL */
@media (max-width: 768px) {
    .main-title-header {
        /* Apilamos el título y los botones */
        flex-direction: column;
        align-items: flex-start; /* Alineamos todo a la izquierda */
        padding: 15px;
        gap: 10px;
         /* Quitamos el padding-right que los rompía */
         padding-right: 15px; 
    }
    
    .main-title-header .page-title {
        font-size: 1.5em; /* Título más pequeño en móvil */
    }

    .page-share-buttons {
        /* Movemos los botones a la derecha en su propia fila */
        align-self: flex-end;
    }
    
    .page-subtitle {
        padding: 10px 15px 15px 15px; /* Padding más simple */
    }
}

/* =================================================================== */
/* === FIN: NUEVOS ESTILOS DE ENCABEZADO PROFESIONAL === */
/* =================================================================== */

/* =================================================================== */
/* === INICIO: CORRECCIÓN DE ESTILOS (Presupuesto.php) === */
/* =================================================================== */

/* --- 1. Arreglo para "Nombre de Negocio" (Unificar Tarjeta) --- */

/* A. El header (título) es la parte de ARRIBA de la tarjeta */
.main-title-header {
    padding: 20px 25px 15px 25px;
    border: 1px solid #ddd;
    border-radius: 8px 8px 0 0; /* Solo redondear arriba */
    box-shadow: 0 2px 4px rgba(0,0,0,0.03);
    
    /* Quitar estilos viejos que causan problemas */
    border-bottom: none;
    padding-top: 20px;
    margin-bottom: 0; /* Pegar al subtítulo */
    
    /* Alinear título (izq) y botones (der) */
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

/* B. El subtítulo (nombre) es la parte de ABAJO de la tarjeta */
.page-subtitle {
    /* Estilos de tarjeta */
    background-color: #ffffff;
    border: 1px solid #ddd;
    border-top: none; /* Unir a la tarjeta de arriba */
    border-radius: 0 0 8px 8px; /* Redondear abajo */
    box-shadow: 0 4px 5px rgba(0,0,0,0.03);
    
    /* Espaciado */
    margin-top: 0; /* Pegar al header */
    margin-bottom: 25px; /* Espacio ANTES del primer formulario */
    padding: 10px 25px 15px 25px;
    
    /* Texto */
    text-align: center; /* Centrado se ve bien en las 3 págs */
    font-size: 1.1em;
    color: #555;
    font-weight: bold;
}

/* C. Anular el margin-top del primer formulario (ya lo da el subtítulo) */
.page-subtitle + .form-message + .negocios-form,
.page-subtitle + .negocios-form {
    margin-top: 0;
}


/* --- 2. Arreglo para Título "Presupuesto de Hoy" (muy grande) --- */
.report-header h2 {
    font-size: 1.4em; /* Reducir tamaño */
    margin: 0;
}

/* --- 3. Arreglo para Botones "Apunados" (en una línea) --- */

/* La fila de botones principal */
.report-actions-row {
    justify-content: flex-start; /* <-- NO usar space-between */
    flex-wrap: wrap;
    gap: 10px; /* Espacio entre todos los items */
}

/* La sección de la DERECHA (con el form "Ver Rango") */
.report-actions-row .report-actions-right {
    margin-left: auto; /* <-- ESTO lo empuja a la derecha */
    gap: 5px; /* Espacio más pequeño para el form */
}

/* Hacer el form "Ver Rango" más compacto */
.report-actions-row .report-action-form label {
    white-space: nowrap; /* Evitar que "Ver Rango" se parta */
}
.report-actions-row .report-action-form input[type="date"] {
    padding: 6px; /* Inputs de fecha más pequeños */
    font-size: 13px;
    max-width: 130px; /* Limitar ancho */
}
.report-actions-row .report-action-form .print-button {
     padding: 8px 10px; /* Botón "Go" más pequeño */
     font-size: 13px;
}

/* 4. Ajustes en Móvil para la nueva disposición */
@media (max-width: 768px) {
    /* El header que tiene título y botones de compartir */
    .main-title-header {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px;
        gap: 10px;
         /* Quitar el padding-right que los rompía */
         padding-right: 15px; 
    }
    
    .main-title-header .page-title {
        font-size: 1.5em;
    }

    .page-share-buttons {
        align-self: flex-end; /* Mover botones de compartir a la derecha */
    }

    .page-subtitle {
        padding: 10px 15px 15px 15px;
        text-align: center;
    }

    /* La fila de botones de acciones */
    .report-actions-row {
         justify-content: center; /* Centrar todo en móvil */
    }
    .report-actions-row .report-actions-right {
        margin-left: 0; /* Quitar el empuje a la derecha */
        width: 100%;
        justify-content: center;
    }
}

/* =================================================================== */
/* === FIN: CORRECCIÓN DE ESTILOS (Presupuesto.php) === */
/* =================================================================== */

