/**
 * TABLEAUX DE COMMANDES WCFM - KOLDKAZE
 * Styles pour les tableaux de détails de commande WCFM
 * Dépendances : variables.css
 * Version : 2.0.0
 * Date : 2024-01-15
 */

/* ===== CONTENEUR PRINCIPAL WCFM ===== */
.wcfm-container .wcfm-content {
    background: var(--koldkaze-white);
    border-radius: var(--koldkaze-border-radius);
    box-shadow: var(--koldkaze-shadow-md);
    overflow: hidden;
    margin-bottom: var(--koldkaze-spacing-xl);
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color);
}

/* ===== TABLEAUX DE COMMANDES WCFM ===== */
.woocommerce_order_items {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--koldkaze-font-size-sm);
    background: var(--koldkaze-white);
    margin: 0;
    font-family: var(--koldkaze-font-family);
}

/* ===== EN-TÊTES DE TABLEAU ===== */
.woocommerce_order_items thead th {
    background: var(--koldkaze-gray-100);
    color: var(--koldkaze-gray-800);
    padding: var(--koldkaze-spacing-md) var(--koldkaze-spacing-sm);
    font-weight: var(--koldkaze-font-weight-semibold);
    text-align: left;
    border: none;
    font-size: var(--koldkaze-font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.woocommerce_order_items thead th.item-thumb {
    border-radius: var(--koldkaze-border-radius) 0 0 0;
}

.woocommerce_order_items thead th.item_cost,
.woocommerce_order_items thead th.line_cost {
    text-align: right;
    white-space: nowrap;
    min-width: 100px;
}

.woocommerce_order_items thead th.line_cost {
    border-radius: 0 var(--koldkaze-border-radius) 0 0;
}

/* ===== LIGNES DE TABLEAU ===== */
.woocommerce_order_items tbody tr.item {
    border: none;
    transition: background-color var(--koldkaze-transition-fast);
}

.woocommerce_order_items tbody tr.item:hover {
    background-color: rgba(99, 0, 255, 0.02);
}

.woocommerce_order_items tbody td {
    padding: var(--koldkaze-spacing-lg) var(--koldkaze-spacing-sm);
    vertical-align: top;
    border: none;
}

/* ===== MINIATURES PRODUITS ===== */
.wc-order-item-thumbnail img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: var(--koldkaze-border-radius-sm);
    box-shadow: var(--koldkaze-shadow-sm);
    user-select: none;
}

/* ===== NOMS DE PRODUITS ===== */

.wc-order-item-name {
    font-weight: var(--koldkaze-font-weight-semibold);
    text-decoration: none;
    font-size: var(--koldkaze-font-size-base);
    display: block;
    margin-bottom: var(--koldkaze-spacing-sm);
}

.wc-order-item-name:hover {
    color: var(--koldkaze-primary-hover);
    text-decoration: underline;
}

/* ===== MÉTADONNÉES D'ARTICLES ===== */
.wc-item-meta {
    margin: 0;
    padding: 0;
    list-style: none;
}

.wc-item-meta li {
    margin-bottom: var(--koldkaze-spacing-xs);
    font-size: var(--koldkaze-font-size-xs);
    color: var(--koldkaze-gray-600);
}

.wc-item-meta-label {
    color: var(--koldkaze-gray-800);
    font-weight: var(--koldkaze-font-weight-medium);
    margin-right: var(--koldkaze-spacing-xs);
}

/* ===== PRIX ET MONTANTS ===== */
.woocommerce-Price-amount {
   
    font-weight: var(--koldkaze-font-weight-bold);
    font-size: var(--koldkaze-font-size-sm);
}

.woocommerce-Price-currencySymbol {
    font-weight: var(--koldkaze-font-weight-semibold);
}

.item_cost,
.line_cost {
    text-align: right;
    font-weight: var(--koldkaze-font-weight-semibold);
    white-space: nowrap;
    min-width: 100px;
}

.wcfm_item_qty {
    text-align: center;
    font-weight: var(--koldkaze-font-weight-semibold);
    min-width: 60px;
}

.wcfm_item_qty .times {
    opacity: 0.6;
    margin-right: var(--koldkaze-spacing-xs);
}

/* ===== SECTION TOTAUX ===== */
.wc-order-data-row.wc-order-totals-items {
    margin-top: var(--koldkaze-spacing-xl);
    background: var(--koldkaze-gray-100);
    border-radius: var(--koldkaze-border-radius);
    padding: var(--koldkaze-spacing-xl);
    border: none;
    box-shadow: none;
}

.wc-order-totals {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--koldkaze-font-size-sm);
}

