/* Refined action controls for generated media */
.action-icon{
  width:15px;
  height:15px;
  display:block;
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.play-video-button,
.cancel-task-button,
.delete-generation-button,
.mini-play-button,
.copy-prompt-button{
  min-height:40px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:12px !important;
  padding:0 14px !important;
  font-family:inherit;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1;
  letter-spacing:-.01em;
  cursor:pointer;
  transition:
    background .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
  box-shadow:0 1px 2px rgba(22,61,90,.04);
}

.play-video-button{
  color:#086b7e !important;
  background:#f1fbfc !important;
  border:1px solid #bfe4e8 !important;
}

.play-video-button:hover{
  color:#045f70 !important;
  background:#e9f9fa !important;
  border-color:#8ed4da !important;
  box-shadow:0 7px 20px rgba(22,140,155,.10) !important;
  transform:translateY(-1px);
}

.play-video-button .action-icon{
  width:14px;
  height:14px;
  padding:5px;
  box-sizing:content-box;
  border-radius:50%;
  color:#fff;
  background:#12adbb;
  box-shadow:0 4px 10px rgba(18,173,187,.18);
}

.delete-generation-button{
  color:#5f6f7d !important;
  background:#fff !important;
  border:1px solid #d9e3ea !important;
}

.delete-generation-button .action-icon{
  color:#cf5965;
}

.delete-generation-button:hover{
  color:#9f3e49 !important;
  background:#fff7f8 !important;
  border-color:#eabac0 !important;
  box-shadow:0 6px 16px rgba(185,72,86,.08) !important;
  transform:translateY(-1px);
}

.cancel-task-button{
  color:#796329 !important;
  background:#fffdf7 !important;
  border:1px solid #eadfbe !important;
}

.cancel-task-button .action-icon{
  color:#a77b17;
}

.cancel-task-button:hover{
  color:#6b551c !important;
  background:#fff9e9 !important;
  border-color:#dfca8b !important;
  box-shadow:0 6px 16px rgba(157,118,22,.08) !important;
  transform:translateY(-1px);
}

.mini-play-button{
  min-height:34px !important;
  padding:0 10px !important;
  color:#0b6f80 !important;
  background:#f1fafb !important;
  border:1px solid #c9e7ea !important;
}

.mini-play-button:hover{
  background:#e9f8f9 !important;
  border-color:#9ed8dd !important;
}

.copy-prompt-button{
  min-height:36px !important;
  padding:0 11px !important;
  color:#345d73 !important;
  background:#fff !important;
  border:1px solid #d8e4eb !important;
}

.copy-prompt-button:hover{
  color:#0a6c80 !important;
  background:#f5fbfc !important;
  border-color:#bcdde2 !important;
}

.compact-action{
  min-height:34px !important;
  padding:0 10px !important;
  font-size:10px !important;
  border-radius:10px !important;
}

.job-action{
  min-width:150px;
  gap:7px !important;
}

.job-action .play-video-button,
.job-action .delete-generation-button,
.job-action .cancel-task-button{
  width:100%;
}

.studio-gen-actions{
  gap:6px !important;
}

.studio-gen-actions .action-icon{
  width:13px;
  height:13px;
}

.video-modal-actions .delete-generation-button,
.video-modal-actions .copy-prompt-button{
  width:auto;
}

body:not(.light-theme) .play-video-button{
  color:#8ce7ed !important;
  background:#102226 !important;
  border-color:#285057 !important;
}

body:not(.light-theme) .delete-generation-button{
  color:#c8d0d8 !important;
  background:#15191e !important;
  border-color:#303841 !important;
}

body:not(.light-theme) .cancel-task-button{
  color:#e5ca7a !important;
  background:#221f14 !important;
  border-color:#4d4323 !important;
}

@media(max-width:720px){
  .job-action{min-width:0}
  .job-action .play-video-button,
  .job-action .delete-generation-button,
  .job-action .cancel-task-button{
    width:100%;
  }
}

/* Final history action layout overrides */
.play-video-button .action-label,
.cancel-task-button .action-label,
.delete-generation-button .action-label,
.mini-play-button .action-label,
.copy-prompt-button .action-label{
  width:auto !important;
  height:auto !important;
  display:inline !important;
  place-items:initial !important;
  border-radius:0 !important;
  background:transparent !important;
  color:inherit !important;
  font-size:inherit !important;
  line-height:1 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
}

.job{
  grid-template-columns:88px minmax(0,1fr) auto auto !important;
  gap:18px !important;
  padding:14px 16px !important;
  min-height:104px;
}

.job .thumb{
  width:88px;
  height:68px;
  border-radius:13px;
}

.job-extra{
  min-width:115px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.job-action{
  min-width:0 !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  overflow:visible !important;
  white-space:nowrap;
}

.job-action .play-video-button,
.job-action .delete-generation-button,
.job-action .cancel-task-button{
  width:auto !important;
  min-width:0 !important;
}

.job-action .play-video-button{
  min-width:116px !important;
}

.job-action .delete-generation-button{
  min-width:84px !important;
}

.job-action .cancel-task-button{
  min-width:108px !important;
}

.job-action .play-video-button .action-icon{
  width:12px;
  height:12px;
  padding:4px;
}

.job-action .delete-generation-button .action-icon,
.job-action .cancel-task-button .action-icon{
  width:14px;
  height:14px;
}

.job h3{
  line-height:1.4;
}

body.light-theme .job{
  box-shadow:0 6px 20px rgba(31,76,104,.045);
}

body.light-theme .job:hover{
  border-color:#c8dce7;
  box-shadow:0 10px 28px rgba(31,76,104,.07);
}

@media(max-width:1100px){
  .job{
    grid-template-columns:76px minmax(0,1fr) auto !important;
  }
  .job .thumb{
    width:76px;
    height:60px;
  }
  .job-action{
    grid-column:2 / 4;
    justify-content:flex-start !important;
    margin-top:2px;
  }
}

@media(max-width:720px){
  .job{
    grid-template-columns:64px minmax(0,1fr) !important;
    gap:12px !important;
    min-height:0;
  }
  .job .thumb{
    width:64px;
    height:54px;
  }
  .job-extra,
  .job-action{
    grid-column:2 !important;
  }
  .job-action{
    flex-wrap:wrap;
    justify-content:flex-start !important;
  }
  .job-action .play-video-button,
  .job-action .delete-generation-button,
  .job-action .cancel-task-button{
    width:auto !important;
  }
}