/* ── Modal de Produto — produtos-modal.css ──────────────────────────── */
/* Prefixo: mp-  |  Formato compacto: uma regra por linha               */

.mp-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
.mp-modal { background:var(--bg, #fff); border-radius:var(--r); box-shadow:0 8px 32px rgba(0,0,0,0.18); width:min(98vw,900px); max-height:92vh; display:flex; flex-direction:column; overflow:hidden; }
.mp-modal__header { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--bdr); flex-shrink:0; }
.mp-modal__titulo { font-size:15px; font-weight:600; color:var(--t1); margin:0; }
.mp-modal__fechar { background:none; border:none; cursor:pointer; font-size:20px; color:var(--t2); line-height:1; padding:0 4px; }
.mp-modal__body { overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:16px; }
.mp-modal__footer { display:flex; align-items:center; justify-content:flex-end; gap:8px; padding:12px 20px; border-top:1px solid var(--bdr); flex-shrink:0; }

.mp-secao { display:flex; flex-direction:column; gap:8px; }
.mp-secao__titulo { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.8px; color:var(--t3); margin:0; }
.mp-linha { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.mp-campo { display:flex; flex-direction:column; gap:4px; }
.mp-campo--flex { flex:1; min-width:0; }
.mp-label { font-size:11px; font-weight:500; letter-spacing:0.8px; color:var(--t2); }
.mp-check-label { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--t2); cursor:pointer; }

/* Editor de cores */
.mp-cores-editor { display:flex; flex-direction:column; gap:12px; }
.mp-add-cor { margin-top:4px; }

/* Bloco de cor */
.cor-bloco { border:1px solid var(--bdr2); border-radius:var(--r); overflow:hidden; }
.cor-bloco__header { display:flex; flex-direction:column; background:var(--inp); }
.cor-bloco__linha1 { display:flex; align-items:center; gap:6px; padding:4px 10px; width:100%; box-sizing:border-box; }
.cor-bloco__btn { width:28px; height:28px; padding:0; display:flex; align-items:center; justify-content:center; font-size:13px; flex-shrink:0; border-radius:6px; }
.cor-bloco__linha1-acoes { display:flex; gap:4px; align-items:center; margin-left:16px; }
input[type=color].cor-bloco__btn { border:1px solid var(--bdr); cursor:pointer; }
.cor-bloco__sep { width:1px; height:20px; background:var(--bdr2); flex-shrink:0; margin:0 2px; align-self:center; }
.cor-bloco__cores { display:flex; gap:6px; align-items:center; flex-shrink:0; margin-left:auto; }
.cor-bloco__cor-item { display:flex; flex-direction:column; align-items:center; gap:1px; }
.cor-bloco__cor-label { font-size:8px; color:var(--t3); line-height:1; }
.cor-bloco__cor-check { display:flex; align-items:center; gap:2px; cursor:pointer; font-size:9px; color:var(--t3); line-height:1; }
.cor-bloco__cor-check input[type=checkbox] { width:9px; height:9px; margin:0; }
.cor-bloco__linha2 { display:flex; align-items:center; justify-content:center; gap:8px; padding:4px 10px; border-top:1px solid var(--bdr); }
.cor-bloco__linha3 { display:flex; align-items:stretch; gap:8px; padding:4px 10px; border-top:1px solid var(--bdr); width:100%; box-sizing:border-box; }
.cor-bloco__linha3 .cor-codforn-input { flex:1 1 50%; min-width:0; height:32px; font-size:13px; }
.cor-bloco__linha3 .cor-obs-input { flex:1 1 50%; min-width:0; height:32px; font-size:13px; }
.cor-bloco__pcc-placeholder { font-size:11px; color:var(--t3); white-space:nowrap; }
.mp-foto-wrap { display:flex; align-items:center; gap:4px; flex-shrink:0; }
.mp-foto-inline { display:flex; align-items:center; gap:4px; }
.mp-foto-slot { position:relative; width:36px; height:36px; border-radius:6px; border:1px solid var(--bdr2); overflow:hidden; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; background:var(--inp); }
.mp-foto-thumb { width:100%; height:100%; object-fit:contain; display:block; background:var(--bg,#fff); }
.mp-foto-icon { font-size:16px; color:var(--t3); }

/* Tabela de tamanhos */
.tabela-tam { width:100%; border-collapse:collapse; font-size:12px; }
.tabela-tam th { padding:4px 6px; text-align:left; font-size:11px; font-weight:600; color:var(--t3); }
.tabela-tam td { padding:3px 4px; }
.tabela-tam input { width:100%; min-width:48px; padding:3px 5px; border:1px solid var(--bdr2); border-radius:4px; font-size:12px; background:var(--inp); color:var(--t1); font-family:inherit; }
.tabela-tam .ti-sku { min-width:90px; }
.tabela-tam .ti-cubado-cell { font-size:11px; color:var(--t3); text-align:right; white-space:nowrap; }
.tabela-tam--editor .ti-sku { min-width:110px; }

/* Resumo PCC */
.pcc-resumo { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:6px 10px; background:var(--inp); border-top:1px solid var(--bdr); font-size:12px; }
.pcc-resumo--editor { background:transparent; border:none; padding:0; flex-shrink:0; display:inline-flex; width:auto; }
.pcc-resumo__item { display:flex; flex-direction:column; align-items:center; gap:2px; }
.pcc-resumo__item--pcc { margin-left:4px; align-self:flex-end; }
.pcc-resumo__label { font-size:10px; font-weight:600; color:var(--t3); text-transform:uppercase; }
.pcc-resumo__inp { width:58px; padding:3px 5px; border:1px solid var(--bdr2); border-radius:4px; font-size:12px; background:var(--inp); color:var(--t1); font-family:inherit; text-align:center; }
.pcc-resumo__val { font-size:12px; color:var(--t1); }
.pcc-resumo__val--pcc { font-weight:600; color:#fff; font-size:11px; box-sizing:border-box; width:58px; height:28px; line-height:22px; padding:3px 5px; border:1px solid var(--marca-azul,#1E3A8A); text-align:center; background:var(--marca-azul,#1E3A8A); border-radius:4px; white-space:nowrap; overflow:hidden; display:block; }
.pcc-resumo__sep { font-size:13px; color:var(--t3); margin-top:12px; }
.pcc-resumo__divider { width:1px; height:28px; background:var(--bdr2); margin:0 2px; }

/* Filiais */
.mp-filiais-wrap { display:flex; gap:8px; flex-wrap:wrap; }

/* Cor nome input */
.cor-nome-input { flex:1; min-width:0; max-width:280px; height:28px; padding:0 8px; border:1px solid var(--bdr2); border-radius:var(--r,6px); font-size:13px; font-family:inherit; background:var(--inp); color:var(--t1); outline:none; }
.cor-codforn-input { height:32px; padding:0 8px; border:1px solid var(--bdr2); border-radius:var(--r,6px); font-size:12px; font-family:inherit; background:var(--inp); color:var(--t1); outline:none; }
.cor-obs-input { height:32px; padding:0 6px; border:1px solid #FDE047; border-radius:var(--r); font-size:12px; font-family:inherit; background:#FEFCE8; color:#854D0E; outline:none; }
.mp-custos-grid { display:grid; grid-template-columns:1fr 1fr 130px; gap:10px 12px; align-items:end; }
.mp-custos-ga { grid-column:1; }
.mp-custos-pe { grid-column:2; }
.mp-custos-ncm { grid-column:3; }
.mp-custos-unlock { grid-column:3; display:flex; align-items:center; padding-bottom:2px; }
#mp-custo-pe:disabled { background:var(--bg2,#F1F5F9); opacity:.6; }
#mp-preco-ga[readonly], #mp-preco-pe[readonly] { background:var(--bg2,#F1F5F9); cursor:not-allowed; opacity:.6; }

.mp-lightbox { position:fixed; inset:0; background:rgba(0,0,0,0.85); display:none; align-items:center; justify-content:center; z-index:9999; cursor:zoom-out; }
.mp-lightbox__img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:8px; box-shadow:0 8px 32px rgba(0,0,0,0.4); }

/* Tabela de tamanhos editor */
.mp-tabela-tam { border-top:2px solid var(--bdr2); }
.mp-tabela-tam__header { border-bottom:1px solid var(--bdr); }
.mp-tabela-tam__th-center { text-align:center; }
.mp-btn-skus { padding:2px 8px; font-size:11px; height:24px; }
.mp-icon-camera { font-size:13px; }

/* Foto principal */
.mp-foto-principal-row {
    align-items: flex-start;
}
.mp-foto-principal-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}
.mp-foto-principal-slot {
    width: 72px;
    height: 72px;
    border: 2px dashed var(--bdr2);
    border-radius: var(--r);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden;
    background: var(--inp);
    transition: border-color .2s;
}
.mp-foto-principal-slot:hover {
    border-color: var(--marca-azul);
}
.mp-foto-principal-slot img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 4px;
}
#mp-foto-principal-placeholder {
    font-size: 22px;
    color: var(--t3);
}