/* ---------- Base ---------- */
.wkr-form .wkr-row{margin:12px 0;}
.wkr-inline{display:flex;align-items:center;gap:8px}
.wkr-domain{background:#f4f4f4;padding:10px;border:1px solid #ddd;border-radius:10px}

/* Inputs uniformes */
.wkr-form input[type="text"],
.wkr-form input[type="url"],
.wkr-form input[type="email"],
.wkr-form input[type="number"],
.wkr-form select,
.wkr-form textarea {
  background-color:#fff;
  border:1px solid #bbb;
  width:100%;
  padding:10px;
  border-radius:10px;
  box-sizing:border-box;
}

/* ---------- Contenedor generador ---------- */
.wkr-card.wkr-generator{
  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
  padding:20px;
  margin:10px 0 24px;
}

/* ---------- UTM acordeón ---------- */
.wkr-utm{border:0; padding:0; margin-top:12px}
.wkr-utm legend{font-weight:600; margin-bottom:8px}
.wkr-utm .wkr-utm-fields{display:none; padding-top:8px}
.wkr-utm .wkr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:800px){ .wkr-utm .wkr-grid{grid-template-columns:1fr} }

/* ---------- Botones ---------- */
.wkr-btn{border:0; padding:10px 16px; cursor:pointer; display:inline-flex; align-items:center; gap:8px}
.wkr-btn-primary{
  background-image:linear-gradient(90deg,#7b25bc 0%, #ef324e 99%);
  color:#fff; border-radius:25px; font-size:16px; font-weight:600;
}
.wkr-btn-gray{
  background:#f1f1f1; color:#333; border-radius:10px; font-weight:600; transition: 0.3s ease;
}
.wkr-short-cell .wkr-btn-gray{
  font-size: 11px; padding: 10px 10px;
}
.wkr-btn-gray:hover {
  transform: scale(1.05);
}

.wkr-short-cell .wkr-btn { display:inline-flex; align-items:center; gap:8px; }

.wkr-btn:disabled{opacity:.7; cursor:not-allowed}

/* ---------- Resultado ---------- */
.wkr-result .wkr-card{margin-top:12px;padding:12px;border:1px solid #eaeaea;border-radius:10px;background:#fdfdfd}
#wkr-out{width:100%; max-width:420px}

/* Copiar en tabla */
.wkr-short{width:100%; max-width:300px}
.wkr-short-cell{display:flex; align-items:center; gap:8px}
.wkr-icon{font-size:16px; line-height:1}

/* ---------- Listado ---------- */
.wkr-list-section{
  background:#f7f7f7;
  padding:18px;
  border-radius:12px;
  box-sizing:border-box;
}

/* Contenedor de tabla: controla el ancho y evita overflow */
.wkr-table-wrapper{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

/* Tabla totalmente contenida */
.wkr-table{
  width:100%;
  table-layout:fixed;          /* Fuerza ajuste proporcional dentro del ancho */
  border-collapse:separate;    /* Para mantener bordes redondeados */
  border-spacing:0;
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-sizing:border-box;
}

/* Celdas */

.entry-content tr td {
    padding: 6px 10px;
}
.wkr-short-cell input[type=text] {
    background-color: #f8f0f8;
}

.wkr-table th,
.wkr-table td{
  border-bottom:1px solid #eee;
  padding:10px;
  font-size:14px;
  text-align:left;
  vertical-align:middle;
  word-wrap:break-word;        /* rompe palabras largas */
  overflow-wrap:break-word;
  white-space:normal;          /* permite saltos de línea */
}

/* Mantiene las esquinas redondeadas */
.wkr-table th:first-child{border-top-left-radius:10px;}
.wkr-table th:last-child{border-top-right-radius:10px;}
.wkr-table tr:last-child td:first-child{border-bottom-left-radius:10px;}
.wkr-table tr:last-child td:last-child{border-bottom-right-radius:10px;}

/* ---------- Tabla contenida y legible ---------- */
.wkr-table{
  width:100%;
  table-layout:fixed;          /* fuerza ajuste al contenedor */
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-sizing:border-box;
}

/* Color y legibilidad garantizados en tbody */
.wkr-table th,
.wkr-table td{
  color:#333;                  /* <-- asegura que no se “pierda” el texto */
  border-bottom:1px solid #eee;
  padding:10px;
  font-size:14px;
  text-align:left;
  vertical-align:middle;
  white-space:normal;          /* permite saltos */
  overflow-wrap:break-word;
  word-wrap:break-word;
}

/* Anchos de columnas (ajusta si quieres) */
.wkr-table th:nth-child(1),
.wkr-table td:nth-child(1){ width:15%; }  /* Título */
.wkr-table th:nth-child(2),
.wkr-table td:nth-child(2){ width:10%; }  /* Cliente */
.wkr-table th:nth-child(3),
.wkr-table td:nth-child(3){ width:15%; }  /* URL Larga */
.wkr-table th:nth-child(4),
.wkr-table td:nth-child(4){ width:37%; }  /* URL Corta */
.wkr-table th:nth-child(5),
.wkr-table td:nth-child(5){ width:10%;  text-align:center;} /* Clics */
.wkr-table th:nth-child(6),
.wkr-table td:nth-child(6){ width:13%; }  /* Fecha */

/* Celda de URL corta: quepa todo y se vea bien */
.wkr-short-cell{ display:flex; align-items:center; gap:8px; white-space:nowrap; }
.wkr-short{ width:100%; max-width:none; min-width: 250px;}

/* ---------- Export CSV panel ---------- */
.wkr-export{
  background:#fff;
  padding:8px;
  border:1px solid #eee;
  border-radius:10px;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr auto; /* cliente / desde / hasta / botón */
  gap:8px;
  align-items:center;
  margin: 20px auto;
}

.wkr-export input[type="text"],
.wkr-export input[type="date"]{
  background-color:#fff;
  border:1px solid #bbb;
  width:100%;
  padding:10px;
  border-radius:10px;
  box-sizing:border-box;
}

.wkr-export .wkr-btn-gray{
  justify-content:center;
  padding:10px 14px;
}

@media (max-width:900px){
  .wkr-export{ grid-template-columns:1fr; }
}
/* Estado normal del botón (gris) ya lo tienes como .wkr-btn-gray */

/* Estado copiado */
.wkr-btn-gray.is-copied{
  background:#21aa0a !important;
  color:#fff !important;
}
.wkr-btn-gray.is-copied .wkr-icon svg{
  width:16px; height:16px; display:block;
}
.wkr-btn .wkr-icon { display:inline-flex; align-items:center; }
.wkr-btn .wkr-icon svg { width:16px; height:16px; display:block; }