/* ------------------------------------------------------------
 * shared-modals.css
 * - 공유 상세/댓글/수정/등록 모달 전용
 * ------------------------------------------------------------ */

.shared-post-modal-head,
.shared-edit-modal-head{
  padding-right:32px;
}

.shared-post-modal-kicker,
.shared-edit-modal-kicker{
  color:var(--text-faint);
  font-size:12px;
  font-weight:500;
}

.shared-post-modal-sub,
.shared-edit-modal-sub{
  margin-top:6px;
  color:var(--text-soft);
  font-size:12px;
  line-height:1.55;
  font-weight:500;
}

.shared-post-modal-body,
.shared-edit-modal-body,
.share-modal-body{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.shared-post-copy{
  color:var(--text);
  font-size:14px;
  line-height:1.6;
  font-weight:500;
  white-space:pre-wrap;
  word-break:break-word;
}

.shared-post-info-grid,
.shared-post-stat-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px;
}

.shared-post-info-grid > div,
.shared-post-stat-grid > div{
  padding:12px 13px;
  border-radius:16px;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(208,216,210,0.88);
  min-width:0;
}

.shared-post-info-grid span,
.shared-post-stat-grid span{
  display:block;
  color:var(--text-faint);
  font-size:12px;
  font-weight:500;
  line-height:1.35;
}

.shared-post-info-grid strong,
.shared-post-stat-grid strong{
  display:block;
  margin-top:5px;
  color:var(--text-strong);
  font-size:13px;
  font-weight:500;
  line-height:1.35;
  word-break:keep-all;
}

.shared-post-actions{
  display:flex;
  gap:6px;
  overflow-x:auto;
  padding-bottom:2px;
  scrollbar-width:none;
}

.shared-post-actions::-webkit-scrollbar{
  display:none;
}

.shared-action-btn.is-done{
  opacity:.82;
}

.shared-post-comment-panel{
  padding:9px 10px;
  border-radius:13px;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(208,216,210,0.88);
}

.shared-post-comment-head{
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:center;
  color:var(--text);
  margin-bottom:6px;
}

.shared-post-comment-head strong{
  font-size:14px;
}

.shared-post-comment-head span{
  color:var(--text-faint);
  font-size:12px;
  font-weight:700;
}

.shared-post-comment-list{
  display:flex;
  flex-direction:column;
  gap:0;
  max-height:240px;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-right:2px;
}

.shared-comment-item{
  padding:8px 0;
  border:0;
  border-bottom:1px solid rgba(96,72,37,0.10);
  border-radius:0;
  background:none;
  box-shadow:none;
}

.shared-comment-item:last-child{
  padding-bottom:0;
  border-bottom:0;
}

.shared-comment-head{
  display:flex;
  justify-content:flex-start;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:7px;
}

.shared-comment-head strong{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:1px 8px 2px;
  border-radius:7px 10px 8px 6px;
  background:linear-gradient(180deg, rgba(255,239,128,0.48), rgba(255,221,88,0.34));
  box-shadow:inset 0 -8px 0 rgba(255,224,92,0.32);
  color:var(--text-strong);
  font-size:12px;
  font-weight:800;
  line-height:1.2;
}

.shared-comment-head span{
  color:var(--text-faint);
  font-size:11px;
  font-weight:600;
}

.shared-comment-body{
  margin-top:0;
  color:var(--text);
  font-size:13px;
  line-height:1.5;
  font-weight:600;
  word-break:break-word;
  white-space:pre-wrap;
}

.shared-post-comment-form{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}

.shared-post-comment-form textarea,
.shared-edit-field input,
.shared-edit-field textarea,
.share-textarea,
.shared-post-comment-form--sheet textarea{
  width:100%;
  border:1px solid rgba(208,216,210,0.88);
  background:#ffffff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.72);
}

.shared-post-comment-form textarea,
.shared-edit-field textarea,
textarea.share-textarea{
  min-height:110px;
}

.shared-edit-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.shared-edit-label,
.share-form-label{
  color:var(--text-strong);
  font-size:13px;
  font-weight:500;
}

