/* =========================
   WCPC – Frontend (clean)
   ========================= */

/* grids extras */
.wcpc-grid-1{display:grid;grid-template-columns:1fr;gap:10px}
.wcpc-grid-3{display:grid;;gap:10px}
.wcpc-grid-6{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media(max-width:900px){
  .wcpc-grid-6{grid-template-columns:repeat(3,1fr)}
  .wcpc-grid-3{grid-template-columns:1fr}
}


/* Só swatches (sem texto) */
.wcpc-field-color-radio .wcpc-swatch-text{
  display:none !important;
}

/* opcional: aumenta um pouco a bolinha */
.wcpc-field-color-radio .wcpc-swatch-dot{
  width: 22px;
  height: 22px;
}


/* inputs de quantidade compactos (não “tijolos”) */
.wcpc-field-number .wcpc-input{
  width:100%;
  max-width:90px;
  padding:8px 10px;
}

/* swatches */
.wcpc-field-color-radio{display:flex;flex-wrap:wrap;gap:10px}
.wcpc-swatch{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;border:1px solid #ddd;border-radius:999px;
  cursor:pointer;user-select:none;
}
.wcpc-swatch input{position:absolute;opacity:0;pointer-events:none}
.wcpc-swatch-dot{
  width:18px;height:18px;border-radius:999px;
  background:var(--sw,#000);
  border:1px solid rgba(0,0,0,.25);
}
.wcpc-swatch:has(input:checked){
  border-color:#111;
  box-shadow:0 0 0 2px rgba(0,0,0,.08);
}

/* wrapper */
.wcpc-wrap{
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #e8e8e8;
  border-radius: 14px;
  background: #fff;
}

.wcpc-title{
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 800;
}

/* Esconde o campo de quantidade no produto */
.single-product .quantity,
.single-product input.qty,
.single-product .qty {
  display: none !important;
}

.wcpc-section{ margin: 14px 0; }

.wcpc-label{
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 8px;
  color: #222;
}

.wcpc-note{
  margin-top: 8px;
  color: #cc0000;
  font-size: 12.5px;
  line-height: 1.3;
}

/* grids (sections) */
.wcpc-grid-2{
  display: grid;
  gap: 10px;
}
.wcpc-grid-1{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (max-width: 640px){
  .wcpc-grid-2{ grid-template-columns: 1fr; }
}

/* =========================
   Radio tiles
   ✅ MOBILE: lado a lado quando há espaço (auto-fit)
   ========================= */

/* o container do grupo de radios (grid responsivo) */
.wcpc-wrap .wcpc-field.wcpc-field-radio{
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
  align-items: stretch !important;
}

/* em ecrãs MUITO pequenos, 1 coluna */
@media (max-width: 360px){
  .wcpc-wrap .wcpc-field.wcpc-field-radio{
    grid-template-columns: 1fr !important;
  }
}

/* cada opção */
.wcpc-opt{
  display: block;
  margin: 0 !important;
  width: auto !important;
  max-width: none !important;
}

/* cada label ocupa a célula do grid */
.wcpc-wrap .wcpc-field.wcpc-field-radio > label.wcpc-opt{
  width: 100% !important;
  margin: 0 !important;
}

/* hide o radio nativo */
.wcpc-opt input{ display: none; }

/* estilo aplicado SÓ ao span principal */
.wcpc-opt > span{
  display: flex;
  align-items: center;
  justify-content: space-between; /* texto esquerda | preço direita */
  gap: 12px;

  width: 100% !important;
  min-height: 46px;
  padding: 12px 14px;

  border: 1px solid #dcdcdc;
  border-radius: 12px;
  background: #fff;

  cursor: pointer;
  user-select: none;
  text-align: left;

  /* neutraliza tema */
  text-transform: none !important;
  letter-spacing: normal !important;

  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  color: #222;

  transition: border-color .12s ease, box-shadow .12s ease, transform .05s ease;
}

.wcpc-opt > span:hover{
  border-color: #bdbdbd;
}

.wcpc-opt input:checked + span{
  border-color: #1e6b3d;
  box-shadow: 0 0 0 2px rgba(30,107,61,.10) inset;
}

/* clique com feedback leve */
.wcpc-opt > span:active{
  transform: translateY(1px);
}

/* texto da opção */
.wcpc-opt > span .wcpc-opt-text{
  display: block;
}

/* preço “offer” à direita */
.wcpc-offer{
  margin-left: auto;
  font-weight: 900;
  font-size: 13px;
  color: #1e6b3d;
  white-space: nowrap;

  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* neutraliza qualquer span interno (preço/€) */
.wcpc-opt > span .wcpc-offer *,
.wcpc-opt > span .woocommerce-Price-amount,
.wcpc-opt > span .woocommerce-Price-currencySymbol{
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  float: none !important;
  position: static !important;
  display: inline !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

/* se algum tema meter o símbolo como bloco */
.wcpc-wrap .woocommerce-Price-currencySymbol,
.wcpc-pricebar .woocommerce-Price-currencySymbol{
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: inline !important;
  float: none !important;
  position: static !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

/* =========================
   Select / input / textarea
   ========================= */

.wcpc-select,
.wcpc-input{
  width: 100%;
  max-width: 360px;

  padding: 10px 12px;
  border: 1px solid #dcdcdc;
  border-radius: 12px;

  font-size: 13px;
  line-height: 1.2;

  text-transform: none !important;
  letter-spacing: normal !important;

  background: #fff;
}

.wcpc-textarea{
  width: 100%;
  max-width: 760px;

  padding: 10px 12px;
  border: 1px solid #dcdcdc;
  border-radius: 12px;

  font-size: 13px;
  line-height: 1.3;

  text-transform: none !important;
  letter-spacing: normal !important;

  background: #fff;
}

.wcpc-file{
  font-size: 13px;
}

/* =========================
   Sticky price bar
   ========================= */

.wcpc-pricebar{
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 999999;

  max-width: 980px;
  margin: 0 auto;

  border: 1px solid rgba(30,107,61,.20);
  border-radius: 16px;

  background: rgba(255,255,255,.96);
  backdrop-filter: saturate(140%) blur(6px);

  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  padding: 10px 12px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.wcpc-pricebar-left{ min-width: 0; }

.wcpc-pricebar-title{
  font-weight: 900;
  font-size: 12.5px;
  color: #444;
}

.wcpc-pricebar-sub{
  font-size: 12px;
  color: #666;
  margin-top: 2px;
}

.wcpc-pricebar-val{
  font-weight: 900;
  font-size: 16px;
  white-space: nowrap;

  /* neutraliza tema */
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* dá espaço no fundo para a barra não tapar conteúdo */
body.single-product{
  padding-bottom: 90px;
}

/* WCPC Tooltips */

.wcpc-tip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;height:22px;
  border-radius:999px;
  border:1px solid rgba(30,107,61,.35);
  background:#fff;
  color:#1e6b3d;
  font-weight:900;
  font-size:12px;
  line-height:1;
  cursor:pointer;
  flex:0 0 auto;
  margin-left:10px;
}

.wcpc-label{
  display:flex;
  align-items:center;
  gap:10px;
}
.wcpc-tooltip img{
  display:block;
  width:100%;
  height:auto;
  border-radius:10px;
  margin-top:8px;
}

/* =========================================================
   T-SHIRTS: forçar 3 colunas a caber (sem afetar outros)
   ========================================================= */
#wcpc-wrap[data-wcpc*='"template":"t-shirts"'] .wcpc-grid-3{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

/* Os "botões" (labels) estavam demasiado largos -> deixam de ter min-width */
#wcpc-wrap[data-wcpc*='"template":"t-shirts"'] .wcpc-grid-3 label{
  min-width: 0 !important;
  width: 100%;
  box-sizing: border-box;
  white-space: normal; /* permite 2 linhas sem rebentar a coluna */
}

/* Opcional: reduzir um pouco o espaço entre colunas só neste template */
#wcpc-wrap[data-wcpc*='"template":"t-shirts"'] .wcpc-grid-3{
  gap: 12px !important;
}
/* =========================
   WCPC Upload Dropzone
   ========================= */

.wcpc-upload-guidelines{
  display:flex;
  align-items:center;
  gap:10px;
  margin: 8px 0 10px;
  color:#cc0000;
  font-size: 13px;
  line-height: 1.3;
}
.wcpc-upload-guidelines a{
  color: inherit;
  text-decoration: underline;
  font-weight: 700;
}
.wcpc-upload-guidelines-ico{
  width:22px;height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(204,0,0,.35);
  color:#cc0000;
  font-weight:900;
  flex:0 0 auto;
}

.wcpc-dropzone{
  border-radius: 14px;
  border: 1px dashed rgba(30,107,61,.35);
  background: rgba(30,107,61,.06);
  padding: 14px;
  position: relative;
  cursor: pointer;
  transition: box-shadow .12s ease, border-color .12s ease, transform .05s ease;
}

.wcpc-dropzone:hover{
  border-color: rgba(30,107,61,.55);
}

.wcpc-dropzone.is-dragover{
  border-color: rgba(30,107,61,.95);
  box-shadow: 0 0 0 2px rgba(30,107,61,.14) inset;
}

.wcpc-dropzone-inner{
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:center;
  text-align:center;
}

.wcpc-dropzone-title{
  font-weight: 900;
  font-size: 16px;
  color:#1e6b3d;
}

.wcpc-dropzone-sub{
  font-size: 13px;
  color:#2a2a2a;
  opacity: .9;
}

.wcpc-dropzone-file{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 800;
  color:#111;
  word-break: break-word;
}

.wcpc-browse{
  appearance:none;
  border:0;
  background: none;
  padding:0;
  margin:0;
  font: inherit;
  color:#1e6b3d;
  text-decoration: underline;
  font-weight: 900;
  cursor: pointer;
}

.wcpc-file-hidden{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
  width:100%;
  height:100%;
}
button.wcpc-browse {
    background: white !important;
    text-shadow: none;
}
/* =========================
   WCPC Upload UX: overlay + spinner
   ========================= */

.wcpc-dropzone .wcpc-dropzone-file{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height: 18px;
}

.wcpc-mini-spinner{
  width:16px;height:16px;
  border-radius:999px;
  border:2px solid rgba(30,107,61,.25);
  border-top-color: rgba(30,107,61,1);
  animation: wcpcSpin .7s linear infinite;
  flex:0 0 auto;
}

@keyframes wcpcSpin { to { transform: rotate(360deg); } }

.wcpc-filemeta{
  font-weight:800;
  font-size:13px;
}

/* Overlay global ao submeter */
.wcpc-overlay{
  position: fixed;
  inset: 0;
  z-index: 99999999;
  background: rgba(255,255,255,.75);
  backdrop-filter: blur(4px);
  display:none;
  align-items:center;
  justify-content:center;
  padding: 20px;
}

.wcpc-overlay.is-on{ display:flex; }

.wcpc-overlay-card{
  width:min(520px, 92vw);
  border:1px solid rgba(30,107,61,.25);
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.12);
  padding:16px;
  text-align:center;
}

.wcpc-overlay-title{
  font-weight:900;
  font-size:16px;
  color:#1e6b3d;
  margin-bottom:6px;
}
.wcpc-overlay-sub{
  font-size:13px;
  color:#333;
  line-height:1.35;
}
.wcpc-overlay-row{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
/* ✅ Forçar 2 colunas SÓ na Quantidade */
.wcpc-wrap .wcpc-field.wcpc-field-radio:has(input[name="wcpc_quantity"]){
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Mobile: 1 coluna */
@media (max-width: 640px){
  .wcpc-wrap .wcpc-field.wcpc-field-radio:has(input[name="wcpc_quantity"]){
    grid-template-columns: 1fr !important;
  }
}
/* ===== WCPC Upload (mais bonito) ===== */
.wcpc-files-panel{
  background:#fff;
  border:1px solid #e8e8e8;
  border-radius:16px;
  padding:14px;
}

.wcpc-files-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px solid #f0f0f0;
  margin-bottom:12px;
}

.wcpc-files-title{
  font-weight:900;
  font-size:14px;
  margin:0;
}

.wcpc-files-sub{
  margin-top:4px;
  font-size:12px;
  color:#666;
}

.wcpc-files-count{
  font-weight:900;
  font-size:12px;
  padding:6px 10px;
  border:1px solid #eee;
  border-radius:999px;
  background:#fafafa;
  white-space:nowrap;
}

.wcpc-upload-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.wcpc-upload-item{
  display:flex;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  border:1px solid #eee;
  border-radius:14px;
  background:#fcfcfc;
}

.wcpc-upload-icon{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:#f3f4f6;
  flex:0 0 auto;
  font-size:16px;
}

.wcpc-upload-meta{
  flex:1 1 auto;
  min-width:0;
}

.wcpc-upload-name{
  font-weight:800;
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.wcpc-upload-sub{
  margin-top:4px;
  font-size:12px;
  color:#777;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
button.wcpc-upload-remove {
    background: white;
}

.wcpc-upload-remove{
  border:1px solid #e5e5e5;
  background:#fff;
  border-radius:12px;
  padding:7px 10px;
  font-weight:800;
  font-size:12px;
  cursor:pointer;
}
/* ===========================
   WCPC Tooltips (FORÇAR HIDE/SHOW)
   =========================== */

/* o wrapper do tooltip */
.wcpc-tip{
  position:relative !important;
  display:inline-flex !important;
}

/* por defeito: escondido (mesmo que o tema force display) */
.wcpc-tip .wcpc-tooltip{
  display:none !important;
  position:absolute !important;
  left:0 !important;
  top:calc(100% + 10px) !important;
  z-index:9999999 !important;

  min-width:220px;
  max-width:360px;
  padding:10px 12px;

  border-radius:12px;
  border:1px solid rgba(0,0,0,.10);
  background:#111;
  color:#fff;

  box-shadow:0 12px 30px rgba(0,0,0,.25);
  font-size:13px;
  line-height:1.25;
}

/* mostrar apenas ao passar o rato OU ao focar (teclado/mobile) */
.wcpc-tip:hover .wcpc-tooltip,
.wcpc-tip:focus-within .wcpc-tooltip{
  display:block !important;
}

/* setinha */
.wcpc-tip .wcpc-tooltip::before{
  content:"";
  position:absolute;
  top:-7px;
  left:10px;
  width:12px;
  height:12px;
  background:#111;
  transform:rotate(45deg);
}


/* mobile: não sair do ecrã */
@media (max-width:520px){
  .wcpc-tip .wcpc-tooltip{
    left:auto !important;
    right:0 !important;
    max-width:min(360px, 90vw);
  }
  .wcpc-tip .wcpc-tooltip::before{
    left:auto;
    right:10px;
  }
}


/* PVC banner: radio ocupa a linha toda, e os 3 numbers ficam lado-a-lado */
#wcpc-wrap .wcpc-grid-3{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

/* mantém o bloco do radio (Size) a ocupar a largura toda */
#wcpc-wrap .wcpc-grid-3 .wcpc-field-radio,
#wcpc-wrap .wcpc-grid-3 .wcpc-field-color-radio,
#wcpc-wrap .wcpc-grid-3 .wcpc-field-select,
#wcpc-wrap .wcpc-grid-3 .wcpc-field-textarea{
  grid-column: 1 / -1;
}

/* força os numbers a não ocuparem a linha toda */
#wcpc-wrap .wcpc-grid-3 .wcpc-field-number{
  grid-column: auto !important;
}

/* responsivo: em ecrãs pequenos volta a 1 coluna */
@media (max-width: 700px){
  #wcpc-wrap .wcpc-grid-3{
    grid-template-columns: 1fr;
  }
}

/* ✅ FIX global: wcpc-grid-3 precisa de colunas no desktop */
.wcpc-grid-3{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

/* mobile */
@media (max-width: 900px){
  .wcpc-grid-3{
    grid-template-columns: 1fr !important;
  }
}