/**
 * Estilos para Impresión Segura y Dinámica
 * Implementa diseño profesional con control total del contenido
 */

/* ====================================
   ESTILOS PARA VISTA NORMAL
   ==================================== */

/* Clases de control para el sistema */
.print-mode-preparing {
    transition: opacity 0.2s ease;
}

.print-authorized-content {
    /* Marca el contenido que puede ser impreso */
    position: relative;
}

/* ====================================
   ESTILOS ESPECÍFICOS PARA IMPRESIÓN
   ==================================== */

@media print {
    /* ✅ CONFIGURACIÓN DE PÁGINA PROFESIONAL */
    @page {
        size: A4;
        margin: 1.5cm 2cm;
        
        /* Headers y footers automáticos */
        @top-center {
            content: "LIBRO DE RECLAMACIONES";
            font-family: 'Times New Roman', serif;
            font-size: 8pt;
            color: #666;
        }
        
        @bottom-right {
            content: "Página " counter(page);
            font-family: 'Times New Roman', serif;
            font-size: 8pt;
            color: #666;
        }
    }
    
    /* ✅ RESET COMPLETO PARA IMPRESIÓN */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        box-sizing: border-box !important;
    }
    
    /* ✅ CONFIGURACIÓN BASE DEL DOCUMENTO */
    body {
        font-family: 'Times New Roman', serif !important;
        font-size: 11pt !important;
        line-height: 1.4 !important;
        color: #000 !important;
        background: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* ✅ OCULTACIÓN INTELIGENTE - Solo elementos de UI */
    /* Navegación y controles */
    .navbar,
    .nav,
    footer,
    .breadcrumb,
    .sidebar,
    
    /* Botones y formularios */
    .btn,
    button,
    input,
    select,
    textarea,
    .form-control,
    .form-group,
    .form-label,
    
    /* Alertas y mensajes de UI */
    .alert,
    .toast,
    .modal,
    .dropdown,
    
    /* Clases específicas de ocultación */
    .d-print-none,
    .no-print,
    .print-hide,
    
    /* Elementos de carga */
    .spinner-border,
    .loading {
        display: none !important;
        visibility: hidden !important;
    }
    
    /* ✅ MOSTRAR ELEMENTOS ESPECÍFICOS DE IMPRESIÓN */
    .d-print-block {
        display: block !important;
        visibility: visible !important;
    }
    
    .d-print-flex {
        display: flex !important;
        visibility: visible !important;
    }
    
    .d-print-inline {
        display: inline !important;
        visibility: visible !important;
    }
    
    /* ✅ LAYOUT PRINCIPAL LIMPIO */
    .container,
    .container-fluid {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .row {
        margin: 0 !important;
        display: block !important;
    }
    
    .col-12, .col-md-6, .col-lg-10, .col-lg-4,
    [class*="col-"] {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        float: none !important;
    }
    
    /* ✅ ESTRUCTURA PROFESIONAL DEL DOCUMENTO */
    
    /* Encabezado principal */
    .print-document-header {
        text-align: center;
        border-bottom: 2pt solid #000;
        padding-bottom: 10pt;
        margin-bottom: 15pt;
        page-break-after: avoid;
    }
    
    .print-document-title {
        font-size: 18pt !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        margin: 0 0 6pt 0 !important;
        letter-spacing: 1.5pt;
    }
    
    .print-document-subtitle {
        font-size: 14pt !important;
        font-weight: normal !important;
        margin: 0 0 8pt 0 !important;
        color: #333 !important;
    }
    
    .print-claim-code {
        font-size: 16pt !important;
        font-weight: bold !important;
        font-family: 'Courier New', monospace !important;
        background: #f8f9fa !important;
        border: 2pt solid #000 !important;
        padding: 6pt 10pt !important;
        display: inline-block !important;
        margin-top: 6pt !important;
    }
    
    /* Información de empresa */
    .print-company-info {
        text-align: center;
        margin-bottom: 15pt;
        padding: 8pt;
        background: #f9f9f9 !important;
        border: 1pt solid #ccc;
        font-size: 10pt;
    }
    
    /* ✅ SECCIONES ORGANIZADAS */
    .print-section {
        margin-bottom: 15pt;
        page-break-inside: avoid;
    }
    
    .print-section-title {
        font-size: 14pt !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        border-bottom: 1.5pt solid #333 !important;
        padding-bottom: 4pt !important;
        margin-bottom: 8pt !important;
        color: #000 !important;
    }
    
    /* ✅ LAYOUT DE DOS COLUMNAS PARA DATOS */
    .print-two-columns {
        display: table !important;
        width: 100% !important;
        margin-bottom: 10pt !important;
        border-collapse: separate;
        border-spacing: 8pt 0;
    }
    
    .print-column {
        display: table-cell !important;
        width: 50% !important;
        vertical-align: top !important;
        padding: 4pt;
        border: 1pt solid #ddd;
        background: #fafafa !important;
    }
    
    /* ✅ CAMPOS DE INFORMACIÓN ESTRUCTURADOS */
    .print-field-group {
        margin-bottom: 10pt;
        padding: 6pt;
        border: 1pt solid #ccc;
        background: #ffffff !important;
    }
    
    .print-field {
        margin-bottom: 5pt;
        display: table !important;
        width: 100% !important;
        border-bottom: 1pt dotted #ddd;
        padding-bottom: 3pt;
    }
    
    .print-field:last-child {
        border-bottom: none;
        margin-bottom: 0;
    }
    
    .print-field-label {
        display: table-cell !important;
        font-weight: bold !important;
        font-size: 10pt !important;
        width: 35% !important;
        vertical-align: top !important;
        padding-right: 8pt !important;
        color: #333 !important;
    }
    
    .print-field-value {
        display: table-cell !important;
        font-size: 10pt !important;
        width: 65% !important;
        vertical-align: top !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    /* ✅ CONTENIDO DE TEXTO LARGO */
    .print-content-box {
        border: 1.5pt solid #000 !important;
        padding: 10pt !important;
        margin-bottom: 12pt !important;
        background: #fff !important;
        font-size: 11pt !important;
        line-height: 1.5 !important;
        text-align: justify !important;
        hyphens: auto !important;
    }
    
    .print-content-title {
        font-weight: bold !important;
        font-size: 12pt !important;
        margin-bottom: 6pt !important;
        text-transform: uppercase !important;
        color: #000 !important;
        border-bottom: 1pt solid #ccc !important;
        padding-bottom: 3pt !important;
    }
    
    /* ✅ SECCIONES ESPECIALES */
    
    /* Información del apoderado */
    .print-guardian-section {
        background: #e3f2fd !important;
        border: 1.5pt solid #1976d2 !important;
        padding: 8pt !important;
        margin: 10pt 0 !important;
        border-radius: 0 !important;
    }
    
    .print-guardian-title {
        font-weight: bold !important;
        font-size: 12pt !important;
        color: #1976d2 !important;
        margin-bottom: 6pt !important;
        text-decoration: underline;
        text-transform: uppercase;
    }
    
    /* Estado del reclamo */
    .print-status-section {
        text-align: center;
        border: 2pt solid #000 !important;
        padding: 12pt !important;
        margin: 15pt 0 !important;
        background: #f8f9fa !important;
        page-break-inside: avoid;
    }
    
    .print-status-title {
        font-size: 16pt !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        margin-bottom: 6pt !important;
        color: #000 !important;
        letter-spacing: 1pt;
    }
    
    .print-status-description {
        font-size: 11pt !important;
        color: #333 !important;
        line-height: 1.4 !important;
        font-style: italic;
    }
    
    /* Archivos adjuntos */
    .print-attachments-section {
        background: #fff3cd !important;
        border: 1pt solid #856404 !important;
        padding: 8pt !important;
        margin: 10pt 0 !important;
    }
    
    .print-attachments-title {
        font-weight: bold !important;
        font-size: 12pt !important;
        color: #856404 !important;
        margin-bottom: 6pt !important;
        text-transform: uppercase;
    }
    
    .print-attachments-list {
        margin: 0 !important;
        padding-left: 15pt !important;
        list-style-type: disc !important;
    }
    
    .print-attachments-list li {
        margin-bottom: 3pt !important;
        font-size: 10pt !important;
    }
    
    /* ✅ PIE DE PÁGINA */
    .print-document-footer {
        margin-top: 20pt;
        padding-top: 10pt;
        border-top: 1pt solid #ccc;
        text-align: center;
        font-size: 9pt;
        color: #666 !important;
        page-break-inside: avoid;
    }
    
    .print-timestamp {
        text-align: right;
        font-size: 8pt;
        color: #999 !important;
        margin-top: 10pt;
        font-style: italic;
    }
    
    /* ✅ CONTROL DE SALTOS DE PÁGINA */
    .print-no-break {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }
    
    .print-page-break-before {
        page-break-before: always !important;
    }
    
    .print-page-break-after {
        page-break-after: always !important;
    }
    
    /* ✅ ELEMENTOS EXISTENTES - ADAPTACIÓN */
    
    /* Cards originales - convertir a estructura simple */
    .card {
        border: none !important;
        box-shadow: none !important;
        background: transparent !important;
        margin: 0 0 8pt 0 !important;
        padding: 0 !important;
        page-break-inside: avoid;
    }
    
    .card-header {
        background: #f8f9fa !important;
        border: 1pt solid #000 !important;
        border-bottom: 1pt solid #000 !important;
        padding: 6pt 8pt !important;
        font-weight: bold !important;
        font-size: 11pt !important;
        margin: 0 !important;
    }
    
    .card-body {
        border: 1pt solid #ccc !important;
        border-top: none !important;
        padding: 8pt !important;
        margin: 0 !important;
        background: #fff !important;
    }
    
    /* Campos valor existentes */
    .campo-valor {
        margin-bottom: 4pt !important;
        display: table !important;
        width: 100% !important;
        border-bottom: 1pt dotted #eee;
        padding-bottom: 2pt;
    }
    
    .campo-label {
        display: table-cell !important;
        font-weight: bold !important;
        font-size: 10pt !important;
        width: 35% !important;
        vertical-align: top !important;
        padding-right: 6pt !important;
        color: #333 !important;
    }
    
    .campo-content {
        display: table-cell !important;
        font-size: 10pt !important;
        width: 65% !important;
        vertical-align: top !important;
        word-wrap: break-word !important;
    }
    
    /* ✅ TÍTULOS Y TEXTO */
    h1, h2, h3, h4, h5, h6 {
        color: #000 !important;
        margin: 8pt 0 4pt 0 !important;
        page-break-after: avoid !important;
    }
    
    /* Ocultar título original de pantalla */
    .container > h1.text-center {
        display: none !important;
    }
    
    p {
        text-align: justify !important;
        margin-bottom: 6pt !important;
        hyphens: auto !important;
        orphans: 2;
        widows: 2;
    }
    
    /* ✅ LISTAS Y ENLACES */
    ul, ol {
        margin: 6pt 0 !important;
        padding-left: 15pt !important;
    }
    
    li {
        margin-bottom: 2pt !important;
        orphans: 2;
        widows: 2;
        page-break-inside: avoid !important;
    }
    
    a {
        color: #000 !important;
        text-decoration: none !important;
    }
    
    /* ✅ ICONOS Y ELEMENTOS VISUALES */
    .fas, .fa, .fab, .far, .fal,
    .bi, .icon {
        display: none !important;
    }
    
    /* ✅ ESPACIADO BOOTSTRAP - OPTIMIZADO */
    .mb-4, .mb-3, .mb-2 {
        margin-bottom: 6pt !important;
    }
    
    .mt-4, .mt-3, .mt-2 {
        margin-top: 6pt !important;
    }
    
    .py-4, .py-3, .py-2 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    
    .px-4, .px-3, .px-2 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ====================================
   MODO IMPRESIÓN EN MISMA VENTANA
   ==================================== */

/* Cuando se aplica .print-mode al body */
body.print-mode {
    /* Preparación para impresión */
    overflow: hidden;
}

body.print-mode .d-print-none,
body.print-mode .no-print,
body.print-mode .btn,
body.print-mode button,
body.print-mode .alert {
    display: none !important;
}

body.print-mode .d-print-block {
    display: block !important;
}

/* ====================================
   ESTILOS PARA VISTA PREVIA
   ==================================== */

.print-preview-container {
    font-family: 'Times New Roman', serif;
    background: #f5f5f5;
    padding: 20px;
}

.print-preview-container .print-document {
    background: white;
    padding: 20px;
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
    max-width: 21cm;
    margin: 0 auto;
}