.wc-order-totals tr {
    border-bottom: var(--koldkaze-border-width) solid var(--koldkaze-border-color);
    background: var(--koldkaze-white);
    border-top: none;
    border-right: none;
    border-left: none;
}

.wc-order-totals th.label {
    text-align: right;
    padding: var(--koldkaze-spacing-md) var(--koldkaze-spacing-lg);
    color: var(--koldkaze-gray-800);
    font-weight: var(--koldkaze-font-weight-semibold);
    background: transparent;
    border: none;
}

.wc-order-totals td.total {
    text-align: center;
    padding: var(--koldkaze-spacing-md) var(--koldkaze-spacing-lg);
    font-weight: var(--koldkaze-font-weight-semibold);
    min-width: 120px;
    background: var(--koldkaze-white);
    color: var(--koldkaze-gray-800);
    border: none;
}

/* ===== LIGNE TOTAL FINAL ===== */
.wc-order-totals tr.total_cost {
    border-bottom: 2px solid var(--koldkaze-primary);
    background: var(--koldkaze-white);
    font-weight: var(--koldkaze-font-weight-bold);
}

.wc-order-totals tr.total_cost th.label {
    color: var(--koldkaze-white);
    font-weight: var(--koldkaze-font-weight-bold);
    background: var(--koldkaze-primary);
    font-size: var(--koldkaze-font-size-lg);
}

.wc-order-totals tr.total_cost td.total {
    font-weight: var(--koldkaze-font-weight-bold);
    background: var(--koldkaze-primary);
    color: var(--koldkaze-white);
    font-size: var(--koldkaze-font-size-lg);
}

.wc-order-totals tr.total_cost .woocommerce-Price-amount {
    color: var(--koldkaze-dark) !important;
    font-size: var(--koldkaze-font-size-lg);
}

/* ===== LIGNES SPÉCIALES TOTAUX ===== */
.wc-order-totals tr.vendor-gains-row th,
.wc-order-totals tr.vendor-gains-row td {
    background: var(--koldkaze-success) !important;
    color: var(--koldkaze-white) !important;
    font-weight: var(--koldkaze-font-weight-bold) !important;
}

.wc-order-totals tr.admin-fee-row th,
.wc-order-totals tr.admin-fee-row td {
    background: var(--koldkaze-danger) !important;
    color: var(--koldkaze-white) !important;
}

.wc-order-totals tr.tax-row th,
.wc-order-totals tr.tax-row td {
    background: var(--koldkaze-warning) !important;
    color: var(--koldkaze-white) !important;
}

/* ===== BOUTON D'ÉDITION WCFM ===== */
.wcfm_order_edit_request {
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--koldkaze-spacing-sm) !important;
    background: var(--koldkaze-primary) !important;
    color: var(--koldkaze-white) !important;
    padding: var(--koldkaze-spacing-md) var(--koldkaze-spacing-xl) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    text-decoration: none !important;
    font-weight: var(--koldkaze-font-weight-semibold) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    transition: all var(--koldkaze-transition-fast) !important;
    margin-top: var(--koldkaze-spacing-md) !important;
    border: none !important;
}

.wcfm_order_edit_request:hover {
    background: var(--koldkaze-primary-hover) !important;
    color: var(--koldkaze-white) !important;
    text-decoration: none !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--koldkaze-shadow-md) !important;
}

/* ===== STYLES POUR LES ADDONS WCFM ===== */
.koldkaze-addon-row {
    background: var(--koldkaze-gray-50) !important;
    border-left: 3px solid var(--koldkaze-gray-300) !important;
    transition: background-color var(--koldkaze-transition-fast) !important;
}

.koldkaze-addon-row:hover {
    background: var(--koldkaze-gray-100) !important;
}

.koldkaze-addon-name {
    font-size: var(--koldkaze-font-size-sm) !important;
    color: var(--koldkaze-gray-700) !important;
    font-style: italic !important;
    padding-left: var(--koldkaze-spacing-sm) !important;
    font-weight: var(--koldkaze-font-weight-semibold) !important;
}

.koldkaze-addon-price {
    color: var(--koldkaze-gray-800) !important;
    font-weight: var(--koldkaze-font-weight-bold) !important;
}

.koldkaze-addon-input {
    width: 80px !important;
    color: var(--koldkaze-gray-800) !important;
    font-weight: var(--koldkaze-font-weight-bold) !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    padding: var(--koldkaze-spacing-xs) !important;
}

.koldkaze-btn-remove-addon {
    margin-left: var(--koldkaze-spacing-xs) !important;
    background: var(--koldkaze-danger) !important;
    color: var(--koldkaze-white) !important;
    border: none !important;
    padding: 2px var(--koldkaze-spacing-xs) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    cursor: pointer !important;
    font-size: var(--koldkaze-font-size-xs) !important;
    transition: background-color var(--koldkaze-transition-fast) !important;
}

