/* PartyShaker User Portal styles */
/* Neutral dark theme variables (no purple) */
:root{
  --ps-bg:#0a0f14;
  --ps-surface:#151822;
  --ps-surface-2:#151822;
  --ps-border:#272A33;
  --ps-text:#e5eef7;
  --ps-muted:#9fb3c8;
  --ps-accent:#1f2a37;
  --ps-accent-dark:#0c1218;
  --ps-accent-contrast:#ffffff;
  --ps-danger:#ef4444;
  --ps-warning:#f59e0b;
  --ps-max:1260px;
}
html, body{overflow-x:hidden}
.psup-container{width:100%;max-width:var(--ps-max);margin:0 auto;padding:16px;box-sizing:border-box}
.psup-header-card .psup-avatar{width:36px;height:36px}
/* Compact header text sizing */
.psup-header-card .psup-username{font-size:14px}
/* Smaller header action buttons */
.psup-header-card .psup-actions .psup-btn{padding:3px 7px;font-size:12px}
/* Optional full-bleed helper, can be applied via attribute */
.psup-container.psup-fullbleed{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
/* Center inner layout within full-bleed container to match header width */
.psup-container.psup-fullbleed > .psup-layout{width:100%;max-width:var(--ps-max);margin:0 auto}
/* Match common theme containers to portal width on portal pages */
header .container, header .wrap,
.site-header .container, .site-header .wrap,
.container, .wrap{max-width:var(--ps-max);margin-left:auto;margin-right:auto}
/* Ensure media never overflows */
img, video{max-width:100%;height:auto}
/* Avoid long text causing overflow */
.psup-card,.psup-header-card,.psup-container{overflow-wrap:break-word;word-break:normal}
/* Brugeroversigt: responsivt multi-kolonne grid */
.psup-users-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));align-items:stretch}
.psup-users-grid > .psup-card{display:flex;flex-direction:column;height:100%}
.psup-users-grid > .psup-card .psup-follow-wrap{margin-top:auto}
.psup-users-grid > .psup-card .psup-follow-bar{margin-top:auto !important}
.psup-card{background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:14px;padding:14px;color:var(--ps-text);align-self:start;position:relative}
/* Vis forhåndsvisning og sociale links i venstre kolonne igen */
/* (fjerner tidligere skjulning) */
.psup-header-card{display:flex;align-items:center;gap:4px;padding:6px}
.psup-avatar{width:64px;height:64px;border-radius:50%;border:3px solid var(--ps-surface);box-shadow:0 0 0 3px #efeaff1a;object-fit:cover}
/* Ensure any generic avatars also use cover and round shape */
.avatar{border-radius:50%;object-fit:cover}
.psup-username{font-weight:600;color:var(--ps-text)}
.psup-role{color:var(--ps-muted);font-size:12px;margin-top:2px}
.psup-actions{display:flex;gap:6px}
.psup-actions{flex-wrap:wrap}
.psup-btn{background:var(--ps-accent);color:var(--ps-accent-contrast);border:none;border-radius:10px;padding:8px 12px;cursor:pointer}
.psup-btn:hover{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.psup-btn-outline{background:transparent;border:1px solid var(--ps-border);color:var(--ps-text)}
/* Inline button style for icon + label alignment */
.psup-btn-inline{display:inline-flex;align-items:center;gap:6px}
.psup-btn-inline .psup-icon,.psup-btn-inline .dashicons{font-size:16px;line-height:1;width:16px;height:16px}
/* Color variants for action buttons */
.psup-btn-green{background:#22c55e;color:#ffffff;border:1px solid #22c55e}
.psup-btn-green:hover{background:#1da34f;border-color:#1da34f;box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.psup-btn-blue{background:var(--ps-accent);color:var(--ps-accent-contrast);border:none}
.psup-btn-blue:hover{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.psup-btn-red{background:var(--ps-danger);color:#fff;border:1px solid var(--ps-danger)}
.psup-btn-red:hover{box-shadow:0 0 0 2px rgba(239,68,68,.35)}
.psup-btn-gray{background:var(--ps-accent);color:var(--ps-accent-contrast);border:none}
.psup-btn-gray:hover{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Outline variants (used sparingly) */
.psup-btn-outline-blue{background:transparent;border:1px solid var(--ps-border);color:var(--ps-text)}
.psup-btn-outline-red{background:transparent;border:1px solid var(--ps-border);color:var(--ps-text)}

/* Ensure action buttons on profile (friend/chat/block) use accent theme */
a[data-dm-login],button[data-dm-login],
a[data-target-login],button[data-target-login],
a[data-block-login],button[data-block-login]{
  background:var(--ps-accent);
  color:var(--ps-accent-contrast);
  border:none;
}
a[data-dm-login]:hover,button[data-dm-login]:hover,
a[data-target-login]:hover,button[data-target-login]:hover,
a[data-block-login]:hover,button[data-block-login]:hover{
  box-shadow:0 0 0 2px rgba(255,255,255,.15);
}

/* Force messages button to match green style like others */
#psup-btn-messages{background:var(--ps-accent);color:var(--ps-accent-contrast);border:none}
#psup-btn-messages:hover{box-shadow:0 0 0 2px rgba(255,255,255,.15)}

.psup-form label{display:block;margin-bottom:4px;color:var(--ps-muted)}
.psup-form input,.psup-form textarea{width:100%;padding:10px;background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px}
/* Status textarea: make it more interesting */
.psup-form textarea[name="ps_status_content"]{
  background: linear-gradient(180deg,var(--ps-accent-dark) 0%, var(--ps-surface-2) 100%);
  border-radius: 12px;
  border-color: var(--ps-border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  transition: box-shadow .15s ease, border-color .15s ease, background .2s ease;
  min-height: 90px;
}
.psup-form textarea[name="ps_status_content"]::placeholder{ color: #8aa0b8; }
.psup-form textarea[name="ps_status_content"]:focus{
  outline: none;
  border-color: #3a4a5f;
  box-shadow: 0 0 0 2px rgba(255,255,255,.12);
  background: linear-gradient(180deg,var(--ps-accent-dark) 0%, var(--ps-accent) 100%);
}
/* Label: add subtle icon and spacing */
.psup-form label[for="ps_status_content"],
.psup-form label:has(+ textarea[name="ps_status_content"]) {
  font-weight: 500;
  color: var(--ps-text);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.psup-form label[for="ps_status_content"]::before,
.psup-form label:has(+ textarea[name="ps_status_content"])::before{
  content: "✍️";
  font-size: 14px;
}
/* Post button: give it a more vibrant hover */
.psup-form .psup-actions .psup-btn{
  background: var(--ps-accent);
  color: var(--ps-accent-contrast);
  border: none;
  border-radius: 10px;
}
.psup-form .psup-actions .psup-btn:hover{
  box-shadow: 0 0 0 2px rgba(255,255,255,.15);
}
.elementor .psup-card,.elementor-widget .psup-card{width:100%;box-sizing:border-box}
.elementor .psup-form input,.elementor .psup-form textarea{max-width:520px}
.psup-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.psup-col-stack{display:flex;flex-direction:column;gap:8px}
/* Ensure stacked cards fill the full column width */
.psup-col-stack .psup-card{align-self:stretch;width:100%}
.psup-alert{padding:8px 10px;border-radius:10px;margin:8px 0}
.psup-alert-error{background:#2a1020;color:#ffb4c4;border:1px solid var(--ps-border)}
.psup-alert-success{background:#1d1533;color:#d9ccff;border:1px solid var(--ps-accent)}
.psup-hidden{display:none}

/* Cover */
.psup-cover{height:160px;border-radius:14px;overflow:hidden;margin-bottom:-32px}
.psup-cover{position:relative;z-index:0}
.psup-cover-img{height:100%;background-size:cover;background-position:center}
/* Dark overlay with bottom fade to card background */
/* Cover fade til transparens i bunden (uden farvet gradient) */
.psup-cover-overlay{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.45) 55%, rgba(0,0,0,0) 100%)}

/* Ensure avatar/text render above cover */
.psup-profile-row{position:relative;z-index:1}

/* Layout */
.psup-layout{display:grid;grid-template-columns:1fr;gap:16px;align-items:start}
.psup-main-full{grid-column:1 / -1}
.psup-row-span{grid-column:1 / -1}
.psup-sidebar{position:static}
/* Header spanning both columns on larger screens */
.psup-header-span{width:100%}
@media (min-width: 1024px){
  .psup-layout{grid-template-columns:1fr 1fr}
  .psup-header-span{grid-column:1 / -1}
  .psup-main-full{grid-column:1 / -1}
  .psup-row-span{grid-column:1 / -1}
  .psup-sidebar{position:sticky;top:16px;height:max-content}
}
.psup-sidebar{position:sticky;top:16px;height:max-content}
.psup-col2{position:static}
.psup-userrow{display:flex;align-items:center;gap:10px;padding:6px 0}

/* Modal */
.psup-modal-overlay{position:fixed;inset:0;background:#0008;display:none;align-items:center;justify-content:center;z-index:9999}
.psup-modal-overlay.open{display:flex}
.psup-modal-dialog{background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:14px;padding:16px;max-width:700px;width:90%}
.psup-modal-close{position:absolute;top:10px;right:14px;background:transparent;color:#e5eef7;border:none;font-size:22px;cursor:pointer}

/* Badges */
.psup-badge{display:inline-block;border-radius:10px;padding:4px 8px;font-size:12px}
.psup-badge-online{background:#2a1a4a;color:#e5d9ff;border:1px solid var(--ps-accent)}
.psup-badge-offline{background:var(--ps-surface-2);color:var(--ps-muted);border:1px solid var(--ps-border)}

/* Rank & XP */
.psup-rank-row{display:flex;align-items:center;gap:8px;margin-top:4px;color:#9fb3c8;font-size:12px;flex-wrap:wrap}
.psup-xp{color:var(--ps-muted)}
.psup-progress{width:160px;height:6px;background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:6px;overflow:hidden;margin-top:4px}
.psup-progress-fill{height:100%;background:var(--ps-accent);width:0%;transition:width 0.6s ease}

/* Konkurrencer: fast grid i 4 kolonner på desktop, 2 på mobil */
.psup-grid.pscomp-gallery{grid-template-columns:repeat(2,1fr)}
@media (min-width: 768px){.psup-grid.pscomp-gallery{grid-template-columns:repeat(4,1fr)}}
.psup-grid.pscomp-overview-grid{grid-template-columns:repeat(2,1fr)}
@media (min-width: 768px){.psup-grid.pscomp-overview-grid{grid-template-columns:repeat(4,1fr)}}
.pscomp-item img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 1px 0 #0004;image-rendering:auto}
.pscomp-winner{max-width:480px;margin:8px auto}
.pscomp-badge{box-shadow:0 0 0 2px #ffd700aa}
.pscomp-meta{color:#9fb3c8;font-size:12px}

/* Dropdowns for header actions */
.psup-dropdown{position:relative;display:inline-block}
.psup-btn.psup-dd-toggle{position:relative;padding-right:58px;min-width:100px}
/* Ensure header-specific rule gives extra space for caret */
.psup-actions .psup-btn.psup-dd-toggle{padding-right:64px;min-width:110px}

.psup-btn.psup-dd-toggle::before{content:"";position:absolute;right:34px;top:6px;bottom:6px;width:1px;background:rgba(255,255,255,.35)}
.psup-btn.psup-dd-toggle::after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);opacity:.98;font-size:18px;font-weight:800;filter:drop-shadow(0 1px 0 #000)}
.psup-dd-menu{position:absolute;right:0;top:100%;background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:12px;box-shadow:0 10px 24px rgba(0,0,0,.35);min-width:220px;padding:6px;display:none;z-index:1000}
.psup-dropdown:hover .psup-dd-menu,.psup-dropdown.open .psup-dd-menu,.psup-dropdown[open] .psup-dd-menu{display:block}
.psup-dropdown[open] .psup-btn.psup-dd-toggle::after{content:"▴"}
.psup-dropdown > summary{list-style:none;cursor:pointer}
.psup-dropdown > summary::-webkit-details-marker{display:none}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:var(--ps-text);text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:#fff}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}

/* Random Users Grid Styling */
.psup-random-users{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;margin:20px 0}
.psup-random-user{display:flex;flex-direction:column;align-items:center;text-align:center;padding:12px;background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:12px;transition:transform 0.2s ease,box-shadow 0.2s ease}
.psup-random-user:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.3)}
.psup-random-user .psup-avatar{margin-bottom:8px;border:2px solid var(--ps-border)}
.psup-random-user .psup-username{font-size:14px;font-weight:600;color:#e5eef7;word-break:break-word}
/* Mobile responsive for random users */
@media (max-width: 768px) {
  .psup-random-users{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px}
  .psup-random-user{padding:8px}
  .psup-random-user .psup-username{font-size:12px}
}
/* Under-beskrivelse: container til profilhandlinger */
.psup-underdesc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}

/* Tabs (venstre/højre kolonne kort) */
.psup-tabs{display:flex;gap:3px;flex-wrap:wrap}
.psup-tab{background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px;padding:6px 10px;cursor:pointer}
.psup-tab .dashicons{margin-right:4px;vertical-align:middle}
.psup-tab.active{background:var(--ps-surface);border-color:var(--ps-border)}
.psup-tab-panel{display:block}
/* Match chat button inside tabs to same sizing/alignment */
.psup-tabs .psup-btn-inline{display:inline-flex;align-items:center;gap:3px;padding:6px 10px;border-radius:10px}

/* Inline social links */
.psup-social-link{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;padding:6px 10px;border:1px solid var(--ps-border);border-radius:999px;background:var(--ps-surface-2)}
.psup-social-link .dashicons{font-size:16px}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Mobile-specific adjustments */
@media (max-width: 768px) {
  .psup-container { padding: 10px; overflow-x: hidden; }
  .psup-card { margin: 10px 0; padding: 16px; }
  .psup-grid { grid-template-columns: 1fr; }
  .psup-profile-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .psup-avatar { width: 88px; height: 88px; }
  .psup-tabs { flex-wrap: wrap; overflow-x: visible; white-space: normal; }
  .psup-tab { display: inline-flex; }
  .psup-actions .psup-btn { padding: 4px 8px; font-size: 14px; }
  .psup-col-stack .psup-card { width: 100%; }
  /* Avoid overflow when cards are 100% width + margins */
  .psup-mobile .psup-col-stack .psup-card { width: auto !important; }
  .psup-cover { height: 120px; margin-bottom: -24px; }
  .psup-progress { width: 120px; }
  
  /* Fix social links overflow and wrapping */
  .psup-social-links { 
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: 6px !important; 
    margin: 0 !important;
  }
  .psup-social-link { 
    flex: 0 1 auto !important; 
    min-width: 0 !important; 
    max-width: calc(50% - 6px) !important;
    padding: 6px 8px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .psup-social-link .dashicons { 
    font-size: 14px !important; 
    flex-shrink: 0 !important;
  }
  
  /* Ensure all content has proper spacing */
  .psup-social-preview-in-col,
  .psup-card > div,
  .psup-card > section {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Simplified UI for mobile */
.psup-mobile .psup-rank-under-desc,
.psup-mobile .psup-xp-timer,
.psup-mobile .psup-global-feed,
/* Overstyr tidligere skjulning af overview-grid: vis den i én kolonne */
.psup-mobile .psup-underdesc-actions { display: none !important; }

.psup-mobile .psup-card h2 { font-size: 18px; }
.psup-mobile .psup-username { font-size: 16px; }
.psup-mobile .psup-grid { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-gallery { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-overview-grid { display: grid !important; grid-template-columns: 1fr !important; }
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.psup-mobile .psup-header-card .psup-actions{display:none !important}
.psup-mobile .psup-header-card .actions{display:none !important}
.psup-hamburger-btn{position:fixed;left:12px;top:12px;z-index:10001;background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px;padding:8px 12px;cursor:pointer}
.psup-hamburger-btn .dashicons{margin-right:6px;vertical-align:middle}
.psup-drawer{position:fixed;left:0;top:0;bottom:0;width:80%;max-width:320px;background:var(--ps-surface-2);color:var(--ps-text);border-right:1px solid var(--ps-border);transform:translateX(-100%);transition:transform .25s ease;z-index:10000;padding:10px;overflow:auto}
.psup-menu-open .psup-drawer{transform:translateX(0)}
.psup-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:9999}
.psup-menu-open .psup-drawer-overlay{display:block}
.psup-drawer-title{font-weight:600;margin:4px 2px 8px}
.psup-drawer .psup-menu-item{display:block;padding:10px;border-radius:10px;margin-bottom:8px;border:1px solid var(--ps-border);background:var(--ps-surface-2);color:var(--ps-text);text-decoration:none}

/* Mobile/tablet fullbleed fix to prevent horizontal scroll */
@media (max-width: 1024px){
  .psup-container.psup-fullbleed{width:100%;max-width:100%;margin-left:0;margin-right:0}
  .psup-sidebar{display:none}
}

/* Listener messages: elegant cards + animations */
.psup-listener-messages{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.psup-listener-messages ul,.psup-listener-messages ol{list-style:none;margin:0;padding:0}
.psup-listener-messages li,
.psup-listener-messages > article,
.psup-listener-messages > div,
.psup-listener-messages .psup-message{background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:14px;padding:12px;box-shadow:0 4px 16px rgba(0,0,0,0.25);transition:box-shadow .25s ease,transform .25s ease,opacity .25s ease}
.psup-listener-messages li:hover,
.psup-listener-messages > article:hover,
.psup-listener-messages > div:hover,
.psup-listener-messages .psup-message:hover{box-shadow:0 6px 20px rgba(0,0,0,0.32);transform:translateY(-1px)}
.psup-listener-messages .psup-message-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.psup-listener-messages .psup-message-name{font-weight:600;color:var(--ps-text)}
.psup-listener-messages .psup-message-time{color:var(--ps-muted);font-size:12px;margin-left:auto}
.psup-listener-messages .psup-message-body{color:var(--ps-text);line-height:1.5}
.psup-message-appear{opacity:0;transform:translateY(4px);animation:psupMsgIn .2s ease-out forwards}
@keyframes psupMsgIn{to{opacity:1;transform:translateY(0)}}
.psup-message-new{box-shadow:0 0 0 2px rgba(255,255,255,.15),0 6px 18px rgba(0,0,0,0.35);animation:psupMsgPulse .9s ease-out}
@keyframes psupMsgPulse{0%{box-shadow:0 0 0 2px rgba(255,255,255,.15),0 6px 18px rgba(0,0,0,0.35)}50%{box-shadow:0 0 0 6px rgba(255,255,255,.10),0 10px 24px rgba(0,0,0,0.4)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0),0 4px 16px rgba(0,0,0,0.25)}}

/* Popup body gradient to match portal theme with subtle depth */
.psup-popup-body{background:linear-gradient(145deg,var(--ps-surface) 0%,var(--ps-surface-2) 60%,var(--ps-surface) 100%);color:var(--ps-text)}

/* Top header for messages: toolbar + search */
.psup-msg-header{background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:14px;padding:10px;display:flex;align-items:center;gap:8px;box-shadow:0 4px 16px rgba(0,0,0,0.25);position:sticky;top:0;z-index:5}
.psup-msg-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:12px;padding:8px 10px}
.psup-msg-search input{flex:1;background:transparent;color:var(--ps-text);border:none;outline:none;font-size:14px}
.psup-msg-search .icon{width:18px;height:18px;border-radius:50%;background:var(--ps-surface-2);box-shadow:0 0 0 2px rgba(255,255,255,.10)}
.psup-msg-actions{display:flex;gap:8px;margin-left:auto}
.psup-msg-actions .psup-btn{background:var(--ps-surface-2)}
.psup-refresh-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--ps-surface-2),var(--ps-surface));border:1px solid var(--ps-border);color:var(--ps-text)}
.psup-refresh-btn .spinner{width:16px;height:16px;border-radius:50%;border:2px solid var(--ps-muted);border-right-color:transparent;display:none}
.psup-refresh-btn.loading .spinner{display:inline-block;animation:psupSpin .8s linear infinite}
.psup-refresh-btn.loading .label{opacity:.8}
@keyframes psupSpin{to{transform:rotate(360deg)}}
.psup-last-update{color:#9fb3c8;align-self:center}

/* Stories row */
.psup-msg-stories{display:flex;align-items:center;gap:10px;margin:12px 0 6px;overflow:auto;padding-bottom:4px}
.psup-story{width:42px;height:42px;border-radius:50%;position:relative;flex:0 0 auto}
.psup-story img{width:100%;height:100%;border-radius:50%;display:block;object-fit:cover;border:2px solid #0b0f14;box-shadow:0 0 0 2px #e5eef71a}
.psup-story:after{content:"";position:absolute;inset:-3px;border-radius:50%;box-shadow:0 0 0 2px #ffd16677}
.psup-story:hover{transform:translateY(-1px);transition:transform .2s ease}

/* Message item layout (avatar-left, name/time row) */
.psup-listener-messages li,.psup-listener-messages article,.psup-listener-messages .psup-message{display:grid;grid-template-columns:auto 1fr;gap:10px}
.psup-listener-messages li img,.psup-listener-messages article img,.psup-listener-messages .psup-message img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid #0b0f14;box-shadow:0 0 0 2px #e5eef71a}
.psup-listener-messages li .psup-message-head,.psup-listener-messages article .psup-message-head,.psup-listener-messages .psup-message .psup-message-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.psup-listener-messages li .psup-message-name,.psup-listener-messages article .psup-message-name,.psup-listener-messages .psup-message .psup-message-name{font-weight:600;color:#e5eef7}
.psup-listener-messages li .psup-message-time,.psup-listener-messages article .psup-message-time,.psup-listener-messages .psup-message .psup-message-time{color:#9fb3c8;font-size:12px;margin-left:auto}
.psup-listener-messages li .psup-message-body,.psup-listener-messages article .psup-message-body,.psup-listener-messages .psup-message .psup-message-body{color:#cbd5e1;line-height:1.52}

/* Dropdowns for header actions */
.psup-dropdown{position:relative;display:inline-block}
.psup-btn.psup-dd-toggle{position:relative;padding-right:58px;min-width:100px}
/* Ensure header-specific rule gives extra space for caret */
.psup-actions .psup-btn.psup-dd-toggle{padding-right:64px;min-width:110px}
.psup-btn.psup-dd-toggle::before{content:"";position:absolute;right:34px;top:6px;bottom:6px;width:1px;background:rgba(255,255,255,.35)}
.psup-btn.psup-dd-toggle::after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);opacity:.98;font-size:18px;font-weight:800;filter:drop-shadow(0 1px 0 #000)}
.psup-dd-menu{position:absolute;right:0;top:100%;background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:12px;box-shadow:0 10px 24px rgba(0,0,0,.35);min-width:220px;padding:6px;display:none;z-index:1000}
.psup-dropdown:hover .psup-dd-menu,.psup-dropdown.open .psup-dd-menu,.psup-dropdown[open] .psup-dd-menu{display:block}
.psup-dropdown[open] .psup-btn.psup-dd-toggle::after{content:"▴"}
.psup-dropdown > summary{list-style:none;cursor:pointer}
.psup-dropdown > summary::-webkit-details-marker{display:none}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:var(--ps-text);text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Under-beskrivelse: container til profilhandlinger */
.psup-underdesc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}

/* Tabs (venstre/højre kolonne kort) */
.psup-tabs{display:flex;gap:3px;flex-wrap:wrap}
.psup-tab{background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px;padding:6px 10px;cursor:pointer}
.psup-tab .dashicons{margin-right:4px;vertical-align:middle}
.psup-tab.active{background:var(--ps-surface);border-color:var(--ps-border)}
.psup-tab-panel{display:block}

/* Inline social links */
.psup-social-link{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;padding:6px 10px;border:1px solid var(--ps-border);border-radius:999px;background:var(--ps-surface-2)}
.psup-social-link .dashicons{font-size:16px}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Mobile-specific adjustments */
@media (max-width: 768px) {
  .psup-container { padding: 10px; overflow-x: hidden; }
  .psup-card { margin: 10px 0; padding: 16px; }
  .psup-grid { grid-template-columns: 1fr; }
  .psup-profile-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .psup-avatar { width: 88px; height: 88px; }
  .psup-tabs { flex-wrap: wrap; overflow-x: visible; white-space: normal; }
  .psup-tab { display: inline-flex; }
  .psup-actions .psup-btn { padding: 4px 8px; font-size: 14px; }
  .psup-col-stack .psup-card { width: 100%; }
  /* Avoid overflow when cards are 100% width + margins */
  .psup-mobile .psup-col-stack .psup-card { width: auto !important; }
  .psup-cover { height: 120px; margin-bottom: -24px; }
  .psup-progress { width: 120px; }
  
  /* Fix social links overflow and wrapping */
  .psup-social-links { 
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: 6px !important; 
    margin: 0 !important;
  }
  .psup-social-link { 
    flex: 0 1 auto !important; 
    min-width: 0 !important; 
    max-width: calc(50% - 6px) !important;
    padding: 6px 8px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .psup-social-link .dashicons { 
    font-size: 14px !important; 
    flex-shrink: 0 !important;
  }
  
  /* Ensure all content has proper spacing */
  .psup-social-preview-in-col,
  .psup-card > div,
  .psup-card > section {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Simplified UI for mobile */
.psup-mobile .psup-rank-under-desc,
.psup-mobile .psup-xp-timer,
.psup-mobile .psup-global-feed,
/* Overstyr tidligere skjulning af overview-grid: vis den i én kolonne */
.psup-mobile .psup-underdesc-actions { display: none !important; }

.psup-mobile .psup-card h2 { font-size: 18px; }
.psup-mobile .psup-username { font-size: 16px; }
.psup-mobile .psup-grid { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-gallery { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-overview-grid { display: grid !important; grid-template-columns: 1fr !important; }
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px #2b8a3e66}
.psup-mobile .psup-header-card .psup-actions{display:none !important}
.psup-mobile .psup-header-card .actions{display:none !important}
.psup-hamburger-btn{position:fixed;left:12px;top:12px;z-index:10001;background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px;padding:8px 12px;cursor:pointer}
.psup-hamburger-btn .dashicons{margin-right:6px;vertical-align:middle}
.psup-drawer{position:fixed;left:0;top:0;bottom:0;width:80%;max-width:320px;background:var(--ps-surface-2);color:var(--ps-text);border-right:1px solid var(--ps-border);transform:translateX(-100%);transition:transform .25s ease;z-index:10000;padding:10px;overflow:auto}
.psup-menu-open .psup-drawer{transform:translateX(0)}
.psup-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:9999}
.psup-menu-open .psup-drawer-overlay{display:block}
.psup-drawer-title{font-weight:600;margin:4px 2px 8px}
.psup-drawer .psup-menu-item{display:block;padding:10px;border-radius:10px;margin-bottom:8px;border:1px solid var(--ps-border);background:var(--ps-surface-2);color:var(--ps-text);text-decoration:none}

/* Mobile/tablet fullbleed fix to prevent horizontal scroll */
@media (max-width: 1024px){
  .psup-container.psup-fullbleed{width:100%;max-width:100%;margin-left:0;margin-right:0}
  .psup-sidebar{display:none}
}

/* Listener messages: elegant cards + animations */
.psup-listener-messages{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.psup-listener-messages ul,.psup-listener-messages ol{list-style:none;margin:0;padding:0}
.psup-listener-messages li,
.psup-listener-messages > article,
.psup-listener-messages > div,
.psup-listener-messages .psup-message{background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:14px;padding:12px;box-shadow:0 4px 16px rgba(0,0,0,0.25);transition:box-shadow .25s ease,transform .25s ease,opacity .25s ease}
.psup-listener-messages li:hover,
.psup-listener-messages > article:hover,
.psup-listener-messages > div:hover,
.psup-listener-messages .psup-message:hover{box-shadow:0 6px 20px rgba(0,0,0,0.32);transform:translateY(-1px)}
.psup-listener-messages .psup-message-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.psup-listener-messages .psup-message-name{font-weight:600;color:#e5eef7}
.psup-listener-messages .psup-message-time{color:#9fb3c8;font-size:12px;margin-left:auto}
.psup-listener-messages .psup-message-body{color:#cbd5e1;line-height:1.5}
.psup-message-appear{opacity:0;transform:translateY(4px);animation:psupMsgIn .2s ease-out forwards}
@keyframes psupMsgIn{to{opacity:1;transform:translateY(0)}}
.psup-message-new{box-shadow:0 0 0 2px rgba(255,255,255,.15),0 6px 18px rgba(0,0,0,0.35);animation:psupMsgPulse .9s ease-out}
@keyframes psupMsgPulse{0%{box-shadow:0 0 0 2px rgba(255,255,255,.15),0 6px 18px rgba(0,0,0,0.35)}50%{box-shadow:0 0 0 6px rgba(255,255,255,.10),0 10px 24px rgba(0,0,0,0.4)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0),0 4px 16px rgba(0,0,0,0.25)}}

/* Popup body gradient to match portal theme with subtle depth */
.psup-popup-body{background:linear-gradient(145deg,var(--ps-surface) 0%,var(--ps-surface-2) 60%,var(--ps-surface) 100%);color:var(--ps-text)}

/* Top header for messages: toolbar + search */
.psup-msg-header{background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:14px;padding:10px;display:flex;align-items:center;gap:8px;box-shadow:0 4px 16px rgba(0,0,0,0.25);position:sticky;top:0;z-index:5}
.psup-msg-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:12px;padding:8px 10px}
.psup-msg-search input{flex:1;background:transparent;color:var(--ps-text);border:none;outline:none;font-size:14px}
.psup-msg-search .icon{width:18px;height:18px;border-radius:50%;background:var(--ps-surface-2);box-shadow:0 0 0 2px rgba(255,255,255,.10)}
.psup-msg-actions{display:flex;gap:8px;margin-left:auto}
.psup-msg-actions .psup-btn{background:var(--ps-accent);color:var(--ps-accent-contrast);border:none}
.psup-refresh-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--ps-surface-2),var(--ps-surface));border:1px solid var(--ps-border);color:var(--ps-text)}
.psup-refresh-btn .spinner{width:16px;height:16px;border-radius:50%;border:2px solid #9fb3c8;border-right-color:transparent;display:none}
.psup-refresh-btn.loading .spinner{display:inline-block;animation:psupSpin .8s linear infinite}
.psup-refresh-btn.loading .label{opacity:.8}
@keyframes psupSpin{to{transform:rotate(360deg)}}
.psup-last-update{color:#9fb3c8;align-self:center}

/* Stories row */
.psup-msg-stories{display:flex;align-items:center;gap:10px;margin:12px 0 6px;overflow:auto;padding-bottom:4px}
.psup-story{width:42px;height:42px;border-radius:50%;position:relative;flex:0 0 auto}
.psup-story img{width:100%;height:100%;border-radius:50%;display:block;object-fit:cover;border:2px solid var(--ps-surface);box-shadow:0 0 0 2px #e5eef71a}
.psup-story:after{content:"";position:absolute;inset:-3px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.10)}
.psup-story:hover{transform:translateY(-1px);transition:transform .2s ease}

/* Message item layout (avatar-left, name/time row) */
.psup-listener-messages li,.psup-listener-messages article,.psup-listener-messages .psup-message{display:grid;grid-template-columns:auto 1fr;gap:10px}
.psup-listener-messages li img,.psup-listener-messages article img,.psup-listener-messages .psup-message img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid var(--ps-surface);box-shadow:0 0 0 2px #e5eef71a}
.psup-listener-messages li .psup-message-head,.psup-listener-messages article .psup-message-head,.psup-listener-messages .psup-message .psup-message-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.psup-listener-messages li .psup-message-name,.psup-listener-messages article .psup-message-name,.psup-listener-messages .psup-message .psup-message-name{font-weight:600;color:#e5eef7}
.psup-listener-messages li .psup-message-time,.psup-listener-messages article .psup-message-time,.psup-listener-messages .psup-message .psup-message-time{color:#9fb3c8;font-size:12px;margin-left:auto}
.psup-listener-messages li .psup-message-body,.psup-listener-messages article .psup-message-body,.psup-listener-messages .psup-message .psup-message-body{color:#cbd5e1;line-height:1.52}

/* Dropdowns for header actions */
.psup-dropdown{position:relative;display:inline-block}
.psup-btn.psup-dd-toggle{position:relative;padding-right:58px;min-width:100px}
/* Ensure header-specific rule gives extra space for caret */
.psup-actions .psup-btn.psup-dd-toggle{padding-right:64px;min-width:110px}
.psup-btn.psup-dd-toggle::before{content:"";position:absolute;right:34px;top:6px;bottom:6px;width:1px;background:rgba(255,255,255,.35)}
.psup-btn.psup-dd-toggle::after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);opacity:.98;font-size:18px;font-weight:800;filter:drop-shadow(0 1px 0 #000)}
.psup-dd-menu{position:absolute;right:0;top:100%;background:var(--ps-surface-2);border:1px solid var(--ps-border);border-radius:12px;box-shadow:0 10px 24px rgba(0,0,0,.35);min-width:220px;padding:6px;display:none;z-index:1000}
.psup-dropdown:hover .psup-dd-menu,.psup-dropdown.open .psup-dd-menu,.psup-dropdown[open] .psup-dd-menu{display:block}
.psup-dropdown[open] .psup-btn.psup-dd-toggle::after{content:"▴"}
.psup-dropdown > summary{list-style:none;cursor:pointer}
.psup-dropdown > summary::-webkit-details-marker{display:none}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:var(--ps-text);text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Under-beskrivelse: container til profilhandlinger */
.psup-underdesc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}

/* Tabs (venstre/højre kolonne kort) */
.psup-tabs{display:flex;gap:3px;flex-wrap:wrap}
.psup-tab{background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:10px;padding:6px 10px;cursor:pointer}
.psup-tab .dashicons{margin-right:4px;vertical-align:middle}
.psup-tab.active{background:var(--ps-surface);border-color:var(--ps-border)}
.psup-tab-panel{display:block}

/* Inline social links */
.psup-social-link{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;padding:6px 10px;border:1px solid var(--ps-border);border-radius:999px;background:var(--ps-surface-2)}
.psup-social-link .dashicons{font-size:16px}
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Mobile-specific adjustments */
@media (max-width: 768px) {
  .psup-container { padding: 10px; overflow-x: hidden; }
  .psup-card { margin: 10px 0; padding: 16px; }
  .psup-grid { grid-template-columns: 1fr; }
  .psup-profile-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .psup-avatar { width: 72px; height: 72px; }
  .psup-tabs { flex-wrap: wrap; overflow-x: visible; white-space: normal; }
  .psup-tab { display: inline-flex; }
  .psup-actions .psup-btn { padding: 4px 8px; font-size: 14px; }
  .psup-col-stack .psup-card { width: 100%; }
  /* Avoid overflow when cards are 100% width + margins */
  .psup-mobile .psup-col-stack .psup-card { width: auto !important; }
  .psup-cover { height: 120px; margin-bottom: -24px; }
  .psup-progress { width: 120px; }
  
  /* Fix social links overflow and wrapping */
  .psup-social-links { 
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: 6px !important; 
    margin: 0 !important;
  }
  .psup-social-link { 
    flex: 0 1 auto !important; 
    min-width: 0 !important; 
    max-width: calc(50% - 6px) !important;
    padding: 6px 8px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .psup-social-link .dashicons { 
    font-size: 14px !important; 
    flex-shrink: 0 !important;
  }
  
  /* Ensure all content has proper spacing */
  .psup-social-preview-in-col,
  .psup-card > div,
  .psup-card > section {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Simplified UI for mobile */
.psup-mobile .psup-rank-under-desc,
.psup-mobile .psup-xp-timer,
.psup-mobile .psup-global-feed,
/* Overstyr tidligere skjulning af overview-grid: vis den i én kolonne */
.psup-mobile .psup-underdesc-actions { display: none !important; }

.psup-mobile .psup-card h2 { font-size: 18px; }
.psup-mobile .psup-username { font-size: 16px; }
.psup-mobile .psup-grid { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-gallery { grid-template-columns: 1fr !important; }
.psup-mobile .pscomp-overview-grid { display: grid !important; grid-template-columns: 1fr !important; }
.psup-dd-item{display:block;padding:8px 10px;border-radius:8px;color:#e5eef7;text-decoration:none;white-space:nowrap}
.psup-dd-item:hover{background:#1f2a37;color:var(--ps-accent-contrast)}
.psup-actions .psup-dropdown{vertical-align:middle}
.psup-dropdown:hover .psup-btn.psup-dd-toggle{box-shadow:0 0 0 2px rgba(255,255,255,.15)}
/* Modal styling for Opret Show */
.psup-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;z-index:9999}
.psup-modal{background:var(--ps-surface);border:1px solid var(--ps-border);border-radius:12px;max-width:800px;width:90%;max-height:90vh;overflow:auto;padding:16px;color:var(--ps-text)}

/* Show card layout */
.psup-show-card{border:1px solid var(--ps-border);border-radius:10px;background:var(--ps-surface);color:var(--ps-text);overflow:hidden;display:flex;flex-direction:column;height:100%}
.psup-show-cover{height:180px;background-size:cover;background-position:center;border-bottom:none;position:relative}
.psup-show-cover-overlay{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(0,0,0,0.25), rgba(0,0,0,0))}
.psup-show-title-overlay{position:absolute;left:16px;bottom:16px;color:#fff;font-size:28px;font-weight:800;text-shadow:0 2px 6px rgba(0,0,0,0.6);letter-spacing:.2px}
@media (max-width:520px){.psup-show-title-overlay{font-size:22px;left:12px;bottom:12px}}
.psup-show-overlay-block{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:6px;color:#fff;text-align:center;width:90%;max-width:1000px;pointer-events:none}
.psup-show-host-overlay{color:#fff;font-size:14px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,0.6);letter-spacing:.2px}
@media (max-width:520px){.psup-show-host-overlay{font-size:13px}}
/* Sørg for at titel ikke brydes i overlay-blokken */
.psup-show-overlay-block .psup-show-title-overlay{position:static;left:auto;bottom:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psup-live-banner{width:100%;height:260px;position:relative;border-radius:10px;overflow:hidden;background:#000}
.psup-live-banner img{width:100%;height:100%;display:block;object-fit:cover}
.psup-show-body{padding:14px;display:flex;flex-direction:column;flex:1}
.psup-show-header{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:6px}
.psup-host-info{display:flex;align-items:flex-start;gap:12px}
.psup-host-avatar{width:56px;height:56px;border-radius:50%;border:none;object-fit:cover}
/* Ensure any image inside host-info renders round, even without class */
.psup-host-info img{border-radius:50% !important;width:56px;height:56px;object-fit:cover}
.psup-host-details{display:flex;flex-direction:column;gap:4px}
.psup-host-name{color:var(--ps-muted);font-size:14px;font-weight:500}
.psup-show-title{font-size:20px;font-weight:700}
.psup-host-details .psup-show-genre{color:var(--ps-muted);font-size:13px;border:none;border-radius:0;padding:0;background:transparent;display:inline-block;margin-top:2px}
.psup-host-under{margin-top:6px;color:#9fb3c8;font-size:13px;font-weight:500}
.psup-show-tagline{color:var(--ps-muted)}
.psup-show-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--ps-muted);margin:8px 0}
.psup-show-meta > div{border:none;border-radius:0;padding:0;background:transparent}
.psup-show-desc{margin-top:8px}
.psup-show-actions{display:flex;gap:8px;margin-top:auto}
.psup-show-actions .psup-btn{padding:6px 10px;flex:1}
.psup-close-btn{position:absolute;top:10px;right:14px;background:var(--ps-surface-2);color:var(--ps-text);border:1px solid var(--ps-border);border-radius:20px;width:32px;height:32px;line-height:28px;text-align:center;cursor:pointer}

/* Details sections */
.psup-section-title{margin-top:10px;font-weight:700;color:var(--ps-text)}
.psup-show-info{margin-top:6px;color:var(--ps-muted);white-space:pre-wrap}

/* Show list grid */
.psup-show-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:stretch}
/* Fjern Del-knappen globalt (button-elementer), behold primære CTA-links */
/* Fjern skjul af knapper i show-actions så Follow-knappen vises */
/* Tidligere blev alle <button> skjult, hvilket gjorde Følg-knappen usynlig */
/* Hvis specifikke knapper skal skjules, målret dem med en mere specifik selector */
.psup-show-list-empty{border:1px solid var(--ps-border);border-radius:10px;padding:12px;color:var(--ps-muted);background:var(--ps-surface)}
.psup-show-card{transition:transform .15s ease, box-shadow .15s ease}
/* Hover-effekt fjernet efter ønske */

@media (max-width: 1024px){
  .psup-show-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 640px){
  .psup-show-grid{grid-template-columns:1fr}
}
/* Transparente bokse: gør kort og paneler gennemsigtige på hele portalen */
.psup-card,
.psup-header-card,
.psup-random-user,
.status,
.comment .cbody,
.card{
  background: var(--ps-surface) !important;
  box-shadow: none !important;
  border: 1px solid var(--ps-border) !important;
  border-radius: 10px !important;
}
/* Fjern evt. indre panelbaggrunde i kort */
.psup-card > div,
.psup-card > section,
.psup-header-card > div,
.card > div,
.card > section{
  background: transparent !important;
  border: none !important;
}

/* Modaler og overlay rammer matcher kravene */
.psup-modal{
  background: var(--ps-surface) !important;
  border: 1px solid var(--ps-border) !important;
  border-radius: 10px !important;
}
.psup-modal-overlay{ background: rgba(0,0,0,0.6) !important; }

/* Lister, rækker, og element-bokse */
.psup-list li,
.psup-userrow,
.psup-panel,
.psup-toast,
.psup-popup{
  background: var(--ps-surface) !important;
  border: 1px solid var(--ps-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* ===== Partyshaker: profiljusteringer ===== */
/* Cover højden ønskes 300px på desktop */
.psup-cover{ height:300px; }

/* Ensret knapstørrelse/afrunding for handlinger under brugernavn */
.psup-underdesc-actions .psup-btn{ padding:6px 10px; border-radius:10px; }

/* Gør “Mine beskeder” neutral som de øvrige knapper */
#psup-btn-messages{ background:var(--ps-surface-2); color:var(--ps-text); border:1px solid var(--ps-border); }
#psup-btn-messages:hover{ box-shadow:0 0 0 2px rgba(255,255,255,.15); }

/* Sociale links skal have samme afrunding som knapperne */
.psup-social-link{ border-radius:10px !important; }
/* Hårde overrides: altid runde profilbilleder på tværs af WordPress */
.psup-avatar, img.avatar, .avatar{
  border-radius:50% !important;
  overflow:hidden;
  object-fit:cover;
  aspect-ratio:1/1;
  -webkit-mask-image:none;
  mask-image:none;
}
.psup-auth .psup-card{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Ekstra fade via mask som moderne fallback (skader ikke ældre browsere) */
.psup-cover-img{
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 70%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 70%, rgba(0,0,0,0) 100%);
}
/* ===== Følgte shows/værter: faceliftede kort ===== */
.psup-users-grid.psup-follow-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:12px;
}
.psup-follow-item{
  position:relative;
  background:var(--ps-surface-2);
  border:1px solid var(--ps-border);
  border-radius:14px;
  padding:12px;
  overflow:hidden;
  box-shadow:0 4px 18px rgba(0,0,0,.25);
  transition:box-shadow .2s ease,transform .2s ease;
  /* Ensret højde på tværs: kortet fylder hele grid-rækken */
  height:100%;
  display:flex;
  flex-direction:column;
}
.psup-follow-item:hover{box-shadow:0 8px 28px rgba(0,0,0,.35);transform:translateY(-1px)}
.psup-follow-bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
  filter:blur(12px) saturate(1.05);opacity:.18;transform:scale(1.08);pointer-events:none
}
.psup-follow-content{position:relative;display:flex;flex-direction:column;gap:8px;flex:1}
.psup-follow-head{display:flex;align-items:center;gap:10px}
.psup-follow-thumb{width:56px;height:56px;border-radius:10px;object-fit:cover;border:2px solid var(--ps-surface);box-shadow:0 0 0 2px rgba(255,255,255,.08)}
.psup-follow-info{flex:1}
.psup-follow-meta{display:flex;gap:8px;margin-top:4px}
.psup-chip{display:inline-block;padding:4px 8px;border-radius:999px;background:var(--ps-surface);border:1px solid var(--ps-border);color:var(--ps-muted);font-size:12px}
.psup-follow-actions{
  /* Placer knap til venstre og tæller til højre, altid én linje */
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  column-gap:10px;
  margin-top:auto;
}
.psup-follow-actions .psup-btn{
  background:var(--ps-accent);
  color:var(--ps-accent-contrast);
  border:none;
  justify-self:start;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.psup-follow-count{color:var(--ps-muted);font-size:13px;white-space:nowrap}
/* Grid: stræk alle items til samme højde i hver række */
.psup-users-grid.psup-follow-grid{align-items:stretch}
@media (max-width:768px){
  .psup-follow-thumb{width:48px;height:48px}
  .psup-users-grid.psup-follow-grid{grid-template-columns:1fr}
}