/* HHSP v1.1.2 — nuke theme button styles + remove artifacts between buttons + clean send button */
.hhsp-card{width:100%;max-width:560px;margin:12px auto;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.hhsp-video-wrap{position:relative;width:100%;height:auto;background:#000}
/* Hard height reservation so builders/themes know this player occupies space */
.hhsp-video-wrap::before{content:"";display:block;padding-top:177.7778%}
/* Modern browsers can still use aspect-ratio */
@supports (aspect-ratio: 9 / 16){
  .hhsp-video-wrap{aspect-ratio:9/16}
  .hhsp-video-wrap::before{display:none}
}
/* Video fills the wrap without forcing a height-based shrink on mobile */
.hhsp-video{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:contain!important;background:#000!important;display:block!important}

/* overlay must allow clicks for sheet + buttons */
.hhsp-overlay{position:absolute;inset:0;pointer-events:auto}

/* meta should NOT steal clicks */
.hhsp-meta{position:absolute;left:14px;right:90px;bottom:14px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.55);pointer-events:none;z-index:10}
.hhsp-title{font-weight:900;font-size:18px;line-height:1.15;margin:0 0 4px}
.hhsp-caption{font-size:14px;line-height:1.25;opacity:.92;margin:0}

/* Actions: TikTok style */
.hhsp-actions{position:absolute;right:12px;bottom:12px;display:flex;flex-direction:column;gap:10px;z-index:20;background:transparent!important}

/* Kill any theme/Elementor button styling (artifacts usually come from padding/bg/border/box-shadow) */
.hhsp-btn,
.hhsp-btn:visited,
.hhsp-btn:hover,
.hhsp-btn:active,
.hhsp-btn:focus{
  all: unset !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  width:54px !important;
  cursor:pointer !important;
  color:#fff !important;
  user-select:none !important;
  -webkit-tap-highlight-color: transparent !important;
  text-decoration:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  outline:none !important;
}
.hhsp-btn:focus-visible{outline:2px solid rgba(255,255,255,.35)!important;outline-offset:4px!important;border-radius:14px!important}
.hhsp-ico{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:rgba(10,10,10,.45)!important;backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);box-shadow:none!important;border:0!important}
.hhsp-ico svg{width:26px;height:26px;display:block}
.hhsp-count{font-size:12px;font-weight:800;letter-spacing:.2px;line-height:1;text-shadow:0 2px 10px rgba(0,0,0,.55)}
.hhsp-like.is-liked .hhsp-ico{background:rgba(255,196,0,.22)!important}
.hhsp-like.is-liked{color:rgba(255,196,0,.95)!important}
.hhsp-audio.is-on .hhsp-ico{background:rgba(255,196,0,.18)!important}

.hhsp-error{padding:12px 14px;border:1px solid rgba(0,0,0,.15);border-radius:10px;background:#fff;color:#111;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace}

/* Comments sheet */
.hhsp-comments-sheet{position:absolute;left:0;right:0;bottom:0;height:58%;max-height:520px;background:rgba(20,20,20,.96);color:#fff;border-top-left-radius:18px;border-top-right-radius:18px;transform:translateY(110%);transition:transform .22s ease;display:flex;flex-direction:column;z-index:50}
.hhsp-comments-sheet.is-open{transform:translateY(0)}
.hhsp-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.hhsp-sheet-title{font-weight:900;letter-spacing:.3px}
.hhsp-sheet-close{all:unset!important;cursor:pointer;font-size:18px;line-height:1;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.08)!important}
.hhsp-sheet-body{display:flex;flex-direction:column;gap:10px;padding:12px 14px;overflow:hidden;flex:1}
.hhsp-comments-list{overflow:auto;flex:1;padding-right:4px}
.hhsp-cmt{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.hhsp-cmt img{width:34px;height:34px;border-radius:999px;flex:0 0 34px}
.hhsp-cmt-author{font-weight:800;font-size:13px;margin-bottom:2px}
.hhsp-cmt-content{font-size:13px;line-height:1.25;opacity:.95}
.hhsp-comments-footer{display:flex;flex-direction:column;gap:10px}

/* Logged-out message */
.hhsp-login-note{font-weight:800;margin-bottom:6px}
.hhsp-login-link{display:inline-block;color:#111!important;background:rgba(255,196,0,.95)!important;padding:10px 12px;border-radius:999px;text-decoration:none!important;font-weight:900}

/* Comment input */
.hhsp-comment-form{display:flex;gap:10px}
.hhsp-comment-input{
  flex:1;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.25);
  color:#fff;
  padding:10px 12px;
  outline:none;
}
.hhsp-comment-input::placeholder{color:rgba(255,255,255,.65)}

/* Send button — hard reset to remove weird yellow artifacts */
.hhsp-comment-send,
.hhsp-comment-send:visited,
.hhsp-comment-send:hover,
.hhsp-comment-send:active,
.hhsp-comment-send:focus{
  all:unset!important;
  cursor:pointer;
  width:44px;height:44px;border-radius:999px;
  display:flex!important;align-items:center;justify-content:center;
  background:rgba(255,196,0,.25)!important;
  color:#fff!important;font-weight:900;line-height:1;
  box-shadow:none!important;border:0!important;margin:0!important;padding:0!important;
}

/* Backdrop behind sheet */
.hhsp-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:40}
.hhsp-sheet-backdrop.is-open{opacity:1;pointer-events:auto}


/* HHSP_DESKTOP_CAP_v1: cap height on larger screens so it doesn't get absurdly tall */
@media (min-width: 900px){
  .hhsp-video-wrap{max-height:85vh;}
}
@media (max-width: 899px){
  .hhsp-video-wrap{max-height:none;}
}

/* HHSP_STACK_FIX_v1 — prevent page elements / other players from overlapping this player */
.hhsp-card{
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  clear: both !important;
  overflow: hidden !important;
  display: block !important;
}

.hhsp-video-wrap{
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  display: block !important;
}

.hhsp-card *{
  box-sizing: border-box;
}

/* Give separate players breathing room */
.hhsp-card + .hhsp-card{
  margin-top: 20px !important;
}

/* Keep internal overlays above the video but inside this player's stacking context */
.hhsp-overlay{z-index: 2 !important;}
.hhsp-actions{z-index: 20 !important;}
.hhsp-sheet-backdrop{z-index: 40 !important;}
.hhsp-comments-sheet{z-index: 50 !important;}

/* Prevent adjacent floated/theme elements from riding over the player */
.hhsp-card::before,
.hhsp-card::after{
  content: "";
  display: table;
}
.hhsp-card::after{
  clear: both;
}


/* HHSP_LAYOUT_RESERVE_v1 — help post/grid widgets respect player height */
.hhsp-card,
.hhsp-video-wrap{contain: layout paint !important;}
.elementor-post__thumbnail__link .hhsp-card,
.elementor-widget-posts .hhsp-card,
.elementor-widget-loop-grid .hhsp-card{width:100% !important;max-width:none !important;}
.elementor-widget-posts .elementor-post,
.elementor-widget-loop-grid .e-loop-item,
.elementor-widget-theme-post-content .hhsp-card{overflow:visible !important;}


/* HHSP_FORCE_LAYOUT_v1.1.6 */
.hhsp-card, .hhsp-video-wrap{min-width:0;}
.hhsp-video-wrap{height:auto;}
.elementor-widget-posts .elementor-post__text,
.elementor-widget-theme-post-content,
.elementor-widget-theme-post-content .elementor-widget-container{overflow:visible !important;}