.koldkaze-btn-remove-addon:hover {
    background: var(--koldkaze-danger-hover) !important;
}

.koldkaze-addon-cell {
    padding: var(--koldkaze-spacing-lg) var(--koldkaze-spacing-sm) !important;
    vertical-align: top !important;
    border: none !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .woocommerce_order_items thead th,
    .woocommerce_order_items tbody td {
        padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-xs);
        font-size: var(--koldkaze-font-size-xs);
    }
    
    .wc-order-item-thumbnail img {
        width: 40px;
        height: 40px;
    }
    
    .wc-order-item-name {
        font-size: var(--koldkaze-font-size-sm);
    }
    
    .wc-item-meta li {
        font-size: 11px;
    }
    
    .wc-order-data-row.wc-order-totals-items {
        padding: var(--koldkaze-spacing-md);
    }
    
    .wc-order-totals th.label,
    .wc-order-totals td.total {
        padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-md);
        font-size: var(--koldkaze-font-size-xs);
    }
}

@media (max-width: 480px) {
    .no_mob {
        display: none !important;
    }
    
    .woocommerce_order_items thead th,
    .woocommerce_order_items tbody td {
        padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-xs);
    }
    
    .wc-order-data-row.wc-order-totals-items {
        padding: var(--koldkaze-spacing-sm);
    }
}

/* ===== FORMULAIRE D'AJOUT DE NOTE WCFM ===== */
.wcfm-container .add_note.koldkaze-form-container {
    background: var(--koldkaze-white) !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius) !important;
    padding: var(--koldkaze-spacing-xl) !important;
    margin-bottom: var(--koldkaze-spacing-xl) !important;
    box-shadow: var(--koldkaze-shadow-sm) !important;
}

.wcfm-container .add_note h2.koldkaze-form-title {
    color: var(--koldkaze-gray-800) !important;
    font-size: var(--koldkaze-font-size-lg) !important;
    font-weight: var(--koldkaze-font-weight-semibold) !important;
    border-bottom: 2px solid var(--koldkaze-border-color) !important;
    padding-bottom: var(--koldkaze-spacing-sm) !important;
    margin-bottom: var(--koldkaze-spacing-lg) !important;
}

.wcfm-container .add_note textarea.wcfm-textarea {
    background: var(--koldkaze-white) !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    padding: var(--koldkaze-spacing-md) !important;
    font-family: var(--koldkaze-font-family) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    color: var(--koldkaze-gray-800) !important;
    width: 100% !important;
    min-height: 120px !important;
    resize: vertical !important;
}

.wcfm-container .add_note textarea.wcfm-textarea:focus {
    border-color: var(--koldkaze-primary) !important;
    box-shadow: 0 0 0 2px rgba(99, 0, 255, 0.1) !important;
    outline: none !important;
}

.wcfm-container .add_note .wcfm_title {
    color: var(--koldkaze-gray-700) !important;
    font-weight: var(--koldkaze-font-weight-medium) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    margin-bottom: var(--koldkaze-spacing-xs) !important;
}

.wcfm-container .add_note input.wcfm-text {
    background: var(--koldkaze-white) !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    padding: var(--koldkaze-spacing-sm) !important;
    font-family: var(--koldkaze-font-family) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    color: var(--koldkaze-gray-800) !important;
}

.wcfm-container .add_note input.wcfm-text:focus {
    border-color: var(--koldkaze-primary) !important;
    box-shadow: 0 0 0 2px rgba(99, 0, 255, 0.1) !important;
    outline: none !important;
}

.wcfm-container .add_note .koldkaze-btn-upload,
.wcfm-container .add_note .upload_button.koldkaze-btn-upload {
    background: var(--koldkaze-primary) !important;
    color: var(--koldkaze-white) !important;
    border: 1px solid var(--koldkaze-primary) !important;
    padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-lg) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    font-weight: var(--koldkaze-font-weight-medium) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    cursor: pointer !important;
    transition: var(--koldkaze-transition-fast) !important;
    text-decoration: none !important;
    display: inline-block !important;
}

.wcfm-container .add_note .koldkaze-btn-upload:hover,
.wcfm-container .add_note .upload_button.koldkaze-btn-upload:hover {
    background: var(--koldkaze-primary-hover) !important;
    border-color: var(--koldkaze-primary-hover) !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--koldkaze-shadow-sm) !important;
}

.wcfm-container .add_note .koldkaze-btn-remove,
.wcfm-container .add_note .remove_button.koldkaze-btn-remove {
    background: var(--koldkaze-danger) !important;
    color: var(--koldkaze-white) !important;
    border: 1px solid var(--koldkaze-danger) !important;
    padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-lg) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    font-weight: var(--koldkaze-font-weight-medium) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    cursor: pointer !important;
    transition: var(--koldkaze-transition-fast) !important;
    text-decoration: none !important;
    display: inline-block !important;
}