.shared-edit-help,
.share-form-hint{
  color:var(--text-faint);
  font-size:11px;
  font-weight:500;
}

.share-preview-box{
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(208,216,210,0.88);
}

.share-preview-label{
  margin-bottom:10px;
  color:var(--text-faint);
  font-size:12px;
  font-weight:500;
}

.shared-post-sheet-card{
  background:
    radial-gradient(circle at top left, rgba(255,255,255,0.98) 0, rgba(255,255,255,0) 16%),
    linear-gradient(180deg, rgba(255,255,255,0.99), rgba(245,247,243,0.99));
}

.shared-post-sheet-header{
  padding-bottom:6px;
}

.shared-post-sheet-body{
  padding-top:6px;
}

.shared-post-sheet-card .sheet-section{
  margin-bottom:6px;
}

.shared-post-sheet-card .sheet-section:last-child{
  margin-bottom:0;
}

.shared-post-hero{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:11px 12px;
  background:linear-gradient(180deg, rgba(248,249,246,0.95), rgba(241,244,239,0.95));
}

.shared-post-hero-top{
  display:none;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
}

.shared-post-state-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 10px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(42,193,160,0.16), rgba(42,193,160,0.24));
  color:var(--accent-strong);
  font-size:12px;
  font-weight:700;
}

.shared-post-hero-micro{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.shared-post-hero-micro span{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(255,255,255,0.72);
  border:1px solid rgba(208,216,210,0.88);
  color:var(--text-soft);
  font-size:12px;
  font-weight:700;
}

.shared-post-hero-balls{
  gap:5px;
}

.shared-post-hero-balls .online-lotto-ball{
  width:32px;
  height:32px;
  font-size:13px;
}

.shared-post-copy-section,
.shared-post-info-section{
  padding:9px 10px;
  border-radius:13px;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(208,216,210,0.88);
}

.shared-post-copy-section .sheet-section-title{
  font-size:14px;
}

.shared-post-fold-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:24px;
  padding:1px 0;
  border:0;
  background:none;
  color:var(--text-strong);
  font-size:14px;
  font-weight:700;
}

.shared-post-fold-arrow{
  color:var(--text-faint);
  font-size:11px;
  transition:transform .18s ease;
}

.shared-post-fold-toggle[aria-expanded="true"] .shared-post-fold-arrow{
  transform:rotate(180deg);
}

.shared-post-fold-body{
  padding-top:6px;
}

.shared-post-fact-list{
  display:flex;
  flex-direction:column;
  gap:0;
}

.shared-post-fact-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding:7px 0;
  border-bottom:1px dashed rgba(208,216,210,0.88);
}

.shared-post-fact-row:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.shared-post-fact-row span{
  color:var(--text-faint);
  font-size:12px;
  font-weight:700;
}

.shared-post-fact-row strong{
  color:var(--text-strong);
  font-size:13px;
  line-height:1.4;
  font-weight:700;
  text-align:right;
}

.shared-post-sheet-footer{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.shared-post-actions .btn{
  min-height:34px;
  padding:0 10px;
  border-radius:10px;
  font-size:12px;
  flex:0 0 auto;
}

.shared-post-comment-form--sheet{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px;
  align-items:end;
}

.shared-post-comment-form--sheet textarea{
  min-height:40px;
  max-height:74px;
  padding:9px 11px;
  border-radius:12px;
  resize:none;
  font-size:14px;
}

.shared-post-comment-form--sheet button{
  min-width:82px;
  min-height:36px;
}

.shared-post-comment-note{
  color:var(--text-faint);
  font-size:11.5px;
  line-height:1.45;
  font-weight:700;
  padding:1px 2px 0;
}

@media (max-width:460px){
  .shared-post-comment-form--sheet{
    grid-template-columns:1fr;
  }

  .shared-post-comment-form--sheet button{
    width:100%;
  }

  .shared-post-info-grid,
  .shared-post-stat-grid{
    grid-template-columns:1fr;
  }
}