.wcfm-container .add_note .koldkaze-btn-remove:hover,
.wcfm-container .add_note .remove_button.koldkaze-btn-remove:hover {
    background: var(--koldkaze-danger-hover) !important;
    border-color: var(--koldkaze-danger-hover) !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--koldkaze-shadow-sm) !important;
}

.wcfm-container .add_note .koldkaze-upload-display {
    width: 75px !important;
    height: 75px !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    overflow: hidden !important;
    display: inline-block !important;
    background: var(--koldkaze-gray-50) !important;
}

.wcfm-container .add_note .koldkaze-upload-span,
.wcfm-container .add_note .placeHolderUploads.koldkaze-upload-span {
    width: 75px !important;
    height: 75px !important;
    background: var(--koldkaze-gray-100) !important;
    border: 2px dashed var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--koldkaze-gray-500) !important;
    font-size: var(--koldkaze-font-size-xs) !important;
}

.wcfm-container .add_note .koldkaze-upload-span:hover,
.wcfm-container .add_note .placeHolderUploads.koldkaze-upload-span:hover {
    border-color: var(--koldkaze-primary) !important;
    background: var(--koldkaze-primary-light) !important;
}

.wcfm-container .add_note .koldkaze-select-styled,
.wcfm-container .add_note select.koldkaze-select-styled {
    background: var(--koldkaze-gray-100) !important;
    border: 2px solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    padding: var(--koldkaze-spacing-sm) var(--koldkaze-spacing-md) !important;
    font-weight: var(--koldkaze-font-weight-medium) !important;
    color: var(--koldkaze-gray-800) !important;
    font-family: var(--koldkaze-font-family) !important;
}

.wcfm-container .add_note .koldkaze-text-danger {
    color: var(--koldkaze-danger) !important;
    font-weight: var(--koldkaze-font-weight-medium) !important;
}

.wcfm-container .add_note .description {
    color: var(--koldkaze-gray-600) !important;
    font-size: var(--koldkaze-font-size-xs) !important;
    margin-top: var(--koldkaze-spacing-sm) !important;
}

.wcfm-container .add_note .add_note.button.koldkaze-form-container,
.wcfm-container .add_note #wcfm_add_order_note {
    background: var(--koldkaze-success) !important;
    color: var(--koldkaze-white) !important;
    border: 1px solid var(--koldkaze-success) !important;
    padding: var(--koldkaze-spacing-md) var(--koldkaze-spacing-xl) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    font-weight: var(--koldkaze-font-weight-semibold) !important;
    font-size: var(--koldkaze-font-size-sm) !important;
    cursor: pointer !important;
    transition: var(--koldkaze-transition-fast) !important;
    text-decoration: none !important;
    display: inline-block !important;
    margin-top: var(--koldkaze-spacing-lg) !important;
}

.wcfm-container .add_note .add_note.button.koldkaze-form-container:hover,
.wcfm-container .add_note #wcfm_add_order_note:hover {
    background: var(--koldkaze-success-hover) !important;
    border-color: var(--koldkaze-success-hover) !important;
    transform: translateY(-1px) !important;
    box-shadow: var(--koldkaze-shadow-md) !important;
}

.wcfm-container .add_note .multi_input_block {
    background: var(--koldkaze-gray-50) !important;
    border: var(--koldkaze-border-width) solid var(--koldkaze-border-color) !important;
    border-radius: var(--koldkaze-border-radius-sm) !important;
    padding: var(--koldkaze-spacing-lg) !important;
    margin-bottom: var(--koldkaze-spacing-md) !important;
}

.wcfm-container .add_note .add_multi_input_block {
    color: var(--koldkaze-success) !important;
    font-size: var(--koldkaze-font-size-lg) !important;
    cursor: pointer !important;
    margin-left: var(--koldkaze-spacing-sm) !important;
}

.wcfm-container .add_note .add_multi_input_block:hover {
    color: var(--koldkaze-success-hover) !important;
}

/* ===== ACCESSIBILITÉ ===== */
@media (prefers-contrast: high) {
    .woocommerce_order_items,
    .wc-order-totals {
        border-width: 2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .woocommerce_order_items tbody tr.item,
    .wcfm_order_edit_request,
    .koldkaze-addon-row,
    .wcfm-container .add_note .koldkaze-btn-upload,
    .wcfm-container .add_note .koldkaze-btn-remove,
    .wcfm-container .add_note #wcfm_add_order_note {
        transition: none;
    }
}
