/**
 * Aprisco CSS - Estilos da Plataforma Comunitaria
 * A Culpa e das Ovelhas - aculpaedasovelhas.org
 */

/* ============================================
   CSS VARIABLES - Theme System
   ============================================ */

/* Dark Mode (Default) */
body.dark-mode,
body[data-theme="dark"],
:root {
  --primary: #c46849;
  --primary-hover: #d47959;
  --primary-light: rgba(196, 104, 73, 0.15);

  --bg-primary: #0f0f1a;
  --bg-secondary: #1a1a2e;
  --bg-tertiary: #252540;
  --bg-hover: #2a2a45;
  --bg-card: #1a1a2e;

  --text-primary: #f0f0f5;
  --text-secondary: #b0b0c0;
  --text-muted: #707085;
  --text-white: #ffffff;

  --border-color: #3a3a55;
  --border-light: #4a4a65;

  --success: #10b981;
  --warning: #f59e0b;
  --error: #ef4444;
  --info: #3b82f6;

  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);

  /* Accent colors - alias for primary */
  --accent: #c46849;
  --accent-color: #c46849;
  --accent-color-rgb: 196, 104, 73;

  /* Legacy fallbacks */
  --gray-850: #1a1a2e;
  --gray-700: #3a3a55;
}

/* Light Mode */
body.light-mode,
body[data-theme="light"] {
  --primary: #8B4513;
  --primary-hover: #7a3c11;
  --primary-light: rgba(139, 69, 19, 0.1);

  --bg-primary: #f8f9fa;
  --bg-secondary: #ffffff;
  --bg-tertiary: #f0f2f5;
  --bg-hover: #e8eaed;
  --bg-card: #ffffff;

  --text-primary: #1a1a2e;
  --text-secondary: #4a4a65;
  --text-muted: #6b7280;
  --text-white: #ffffff;

  --border-color: #d1d5db;
  --border-light: #e5e7eb;

  --success: #059669;
  --warning: #d97706;
  --error: #dc2626;
  --info: #2563eb;

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

  /* Accent colors - alias for primary */
  --accent: #8B4513;
  --accent-color: #8B4513;
  --accent-color-rgb: 139, 69, 19;

  /* Legacy fallbacks */
  --gray-850: #ffffff;
  --gray-700: #d1d5db;
}

/* ============================================
   BASE STYLES
   ============================================ */

body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  transition: background-color 0.3s, color 0.3s;
}

/* ============================================
   LAYOUT - Estrutura de 3 Colunas
   ============================================ */
.aprisco-layout {
  display: grid;
  grid-template-columns: 280px 1fr 300px;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
  min-height: calc(100vh - 80px);
}

.aprisco-sidebar-left {
  position: sticky;
  top: 100px;
  height: fit-content;
}

.aprisco-main {
  min-width: 0;
}

.aprisco-sidebar-right {
  position: sticky;
  top: 100px;
  height: fit-content;
}

@media (max-width: 1024px) {
  .aprisco-layout {
    grid-template-columns: 1fr 300px;
  }

  .aprisco-sidebar-left {
    display: none;
  }
}

@media (max-width: 768px) {
  .aprisco-layout {
    grid-template-columns: 1fr;
    padding: 16px;
    gap: 16px;
  }

  .aprisco-sidebar-right {
    display: none;
  }
}

/* ============================================
   CARDS - Componente Base
   ============================================ */
.aprisco-card {
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  transition: background-color 0.3s, border-color 0.3s;
}

.aprisco-card--clickable {
  cursor: pointer;
  transition:
    border-color 0.2s,
    transform 0.2s,
    background-color 0.3s;
}

.aprisco-card--clickable:hover {
  border-color: var(--primary);
  transform: translateY(-2px);
}

/* ============================================
   PROFILE WIDGET - Sidebar Esquerda
   ============================================ */
.aprisco-profile-widget {
  text-align: center;
}

.aprisco-profile-widget__cover {
  height: 80px;
  background: linear-gradient(135deg, var(--accent, #c46849), #8b4533);
  border-radius: 12px 12px 0 0;
  margin: -20px -20px 0 -20px;
}

.aprisco-profile-widget__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 4px solid var(--gray-850, #1a1a2e);
  margin-top: -40px;
  background: var(--gray-700, #374151);
  object-fit: cover;
}

body.light-mode .aprisco-profile-widget__avatar {
  border-color: #ffffff;
}

.aprisco-profile-widget__name {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 12px 0 4px;
}

body.light-mode .aprisco-profile-widget__name {
  color: #0f172a;
}

.aprisco-profile-widget__username {
  font-size: 0.9rem;
  color: var(--gray-400, #9ca3af);
  margin-bottom: 12px;
}

.aprisco-profile-widget__bio {
  font-size: 0.9rem;
  color: var(--gray-300, #d1d5db);
  line-height: 1.5;
  margin-bottom: 16px;
}

body.light-mode .aprisco-profile-widget__bio {
  color: #4b5563;
}

.aprisco-profile-widget__stats {
  display: flex;
  justify-content: center;
  gap: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-profile-widget__stats {
  border-color: #e5e7eb;
}

.aprisco-profile-widget__stat {
  text-align: center;
}

.aprisco-profile-widget__stat-value {
  display: block;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-profile-widget__stat-value {
  color: #0f172a;
}

.aprisco-profile-widget__stat-label {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   CREATE POST - Criar Publicacao
   ============================================ */
.aprisco-create-post {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.aprisco-create-post__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  flex-shrink: 0;
  object-fit: cover;
}

.aprisco-create-post__input-wrapper {
  flex: 1;
}

.aprisco-create-post__textarea {
  width: 100%;
  min-height: 80px;
  padding: 12px;
  border: 1px solid var(--gray-700, #374151);
  border-radius: 8px;
  background: var(--gray-900, #0f0f1a);
  color: var(--text-white, #ffffff);
  font-size: 1rem;
  resize: vertical;
  font-family: inherit;
}

body.light-mode .aprisco-create-post__textarea {
  background: #f9fafb;
  border-color: #e5e7eb;
  color: #0f172a;
}

.aprisco-create-post__textarea::placeholder {
  color: var(--gray-500, #6b7280);
}

.aprisco-create-post__textarea:focus {
  outline: none;
  border-color: var(--accent, #c46849);
}

.aprisco-create-post__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
}

.aprisco-create-post__tools {
  display: flex;
  gap: 8px;
}

.aprisco-create-post__tool {
  padding: 8px 12px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  border-radius: 6px;
  font-size: 0.9rem;
  transition:
    background 0.2s,
    color 0.2s;
}

.aprisco-create-post__tool:hover {
  background: var(--gray-800, #1f2937);
  color: var(--accent, #c46849);
}

body.light-mode .aprisco-create-post__tool:hover {
  background: #f3f4f6;
}

.aprisco-create-post__type-select {
  padding: 6px 12px;
  border: 1px solid var(--gray-700, #374151);
  border-radius: 6px;
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
  font-size: 0.85rem;
  cursor: pointer;
}

body.light-mode .aprisco-create-post__type-select {
  background: #ffffff;
  border-color: #e5e7eb;
  color: #0f172a;
}

/* ============================================
   POST - Publicacao
   ============================================ */
.aprisco-post {
  padding: 20px;
}

.aprisco-post__header {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-post__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  flex-shrink: 0;
  object-fit: cover;
}

.aprisco-post__meta {
  flex: 1;
}

.aprisco-post__author {
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-post__author-name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  text-decoration: none;
}

.aprisco-post__author-name:hover {
  text-decoration: underline;
}

body.light-mode .aprisco-post__author-name {
  color: #0f172a;
}

.aprisco-post__author-username {
  color: var(--gray-400, #9ca3af);
  font-size: 0.9rem;
  text-decoration: none;
}

.aprisco-post__author-username:hover {
  text-decoration: underline;
}

.aprisco-post__time {
  color: var(--gray-500, #6b7280);
  font-size: 0.85rem;
}

.aprisco-post__type-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 500;
  margin-left: auto;
}

.aprisco-post__type-badge--testimony {
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
}

.aprisco-post__type-badge--prayer_request {
  background: rgba(168, 85, 247, 0.15);
  color: #a855f7;
}

.aprisco-post__type-badge--question {
  background: rgba(59, 130, 246, 0.15);
  color: #3b82f6;
}

.aprisco-post__type-badge--study {
  background: rgba(234, 179, 8, 0.15);
  color: #eab308;
}

.aprisco-post__content {
  color: var(--gray-200, #e5e7eb);
  line-height: 1.6;
  margin-bottom: 12px;
  white-space: pre-wrap;
  word-break: break-word;
}

body.light-mode .aprisco-post__content {
  color: #374151;
}

.aprisco-post__content .bible-ref {
  color: var(--accent, #c46849);
  text-decoration: none;
  font-weight: 500;
}

.aprisco-post__content .bible-ref:hover {
  text-decoration: underline;
}

.aprisco-post__media {
  margin: 12px 0;
  border-radius: 8px;
  overflow: hidden;
}

.aprisco-post__media img {
  width: 100%;
  max-height: 400px;
  object-fit: cover;
}

.aprisco-post__actions {
  display: flex;
  gap: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-post__actions {
  border-color: #f3f4f6;
}

.aprisco-post__action {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  border-radius: 6px;
  font-size: 0.9rem;
  transition:
    background 0.2s,
    color 0.2s;
}

.aprisco-post__action:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-post__action:hover {
  background: #f3f4f6;
}

.aprisco-post__action--liked {
  color: #ef4444;
}

.aprisco-post__action--prayed {
  color: #a855f7;
}

.aprisco-post__action--bookmarked {
  color: #f59e0b;
}

/* ============================================
   TRENDS WIDGET - Sidebar Direita
   ============================================ */
.aprisco-trends-widget__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin-bottom: 16px;
}

body.light-mode .aprisco-trends-widget__title {
  color: #0f172a;
}

.aprisco-trends-widget__item {
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-trends-widget__item {
  border-color: #f3f4f6;
}

.aprisco-trends-widget__item:last-child {
  border-bottom: none;
}

.aprisco-trends-widget__category {
  font-size: 0.75rem;
  color: var(--gray-500, #6b7280);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.aprisco-trends-widget__topic {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 4px 0;
}

body.light-mode .aprisco-trends-widget__topic {
  color: #0f172a;
}

.aprisco-trends-widget__count {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   FOLLOW WIDGET - Sugestoes de Seguir
   ============================================ */
.aprisco-follow-widget__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin-bottom: 16px;
}

body.light-mode .aprisco-follow-widget__title {
  color: #0f172a;
}

.aprisco-follow-widget__user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-follow-widget__user {
  border-color: #f3f4f6;
}

.aprisco-follow-widget__user:last-child {
  border-bottom: none;
}

.aprisco-follow-widget__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  object-fit: cover;
}

.aprisco-follow-widget__info {
  flex: 1;
  min-width: 0;
}

.aprisco-follow-widget__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-follow-widget__name {
  color: #0f172a;
}

.aprisco-follow-widget__username {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   BUTTONS
   ============================================ */
.aprisco-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  border: none;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  transition:
    background 0.2s,
    transform 0.1s;
}

.aprisco-btn:active {
  transform: scale(0.98);
}

.aprisco-btn--primary {
  background: var(--primary);
  color: #ffffff;
}

.aprisco-btn--primary:hover {
  background: var(--primary-hover);
}

.aprisco-btn--secondary {
  background: var(--bg-tertiary);
  color: var(--text-primary);
}

.aprisco-btn--secondary:hover {
  background: var(--bg-hover);
}

.aprisco-btn--small {
  padding: 6px 12px;
  font-size: 0.85rem;
}

.aprisco-btn--outline {
  background: transparent;
  border: 1px solid var(--primary);
  color: var(--primary);
}

.aprisco-btn--outline:hover {
  background: var(--primary);
  color: #ffffff;
}

/* ============================================
   LOADING & EMPTY STATES
   ============================================ */
.aprisco-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  color: var(--text-muted);
}

.aprisco-loading__spinner {
  width: 40px;
  height: 40px;
  border: 3px solid var(--border-color);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: aprisco-spin 0.8s linear infinite;
}

@keyframes aprisco-spin {
  to {
    transform: rotate(360deg);
  }
}

.aprisco-loading__text {
  margin-top: 12px;
  font-size: 0.9rem;
}

.aprisco-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.aprisco-empty__icon {
  font-size: 3rem;
  margin-bottom: 16px;
  display: block;
}

.aprisco-empty__message {
  font-size: 1rem;
  line-height: 1.5;
}

/* ============================================
   TOAST NOTIFICATIONS
   ============================================ */
.aprisco-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  padding: 16px 24px;
  border-radius: 10px;
  background: #1e293b;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 500;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  transform: translateY(100px);
  opacity: 0;
  transition:
    transform 0.3s,
    opacity 0.3s;
  z-index: 9999;
  max-width: 400px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

body.light-mode .aprisco-toast {
  background: #1e293b;
  color: #ffffff;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.aprisco-toast--visible {
  transform: translateY(0);
  opacity: 1;
}

.aprisco-toast--success {
  background: #059669;
  border-color: #10b981;
}

.aprisco-toast--error {
  background: #dc2626;
  border-color: #ef4444;
}

.aprisco-toast--warning {
  background: #d97706;
  border-color: #f59e0b;
}

.aprisco-toast--info {
  background: #2563eb;
  border-color: #3b82f6;
}

/* ============================================
   MODAL
   ============================================ */
.aprisco-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

.aprisco-modal__backdrop,
.aprisco-modal__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
}

.aprisco-modal__content {
  position: relative;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 24px;
  max-width: 400px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
}

.aprisco-modal__content--lg {
  max-width: 600px;
}

.aprisco-modal__content--xl {
  max-width: 800px;
}

.aprisco-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-modal__title {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 0;
}

.aprisco-modal__close {
  background: none;
  border: none;
  font-size: 24px;
  color: var(--text-muted);
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
}

.aprisco-modal__close:hover {
  color: var(--text-primary);
}

.aprisco-modal__body {
  margin-bottom: 20px;
}

.aprisco-modal__message {
  color: var(--text-secondary);
  margin-bottom: 24px;
  line-height: 1.5;
}

.aprisco-modal__footer {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  padding-top: 16px;
  border-top: 1px solid var(--border-color);
}

.aprisco-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

/* ============================================
   SCROLL SENTINEL (Infinite Scroll)
   ============================================ */
.aprisco-scroll-sentinel {
  height: 1px;
  visibility: hidden;
}

/* ============================================
   NAV MOBILE APRISCO
   ============================================ */
.aprisco-mobile-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--bg-secondary);
  border-top: 1px solid var(--border-color);
  padding: 8px 0;
  z-index: 1000;
}

@media (max-width: 768px) {
  .aprisco-mobile-nav {
    display: flex;
    justify-content: space-around;
  }

  .aprisco-main {
    padding-bottom: 70px;
  }
}

.aprisco-mobile-nav__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.75rem;
  transition: color 0.2s;
}

.aprisco-mobile-nav__item--active,
.aprisco-mobile-nav__item:hover {
  color: var(--primary);
}

.aprisco-mobile-nav__icon {
  font-size: 1.4rem;
}

/* ============================================
   COMMENTS MODAL
   ============================================ */
.aprisco-comments-modal {
  display: none;
}

.aprisco-comments-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-comments-modal__content {
  max-width: 600px;
  width: 95%;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  padding: 0;
}

.aprisco-comments-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-comments-modal__header {
  border-color: #e5e7eb;
}

.aprisco-comments-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-comments-modal__header h3 {
  color: #0f172a;
}

.aprisco-comments-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  transition: background 0.2s, color 0.2s;
}

.aprisco-comments-modal__close:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-comments-modal__close:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-comments-modal__body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
  min-height: 200px;
  max-height: 400px;
}

.aprisco-comments-modal__footer {
  padding: 16px 20px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-comments-modal__footer {
  border-color: #e5e7eb;
}

/* ============================================
   COMMENT ITEM
   ============================================ */
.aprisco-comment {
  display: flex;
  gap: 12px;
  padding: 12px 0;
}

.aprisco-comment:first-child {
  padding-top: 0;
}

.aprisco-comment--reply {
  margin-left: 48px;
  padding-left: 16px;
  border-left: 2px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-comment--reply {
  border-color: #e5e7eb;
}

.aprisco-comment__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  flex-shrink: 0;
  object-fit: cover;
}

.aprisco-comment--reply .aprisco-comment__avatar {
  width: 28px;
  height: 28px;
}

.aprisco-comment__body {
  flex: 1;
  min-width: 0;
}

.aprisco-comment__header {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.aprisco-comment__author {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-comment__author {
  color: #0f172a;
}

.aprisco-comment__username {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

.aprisco-comment__time {
  font-size: 0.8rem;
  color: var(--gray-500, #6b7280);
}

.aprisco-comment__content {
  color: var(--gray-200, #e5e7eb);
  font-size: 0.95rem;
  line-height: 1.5;
  word-break: break-word;
}

body.light-mode .aprisco-comment__content {
  color: #374151;
}

.aprisco-comment__actions {
  display: flex;
  gap: 12px;
  margin-top: 8px;
}

.aprisco-comment__action {
  display: flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 0.85rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  transition: background 0.2s, color 0.2s;
}

.aprisco-comment__action:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-comment__action:hover {
  background: #f3f4f6;
}

.aprisco-comment__action--liked {
  color: #ef4444;
}

.aprisco-comment__replies {
  margin-top: 8px;
}

/* ============================================
   MENTION
   ============================================ */
.aprisco-mention {
  color: var(--accent, #c46849);
  font-weight: 500;
  cursor: pointer;
}

.aprisco-mention:hover {
  text-decoration: underline;
}

/* ============================================
   COMMENT INPUT
   ============================================ */
.aprisco-comments__reply-indicator {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  margin-bottom: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 6px;
  font-size: 0.85rem;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-comments__reply-indicator {
  background: #f3f4f6;
  color: #4b5563;
}

.aprisco-comments__reply-indicator button {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
}

.aprisco-comments__reply-indicator button:hover {
  background: var(--gray-700, #374151);
}

body.light-mode .aprisco-comments__reply-indicator button:hover {
  background: #e5e7eb;
}

.aprisco-comments__input-wrapper {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.aprisco-comments__input-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  flex-shrink: 0;
  object-fit: cover;
}

.aprisco-comments__input {
  flex: 1;
  min-height: 40px;
  max-height: 120px;
  padding: 10px 12px;
  border: 1px solid var(--gray-700, #374151);
  border-radius: 8px;
  background: var(--gray-900, #0f0f1a);
  color: var(--text-white, #ffffff);
  font-size: 0.95rem;
  resize: none;
  font-family: inherit;
}

body.light-mode .aprisco-comments__input {
  background: #f9fafb;
  border-color: #e5e7eb;
  color: #0f172a;
}

.aprisco-comments__input::placeholder {
  color: var(--gray-500, #6b7280);
}

.aprisco-comments__input:focus {
  outline: none;
  border-color: var(--accent, #c46849);
}

.aprisco-comments__send {
  flex-shrink: 0;
}

/* ============================================
   PROFILE PAGE LAYOUT
   ============================================ */
.aprisco-profile-layout {
  grid-template-columns: 1fr 300px;
}

.aprisco-profile-main {
  min-width: 0;
}

@media (max-width: 1024px) {
  .aprisco-profile-layout {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   PROFILE HEADER
   ============================================ */
.aprisco-profile-header {
  padding: 0;
  overflow: hidden;
}

.aprisco-profile-header__cover {
  height: 150px;
  background: linear-gradient(135deg, var(--accent, #c46849) 0%, #8b4533 50%, #5a2d1a 100%);
}

.aprisco-profile-header__info {
  display: flex;
  gap: 20px;
  padding: 0 24px 20px;
  margin-top: -50px;
  align-items: flex-start;
}

@media (max-width: 640px) {
  .aprisco-profile-header__info {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

.aprisco-profile-header__avatar {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  border: 4px solid var(--gray-850, #1a1a2e);
  background: var(--gray-700, #374151);
  object-fit: cover;
  flex-shrink: 0;
}

body.light-mode .aprisco-profile-header__avatar {
  border-color: #ffffff;
}

.aprisco-profile-header__details {
  flex: 1;
  padding-top: 56px;
  min-width: 0;
}

@media (max-width: 640px) {
  .aprisco-profile-header__details {
    padding-top: 12px;
  }
}

.aprisco-profile-header__name-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

@media (max-width: 640px) {
  .aprisco-profile-header__name-row {
    justify-content: center;
  }
}

.aprisco-profile-header__name {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-profile-header__name {
  color: #0f172a;
}

.aprisco-profile-header__verified {
  color: #3b82f6;
  font-size: 1.2rem;
}

.aprisco-profile-header__username {
  color: var(--gray-400, #9ca3af);
  font-size: 1rem;
  margin: 4px 0 12px;
}

.aprisco-profile-header__bio {
  color: var(--gray-200, #e5e7eb);
  line-height: 1.5;
  margin-bottom: 12px;
  max-width: 500px;
}

body.light-mode .aprisco-profile-header__bio {
  color: #374151;
}

.aprisco-profile-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: var(--gray-400, #9ca3af);
  font-size: 0.9rem;
}

@media (max-width: 640px) {
  .aprisco-profile-header__meta {
    justify-content: center;
  }
}

.aprisco-profile-header__meta span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.aprisco-profile-header__actions {
  display: flex;
  gap: 12px;
  padding-top: 56px;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .aprisco-profile-header__actions {
    padding-top: 0;
    width: 100%;
    justify-content: center;
  }
}

.aprisco-profile-header__stats {
  display: flex;
  justify-content: flex-start;
  gap: 32px;
  padding: 16px 24px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-profile-header__stats {
  border-color: #e5e7eb;
}

@media (max-width: 640px) {
  .aprisco-profile-header__stats {
    justify-content: center;
  }
}

.aprisco-profile-header__stat {
  text-align: center;
}

.aprisco-profile-header__stat--clickable {
  cursor: pointer;
  transition: opacity 0.2s;
}

.aprisco-profile-header__stat--clickable:hover {
  opacity: 0.8;
}

.aprisco-profile-header__stat-value {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-profile-header__stat-value {
  color: #0f172a;
}

.aprisco-profile-header__stat-label {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   PROFILE TABS
   ============================================ */
.aprisco-profile-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 16px;
  overflow-x: auto;
}

.aprisco-profile-tab {
  padding: 10px 20px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.aprisco-profile-tab:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-profile-tab:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-profile-tab--active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

.aprisco-profile-tab--active:hover {
  background: #a85a3d;
  color: #ffffff;
}

/* ============================================
   TAGS
   ============================================ */
.aprisco-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-tag {
  display: inline-block;
  padding: 6px 12px;
  background: var(--gray-800, #1f2937);
  color: var(--gray-200, #e5e7eb);
  border-radius: 20px;
  font-size: 0.85rem;
}

body.light-mode .aprisco-tag {
  background: #e5e7eb;
  color: #374151;
}

/* ============================================
   WIDGET TITLE
   ============================================ */
.aprisco-widget-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0 0 16px 0;
}

body.light-mode .aprisco-widget-title {
  color: #0f172a;
}

/* ============================================
   EDIT PROFILE MODAL
   ============================================ */
.aprisco-edit-profile-modal {
  display: none;
}

.aprisco-edit-profile-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-edit-profile-modal__content {
  max-width: 500px;
  width: 95%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 0;
}

.aprisco-edit-profile-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-edit-profile-modal__header {
  border-color: #e5e7eb;
}

.aprisco-edit-profile-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-edit-profile-modal__header h3 {
  color: #0f172a;
}

.aprisco-edit-profile-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-edit-profile-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-edit-profile-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-edit-profile-modal__form {
  padding: 20px;
}

.aprisco-edit-profile-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-edit-profile-modal__actions {
  border-color: #e5e7eb;
}

/* ============================================
   FORM ELEMENTS
   ============================================ */
.aprisco-form-group {
  margin-bottom: 16px;
}

.aprisco-form-group label {
  display: block;
  margin-bottom: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-input,
.aprisco-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border-color);
  border-radius: 8px;
  background: var(--bg-tertiary);
  color: var(--text-primary);
  font-size: 0.95rem;
  font-family: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.aprisco-input::placeholder,
.aprisco-textarea::placeholder {
  color: var(--text-muted);
}

.aprisco-input:focus,
.aprisco-textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-light);
}

.aprisco-textarea {
  resize: vertical;
  min-height: 80px;
}

/* ============================================
   FOLLOW LIST MODAL
   ============================================ */
.aprisco-follow-list-modal {
  display: none;
}

.aprisco-follow-list-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-follow-list-modal__content {
  max-width: 400px;
  width: 95%;
  max-height: 70vh;
  padding: 0;
}

.aprisco-follow-list-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-follow-list-modal__header {
  border-color: #e5e7eb;
}

.aprisco-follow-list-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-follow-list-modal__header h3 {
  color: #0f172a;
}

.aprisco-follow-list-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-follow-list-modal__body {
  padding: 16px 20px;
  overflow-y: auto;
  max-height: calc(70vh - 60px);
}

.aprisco-follow-list__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-follow-list__item {
  border-color: #f3f4f6;
}

.aprisco-follow-list__item:last-child {
  border-bottom: none;
}

.aprisco-follow-list__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--gray-700, #374151);
  object-fit: cover;
}

.aprisco-follow-list__info {
  flex: 1;
  min-width: 0;
}

.aprisco-follow-list__name {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  text-decoration: none;
}

body.light-mode .aprisco-follow-list__name {
  color: #0f172a;
}

.aprisco-follow-list__name:hover {
  text-decoration: underline;
}

.aprisco-follow-list__username {
  display: block;
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   GROUPS - PAGE HEADER
   ============================================ */
.aprisco-page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.aprisco-page-header__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-page-header__title {
  color: #0f172a;
}

/* ============================================
   GROUPS - NAVIGATION MENU
   ============================================ */
.aprisco-nav-menu {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-nav-menu__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 8px;
  color: var(--gray-300, #d1d5db);
  text-decoration: none;
  font-size: 0.95rem;
  transition: background 0.2s, color 0.2s;
}

.aprisco-nav-menu__item:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-nav-menu__item:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-nav-menu__item--active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

.aprisco-nav-menu__item--active:hover {
  background: #a85a3d;
}

.aprisco-nav-menu__icon {
  font-size: 1.2rem;
}

/* ============================================
   GROUPS - FILTERS
   ============================================ */
.aprisco-groups-filters {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-search-box {
  width: 100%;
}

.aprisco-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filter-tab {
  transition: background 0.2s, color 0.2s;
}

.filter-tab.active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

/* ============================================
   GROUPS - GRID
   ============================================ */
.aprisco-groups-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

@media (max-width: 640px) {
  .aprisco-groups-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   GROUPS - CARD
   ============================================ */
.aprisco-group-card {
  padding: 0;
  overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}

.aprisco-group-card:hover {
  border-color: var(--accent, #c46849);
  transform: translateY(-2px);
}

.aprisco-group-card__cover {
  height: 80px;
  background: linear-gradient(135deg, var(--gray-700, #374151) 0%, var(--gray-800, #1f2937) 100%);
  position: relative;
}

.aprisco-group-card__icon {
  position: absolute;
  bottom: -20px;
  left: 16px;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--gray-850, #1a1a2e);
  border: 3px solid var(--gray-850, #1a1a2e);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}

body.light-mode .aprisco-group-card__icon {
  background: #ffffff;
  border-color: #ffffff;
}

.aprisco-group-card__content {
  padding: 28px 16px 16px;
}

.aprisco-group-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
}

.aprisco-group-card__name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-group-card__name {
  color: #0f172a;
}

.aprisco-group-card__type {
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 0.7rem;
  font-weight: 500;
  white-space: nowrap;
}

.aprisco-group-card__description {
  color: var(--gray-400, #9ca3af);
  font-size: 0.85rem;
  line-height: 1.4;
  margin-bottom: 12px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.aprisco-group-card__stats {
  display: flex;
  gap: 16px;
  color: var(--gray-500, #6b7280);
  font-size: 0.8rem;
  margin-bottom: 12px;
}

.aprisco-group-card__actions {
  display: flex;
  gap: 8px;
}

.aprisco-group-card__actions .aprisco-btn {
  flex: 1;
}

/* ============================================
   GROUPS - CATEGORIES
   ============================================ */
.aprisco-categories {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-category {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  text-decoration: none;
  color: var(--gray-300, #d1d5db);
  transition: background 0.2s;
}

.aprisco-category:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-category:hover {
  background: #f3f4f6;
}

.aprisco-category__icon {
  font-size: 1.2rem;
}

.aprisco-category__name {
  flex: 1;
  font-size: 0.9rem;
}

.aprisco-category__count {
  background: var(--gray-700, #374151);
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
}

body.light-mode .aprisco-category__count {
  background: #e5e7eb;
  color: #6b7280;
}

/* ============================================
   GROUPS - MY GROUPS (SIDEBAR)
   ============================================ */
.aprisco-my-group-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  text-decoration: none;
}

body.light-mode .aprisco-my-group-item {
  border-color: #f3f4f6;
}

.aprisco-my-group-item:last-child {
  border-bottom: none;
}

.aprisco-my-group-item__icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: var(--gray-700, #374151);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.aprisco-my-group-item__info {
  flex: 1;
  min-width: 0;
}

.aprisco-my-group-item__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-my-group-item__name {
  color: #0f172a;
}

.aprisco-my-group-item__role {
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   GROUPS - SUGGESTED GROUPS
   ============================================ */
.aprisco-suggested-group {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-suggested-group {
  border-color: #f3f4f6;
}

.aprisco-suggested-group:last-child {
  border-bottom: none;
}

.aprisco-suggested-group__icon {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background: var(--gray-700, #374151);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  flex-shrink: 0;
}

.aprisco-suggested-group__info {
  flex: 1;
  min-width: 0;
}

.aprisco-suggested-group__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  margin-bottom: 2px;
}

body.light-mode .aprisco-suggested-group__name {
  color: #0f172a;
}

.aprisco-suggested-group__members {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   GROUPS - CREATE GROUP MODAL
   ============================================ */
.aprisco-create-group-modal {
  display: none;
}

.aprisco-create-group-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-create-group-modal__content {
  max-width: 500px;
  width: 95%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 0;
}

.aprisco-create-group-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-create-group-modal__header {
  border-color: #e5e7eb;
}

.aprisco-create-group-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-create-group-modal__header h3 {
  color: #0f172a;
}

.aprisco-create-group-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-create-group-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-create-group-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-create-group-modal__form {
  padding: 20px;
}

.aprisco-create-group-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-create-group-modal__actions {
  border-color: #e5e7eb;
}

.aprisco-select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border-color);
  border-radius: 8px;
  background: var(--bg-tertiary);
  color: var(--text-primary);
  font-size: 0.95rem;
  font-family: inherit;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.aprisco-select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-light);
}

.aprisco-select option {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

/* ============================================
   GROUP PAGE - LAYOUT
   ============================================ */
.aprisco-group-layout {
  grid-template-columns: 1fr 300px;
}

.aprisco-group-main {
  min-width: 0;
}

@media (max-width: 1024px) {
  .aprisco-group-layout {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   GROUP PAGE - HEADER
   ============================================ */
.aprisco-group-header {
  padding: 0;
  overflow: hidden;
}

.aprisco-group-header__cover {
  height: 160px;
  background: linear-gradient(135deg, var(--gray-700, #374151) 0%, var(--gray-800, #1f2937) 100%);
}

.aprisco-group-header__info {
  display: flex;
  gap: 16px;
  padding: 0 20px 20px;
  margin-top: -30px;
  align-items: flex-start;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .aprisco-group-header__info {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

.aprisco-group-header__icon {
  width: 80px;
  height: 80px;
  border-radius: 16px;
  background: var(--gray-850, #1a1a2e);
  border: 4px solid var(--gray-850, #1a1a2e);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  flex-shrink: 0;
}

body.light-mode .aprisco-group-header__icon {
  background: #ffffff;
  border-color: #ffffff;
}

.aprisco-group-header__details {
  flex: 1;
  padding-top: 36px;
  min-width: 0;
}

@media (max-width: 640px) {
  .aprisco-group-header__details {
    padding-top: 12px;
  }
}

.aprisco-group-header__name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .aprisco-group-header__name-row {
    justify-content: center;
  }
}

.aprisco-group-header__name {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-group-header__name {
  color: #0f172a;
}

.aprisco-group-header__type-badge {
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

.aprisco-group-header__description {
  color: var(--gray-300, #d1d5db);
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 8px 0 12px;
}

body.light-mode .aprisco-group-header__description {
  color: #4b5563;
}

.aprisco-group-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: var(--gray-400, #9ca3af);
  font-size: 0.9rem;
}

@media (max-width: 640px) {
  .aprisco-group-header__meta {
    justify-content: center;
  }
}

.aprisco-group-header__meta strong {
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-group-header__meta strong {
  color: #0f172a;
}

.aprisco-group-header__actions {
  display: flex;
  gap: 8px;
  padding-top: 36px;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .aprisco-group-header__actions {
    padding-top: 0;
    width: 100%;
    justify-content: center;
  }
}

/* ============================================
   GROUP PAGE - TABS
   ============================================ */
.aprisco-group-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 16px;
  overflow-x: auto;
}

.aprisco-group-tab {
  padding: 10px 20px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.aprisco-group-tab:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-group-tab:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-group-tab--active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

.aprisco-group-tab--active:hover {
  background: #a85a3d;
  color: #ffffff;
}

/* ============================================
   GROUP PAGE - TAB CONTENT
   ============================================ */
.aprisco-group-tab-content {
  display: none;
}

.aprisco-group-tab-content--active {
  display: block;
}

/* ============================================
   GROUP PAGE - ABOUT
   ============================================ */
.aprisco-group-about p {
  color: var(--gray-200, #e5e7eb);
  line-height: 1.6;
  margin-bottom: 20px;
}

body.light-mode .aprisco-group-about p {
  color: #374151;
}

.aprisco-group-about__rules h4 {
  color: var(--text-white, #ffffff);
  font-size: 1rem;
  margin-bottom: 12px;
}

body.light-mode .aprisco-group-about__rules h4 {
  color: #0f172a;
}

.aprisco-group-about__rules ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.aprisco-group-about__rules li {
  color: var(--gray-300, #d1d5db);
  padding: 8px 0;
  padding-left: 24px;
  position: relative;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-group-about__rules li {
  color: #4b5563;
  border-color: #f3f4f6;
}

.aprisco-group-about__rules li:last-child {
  border-bottom: none;
}

.aprisco-group-about__rules li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #22c55e;
}

/* ============================================
   GROUP PAGE - MEMBERS
   ============================================ */
.aprisco-group-members-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}

.aprisco-group-members {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.aprisco-member-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

body.light-mode .aprisco-member-item {
  background: #f9fafb;
}

.aprisco-member-item:hover {
  background: var(--gray-700, #374151);
}

body.light-mode .aprisco-member-item:hover {
  background: #f3f4f6;
}

.aprisco-member-item__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--gray-600, #4b5563);
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-member-item__info {
  flex: 1;
  min-width: 0;
}

.aprisco-member-item__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-member-item__name {
  color: #0f172a;
}

.aprisco-member-item__role {
  font-size: 0.75rem;
  padding: 2px 8px;
  border-radius: 10px;
  display: inline-block;
  margin-top: 4px;
}

.aprisco-member-item__role--leader {
  background: rgba(234, 179, 8, 0.15);
  color: #eab308;
}

.aprisco-member-item__role--admin {
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
}

.aprisco-member-item__role--moderator {
  background: rgba(59, 130, 246, 0.15);
  color: #3b82f6;
}

/* ============================================
   GROUP PAGE - ADMINS SIDEBAR
   ============================================ */
.aprisco-admin-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-admin-item {
  border-color: #f3f4f6;
}

.aprisco-admin-item:last-child {
  border-bottom: none;
}

.aprisco-admin-item__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gray-600, #4b5563);
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-admin-item__info {
  flex: 1;
  min-width: 0;
}

.aprisco-admin-item__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
}

body.light-mode .aprisco-admin-item__name {
  color: #0f172a;
}

.aprisco-admin-item__role {
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   GROUP PAGE - EVENTS
   ============================================ */
.aprisco-group-events-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}

.aprisco-event-item {
  display: flex;
  gap: 16px;
  padding: 16px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  margin-bottom: 12px;
}

body.light-mode .aprisco-event-item {
  background: #f9fafb;
}

.aprisco-event-item__date {
  text-align: center;
  padding: 8px 12px;
  background: var(--accent, #c46849);
  border-radius: 8px;
  flex-shrink: 0;
}

.aprisco-event-item__day {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  color: #ffffff;
}

.aprisco-event-item__month {
  display: block;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
}

.aprisco-event-item__info {
  flex: 1;
}

.aprisco-event-item__title {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin-bottom: 4px;
}

body.light-mode .aprisco-event-item__title {
  color: #0f172a;
}

.aprisco-event-item__time,
.aprisco-event-item__location {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ============================================
   GROUP PAGE - RELATED GROUPS
   ============================================ */
.aprisco-related-group {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  text-decoration: none;
}

body.light-mode .aprisco-related-group {
  border-color: #f3f4f6;
}

.aprisco-related-group:last-child {
  border-bottom: none;
}

.aprisco-related-group__icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: var(--gray-700, #374151);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.aprisco-related-group__info {
  flex: 1;
  min-width: 0;
}

.aprisco-related-group__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-related-group__name {
  color: #0f172a;
}

.aprisco-related-group__members {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   MEMBERS MODAL (GROUP)
   ============================================ */
.aprisco-members-modal {
  display: none;
}

.aprisco-members-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-members-modal__content {
  max-width: 500px;
  width: 95%;
  max-height: 80vh;
  padding: 0;
}

.aprisco-members-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-members-modal__header {
  border-color: #e5e7eb;
}

.aprisco-members-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-members-modal__header h3 {
  color: #0f172a;
}

.aprisco-members-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-members-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-members-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-members-modal__body {
  padding: 16px 20px;
  overflow-y: auto;
  max-height: calc(80vh - 60px);
}

/* ============================================
   UTILITY - MUTED TEXT
   ============================================ */
.aprisco-muted {
  color: var(--gray-500, #6b7280);
  font-size: 0.9rem;
}

/* ============================================
   EVENTS - FILTERS
   ============================================ */
.aprisco-events-filters {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-events-filters__row {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.aprisco-view-toggle {
  display: flex;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  padding: 4px;
}

body.light-mode .aprisco-view-toggle {
  background: #e5e7eb;
}

.aprisco-view-toggle__btn {
  padding: 8px 16px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  font-size: 0.9rem;
  cursor: pointer;
  border-radius: 6px;
  transition: background 0.2s, color 0.2s;
}

.aprisco-view-toggle__btn--active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

/* ============================================
   EVENTS - LIST VIEW
   ============================================ */
.aprisco-events-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.aprisco-events-month__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-events-month__title {
  color: #0f172a;
  border-color: #e5e7eb;
}

.aprisco-events-month__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ============================================
   EVENTS - CARD
   ============================================ */
.aprisco-event-card {
  display: flex;
  gap: 16px;
  padding: 0;
  overflow: hidden;
}

.aprisco-event-card__date {
  width: 70px;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px 12px;
  flex-shrink: 0;
}

.aprisco-event-card__day {
  font-size: 1.8rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1;
}

.aprisco-event-card__weekday {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
}

.aprisco-event-card__content {
  flex: 1;
  padding: 16px 16px 16px 0;
  min-width: 0;
}

.aprisco-event-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.aprisco-event-card__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  text-decoration: none;
}

body.light-mode .aprisco-event-card__title {
  color: #0f172a;
}

.aprisco-event-card__title:hover {
  text-decoration: underline;
}

.aprisco-event-card__type {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
  white-space: nowrap;
}

.aprisco-event-card__meta {
  display: flex;
  gap: 16px;
  color: var(--gray-400, #9ca3af);
  font-size: 0.85rem;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.aprisco-event-card__description {
  color: var(--gray-300, #d1d5db);
  font-size: 0.9rem;
  line-height: 1.4;
  margin-bottom: 12px;
}

body.light-mode .aprisco-event-card__description {
  color: #4b5563;
}

.aprisco-event-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.aprisco-event-card__stats {
  display: flex;
  gap: 12px;
  color: var(--gray-400, #9ca3af);
  font-size: 0.85rem;
}

.aprisco-event-card__rsvp-status {
  font-size: 0.85rem;
  font-weight: 500;
}

/* ============================================
   EVENTS - MY EVENTS (SIDEBAR)
   ============================================ */
.aprisco-my-event-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  text-decoration: none;
}

body.light-mode .aprisco-my-event-item {
  border-color: #f3f4f6;
}

.aprisco-my-event-item:last-child {
  border-bottom: none;
}

.aprisco-my-event-item__date {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background: var(--accent, #c46849);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.aprisco-my-event-item__day {
  font-size: 1.1rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1;
}

.aprisco-my-event-item__month {
  font-size: 0.65rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
}

.aprisco-my-event-item__info {
  flex: 1;
  min-width: 0;
}

.aprisco-my-event-item__title {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-my-event-item__title {
  color: #0f172a;
}

.aprisco-my-event-item__time {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENTS - UPCOMING EVENTS (SIDEBAR)
   ============================================ */
.aprisco-upcoming-event {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  text-decoration: none;
}

body.light-mode .aprisco-upcoming-event {
  border-color: #f3f4f6;
}

.aprisco-upcoming-event:last-child {
  border-bottom: none;
}

.aprisco-upcoming-event__date {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.aprisco-upcoming-event__day {
  font-size: 1.1rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1;
}

.aprisco-upcoming-event__month {
  font-size: 0.65rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
}

.aprisco-upcoming-event__info {
  flex: 1;
  min-width: 0;
}

.aprisco-upcoming-event__title {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-upcoming-event__title {
  color: #0f172a;
}

.aprisco-upcoming-event__meta {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENTS - MINI CALENDAR
   ============================================ */
.aprisco-mini-calendar__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.aprisco-mini-calendar__month {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-mini-calendar__month {
  color: #0f172a;
}

.aprisco-mini-calendar__nav {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 0.8rem;
}

.aprisco-mini-calendar__nav:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-mini-calendar__nav:hover {
  background: #f3f4f6;
}

.aprisco-mini-calendar__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  text-align: center;
  font-size: 0.7rem;
  color: var(--gray-500, #6b7280);
  margin-bottom: 8px;
}

.aprisco-mini-calendar__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}

.aprisco-mini-calendar__day {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  color: var(--gray-300, #d1d5db);
  border-radius: 4px;
}

body.light-mode .aprisco-mini-calendar__day {
  color: #374151;
}

.aprisco-mini-calendar__day--empty {
  color: transparent;
}

.aprisco-mini-calendar__day--today {
  background: var(--accent, #c46849);
  color: #ffffff;
  font-weight: 600;
}

.aprisco-mini-calendar__day--event {
  background: var(--gray-700, #374151);
  cursor: pointer;
}

body.light-mode .aprisco-mini-calendar__day--event {
  background: #e5e7eb;
}

.aprisco-mini-calendar__day--event.aprisco-mini-calendar__day--today {
  background: var(--accent, #c46849);
}

/* ============================================
   EVENTS - CALENDAR VIEW
   ============================================ */
.aprisco-calendar {
  background: var(--gray-850, #1a1a2e);
  border: 1px solid var(--gray-700, #374151);
  border-radius: 12px;
  padding: 20px;
}

body.light-mode .aprisco-calendar {
  background: #ffffff;
  border-color: #e5e7eb;
}

.aprisco-calendar__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.aprisco-calendar__month {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-calendar__month {
  color: #0f172a;
}

.aprisco-calendar__nav {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 1rem;
}

.aprisco-calendar__nav:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-calendar__nav:hover {
  background: #f3f4f6;
}

.aprisco-calendar__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  text-align: center;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--gray-400, #9ca3af);
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-calendar__weekdays {
  border-color: #e5e7eb;
}

.aprisco-calendar__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}

.aprisco-calendar__day {
  min-height: 80px;
  padding: 8px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.light-mode .aprisco-calendar__day {
  background: #f9fafb;
}

.aprisco-calendar__day--empty {
  background: transparent;
}

.aprisco-calendar__day--today {
  border: 2px solid var(--accent, #c46849);
}

.aprisco-calendar__day-number {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-calendar__day-number {
  color: #374151;
}

.aprisco-calendar__day--today .aprisco-calendar__day-number {
  color: var(--accent, #c46849);
}

.aprisco-calendar__event {
  display: block;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.7rem;
  color: #ffffff;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-calendar__more {
  font-size: 0.7rem;
  color: var(--gray-400, #9ca3af);
}

@media (max-width: 768px) {
  .aprisco-calendar__day {
    min-height: 50px;
    padding: 4px;
  }

  .aprisco-calendar__event {
    font-size: 0.6rem;
    padding: 1px 4px;
  }
}

/* ============================================
   EVENTS - CREATE EVENT MODAL
   ============================================ */
.aprisco-create-event-modal {
  display: none;
}

.aprisco-create-event-modal.aprisco-modal--visible {
  display: flex;
}

.aprisco-create-event-modal__content {
  max-width: 550px;
  width: 95%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 0;
}

.aprisco-create-event-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-create-event-modal__header {
  border-color: #e5e7eb;
}

.aprisco-create-event-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-create-event-modal__header h3 {
  color: #0f172a;
}

.aprisco-create-event-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-create-event-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-create-event-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-create-event-modal__form {
  padding: 20px;
}

.aprisco-create-event-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-create-event-modal__actions {
  border-color: #e5e7eb;
}

.aprisco-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

@media (max-width: 480px) {
  .aprisco-form-row {
    grid-template-columns: 1fr;
  }
}

.aprisco-checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  color: var(--gray-200, #e5e7eb);
}

body.light-mode .aprisco-checkbox-label {
  color: #374151;
}

.aprisco-checkbox {
  width: 18px;
  height: 18px;
  accent-color: var(--accent, #c46849);
}

/* ============================================
   EVENT PAGE - LAYOUT
   ============================================ */
.aprisco-event-layout {
  grid-template-columns: 1fr 300px;
}

.aprisco-event-main {
  min-width: 0;
}

@media (max-width: 1024px) {
  .aprisco-event-layout {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   EVENT PAGE - HEADER
   ============================================ */
.aprisco-event-header {
  padding: 0;
  overflow: hidden;
}

.aprisco-event-header__cover {
  height: 120px;
  background: linear-gradient(135deg, var(--gray-700, #374151) 0%, var(--gray-800, #1f2937) 100%);
}

.aprisco-event-header__info {
  display: flex;
  gap: 16px;
  padding: 0 20px 20px;
  margin-top: -40px;
  align-items: flex-start;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .aprisco-event-header__info {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

.aprisco-event-header__date-box {
  width: 80px;
  height: 80px;
  border-radius: 12px;
  background: var(--accent, #c46849);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.aprisco-event-header__day {
  font-size: 2rem;
  font-weight: 700;
  color: #ffffff;
  line-height: 1;
}

.aprisco-event-header__month {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.9);
  text-transform: uppercase;
}

.aprisco-event-header__details {
  flex: 1;
  padding-top: 44px;
  min-width: 0;
}

@media (max-width: 640px) {
  .aprisco-event-header__details {
    padding-top: 12px;
  }
}

.aprisco-event-header__title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

@media (max-width: 640px) {
  .aprisco-event-header__title-row {
    justify-content: center;
  }
}

.aprisco-event-header__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-event-header__title {
  color: #0f172a;
}

.aprisco-event-header__type-badge {
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 0.8rem;
  font-weight: 500;
}

.aprisco-event-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: var(--gray-400, #9ca3af);
  font-size: 0.9rem;
  margin-bottom: 12px;
}

@media (max-width: 640px) {
  .aprisco-event-header__meta {
    justify-content: center;
  }
}

.aprisco-event-header__meta span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.aprisco-event-header__icon {
  font-size: 1rem;
}

.aprisco-event-header__description {
  color: var(--gray-200, #e5e7eb);
  line-height: 1.5;
  max-width: 600px;
}

body.light-mode .aprisco-event-header__description {
  color: #374151;
}

.aprisco-event-header__actions {
  display: flex;
  gap: 8px;
  padding-top: 44px;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .aprisco-event-header__actions {
    padding-top: 0;
    width: 100%;
    justify-content: center;
  }
}

/* ============================================
   EVENT PAGE - RSVP
   ============================================ */
.aprisco-event-rsvp {
  padding: 20px;
}

.aprisco-rsvp-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.aprisco-rsvp-btn {
  flex: 1;
  min-width: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px;
  border: 2px solid var(--gray-700, #374151);
  background: transparent;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

body.light-mode .aprisco-rsvp-btn {
  border-color: #e5e7eb;
}

.aprisco-rsvp-btn:hover {
  border-color: var(--gray-600, #4b5563);
}

.aprisco-rsvp-btn--selected {
  border-color: var(--accent, #c46849);
  background: rgba(196, 104, 73, 0.1);
}

.aprisco-rsvp-btn__icon {
  font-size: 1.5rem;
}

.aprisco-rsvp-btn__label {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-rsvp-btn__label {
  color: #0f172a;
}

.aprisco-rsvp-btn__count {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENT PAGE - TABS
   ============================================ */
.aprisco-event-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 16px;
  overflow-x: auto;
}

.aprisco-event-tab {
  padding: 10px 20px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.aprisco-event-tab:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-event-tab:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-event-tab--active {
  background: var(--accent, #c46849);
  color: #ffffff;
}

.aprisco-event-tab--active:hover {
  background: #a85a3d;
  color: #ffffff;
}

/* ============================================
   EVENT PAGE - TAB CONTENT
   ============================================ */
.aprisco-event-tab-content {
  display: none;
}

.aprisco-event-tab-content--active {
  display: block;
}

/* ============================================
   EVENT PAGE - DETAILS
   ============================================ */
.aprisco-event-details {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-event-detail {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.aprisco-event-detail__icon {
  font-size: 1.2rem;
  width: 32px;
  text-align: center;
  flex-shrink: 0;
}

.aprisco-event-detail__content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-event-detail__content strong {
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
}

body.light-mode .aprisco-event-detail__content strong {
  color: #0f172a;
}

.aprisco-event-detail__content span,
.aprisco-event-link {
  color: var(--gray-300, #d1d5db);
  font-size: 0.9rem;
}

body.light-mode .aprisco-event-detail__content span,
body.light-mode .aprisco-event-link {
  color: #4b5563;
}

.aprisco-event-link {
  color: var(--accent, #c46849);
  text-decoration: none;
}

.aprisco-event-link:hover {
  text-decoration: underline;
}

/* ============================================
   EVENT PAGE - ATTENDEES
   ============================================ */
.aprisco-event-attendees-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}

.aprisco-event-attendees-filter {
  display: flex;
  gap: 8px;
}

.aprisco-event-attendees {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.aprisco-attendee-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

body.light-mode .aprisco-attendee-item {
  background: #f9fafb;
}

.aprisco-attendee-item:hover {
  background: var(--gray-700, #374151);
}

body.light-mode .aprisco-attendee-item:hover {
  background: #f3f4f6;
}

.aprisco-attendee-item__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--gray-600, #4b5563);
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-attendee-item__info {
  flex: 1;
  min-width: 0;
}

.aprisco-attendee-item__name {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
}

body.light-mode .aprisco-attendee-item__name {
  color: #0f172a;
}

.aprisco-attendee-item__username {
  display: block;
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENT PAGE - ORGANIZER CARD
   ============================================ */
.aprisco-organizer-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

body.light-mode .aprisco-organizer-card {
  background: #f9fafb;
}

.aprisco-organizer-card:hover {
  background: var(--gray-700, #374151);
}

body.light-mode .aprisco-organizer-card:hover {
  background: #f3f4f6;
}

.aprisco-organizer-card__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--gray-600, #4b5563);
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-organizer-card__info {
  flex: 1;
  min-width: 0;
}

.aprisco-organizer-card__name {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.95rem;
}

body.light-mode .aprisco-organizer-card__name {
  color: #0f172a;
}

.aprisco-organizer-card__username {
  display: block;
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENT PAGE - RELATED EVENTS
   ============================================ */
.aprisco-related-event {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  text-decoration: none;
}

body.light-mode .aprisco-related-event {
  border-color: #f3f4f6;
}

.aprisco-related-event:last-child {
  border-bottom: none;
}

.aprisco-related-event__icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.aprisco-related-event__info {
  flex: 1;
  min-width: 0;
}

.aprisco-related-event__title {
  display: block;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.light-mode .aprisco-related-event__title {
  color: #0f172a;
}

.aprisco-related-event__date {
  display: block;
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   EVENT PAGE - SHARE BUTTONS
   ============================================ */
.aprisco-share-buttons {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-share-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid var(--gray-700, #374151);
  background: transparent;
  border-radius: 8px;
  color: var(--gray-200, #e5e7eb);
  cursor: pointer;
  font-size: 0.9rem;
  transition: background 0.2s, border-color 0.2s;
}

body.light-mode .aprisco-share-btn {
  border-color: #e5e7eb;
  color: #374151;
}

.aprisco-share-btn:hover {
  background: var(--gray-800, #1f2937);
  border-color: var(--gray-600, #4b5563);
}

body.light-mode .aprisco-share-btn:hover {
  background: #f9fafb;
}

/* ============================================
   NOTIFICATIONS - FILTERS (SIDEBAR)
   ============================================ */
.aprisco-notification-filters {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-notification-filter {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: none;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
  width: 100%;
  text-align: left;
}

.aprisco-notification-filter:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-notification-filter:hover {
  background: #f3f4f6;
}

.aprisco-notification-filter--active {
  background: var(--accent, #c46849);
}

.aprisco-notification-filter--active:hover {
  background: #a85a3d;
}

.aprisco-notification-filter__icon {
  font-size: 1rem;
  width: 24px;
  text-align: center;
}

.aprisco-notification-filter__label {
  flex: 1;
  font-size: 0.9rem;
  color: var(--gray-200, #e5e7eb);
}

body.light-mode .aprisco-notification-filter__label {
  color: #374151;
}

.aprisco-notification-filter--active .aprisco-notification-filter__label {
  color: #ffffff;
}

.aprisco-notification-filter__count {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
  background: var(--gray-700, #374151);
  padding: 2px 8px;
  border-radius: 10px;
}

body.light-mode .aprisco-notification-filter__count {
  background: #e5e7eb;
  color: #4b5563;
}

.aprisco-notification-filter--active .aprisco-notification-filter__count {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

/* ============================================
   NOTIFICATIONS - LIST
   ============================================ */
.aprisco-notifications-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-notification-group {
  background: var(--gray-850, #1a1a2e);
  border: 1px solid var(--gray-700, #374151);
  border-radius: 12px;
  overflow: hidden;
}

body.light-mode .aprisco-notification-group {
  background: #ffffff;
  border-color: #e5e7eb;
}

.aprisco-notification-group__title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--gray-400, #9ca3af);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 12px 16px;
  margin: 0;
  background: var(--gray-800, #1f2937);
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-notification-group__title {
  background: #f9fafb;
  border-color: #e5e7eb;
  color: #6b7280;
}

.aprisco-notification-group__list {
  display: flex;
  flex-direction: column;
}

/* ============================================
   NOTIFICATIONS - ITEM
   ============================================ */
.aprisco-notification-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--gray-700, #374151);
  position: relative;
  transition: background 0.2s;
}

body.light-mode .aprisco-notification-item {
  border-color: #f3f4f6;
}

.aprisco-notification-item:last-child {
  border-bottom: none;
}

.aprisco-notification-item:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-notification-item:hover {
  background: #f9fafb;
}

.aprisco-notification-item--unread {
  background: rgba(196, 104, 73, 0.08);
}

body.light-mode .aprisco-notification-item--unread {
  background: rgba(196, 104, 73, 0.05);
}

.aprisco-notification-item--unread:hover {
  background: rgba(196, 104, 73, 0.12);
}

.aprisco-notification-item__indicator {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  border-radius: 0 2px 2px 0;
  opacity: 0;
  transition: opacity 0.2s;
}

.aprisco-notification-item--unread .aprisco-notification-item__indicator {
  opacity: 1;
}

.aprisco-notification-item__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-notification-item__avatar--system {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  color: #ffffff;
}

.aprisco-notification-item__content {
  flex: 1;
  min-width: 0;
}

.aprisco-notification-item__message {
  margin: 0;
  font-size: 0.9rem;
  color: var(--gray-200, #e5e7eb);
  line-height: 1.4;
}

body.light-mode .aprisco-notification-item__message {
  color: #374151;
}

.aprisco-notification-item__message strong {
  color: var(--text-white, #ffffff);
  font-weight: 600;
}

body.light-mode .aprisco-notification-item__message strong {
  color: #0f172a;
}

.aprisco-notification-item__time {
  display: block;
  font-size: 0.8rem;
  color: var(--gray-500, #6b7280);
  margin-top: 4px;
}

.aprisco-notification-item__actions {
  display: flex;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.2s;
}

.aprisco-notification-item:hover .aprisco-notification-item__actions {
  opacity: 1;
}

.aprisco-notification-item__action {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: var(--gray-700, #374151);
  color: var(--gray-300, #d1d5db);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.85rem;
  transition: background 0.2s;
}

body.light-mode .aprisco-notification-item__action {
  background: #e5e7eb;
  color: #4b5563;
}

.aprisco-notification-item__action:hover {
  background: var(--gray-600, #4b5563);
}

body.light-mode .aprisco-notification-item__action:hover {
  background: #d1d5db;
}

.aprisco-notification-item__link {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.aprisco-notification-item__actions {
  position: relative;
  z-index: 2;
}

/* ============================================
   NOTIFICATIONS - SUMMARY (SIDEBAR)
   ============================================ */
.aprisco-notification-summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-notification-summary__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-notification-summary__item {
  border-color: #f3f4f6;
}

.aprisco-notification-summary__item:last-child {
  border-bottom: none;
}

.aprisco-notification-summary__icon {
  font-size: 1.2rem;
  width: 32px;
  text-align: center;
}

.aprisco-notification-summary__info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.aprisco-notification-summary__count {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-notification-summary__count {
  color: #0f172a;
}

.aprisco-notification-summary__label {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   NOTIFICATIONS - RECENT ACTIVITY
   ============================================ */
.aprisco-recent-activity {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-recent-activity__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
}

.aprisco-recent-activity__icon {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  flex-shrink: 0;
}

.aprisco-recent-activity__label {
  flex: 1;
  font-size: 0.85rem;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-recent-activity__label {
  color: #4b5563;
}

.aprisco-recent-activity__count {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--gray-400, #9ca3af);
}

.aprisco-empty-text {
  color: var(--gray-500, #6b7280);
  font-size: 0.85rem;
  text-align: center;
  padding: 12px 0;
}

/* ============================================
   NOTIFICATIONS - QUICK SETTINGS (SIDEBAR)
   ============================================ */
.aprisco-notification-quick-settings {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-toggle-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  font-size: 0.9rem;
  color: var(--gray-200, #e5e7eb);
}

body.light-mode .aprisco-toggle-label {
  color: #374151;
}

.aprisco-toggle {
  display: none;
}

.aprisco-toggle__slider {
  width: 44px;
  height: 24px;
  background: var(--gray-600, #4b5563);
  border-radius: 12px;
  position: relative;
  transition: background 0.2s;
  flex-shrink: 0;
}

.aprisco-toggle__slider::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  transition: transform 0.2s;
}

.aprisco-toggle:checked + .aprisco-toggle__slider {
  background: var(--accent, #c46849);
}

.aprisco-toggle:checked + .aprisco-toggle__slider::after {
  transform: translateX(20px);
}

/* ============================================
   NOTIFICATIONS - SETTINGS MODAL
   ============================================ */
.aprisco-notification-settings-modal__content {
  max-width: 500px;
  width: 95%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 0;
}

.aprisco-notification-settings-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-notification-settings-modal__header {
  border-color: #e5e7eb;
}

.aprisco-notification-settings-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-notification-settings-modal__header h3 {
  color: #0f172a;
}

.aprisco-notification-settings-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-notification-settings-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-notification-settings-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-notification-settings-modal__body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.aprisco-notification-settings-section h4 {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

body.light-mode .aprisco-notification-settings-section h4 {
  color: #0f172a;
}

.aprisco-notification-settings-section .aprisco-checkbox-label {
  padding: 8px 0;
  border-bottom: 1px solid var(--gray-800, #1f2937);
}

body.light-mode .aprisco-notification-settings-section .aprisco-checkbox-label {
  border-color: #f3f4f6;
}

.aprisco-notification-settings-section .aprisco-checkbox-label:last-child {
  border-bottom: none;
}

.aprisco-notification-settings-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  padding: 16px 20px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-notification-settings-modal__actions {
  border-color: #e5e7eb;
}

/* ============================================
   NOTIFICATIONS - BADGE (NAV)
   ============================================ */
.aprisco-nav-badge {
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: var(--accent, #c46849);
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 600;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}

.aprisco-mobile-nav__badge {
  position: absolute;
  top: 2px;
  right: 50%;
  transform: translateX(100%);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: var(--accent, #c46849);
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 600;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-mobile-nav__item {
  position: relative;
}

/* ============================================
   MODERATION - STATS
   ============================================ */
.aprisco-mod-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.aprisco-mod-stat {
  text-align: center;
  padding: 12px 8px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
}

body.light-mode .aprisco-mod-stat {
  background: #f9fafb;
}

.aprisco-mod-stat__value {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-mod-stat__value {
  color: #0f172a;
}

.aprisco-mod-stat__label {
  display: block;
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
  margin-top: 4px;
}

/* ============================================
   MODERATION - REPORT CARD
   ============================================ */
.aprisco-reports-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-report-card {
  padding: 16px;
  border-left: 4px solid transparent;
}

.aprisco-report-card--pending {
  border-left-color: var(--accent, #c46849);
}

.aprisco-report-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.aprisco-report-card__reason {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 0.85rem;
  font-weight: 500;
}

.aprisco-report-card__status {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

.aprisco-report-card__content {
  margin-bottom: 12px;
}

.aprisco-report-card__preview {
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  padding: 12px;
}

body.light-mode .aprisco-report-card__preview {
  background: #f9fafb;
}

.aprisco-report-card__content-type {
  display: inline-block;
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
  margin-bottom: 6px;
}

.aprisco-report-card__preview p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--gray-200, #e5e7eb);
  font-style: italic;
}

body.light-mode .aprisco-report-card__preview p {
  color: #374151;
}

.aprisco-report-card__users {
  display: flex;
  gap: 24px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.aprisco-report-card__user {
  display: flex;
  align-items: center;
  gap: 10px;
}

.aprisco-report-card__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-report-card__user-info {
  display: flex;
  flex-direction: column;
}

.aprisco-report-card__user-label {
  font-size: 0.7rem;
  color: var(--gray-500, #6b7280);
  text-transform: uppercase;
}

.aprisco-report-card__user-name {
  font-size: 0.85rem;
  color: var(--text-white, #ffffff);
  font-weight: 500;
}

body.light-mode .aprisco-report-card__user-name {
  color: #0f172a;
}

.aprisco-report-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aprisco-report-card__time {
  font-size: 0.8rem;
  color: var(--gray-500, #6b7280);
}

/* ============================================
   MODERATION - USER CARD
   ============================================ */
.aprisco-users-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-user-mod-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
  flex-wrap: wrap;
}

body.light-mode .aprisco-user-mod-card {
  background: #f9fafb;
}

.aprisco-user-mod-card__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.aprisco-user-mod-card__info {
  flex: 1;
  min-width: 120px;
}

.aprisco-user-mod-card__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
  display: flex;
  align-items: center;
  gap: 6px;
}

body.light-mode .aprisco-user-mod-card__name {
  color: #0f172a;
}

.aprisco-verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: #3b82f6;
  color: #ffffff;
  border-radius: 50%;
  font-size: 0.65rem;
}

.aprisco-user-mod-card__username {
  display: block;
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

.aprisco-user-mod-card__stats {
  display: flex;
  gap: 12px;
}

.aprisco-user-mod-card__stat {
  font-size: 0.85rem;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-user-mod-card__stat {
  color: #4b5563;
}

.aprisco-user-mod-card__status {
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 500;
  text-align: center;
  min-width: 80px;
}

.aprisco-user-mod-card__actions {
  display: flex;
  gap: 8px;
}

/* ============================================
   MODERATION - BANNED CARD
   ============================================ */
.aprisco-banned-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-banned-card {
  padding: 16px;
}

.aprisco-banned-card__user {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-banned-card__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-banned-card__info {
  display: flex;
  flex-direction: column;
}

.aprisco-banned-card__name {
  font-weight: 600;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-banned-card__name {
  color: #0f172a;
}

.aprisco-banned-card__username {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

.aprisco-banned-card__details {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
  padding: 12px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
}

body.light-mode .aprisco-banned-card__details {
  background: #f9fafb;
}

.aprisco-banned-card__detail {
  font-size: 0.85rem;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-banned-card__detail {
  color: #4b5563;
}

.aprisco-banned-card__detail strong {
  color: var(--gray-400, #9ca3af);
}

.aprisco-banned-card__actions {
  display: flex;
  justify-content: flex-end;
}

/* ============================================
   MODERATION - LOGS
   ============================================ */
.aprisco-logs-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-log-item {
  display: flex;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-log-item {
  border-color: #e5e7eb;
}

.aprisco-log-item:last-child {
  border-bottom: none;
}

.aprisco-log-item__icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.aprisco-log-item__content {
  flex: 1;
  min-width: 0;
}

.aprisco-log-item__header {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.aprisco-log-item__action {
  font-weight: 600;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-log-item__action {
  color: #0f172a;
}

.aprisco-log-item__target {
  font-size: 0.85rem;
  color: var(--gray-400, #9ca3af);
}

.aprisco-log-item__details {
  margin: 0;
  font-size: 0.9rem;
  color: var(--gray-300, #d1d5db);
}

body.light-mode .aprisco-log-item__details {
  color: #4b5563;
}

.aprisco-log-item__meta {
  display: flex;
  gap: 16px;
  margin-top: 8px;
  font-size: 0.8rem;
  color: var(--gray-500, #6b7280);
}

/* ============================================
   MODERATION - GUIDE
   ============================================ */
.aprisco-mod-guide {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-mod-guide__item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.aprisco-mod-guide__icon {
  font-size: 1.2rem;
  width: 28px;
  text-align: center;
  flex-shrink: 0;
}

.aprisco-mod-guide__content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-mod-guide__content strong {
  font-size: 0.9rem;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-mod-guide__content strong {
  color: #0f172a;
}

.aprisco-mod-guide__content span {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   MODERATION - ACTIONS GUIDE
   ============================================ */
.aprisco-mod-actions-guide {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-mod-action-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.aprisco-mod-action-item__badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 500;
  min-width: 70px;
  text-align: center;
}

.aprisco-mod-action-item__badge--dismiss {
  background: #6b728020;
  color: #6b7280;
}

.aprisco-mod-action-item__badge--warn {
  background: #f59e0b20;
  color: #f59e0b;
}

.aprisco-mod-action-item__badge--remove {
  background: #ef444420;
  color: #ef4444;
}

.aprisco-mod-action-item__badge--suspend {
  background: #f9731620;
  color: #f97316;
}

.aprisco-mod-action-item__badge--ban {
  background: #dc262620;
  color: #dc2626;
}

.aprisco-mod-action-item span:not(.aprisco-mod-action-item__badge) {
  font-size: 0.8rem;
  color: var(--gray-400, #9ca3af);
}

/* ============================================
   MODERATION - REPORT MODAL
   ============================================ */
.aprisco-report-modal__content {
  max-width: 600px;
  width: 95%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 0;
}

.aprisco-report-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-report-modal__header {
  border-color: #e5e7eb;
}

.aprisco-report-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-report-modal__header h3 {
  color: #0f172a;
}

.aprisco-report-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-report-modal__close:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-report-modal__close:hover {
  background: #f3f4f6;
}

.aprisco-report-modal__body {
  padding: 20px;
}

.aprisco-report-modal__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  padding: 16px 20px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-report-modal__actions {
  border-color: #e5e7eb;
}

.aprisco-report-modal__action-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* ============================================
   MODERATION - REPORT DETAIL
   ============================================ */
.aprisco-report-detail {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-report-detail__reason {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 8px;
  font-weight: 500;
  align-self: flex-start;
}

.aprisco-report-detail__section {
  padding: 16px;
  background: var(--gray-800, #1f2937);
  border-radius: 8px;
}

body.light-mode .aprisco-report-detail__section {
  background: #f9fafb;
}

.aprisco-report-detail__section h4 {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--gray-400, #9ca3af);
  margin: 0 0 12px;
  text-transform: uppercase;
}

.aprisco-report-detail__section p {
  margin: 0;
  color: var(--gray-200, #e5e7eb);
}

body.light-mode .aprisco-report-detail__section p {
  color: #374151;
}

.aprisco-report-detail__content-box {
  background: var(--gray-700, #374151);
  border-radius: 6px;
  padding: 12px;
}

body.light-mode .aprisco-report-detail__content-box {
  background: #e5e7eb;
}

.aprisco-report-detail__content-type {
  display: inline-block;
  font-size: 0.75rem;
  color: var(--gray-400, #9ca3af);
  margin-bottom: 6px;
}

.aprisco-report-detail__content-box p {
  font-style: italic;
  margin: 0;
}

.aprisco-report-detail__users {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}

.aprisco-report-detail__user {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-report-detail__user img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-report-detail__user-label {
  display: block;
  font-size: 0.7rem;
  color: var(--gray-500, #6b7280);
  text-transform: uppercase;
}

.aprisco-report-detail__user-name {
  display: block;
  font-weight: 500;
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-report-detail__user-name {
  color: #0f172a;
}

.aprisco-report-detail__meta {
  font-size: 0.85rem;
  color: var(--gray-500, #6b7280);
}

.aprisco-report-detail__resolution {
  padding: 16px;
  background: #10b98120;
  border-radius: 8px;
  border-left: 4px solid #10b981;
}

.aprisco-report-detail__resolution h4 {
  font-size: 0.85rem;
  font-weight: 600;
  color: #10b981;
  margin: 0 0 12px;
}

.aprisco-report-detail__resolution p {
  margin: 0 0 6px;
  font-size: 0.9rem;
  color: var(--gray-200, #e5e7eb);
}

body.light-mode .aprisco-report-detail__resolution p {
  color: #374151;
}

/* ============================================
   MODERATION - USER ACTION MODAL
   ============================================ */
.aprisco-user-action-modal__content {
  max-width: 450px;
  width: 95%;
  padding: 0;
}

.aprisco-user-action-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-user-action-modal__header {
  border-color: #e5e7eb;
}

.aprisco-user-action-modal__header h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin: 0;
}

body.light-mode .aprisco-user-action-modal__header h3 {
  color: #0f172a;
}

.aprisco-user-action-modal__close {
  background: transparent;
  border: none;
  color: var(--gray-400, #9ca3af);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}

.aprisco-user-action-modal__body {
  padding: 20px;
}

.aprisco-user-action-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  padding: 16px 20px;
  border-top: 1px solid var(--gray-700, #374151);
}

body.light-mode .aprisco-user-action-modal__actions {
  border-color: #e5e7eb;
}

/* ============================================
   BUTTONS - DANGER / WARNING
   ============================================ */
.aprisco-btn--danger {
  background: #ef4444;
  color: #ffffff;
  border: none;
}

.aprisco-btn--danger:hover {
  background: #dc2626;
}

.aprisco-btn--warning {
  background: #f59e0b;
  color: #ffffff;
  border: none;
}

.aprisco-btn--warning:hover {
  background: #d97706;
}

/* ============================================
   SEARCH & EXPLORE - Busca e Descoberta
   ============================================ */

/* Search Header */
.aprisco-search-header {
  position: relative;
  margin-bottom: 24px;
}

.aprisco-search-box {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-search-box--large {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 12px 16px;
}

.aprisco-search-box--inline {
  flex: 1;
  max-width: 300px;
}

.aprisco-search-box__icon {
  font-size: 18px;
  opacity: 0.7;
}

.aprisco-input--search {
  flex: 1;
  background: transparent;
  border: none;
  color: var(--text-primary);
  font-size: 16px;
  padding: 8px 0;
}

.aprisco-input--search:focus {
  outline: none;
}

.aprisco-input--search::placeholder {
  color: var(--text-secondary);
}

/* Search Suggestions */
.aprisco-search-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  margin-top: 8px;
  box-shadow: var(--shadow);
  z-index: 100;
  max-height: 400px;
  overflow-y: auto;
}

.aprisco-suggestion {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background 0.2s;
}

.aprisco-suggestion:hover {
  background: var(--bg-secondary);
}

.aprisco-suggestion__icon {
  width: 24px;
  text-align: center;
  font-size: 16px;
}

.aprisco-suggestion__text {
  flex: 1;
  color: var(--text-primary);
}

.aprisco-suggestion__label {
  color: var(--text-secondary);
  font-size: 12px;
}

/* Search Tips */
.aprisco-search-tips {
  padding: 24px;
}

.aprisco-search-tips__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 16px;
}

.aprisco-search-tip {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-search-tip__icon {
  font-size: 20px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-color);
  color: #fff;
  border-radius: 8px;
}

.aprisco-search-tip__content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-search-tip__content strong {
  color: var(--text-primary);
  font-size: 14px;
}

.aprisco-search-tip__content span {
  color: var(--text-secondary);
  font-size: 13px;
}

/* Search Filters */
.aprisco-search-filters {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-filter-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-filter-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.aprisco-filter-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Recent Searches */
.aprisco-recent-searches {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-recent-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  margin: 0 -12px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
}

.aprisco-recent-search:hover {
  background: var(--bg-secondary);
}

.aprisco-recent-search__icon {
  font-size: 14px;
  opacity: 0.6;
}

.aprisco-recent-search__text {
  flex: 1;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-recent-search__remove {
  padding: 4px;
  background: none;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.2s;
}

.aprisco-recent-search:hover .aprisco-recent-search__remove {
  opacity: 1;
}

/* Search Results */
.aprisco-results-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}

#resultsCount {
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-results-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.aprisco-results-tab {
  padding: 8px 16px;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 20px;
  color: var(--text-secondary);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-results-tab:hover {
  background: var(--accent-color);
  color: #fff;
  border-color: var(--accent-color);
}

.aprisco-results-tab--active {
  background: var(--accent-color);
  color: #fff;
  border-color: var(--accent-color);
}

.aprisco-results-tab__count {
  background: rgba(255, 255, 255, 0.2);
  padding: 2px 6px;
  border-radius: 10px;
  font-size: 12px;
  margin-left: 4px;
}

.aprisco-results-section-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 24px 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-results-section-title:first-child {
  margin-top: 0;
}

.aprisco-no-results {
  text-align: center;
  color: var(--text-secondary);
  padding: 24px;
}

/* Result Post */
.aprisco-result-post {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-result-post:hover {
  border-color: var(--accent-color);
  transform: translateY(-2px);
}

.aprisco-result-post__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-result-post__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-result-post__author {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.aprisco-result-post__name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-result-post__username {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-result-post__type {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
  color: #fff;
}

.aprisco-result-post__content {
  color: var(--text-primary);
  line-height: 1.6;
  margin-bottom: 12px;
}

.aprisco-result-post__meta {
  display: flex;
  gap: 16px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-highlight {
  background: rgba(var(--accent-color-rgb, 59, 130, 246), 0.3);
  color: var(--text-primary);
  padding: 0 2px;
  border-radius: 2px;
}

/* Result User */
.aprisco-results-users {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-result-user {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-result-user:hover {
  border-color: var(--accent-color);
}

.aprisco-result-user__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-result-user__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-result-user__name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-result-user__username {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-result-user__bio {
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 4px;
}

.aprisco-result-user__stats {
  font-size: 13px;
  color: var(--text-secondary);
  margin-right: 12px;
}

/* Result Group */
.aprisco-results-groups {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-result-group {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-result-group:hover {
  border-color: var(--accent-color);
}

.aprisco-result-group__icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-color);
  border-radius: 12px;
  font-size: 24px;
}

.aprisco-result-group__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-result-group__name {
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-result-group__description {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-result-group__members {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Result Event */
.aprisco-results-events {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-result-event {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-result-event:hover {
  border-color: var(--accent-color);
}

.aprisco-result-event__date {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 48px;
  background: var(--accent-color);
  border-radius: 8px;
  color: #fff;
}

.aprisco-result-event__day {
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.aprisco-result-event__month {
  font-size: 10px;
  text-transform: uppercase;
}

.aprisco-result-event__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-result-event__title {
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-result-event__type {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-result-event__attendees {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Trending Topics */
.aprisco-trending {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-trending-topic {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  margin: 0 -12px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
}

.aprisco-trending-topic:hover {
  background: var(--bg-secondary);
}

.aprisco-trending-topic__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-trending-topic__name {
  font-weight: 500;
  color: var(--text-primary);
  font-size: 14px;
}

.aprisco-trending-topic__count {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-trending-topic__trend {
  font-size: 16px;
}

/* Popular Hashtags */
.aprisco-hashtags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-hashtag-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg-secondary);
  border-radius: 16px;
  color: var(--accent-color);
  font-size: 13px;
  text-decoration: none;
  transition: all 0.2s;
}

.aprisco-hashtag-link:hover {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-hashtag-count {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-hashtag-link:hover .aprisco-hashtag-count {
  color: rgba(255, 255, 255, 0.8);
}

/* Featured Users */
.aprisco-featured-users {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-featured-user {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}

.aprisco-featured-user__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-featured-user__info {
  display: flex;
  flex-direction: column;
}

.aprisco-featured-user__name {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-featured-user__username {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Verified Badge */
.aprisco-verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: var(--accent-color);
  color: #fff;
  border-radius: 50%;
  font-size: 10px;
}

/* ============================================
   EXPLORE PAGE
   ============================================ */

/* Explore Categories */
.aprisco-explore-categories {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-explore-category {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  margin: 0 -12px;
  border-radius: 8px;
  color: var(--text-primary);
  text-decoration: none;
  transition: all 0.2s;
}

.aprisco-explore-category:hover {
  background: var(--bg-secondary);
}

.aprisco-explore-category--active {
  background: var(--accent-color) !important;
  color: #fff;
}

.aprisco-explore-category__icon {
  font-size: 18px;
}

.aprisco-explore-category__name {
  font-size: 14px;
  font-weight: 500;
}

/* Interests */
.aprisco-interests {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.aprisco-interest-tag {
  padding: 4px 10px;
  background: var(--accent-color);
  color: #fff;
  border-radius: 12px;
  font-size: 12px;
}

/* Explore Sections */
.aprisco-explore-section {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 20px;
}

.aprisco-explore-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.aprisco-explore-section__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}

.aprisco-explore-section__icon {
  font-size: 20px;
}

.aprisco-explore-section__more {
  font-size: 14px;
  color: var(--accent-color);
  text-decoration: none;
}

.aprisco-explore-section__more:hover {
  text-decoration: underline;
}

/* Featured Posts */
.aprisco-explore-featured {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}

.aprisco-featured-post {
  background: var(--bg-secondary);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-featured-post:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.aprisco-featured-post__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.aprisco-featured-post__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

.aprisco-featured-post__author {
  font-weight: 500;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-featured-post__content {
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-featured-post__stats {
  display: flex;
  gap: 12px;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Explore Trending */
.aprisco-explore-trending {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-explore-trend {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-explore-trend:hover {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-explore-trend__rank {
  font-weight: 700;
  font-size: 16px;
  color: var(--accent-color);
  min-width: 24px;
}

.aprisco-explore-trend:hover .aprisco-explore-trend__rank {
  color: #fff;
}

.aprisco-explore-trend__info {
  display: flex;
  flex-direction: column;
}

.aprisco-explore-trend__topic {
  font-weight: 600;
  font-size: 14px;
}

.aprisco-explore-trend__count {
  font-size: 12px;
  opacity: 0.7;
}

/* Explore Hashtags */
.aprisco-explore-hashtags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-explore-hashtag {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 14px;
  background: var(--bg-secondary);
  border-radius: 20px;
  color: var(--accent-color);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
}

.aprisco-explore-hashtag:hover {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-explore-hashtag span {
  font-size: 12px;
  opacity: 0.7;
}

/* Explore Groups */
.aprisco-explore-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

.aprisco-explore-group {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-explore-group:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.aprisco-explore-group__icon {
  font-size: 24px;
}

.aprisco-explore-group__info {
  display: flex;
  flex-direction: column;
}

.aprisco-explore-group__name {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-explore-group__members {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Explore Events */
.aprisco-explore-events {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-explore-event {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-explore-event:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.aprisco-explore-event__date {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 44px;
  padding: 6px;
  background: var(--accent-color);
  border-radius: 8px;
  color: #fff;
}

.aprisco-explore-event__day {
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.aprisco-explore-event__month {
  font-size: 10px;
  text-transform: uppercase;
}

.aprisco-explore-event__info {
  display: flex;
  flex-direction: column;
}

.aprisco-explore-event__title {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-explore-event__attendees {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Explore Users */
.aprisco-explore-users {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-explore-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 12px;
}

.aprisco-explore-user__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
}

.aprisco-explore-user__info {
  flex: 1;
  cursor: pointer;
}

.aprisco-explore-user__name {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-explore-user__bio {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Quick Search */
.aprisco-quick-search {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-quick-search__btn {
  padding: 6px 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  color: var(--text-primary);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-quick-search__btn:hover {
  background: var(--accent-color);
  color: #fff;
  border-color: var(--accent-color);
}

/* Discussed Verses */
.aprisco-discussed-verses {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-discussed-verse {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s;
}

.aprisco-discussed-verse:hover {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-discussed-verse__ref {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-discussed-verse:hover .aprisco-discussed-verse__ref {
  color: #fff;
}

.aprisco-discussed-verse__count {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-discussed-verse:hover .aprisco-discussed-verse__count {
  color: rgba(255, 255, 255, 0.8);
}

/* Community Stats */
.aprisco-community-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  text-align: center;
}

.aprisco-community-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 8px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-community-stat__value {
  font-size: 18px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-community-stat__label {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Edit Interests Modal */
.aprisco-edit-interests__content {
  max-width: 600px;
}

.aprisco-edit-interests__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-edit-interests__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-edit-interests__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-edit-interests__body {
  padding: 20px;
}

.aprisco-edit-interests__description {
  color: var(--text-secondary);
  margin-bottom: 20px;
}

.aprisco-interest-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}

.aprisco-interest-item {
  cursor: pointer;
}

.aprisco-interest-item input {
  display: none;
}

.aprisco-interest-item__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px;
  background: var(--bg-secondary);
  border: 2px solid transparent;
  border-radius: 12px;
  transition: all 0.2s;
}

.aprisco-interest-item:hover .aprisco-interest-item__content {
  border-color: var(--accent-color);
}

.aprisco-interest-item input:checked + .aprisco-interest-item__content {
  background: var(--accent-color);
  color: #fff;
  border-color: var(--accent-color);
}

.aprisco-interest-item__icon {
  font-size: 24px;
}

.aprisco-interest-item__name {
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}

.aprisco-edit-interests__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

/* Advanced Search Modal */
.aprisco-advanced-search__content {
  max-width: 500px;
}

.aprisco-advanced-search__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-advanced-search__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-advanced-search__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-advanced-search__form {
  padding: 20px;
}

.aprisco-advanced-search__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--border-color);
  margin-top: 16px;
}

/* Load More */
.aprisco-load-more {
  text-align: center;
  padding: 20px;
}

/* Empty Text */
.aprisco-empty-text {
  color: var(--text-secondary);
  font-size: 14px;
  text-align: center;
  padding: 12px 0;
}

/* Mobile Responsive - Search */
@media (max-width: 768px) {
  .aprisco-search-box--large {
    flex-wrap: wrap;
  }

  .aprisco-search-box--large .aprisco-btn {
    width: 100%;
    margin-top: 8px;
  }

  .aprisco-search-tips__list {
    grid-template-columns: 1fr;
  }

  .aprisco-results-header {
    flex-direction: column;
    align-items: stretch;
  }

  .aprisco-results-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .aprisco-explore-featured {
    grid-template-columns: 1fr;
  }

  .aprisco-explore-groups {
    grid-template-columns: 1fr;
  }

  .aprisco-interest-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============================================
   MESSAGES - Sistema de Mensagens Diretas
   ============================================ */

/* Messages Layout */
.aprisco-messages-layout {
  display: grid;
  grid-template-columns: 360px 1fr;
  height: calc(100vh - 80px);
  max-width: 1400px;
  margin: 0 auto;
}

/* Conversations Panel */
.aprisco-conversations-panel {
  display: flex;
  flex-direction: column;
  background: var(--card-bg);
  border-right: 1px solid var(--border-color);
  overflow: hidden;
}

.aprisco-conversations-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-conversations-header__title {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0;
}

.aprisco-btn--icon {
  width: 36px;
  height: 36px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.aprisco-conversations-search {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-conversations-tabs {
  display: flex;
  gap: 4px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-conversations-tab {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-conversations-tab:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.aprisco-conversations-tab--active {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-conversations-tab__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  background: #ef4444;
  color: #fff;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 600;
}

.aprisco-conversations-tab--active .aprisco-conversations-tab__badge {
  background: rgba(255, 255, 255, 0.3);
}

/* Conversations List */
.aprisco-conversations-list {
  flex: 1;
  overflow-y: auto;
}

.aprisco-conversation {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background 0.2s;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-conversation:hover {
  background: var(--bg-secondary);
}

.aprisco-conversation--active {
  background: var(--bg-secondary);
  border-left: 3px solid var(--accent-color);
}

.aprisco-conversation--unread {
  background: rgba(var(--accent-color-rgb, 59, 130, 246), 0.05);
}

.aprisco-conversation__avatar-wrapper {
  position: relative;
  flex-shrink: 0;
}

.aprisco-conversation__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-conversation__online {
  position: absolute;
  bottom: 2px;
  right: 2px;
  width: 12px;
  height: 12px;
  background: #22c55e;
  border: 2px solid var(--card-bg);
  border-radius: 50%;
}

.aprisco-conversation__content {
  flex: 1;
  min-width: 0;
}

.aprisco-conversation__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}

.aprisco-conversation__name {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-conversation--unread .aprisco-conversation__name {
  font-weight: 700;
}

.aprisco-conversation__time {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-conversation__preview {
  font-size: 13px;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-conversation--unread .aprisco-conversation__preview {
  color: var(--text-primary);
  font-weight: 500;
}

.aprisco-conversation__sent {
  color: var(--text-secondary);
}

.aprisco-conversation__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: var(--accent-color);
  color: #fff;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
}

.aprisco-conversation__muted {
  font-size: 14px;
  opacity: 0.5;
}

.aprisco-conversations-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px;
  text-align: center;
}

.aprisco-conversations-empty__icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.aprisco-conversations-empty__text {
  color: var(--text-secondary);
  margin-bottom: 16px;
}

/* Chat Panel */
.aprisco-chat-panel {
  display: flex;
  flex-direction: column;
  background: var(--bg-primary);
  overflow: hidden;
}

.aprisco-chat-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px;
  text-align: center;
}

.aprisco-chat-empty__icon {
  font-size: 64px;
  margin-bottom: 24px;
}

.aprisco-chat-empty__title {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 8px;
}

.aprisco-chat-empty__text {
  color: var(--text-secondary);
  max-width: 300px;
  margin-bottom: 24px;
}

/* Active Chat */
.aprisco-chat {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.aprisco-chat-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--card-bg);
  border-bottom: 1px solid var(--border-color);
}

.aprisco-chat-header__back {
  display: none;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  border-radius: 50%;
  font-size: 18px;
  color: var(--text-primary);
  cursor: pointer;
}

.aprisco-chat-header__user {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  cursor: pointer;
}

.aprisco-chat-header__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-chat-header__info {
  display: flex;
  flex-direction: column;
}

.aprisco-chat-header__name {
  font-weight: 600;
  font-size: 15px;
  color: var(--text-primary);
}

.aprisco-chat-header__status {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-chat-header__actions {
  display: flex;
  gap: 8px;
}

.aprisco-chat-header__action {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 50%;
  font-size: 18px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-chat-header__action:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

/* Chat Messages */
.aprisco-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-chat-date {
  text-align: center;
  padding: 12px 0;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 500;
}

.aprisco-chat-start {
  text-align: center;
  padding: 24px;
  color: var(--text-secondary);
  font-size: 13px;
}

.aprisco-message {
  display: flex;
  max-width: 75%;
}

.aprisco-message--own {
  align-self: flex-end;
}

.aprisco-message--other {
  align-self: flex-start;
}

.aprisco-message__bubble {
  padding: 10px 14px;
  border-radius: 18px;
  max-width: 100%;
}

.aprisco-message--own .aprisco-message__bubble {
  background: var(--accent-color);
  color: #fff;
  border-bottom-right-radius: 4px;
}

.aprisco-message--other .aprisco-message__bubble {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  color: var(--text-primary);
  border-bottom-left-radius: 4px;
}

.aprisco-message__content {
  margin: 0;
  word-break: break-word;
  line-height: 1.4;
}

.aprisco-message__meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 4px;
  font-size: 11px;
  opacity: 0.7;
}

.aprisco-message--own .aprisco-message__meta {
  color: rgba(255, 255, 255, 0.8);
}

.aprisco-message--other .aprisco-message__meta {
  color: var(--text-secondary);
}

.aprisco-message__status {
  font-size: 12px;
}

/* Typing Indicator */
.aprisco-typing-indicator {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  color: var(--text-secondary);
  font-size: 12px;
}

.aprisco-typing-indicator__dot {
  width: 6px;
  height: 6px;
  background: var(--text-secondary);
  border-radius: 50%;
  animation: typingDot 1.4s infinite ease-in-out;
}

.aprisco-typing-indicator__dot:nth-child(1) { animation-delay: 0s; }
.aprisco-typing-indicator__dot:nth-child(2) { animation-delay: 0.2s; }
.aprisco-typing-indicator__dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes typingDot {
  0%, 60%, 100% { transform: translateY(0); }
  30% { transform: translateY(-4px); }
}

/* Chat Input */
.aprisco-chat-input {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 16px;
  background: var(--card-bg);
  border-top: 1px solid var(--border-color);
}

.aprisco-chat-input__attach,
.aprisco-chat-input__emoji {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 50%;
  font-size: 18px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-chat-input__attach:hover,
.aprisco-chat-input__emoji:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.aprisco-chat-input__textarea {
  flex: 1;
  padding: 10px 16px;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 20px;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.4;
  resize: none;
  max-height: 120px;
  overflow-y: auto;
}

.aprisco-chat-input__textarea:focus {
  outline: none;
  border-color: var(--accent-color);
}

.aprisco-chat-input__send {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-color);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-chat-input__send:hover {
  transform: scale(1.05);
}

.aprisco-chat-input__send:disabled {
  background: var(--text-secondary);
  cursor: not-allowed;
  transform: none;
}

/* Chat Info Panel */
.aprisco-chat-info-panel {
  width: 300px;
  background: var(--card-bg);
  border-left: 1px solid var(--border-color);
  overflow-y: auto;
}

.aprisco-chat-info-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-chat-info-header h3 {
  margin: 0;
  font-size: 16px;
  color: var(--text-primary);
}

.aprisco-chat-info-close {
  background: none;
  border: none;
  font-size: 18px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-chat-info-content {
  padding: 20px;
}

.aprisco-chat-info-user {
  text-align: center;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-color);
  margin-bottom: 20px;
}

.aprisco-chat-info-user__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-bottom: 12px;
}

.aprisco-chat-info-user__name {
  margin: 0 0 4px;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-chat-info-user__username {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-chat-info-section {
  margin-bottom: 20px;
}

.aprisco-chat-info-section h5 {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.aprisco-chat-info-option {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 12px;
  margin-bottom: 4px;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 14px;
  cursor: pointer;
  transition: background 0.2s;
  text-align: left;
}

.aprisco-chat-info-option:hover {
  background: var(--bg-secondary);
}

.aprisco-chat-info-option--danger {
  color: #ef4444;
}

.aprisco-chat-info-media {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}

/* New Message Modal */
.aprisco-new-message-modal__content {
  max-width: 480px;
}

.aprisco-new-message-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-new-message-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-new-message-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-new-message-modal__body {
  padding: 20px;
}

.aprisco-new-message-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

/* Recipient Suggestions */
.aprisco-recipient-suggestions {
  max-height: 200px;
  overflow-y: auto;
  margin-bottom: 16px;
}

.aprisco-recipient-suggestion {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
}

.aprisco-recipient-suggestion:hover {
  background: var(--bg-secondary);
}

.aprisco-recipient-suggestion__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.aprisco-recipient-suggestion__info {
  display: flex;
  flex-direction: column;
}

.aprisco-recipient-suggestion__name {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-recipient-suggestion__username {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Selected Recipient */
.aprisco-selected-recipient {
  margin-bottom: 16px;
}

.aprisco-selected-recipient__user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  background: var(--accent-color);
  border-radius: 20px;
  color: #fff;
}

.aprisco-selected-recipient__avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.aprisco-selected-recipient__name {
  font-size: 14px;
  font-weight: 500;
}

.aprisco-selected-recipient__remove {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  cursor: pointer;
  font-size: 14px;
}

/* Chat Options Modal */
.aprisco-chat-options-modal__content {
  max-width: 320px;
}

.aprisco-chat-options-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-chat-options-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-chat-options-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-chat-options-modal__body {
  padding: 12px;
}

.aprisco-chat-option {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 16px;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 15px;
  cursor: pointer;
  transition: background 0.2s;
  text-align: left;
}

.aprisco-chat-option:hover {
  background: var(--bg-secondary);
}

.aprisco-chat-option--danger {
  color: #ef4444;
}

.aprisco-chat-option__icon {
  font-size: 18px;
}

/* Confirm Modal */
.aprisco-confirm-modal__content {
  max-width: 400px;
  text-align: center;
}

.aprisco-confirm-modal__body {
  padding: 32px 24px;
}

.aprisco-confirm-modal__icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.aprisco-confirm-modal__title {
  margin: 0 0 8px;
  font-size: 20px;
  color: var(--text-primary);
}

.aprisco-confirm-modal__text {
  margin: 0;
  color: var(--text-secondary);
}

.aprisco-confirm-modal__actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid var(--border-color);
}

/* Mobile Responsive - Messages */
@media (max-width: 768px) {
  .aprisco-messages-layout {
    grid-template-columns: 1fr;
  }

  .aprisco-conversations-panel {
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    bottom: 60px;
    z-index: 10;
    transition: transform 0.3s;
  }

  .aprisco-conversations-panel--hidden {
    transform: translateX(-100%);
  }

  .aprisco-chat-panel {
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    bottom: 60px;
    z-index: 10;
  }

  .aprisco-chat-header__back {
    display: flex;
  }

  .aprisco-chat-info-panel {
    display: none;
  }

  .aprisco-message {
    max-width: 85%;
  }
}

@media (max-width: 1024px) {
  .aprisco-messages-layout {
    grid-template-columns: 320px 1fr;
  }

  .aprisco-chat-info-panel {
    display: none;
  }
}

/* ==================== MEDIA / GALLERY ==================== */

/* Upload Zone */
.aprisco-upload-zone {
  border: 2px dashed var(--border-color);
  background: transparent;
  transition: all 0.3s;
}

.aprisco-upload-zone--dragover {
  border-color: var(--accent-color);
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-upload-zone__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  text-align: center;
}

.aprisco-upload-zone__icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.aprisco-upload-zone__text {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-upload-zone__subtext {
  color: var(--text-secondary);
  margin-bottom: 16px;
}

.aprisco-upload-zone__hint {
  margin-top: 16px;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Gallery Grid */
.aprisco-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
}

.aprisco-gallery-item {
  position: relative;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  background: var(--bg-secondary);
  transition: transform 0.2s, box-shadow 0.2s;
}

.aprisco-gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

.aprisco-gallery-item__thumb {
  width: 100%;
  height: 100%;
  position: relative;
}

.aprisco-gallery-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aprisco-gallery-item__duration {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.aprisco-gallery-item__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #fff;
}

.aprisco-gallery-item__badge {
  position: absolute;
  top: 8px;
  left: 8px;
  background: var(--accent-color);
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

.aprisco-gallery-item__overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  opacity: 0;
  transition: opacity 0.2s;
}

.aprisco-gallery-item:hover .aprisco-gallery-item__overlay {
  opacity: 1;
}

.aprisco-gallery-item__name {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-gallery-item__size {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.7);
}

.aprisco-gallery-item__used {
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
}

/* Storage Info */
.aprisco-storage-info {
  padding: 8px 0;
}

.aprisco-storage-bar {
  height: 8px;
  background: var(--bg-secondary);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 8px;
}

.aprisco-storage-bar__fill {
  height: 100%;
  background: var(--accent-color);
  border-radius: 4px;
  transition: width 0.3s;
}

.aprisco-storage-bar__fill--warning {
  background: #f59e0b;
}

.aprisco-storage-bar__fill--danger {
  background: #ef4444;
}

.aprisco-storage-details {
  display: flex;
  justify-content: center;
  gap: 4px;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Tips List */
.aprisco-tips-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-tip {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.aprisco-tip__icon {
  font-size: 20px;
}

.aprisco-tip__content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-tip__content strong {
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-tip__content span {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Recent Activity */
.aprisco-recent-activity {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-activity-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.aprisco-activity-item__icon {
  font-size: 18px;
}

.aprisco-activity-item__content {
  flex: 1;
  min-width: 0;
}

.aprisco-activity-item__content p {
  margin: 0;
  font-size: 13px;
  color: var(--text-primary);
  line-height: 1.4;
}

.aprisco-activity-item__time {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Albums List */
.aprisco-albums-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-album-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
}

.aprisco-album-item:hover {
  background: var(--bg-secondary);
}

.aprisco-album-item__cover {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}

.aprisco-album-item__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aprisco-album-item__private {
  position: absolute;
  top: 2px;
  right: 2px;
  font-size: 10px;
}

.aprisco-album-item__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.aprisco-album-item__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-album-item__count {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Upload Modal */
.aprisco-upload-modal__content {
  max-width: 560px;
  width: 100%;
}

.aprisco-upload-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-upload-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-upload-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-upload-modal__body {
  padding: 20px;
  max-height: 60vh;
  overflow-y: auto;
}

.aprisco-upload-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

/* Upload Dropzone */
.aprisco-upload-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  border: 2px dashed var(--border-color);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
  text-align: center;
}

.aprisco-upload-dropzone:hover,
.aprisco-upload-dropzone.aprisco-upload-zone--dragover {
  border-color: var(--accent-color);
  background: rgba(79, 70, 229, 0.05);
}

.aprisco-upload-dropzone__icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.aprisco-upload-dropzone__text {
  margin: 0 0 8px;
  font-size: 16px;
  color: var(--text-primary);
}

.aprisco-upload-dropzone__hint {
  margin: 0;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Upload Preview */
.aprisco-upload-preview {
  margin-top: 20px;
}

.aprisco-upload-preview h4 {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-preview-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-preview-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-preview-item__thumb {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--bg-primary);
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-preview-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aprisco-preview-item__video-icon {
  font-size: 24px;
}

.aprisco-preview-item__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-preview-item__name {
  font-size: 14px;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-preview-item__size {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-preview-item__badge {
  display: inline-block;
  background: var(--accent-color);
  color: #fff;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.aprisco-preview-item__remove {
  background: none;
  border: none;
  color: var(--text-secondary);
  font-size: 16px;
  cursor: pointer;
  padding: 8px;
}

.aprisco-preview-item__remove:hover {
  color: #ef4444;
}

/* Upload Options */
.aprisco-upload-options {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--border-color);
}

/* Upload Progress */
.aprisco-upload-progress {
  margin-top: 20px;
}

.aprisco-upload-progress__bar {
  height: 8px;
  background: var(--bg-secondary);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 8px;
}

.aprisco-upload-progress__fill {
  height: 100%;
  background: var(--accent-color);
  border-radius: 4px;
  transition: width 0.2s;
}

.aprisco-upload-progress__text {
  display: block;
  font-size: 13px;
  color: var(--text-secondary);
  text-align: center;
}

/* Lightbox */
.aprisco-lightbox {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}

.aprisco-lightbox--open {
  display: flex;
}

.aprisco-lightbox__backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.95);
}

.aprisco-lightbox__content {
  position: relative;
  max-width: 90vw;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.aprisco-lightbox__close {
  position: absolute;
  top: -40px;
  right: 0;
  background: none;
  border: none;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  z-index: 10;
}

.aprisco-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.1);
  border: none;
  color: #fff;
  font-size: 48px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-lightbox__nav:hover {
  background: rgba(255, 255, 255, 0.2);
}

.aprisco-lightbox__nav--prev {
  left: -80px;
}

.aprisco-lightbox__nav--next {
  right: -80px;
}

.aprisco-lightbox__media {
  max-width: 100%;
  max-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-lightbox__image {
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 8px;
}

.aprisco-lightbox__video {
  max-width: 100%;
  max-height: 70vh;
  border-radius: 8px;
}

.aprisco-lightbox__info {
  margin-top: 16px;
  text-align: center;
  color: #fff;
}

.aprisco-lightbox__info-main h4 {
  margin: 0 0 4px;
  font-size: 16px;
}

.aprisco-lightbox__info-main span {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
}

.aprisco-lightbox__info-meta {
  margin-top: 8px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  gap: 16px;
  justify-content: center;
}

.aprisco-lightbox__actions {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  background: rgba(0, 0, 0, 0.8);
  padding: 12px 16px;
  border-radius: 12px;
}

.aprisco-lightbox__action {
  background: rgba(255, 255, 255, 0.1);
  border: none;
  color: #fff;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  transition: background 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-lightbox__action:hover {
  background: rgba(255, 255, 255, 0.2);
}

.aprisco-lightbox__action--danger:hover {
  background: rgba(239, 68, 68, 0.5);
}

/* Create Album Modal */
.aprisco-album-modal__content {
  max-width: 440px;
  width: 100%;
}

.aprisco-album-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-album-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-album-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-album-modal__body {
  padding: 20px;
}

.aprisco-album-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

/* Empty Text */
.aprisco-empty-text {
  text-align: center;
  color: var(--text-secondary);
  font-size: 14px;
  padding: 16px;
}

/* Mobile Responsive - Gallery */
@media (max-width: 768px) {
  .aprisco-gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 8px;
  }

  .aprisco-upload-zone__content {
    padding: 24px 16px;
  }

  .aprisco-upload-zone__icon {
    font-size: 36px;
  }

  .aprisco-upload-zone__text {
    font-size: 16px;
  }

  .aprisco-lightbox__nav {
    display: none;
  }

  .aprisco-lightbox__content {
    max-width: 100vw;
    max-height: 100vh;
    padding: 16px;
  }

  .aprisco-lightbox__close {
    top: 16px;
    right: 16px;
  }

  .aprisco-lightbox__actions {
    bottom: 16px;
    padding: 8px 12px;
  }

  .aprisco-lightbox__action {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }
}

/* ==================== POST MEDIA ==================== */

/* Media Preview in Create Post */
.aprisco-post-media-preview {
  margin-top: 12px;
}

.aprisco-media-preview {
  position: relative;
  display: inline-block;
  max-width: 100%;
  border-radius: 12px;
  overflow: hidden;
}

.aprisco-media-preview__image {
  max-width: 100%;
  max-height: 300px;
  border-radius: 12px;
  object-fit: cover;
}

.aprisco-media-preview__video {
  max-width: 100%;
  max-height: 300px;
  border-radius: 12px;
}

.aprisco-media-preview__badge {
  position: absolute;
  top: 8px;
  left: 8px;
  background: var(--accent-color);
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

.aprisco-media-preview__remove {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  background: rgba(0, 0, 0, 0.7);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.aprisco-media-preview__remove:hover {
  background: rgba(239, 68, 68, 0.9);
}

/* Post Media Display */
.aprisco-post__media {
  margin-top: 12px;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
}

.aprisco-post__image {
  width: 100%;
  max-height: 500px;
  object-fit: cover;
  cursor: pointer;
  transition: transform 0.2s;
}

.aprisco-post__image:hover {
  transform: scale(1.01);
}

.aprisco-post__video {
  width: 100%;
  max-height: 500px;
  border-radius: 12px;
}

.aprisco-post__media-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--accent-color);
  color: #fff;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
}

/* Image Overlay (simple lightbox) */
.aprisco-image-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-image-overlay__backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.95);
}

.aprisco-image-overlay__image {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 8px;
  z-index: 1;
}

.aprisco-image-overlay__close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  border-radius: 50%;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aprisco-image-overlay__close:hover {
  background: rgba(255, 255, 255, 0.2);
}

/* ==================== BOOKMARKS ==================== */

/* Bookmark Card */
.aprisco-bookmark-card {
  padding: 0;
  overflow: hidden;
}

.aprisco-bookmark-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-color);
}

.aprisco-bookmark-card__saved-info {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-bookmark-card__saved-icon {
  font-size: 16px;
}

.aprisco-bookmark-card__collection {
  background: var(--accent-color);
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
}

.aprisco-bookmark-card__actions {
  display: flex;
  gap: 4px;
}

.aprisco-bookmark-action {
  background: transparent;
  border: none;
  padding: 8px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.2s;
}

.aprisco-bookmark-action:hover {
  background: var(--bg-primary);
}

.aprisco-bookmark-card .aprisco-post {
  box-shadow: none;
  margin: 0;
}

.aprisco-bookmark-card__note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 12px 16px;
  background: rgba(79, 70, 229, 0.1);
  border-top: 1px solid var(--border-color);
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-bookmark-card__note-icon {
  font-size: 14px;
}

/* Bookmark Stats */
.aprisco-bookmark-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  text-align: center;
}

.aprisco-bookmark-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-bookmark-stat__value {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-bookmark-stat__label {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Hashtags Cloud */
.aprisco-hashtags-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-hashtag-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg-secondary);
  border-radius: 20px;
  font-size: 13px;
  color: var(--text-primary);
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-hashtag-chip:hover {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-hashtag-chip__count {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-hashtag-chip:hover .aprisco-hashtag-chip__count {
  color: rgba(255, 255, 255, 0.8);
}

/* Frequent Authors */
.aprisco-frequent-authors {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-frequent-author {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-frequent-author:hover {
  background: var(--bg-secondary);
}

.aprisco-frequent-author__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-frequent-author__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-frequent-author__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-frequent-author__count {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Collection Modal */
.aprisco-collection-modal__content {
  max-width: 440px;
  width: 100%;
}

.aprisco-collection-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-collection-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-collection-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-collection-modal__body {
  padding: 20px;
}

.aprisco-collection-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

/* Icon Picker */
.aprisco-icon-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-icon-option {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: var(--bg-secondary);
  border: 2px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-icon-option:hover {
  background: var(--bg-primary);
}

.aprisco-icon-option--selected {
  border-color: var(--accent-color);
  background: rgba(79, 70, 229, 0.1);
}

/* Move Modal */
.aprisco-move-modal__content {
  max-width: 400px;
  width: 100%;
}

.aprisco-move-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-move-modal__header h3 {
  margin: 0;
  font-size: 18px;
  color: var(--text-primary);
}

.aprisco-move-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-move-modal__body {
  padding: 12px;
  max-height: 400px;
  overflow-y: auto;
}

.aprisco-move-modal__actions {
  padding: 16px 20px;
  border-top: 1px solid var(--border-color);
}

.aprisco-move-collections {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-move-option {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 16px;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-align: left;
  transition: background 0.2s;
}

.aprisco-move-option:hover {
  background: var(--bg-secondary);
}

.aprisco-move-option__icon {
  font-size: 20px;
}

.aprisco-move-option__name {
  flex: 1;
  font-size: 15px;
  color: var(--text-primary);
}

.aprisco-move-option__count {
  font-size: 13px;
  color: var(--text-secondary);
}

/* ==================== HASHTAGS ==================== */

/* Hashtag Header */
.aprisco-hashtag-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px;
}

.aprisco-hashtag-header__info {
  flex: 1;
}

.aprisco-hashtag-header__title {
  margin: 0 0 8px;
  font-size: 32px;
  font-weight: 700;
  color: var(--text-primary);
  display: flex;
  align-items: baseline;
}

.aprisco-hashtag-header__hash {
  color: var(--accent-color);
  margin-right: 2px;
}

.aprisco-hashtag-header__stats {
  display: flex;
  gap: 16px;
  margin-bottom: 12px;
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-hashtag-header__stats strong {
  color: var(--text-primary);
}

.aprisco-hashtag-header__description {
  margin: 0;
  font-size: 15px;
  color: var(--text-secondary);
  line-height: 1.5;
}

.aprisco-hashtag-header__actions {
  display: flex;
  gap: 8px;
}

/* Hashtag Tabs */
.aprisco-hashtag-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 16px;
}

.aprisco-hashtag-tab {
  padding: 8px 16px;
  background: transparent;
  border: none;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-hashtag-tab:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.aprisco-hashtag-tab--active {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-hashtag-tab--active:hover {
  background: var(--accent-color);
  color: #fff;
}

/* Hashtag Link in Content */
.aprisco-hashtag {
  color: var(--accent-color);
  text-decoration: none;
  font-weight: 500;
}

.aprisco-hashtag:hover {
  text-decoration: underline;
}

.aprisco-hashtag--current {
  background: rgba(79, 70, 229, 0.2);
  padding: 2px 4px;
  border-radius: 4px;
}

/* Mention Link */
.aprisco-mention {
  color: var(--accent-color);
  text-decoration: none;
}

.aprisco-mention:hover {
  text-decoration: underline;
}

/* Related Hashtags */
.aprisco-related-hashtags {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-related-tag {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-related-tag:hover {
  background: var(--bg-primary);
}

.aprisco-related-tag__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--accent-color);
}

.aprisco-related-tag__count {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Top Contributors */
.aprisco-top-contributors {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-contributor {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-contributor:hover {
  background: var(--bg-secondary);
}

.aprisco-contributor__rank {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
}

.aprisco-contributor__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.aprisco-contributor__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-contributor__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-contributor__count {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Trending Hashtags */
.aprisco-trending-hashtags {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-trending-tag {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-trending-tag:hover {
  background: var(--bg-secondary);
}

.aprisco-trending-tag--current {
  background: rgba(79, 70, 229, 0.1);
  border: 1px solid var(--accent-color);
}

.aprisco-trending-tag__rank {
  width: 24px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary);
  text-align: center;
}

.aprisco-trending-tag__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-trending-tag__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-trending-tag__count {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-trending-tag__change {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-trending-tag__change--up {
  color: #10b981;
}

/* Followed Hashtags */
.aprisco-followed-hashtags {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-followed-tag {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-followed-tag:hover {
  background: var(--bg-secondary);
}

.aprisco-followed-tag--current {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-followed-tag__name {
  font-size: 14px;
  color: var(--accent-color);
  font-weight: 500;
}

.aprisco-followed-tag__badge {
  background: var(--accent-color);
  color: #fff;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
}

/* Empty Text */
.aprisco-empty-text {
  text-align: center;
  color: var(--text-secondary);
  font-size: 14px;
  padding: 16px;
}

/* Mobile Responsive - Bookmarks/Hashtags */
@media (max-width: 768px) {
  .aprisco-hashtag-header {
    flex-direction: column;
    gap: 16px;
    padding: 16px;
  }

  .aprisco-hashtag-header__title {
    font-size: 24px;
  }

  .aprisco-hashtag-header__actions {
    width: 100%;
  }

  .aprisco-hashtag-header__actions .aprisco-btn {
    flex: 1;
  }

  .aprisco-bookmark-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .aprisco-bookmark-stat__value {
    font-size: 20px;
  }
}

/* ========================================
   SETTINGS PAGE STYLES
   ======================================== */

/* Settings Layout */
.aprisco-settings-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
}

/* Settings Navigation */
.aprisco-settings-nav {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 16px;
  position: sticky;
  top: 100px;
  height: fit-content;
}

.aprisco-settings-nav__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  padding: 0 12px 16px;
  border-bottom: 1px solid var(--border-color);
  margin-bottom: 8px;
}

.aprisco-settings-menu {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-settings-menu__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-radius: 8px;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
  cursor: pointer;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}

.aprisco-settings-menu__item:hover {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.aprisco-settings-menu__item--active {
  background: rgba(79, 70, 229, 0.1);
  color: var(--accent-color);
}

.aprisco-settings-menu__icon {
  font-size: 18px;
  width: 24px;
  text-align: center;
}

.aprisco-settings-menu__item--danger {
  color: #ef4444;
}

.aprisco-settings-menu__item--danger:hover {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}

/* Settings Content */
.aprisco-settings-content {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 32px;
}

/* Settings Section */
.aprisco-settings-section {
  display: none;
}

.aprisco-settings-section--active {
  display: block;
}

.aprisco-settings-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-settings-description {
  color: var(--text-secondary);
  font-size: 14px;
  margin-bottom: 32px;
}

/* Settings Groups */
.aprisco-settings-group {
  margin-bottom: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-settings-group:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.aprisco-settings-group__title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
}

.aprisco-settings-group__description {
  color: var(--text-secondary);
  font-size: 13px;
  margin-bottom: 16px;
}

/* Settings Row */
.aprisco-settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-settings-row:last-child {
  border-bottom: none;
}

.aprisco-settings-row__info {
  flex: 1;
}

.aprisco-settings-row__label {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-settings-row__hint {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-settings-row__action {
  margin-left: 16px;
}

/* Toggle Switch */
.aprisco-toggle {
  position: relative;
  width: 48px;
  height: 26px;
  background: var(--bg-secondary);
  border-radius: 13px;
  cursor: pointer;
  transition: background 0.3s;
}

.aprisco-toggle input {
  display: none;
}

.aprisco-toggle__slider {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.3s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.aprisco-toggle input:checked + .aprisco-toggle__slider {
  transform: translateX(22px);
}

.aprisco-toggle input:checked ~ .aprisco-toggle {
  background: var(--accent-color);
}

.aprisco-toggle:has(input:checked) {
  background: var(--accent-color);
}

/* Theme Options */
.aprisco-theme-options {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.aprisco-theme-option {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
  border-radius: 12px;
  border: 2px solid var(--border-color);
  background: var(--bg-secondary);
  cursor: pointer;
  transition: all 0.2s;
  min-width: 100px;
}

.aprisco-theme-option:hover {
  border-color: var(--accent-color);
}

.aprisco-theme-option--active {
  border-color: var(--accent-color);
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-theme-option__icon {
  font-size: 32px;
}

.aprisco-theme-option__label {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

/* Accent Color Options */
.aprisco-accent-options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.aprisco-accent-option {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  border: 3px solid transparent;
  transition: all 0.2s;
  position: relative;
}

.aprisco-accent-option:hover {
  transform: scale(1.1);
}

.aprisco-accent-option--active {
  border-color: var(--text-primary);
}

.aprisco-accent-option--active::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 16px;
  font-weight: bold;
}

.aprisco-accent-option--purple { background: #8b5cf6; }
.aprisco-accent-option--blue { background: #3b82f6; }
.aprisco-accent-option--green { background: #10b981; }
.aprisco-accent-option--orange { background: #f59e0b; }
.aprisco-accent-option--pink { background: #ec4899; }
.aprisco-accent-option--red { background: #ef4444; }

/* Font Size Slider */
.aprisco-font-slider {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
}

.aprisco-font-slider__label {
  font-size: 12px;
  color: var(--text-secondary);
  min-width: 40px;
}

.aprisco-font-slider__input {
  flex: 1;
  -webkit-appearance: none;
  appearance: none;
  height: 6px;
  background: var(--bg-secondary);
  border-radius: 3px;
  outline: none;
}

.aprisco-font-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: var(--accent-color);
  border-radius: 50%;
  cursor: pointer;
  transition: transform 0.2s;
}

.aprisco-font-slider__input::-webkit-slider-thumb:hover {
  transform: scale(1.1);
}

.aprisco-font-slider__value {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  min-width: 45px;
  text-align: right;
}

/* Sessions List */
.aprisco-sessions-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-session-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
}

.aprisco-session-item--current {
  border: 1px solid var(--accent-color);
}

.aprisco-session-info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-session-icon {
  font-size: 24px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  border-radius: 8px;
}

.aprisco-session-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.aprisco-session-device {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-session-current-badge {
  font-size: 10px;
  background: var(--accent-color);
  color: #fff;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 600;
}

.aprisco-session-location {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-session-time {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Blocked Users List */
.aprisco-blocked-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-blocked-user {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-blocked-user__info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-blocked-user__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--bg-card);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}

.aprisco-blocked-user__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-blocked-user__username {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Data Stats */
.aprisco-data-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.aprisco-data-stat {
  padding: 20px;
  background: var(--bg-secondary);
  border-radius: 12px;
  text-align: center;
}

.aprisco-data-stat__value {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 4px;
}

.aprisco-data-stat__label {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Danger Zone */
.aprisco-danger-zone {
  background: rgba(239, 68, 68, 0.05);
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 12px;
  padding: 24px;
}

.aprisco-danger-zone__title {
  font-size: 16px;
  font-weight: 600;
  color: #ef4444;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-danger-zone__description {
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 16px;
}

.aprisco-danger-zone__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* Username/Email Edit Row */
.aprisco-edit-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-edit-row .aprisco-input {
  flex: 1;
}

.aprisco-edit-row .aprisco-btn {
  flex-shrink: 0;
}

/* Form Row Inline */
.aprisco-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

/* Settings Actions */
.aprisco-settings-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--border-color);
}

/* Notification Categories */
.aprisco-notification-categories {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-notification-category {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-notification-category__info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-notification-category__icon {
  font-size: 20px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  border-radius: 8px;
}

.aprisco-notification-category__label {
  font-size: 14px;
  color: var(--text-primary);
}

/* 2FA Section */
.aprisco-2fa-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  background: var(--bg-secondary);
  border-radius: 12px;
}

.aprisco-2fa-info {
  display: flex;
  align-items: center;
  gap: 16px;
}

.aprisco-2fa-icon {
  font-size: 32px;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  border-radius: 12px;
}

.aprisco-2fa-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-2fa-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-2fa-status {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-2fa-status--enabled {
  color: #10b981;
}

/* Password Form */
.aprisco-password-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 400px;
}

/* Confirm Modal */
.aprisco-confirm-modal__content {
  max-width: 400px;
  text-align: center;
  padding: 32px;
}

.aprisco-confirm-modal__icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.aprisco-confirm-modal__title {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-confirm-modal__text {
  color: var(--text-secondary);
  font-size: 14px;
  margin-bottom: 24px;
}

.aprisco-confirm-modal__actions {
  display: flex;
  gap: 12px;
  justify-content: center;
}

/* Input with Icon */
.aprisco-input-icon {
  position: relative;
}

.aprisco-input-icon .aprisco-input {
  padding-right: 40px;
}

.aprisco-input-icon__btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 8px;
  cursor: pointer;
  color: var(--text-secondary);
  font-size: 16px;
}

.aprisco-input-icon__btn:hover {
  color: var(--text-primary);
}

/* Settings Saved Toast Animation */
@keyframes settingsSaved {
  0% { transform: translateY(20px); opacity: 0; }
  20% { transform: translateY(0); opacity: 1; }
  80% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(-20px); opacity: 0; }
}

.aprisco-settings-saved {
  position: fixed;
  bottom: 100px;
  left: 50%;
  transform: translateX(-50%);
  background: #10b981;
  color: #fff;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  animation: settingsSaved 2s ease-in-out forwards;
  z-index: 1000;
}

/* Mobile Responsive - Settings */
@media (max-width: 900px) {
  .aprisco-settings-layout {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .aprisco-settings-nav {
    position: static;
  }

  .aprisco-settings-menu {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
  }

  .aprisco-settings-menu__item {
    flex: 1;
    min-width: 100px;
    justify-content: center;
    padding: 10px 12px;
    font-size: 12px;
  }

  .aprisco-settings-menu__icon {
    font-size: 16px;
  }

  .aprisco-settings-content {
    padding: 20px;
  }

  .aprisco-settings-title {
    font-size: 20px;
  }

  .aprisco-form-row {
    grid-template-columns: 1fr;
  }

  .aprisco-theme-options {
    flex-direction: column;
  }

  .aprisco-theme-option {
    flex-direction: row;
    min-width: auto;
  }

  .aprisco-session-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .aprisco-danger-zone__actions {
    flex-direction: column;
  }

  .aprisco-danger-zone__actions .aprisco-btn {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .aprisco-settings-menu {
    flex-direction: column;
  }

  .aprisco-settings-menu__item {
    min-width: auto;
    justify-content: flex-start;
  }

  .aprisco-settings-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .aprisco-settings-row__action {
    margin-left: 0;
    width: 100%;
  }

  .aprisco-edit-row {
    flex-direction: column;
  }

  .aprisco-edit-row .aprisco-btn {
    width: 100%;
  }

  .aprisco-2fa-section {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }

  .aprisco-2fa-info {
    flex-direction: column;
  }

  .aprisco-data-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .aprisco-accent-options {
    justify-content: center;
  }
}

/* ========================================
   PROJECTS PAGE STYLES
   ======================================== */

/* Projects Toolbar */
.aprisco-projects-toolbar {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px;
}

.aprisco-projects-toolbar .aprisco-search-box {
  flex: 1;
}

/* Featured Projects Grid */
.aprisco-featured-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
}

.aprisco-featured-project {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-featured-project:hover {
  background: rgba(79, 70, 229, 0.1);
  transform: translateY(-2px);
}

.aprisco-featured-project__badge {
  font-size: 24px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  border-radius: 10px;
}

.aprisco-featured-project__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-featured-project__stats {
  font-size: 12px;
  color: var(--text-secondary);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* Projects List */
.aprisco-projects-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

/* Project Card */
.aprisco-project-card {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: all 0.2s;
  border: 1px solid transparent;
}

.aprisco-project-card:hover {
  border-color: var(--accent-color);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.aprisco-project-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.aprisco-project-card__badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.aprisco-project-type-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
}

.aprisco-project-status-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
}

.aprisco-project-featured-badge {
  color: #f59e0b;
  font-size: 12px;
}

.aprisco-project-card__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
  line-height: 1.3;
}

.aprisco-project-card__description {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 16px;
}

.aprisco-project-card__progress {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.aprisco-project-card__progress-bar {
  flex: 1;
  height: 8px;
  background: var(--bg-secondary);
  border-radius: 4px;
  overflow: hidden;
}

.aprisco-project-card__progress-fill {
  height: 100%;
  background: var(--accent-color);
  border-radius: 4px;
  transition: width 0.3s;
}

.aprisco-project-card__progress-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--accent-color);
  min-width: 40px;
}

.aprisco-project-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-project-card__meta-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-project-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.aprisco-project-tag {
  padding: 4px 10px;
  background: var(--bg-secondary);
  border-radius: 12px;
  font-size: 12px;
  color: var(--accent-color);
  text-decoration: none;
}

.aprisco-project-tag:hover {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-project-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 12px;
  border-top: 1px solid var(--border-color);
}

.aprisco-project-card__owner {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Global Stats */
.aprisco-project-global-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.aprisco-project-global-stat {
  text-align: center;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-project-global-stat__value {
  display: block;
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-project-global-stat__label {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Top Contributors */
.aprisco-top-contributors {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-top-contributor {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-top-contributor__rank {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
}

.aprisco-top-contributor__info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.aprisco-top-contributor__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-top-contributor__stats {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Need Help Projects */
.aprisco-need-help-projects {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-need-help-project {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-need-help-project:hover {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-need-help-project__icon {
  font-size: 20px;
}

.aprisco-need-help-project__info {
  display: flex;
  flex-direction: column;
}

.aprisco-need-help-project__title {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-need-help-project__need {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Contribution Types Widget */
.aprisco-contribution-types {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.aprisco-contribution-type {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  background: var(--bg-secondary);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-contribution-type__icon {
  font-size: 16px;
}

/* ========================================
   SINGLE PROJECT PAGE STYLES
   ======================================== */

/* Wide Layout */
.aprisco-layout--wide {
  max-width: 1400px;
}

/* Project Header */
.aprisco-project-header {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 24px;
}

.aprisco-project-header__top {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
}

.aprisco-project-header__title {
  font-size: 28px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-project-header__description {
  font-size: 15px;
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 16px;
}

.aprisco-project-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}

.aprisco-project-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-project-meta__icon {
  font-size: 16px;
}

.aprisco-project-header__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Project Stats Grid */
.aprisco-project-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.aprisco-project-stat-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: var(--bg-card);
  border-radius: 12px;
}

.aprisco-project-stat-card__icon {
  font-size: 32px;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border-radius: 12px;
}

.aprisco-project-stat-card__content {
  display: flex;
  flex-direction: column;
}

.aprisco-project-stat-card__value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
}

.aprisco-project-stat-card__label {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Progress Bar Large */
.aprisco-project-progress-bar {
  height: 12px;
  background: var(--bg-secondary);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 8px;
}

.aprisco-project-progress-bar__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-color), #a78bfa);
  border-radius: 6px;
  transition: width 0.5s ease;
}

.aprisco-project-progress-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--text-secondary);
}

/* Progress Circle Widget */
.aprisco-project-progress-widget {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.aprisco-progress-circle {
  position: relative;
  width: 100px;
  height: 100px;
}

.aprisco-progress-circle svg {
  transform: rotate(-90deg);
  width: 100%;
  height: 100%;
}

.aprisco-progress-circle__bg {
  fill: none;
  stroke: var(--bg-secondary);
  stroke-width: 8;
}

.aprisco-progress-circle__fill {
  fill: none;
  stroke: var(--accent-color);
  stroke-width: 8;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.5s ease;
}

.aprisco-progress-circle__value {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
}

.aprisco-progress-stats {
  display: flex;
  gap: 24px;
}

.aprisco-progress-stat {
  text-align: center;
}

.aprisco-progress-stat__value {
  display: block;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-progress-stat__label {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Milestones */
.aprisco-milestones {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.aprisco-milestone {
  display: flex;
  gap: 16px;
  padding: 16px 0;
  position: relative;
}

.aprisco-milestone:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 11px;
  top: 40px;
  width: 2px;
  height: calc(100% - 24px);
  background: var(--border-color);
}

.aprisco-milestone--completed::after {
  background: var(--accent-color);
}

.aprisco-milestone__marker {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 12px;
  background: var(--bg-secondary);
  color: var(--text-secondary);
  z-index: 1;
}

.aprisco-milestone--completed .aprisco-milestone__marker {
  background: var(--accent-color);
  color: #fff;
}

.aprisco-milestone--in_progress .aprisco-milestone__marker {
  background: #f59e0b;
  color: #fff;
}

.aprisco-milestone__content {
  flex: 1;
}

.aprisco-milestone__title {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-milestone--completed .aprisco-milestone__title {
  text-decoration: line-through;
  opacity: 0.7;
}

.aprisco-milestone__date {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Activity Feed */
.aprisco-activity-feed {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-activity-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-activity-item__content {
  flex: 1;
}

.aprisco-activity-item__user {
  font-weight: 500;
  color: var(--text-primary);
  margin-right: 4px;
}

.aprisco-activity-item__description {
  color: var(--text-secondary);
  font-size: 14px;
}

.aprisco-activity-item__time {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Contribution Types Grid */
.aprisco-contribution-types-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
}

.aprisco-contribution-type-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
}

.aprisco-contribution-type-card__icon {
  font-size: 28px;
}

.aprisco-contribution-type-card__label {
  font-size: 13px;
  color: var(--text-primary);
}

/* Project Tabs */
.aprisco-project-tab {
  display: none;
}

.aprisco-project-tab--active {
  display: block;
}

/* Tasks List */
.aprisco-tasks-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-tasks-actions {
  display: flex;
  gap: 12px;
}

.aprisco-tasks-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-task-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-task-item:hover {
  background: rgba(79, 70, 229, 0.05);
}

.aprisco-task-item__checkbox input {
  width: 20px;
  height: 20px;
  accent-color: var(--accent-color);
}

.aprisco-task-item__content {
  flex: 1;
}

.aprisco-task-item__title {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 6px;
}

.aprisco-task-item__title--completed {
  text-decoration: line-through;
  opacity: 0.6;
}

.aprisco-task-item__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-task-type-badge {
  font-size: 11px;
  padding: 2px 8px;
  background: var(--bg-card);
  border-radius: 4px;
  color: var(--text-secondary);
}

.aprisco-task-priority-badge {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 4px;
  color: #fff;
}

.aprisco-task-priority-badge--low { background: #6b7280; }
.aprisco-task-priority-badge--medium { background: #3b82f6; }
.aprisco-task-priority-badge--high { background: #f59e0b; }
.aprisco-task-priority-badge--urgent { background: #ef4444; }

.aprisco-task-points {
  font-size: 11px;
  color: var(--accent-color);
  font-weight: 600;
}

.aprisco-task-item__assignee {
  display: flex;
  align-items: center;
}

.aprisco-task-unassigned {
  font-size: 12px;
  color: var(--text-secondary);
  padding: 4px 12px;
  background: var(--bg-card);
  border-radius: 12px;
}

/* Contributors List */
.aprisco-contributors-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.aprisco-ownership-section {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-ownership-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
}

.aprisco-ownership-chart {
  display: flex;
  gap: 24px;
  align-items: center;
}

.aprisco-ownership-pie {
  width: 120px;
  height: 120px;
}

.aprisco-ownership-pie svg {
  transform: rotate(-90deg);
}

.aprisco-ownership-legend {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-ownership-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-ownership-legend-color {
  width: 12px;
  height: 12px;
  border-radius: 3px;
}

.aprisco-ownership-legend-name {
  flex: 1;
  font-size: 13px;
  color: var(--text-primary);
}

.aprisco-ownership-legend-value {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
}

.aprisco-contributors-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-contributor-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
}

.aprisco-contributor-item__info {
  flex: 1;
}

.aprisco-contributor-item__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-contributor-badge {
  font-size: 10px;
  padding: 2px 8px;
  background: var(--accent-color);
  color: #fff;
  border-radius: 4px;
  font-weight: 600;
}

.aprisco-contributor-item__stats {
  font-size: 12px;
  color: var(--text-secondary);
  margin-top: 4px;
}

.aprisco-contributor-item__ownership {
  text-align: right;
}

.aprisco-contributor-item__ownership-value {
  display: block;
  font-size: 18px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-contributor-item__ownership-label {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Leaderboard */
.aprisco-leaderboard {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-leaderboard-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-leaderboard-item__rank {
  width: 24px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent-color);
}

.aprisco-leaderboard-item__info {
  flex: 1;
}

.aprisco-leaderboard-item__name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-leaderboard-item__role {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-leaderboard-item__points {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-color);
}

/* Project Owner Card */
.aprisco-project-owner-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}

.aprisco-project-owner-card__info {
  display: flex;
  flex-direction: column;
}

.aprisco-project-owner-card__name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-project-owner-card__role {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Related Projects */
.aprisco-related-projects {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.aprisco-related-project {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-related-project:hover {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-related-project__icon {
  font-size: 20px;
}

.aprisco-related-project__info {
  flex: 1;
}

.aprisco-related-project__title {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-related-project__progress {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Project Actions Sidebar */
.aprisco-project-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Discussion */
.aprisco-discussion-header {
  margin-bottom: 16px;
}

.aprisco-new-discussion {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-discussion-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Files List */
.aprisco-files-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-files-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Activity Timeline */
.aprisco-activity-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-left: 24px;
  border-left: 2px solid var(--border-color);
}

.aprisco-activity-timeline .aprisco-activity-item {
  position: relative;
  margin-left: -12px;
}

.aprisco-activity-timeline .aprisco-activity-item::before {
  content: '';
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: var(--accent-color);
  border-radius: 50%;
  border: 2px solid var(--bg-card);
}

/* Project Modals */
.aprisco-project-modal__content {
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
}

.aprisco-project-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-project-modal__header h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-project-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 4px;
}

.aprisco-project-modal__body {
  padding: 24px;
}

.aprisco-project-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid var(--border-color);
}

/* Checkbox Grid */
.aprisco-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}

/* Join Project Modal */
.aprisco-join-modal__content {
  max-width: 500px;
}

.aprisco-join-modal__header,
.aprisco-join-modal__body,
.aprisco-join-modal__actions {
  padding: 20px 24px;
}

.aprisco-join-modal__header {
  border-bottom: 1px solid var(--border-color);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aprisco-join-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-join-modal__actions {
  border-top: 1px solid var(--border-color);
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.aprisco-join-project-info {
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 8px;
  margin-bottom: 20px;
}

.aprisco-join-project-info h4 {
  font-size: 16px;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-join-project-info p {
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-stake-section {
  padding: 16px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.2);
  border-radius: 8px;
  margin-top: 16px;
}

.aprisco-stake-info {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.aprisco-stake-icon {
  font-size: 24px;
}

.aprisco-stake-details {
  display: flex;
  flex-direction: column;
}

.aprisco-stake-label {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-stake-value {
  font-size: 18px;
  font-weight: 700;
  color: #f59e0b;
}

.aprisco-stake-hint {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
}

/* Task Modal */
.aprisco-task-modal__content {
  max-width: 500px;
}

.aprisco-task-modal__header,
.aprisco-task-modal__body,
.aprisco-task-modal__actions {
  padding: 20px 24px;
}

.aprisco-task-modal__header {
  border-bottom: 1px solid var(--border-color);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aprisco-task-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-task-modal__actions {
  border-top: 1px solid var(--border-color);
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

/* Task Detail Modal */
.aprisco-task-detail-modal__content {
  max-width: 600px;
}

.aprisco-task-detail-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-task-detail-badges {
  display: flex;
  gap: 8px;
}

.aprisco-task-status-badge {
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  background: var(--accent-color);
}

.aprisco-task-detail-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-task-detail-modal__body {
  padding: 24px;
}

.aprisco-task-detail-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-task-detail-description {
  font-size: 14px;
  color: var(--text-secondary);
  margin-bottom: 20px;
}

.aprisco-task-detail-meta {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 8px;
  margin-bottom: 20px;
}

.aprisco-task-detail-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-task-detail-meta-label {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-task-detail-meta-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-task-detail-actions {
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
}

.aprisco-task-comments h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-task-new-comment {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
}

/* Contribution Form */
.aprisco-contribution-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-contribution-preview {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-contribution-preview__label {
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-contribution-preview__value {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-color);
}

/* Contribution Item */
.aprisco-contribution-item {
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
  border-left: 3px solid var(--border-color);
}

.aprisco-contribution-item--approved {
  border-left-color: #10b981;
}

.aprisco-contribution-item--pending {
  border-left-color: #f59e0b;
}

.aprisco-contribution-item--rejected {
  border-left-color: #ef4444;
  opacity: 0.7;
}

.aprisco-contribution-item__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.aprisco-contribution-status-badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
}

.aprisco-contribution-status-badge--approved {
  background: #10b981;
  color: #fff;
}

.aprisco-contribution-status-badge--pending {
  background: #f59e0b;
  color: #fff;
}

.aprisco-contribution-status-badge--rejected {
  background: #ef4444;
  color: #fff;
}

.aprisco-contribution-item__description {
  font-size: 14px;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-contribution-item__footer {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-contribution-item__points {
  font-weight: 600;
  color: var(--accent-color);
}

/* Mobile Responsive - Projects */
@media (max-width: 768px) {
  .aprisco-projects-toolbar {
    flex-direction: column;
  }

  .aprisco-projects-list {
    grid-template-columns: 1fr;
  }

  .aprisco-featured-grid {
    grid-template-columns: 1fr;
  }

  .aprisco-project-header__title {
    font-size: 22px;
  }

  .aprisco-project-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .aprisco-ownership-chart {
    flex-direction: column;
    align-items: center;
  }

  .aprisco-ownership-pie {
    width: 100px;
    height: 100px;
  }

  .aprisco-task-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .aprisco-task-item__assignee {
    align-self: flex-end;
  }

  .aprisco-contributor-item {
    flex-direction: column;
    text-align: center;
  }

  .aprisco-contributor-item__ownership {
    text-align: center;
  }

  .aprisco-task-detail-meta {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   ARBITRATION PAGE STYLES
   ======================================== */

/* My Disputes Summary */
.aprisco-my-disputes-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.aprisco-my-dispute-stat {
  text-align: center;
  padding: 12px 8px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-my-dispute-stat__value {
  display: block;
  font-size: 20px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-my-dispute-stat__label {
  font-size: 11px;
  color: var(--text-secondary);
}

/* AI Banner */
.aprisco-ai-banner {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px;
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.1), rgba(139, 92, 246, 0.1));
  border: 1px solid rgba(79, 70, 229, 0.2);
}

.aprisco-ai-banner__icon {
  font-size: 48px;
  flex-shrink: 0;
}

.aprisco-ai-banner__content {
  flex: 1;
}

.aprisco-ai-banner__title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-ai-banner__description {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin: 0;
}

/* Arbitration Stats */
.aprisco-arbitration-stats {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-arbitration-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-arbitration-stat__value {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent-color);
}

.aprisco-arbitration-stat__label {
  font-size: 13px;
  color: var(--text-secondary);
}

/* How It Works */
.aprisco-how-it-works {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-step {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.aprisco-step__number {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-color);
  color: #fff;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 600;
  flex-shrink: 0;
}

.aprisco-step__content {
  display: flex;
  flex-direction: column;
}

.aprisco-step__title {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-step__description {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Dispute Types Info */
.aprisco-dispute-types-info {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-dispute-type-info {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-dispute-type-info__icon {
  font-size: 20px;
}

.aprisco-dispute-type-info__content {
  display: flex;
  flex-direction: column;
}

.aprisco-dispute-type-info__title {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-dispute-type-info__desc {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Rules List */
.aprisco-rules-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.aprisco-rules-list li {
  padding: 8px 0;
  border-bottom: 1px solid var(--border-color);
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-rules-list li:last-child {
  border-bottom: none;
}

/* Disputes List */
.aprisco-disputes-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Dispute Card */
.aprisco-dispute-card {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: all 0.2s;
  border: 1px solid transparent;
}

.aprisco-dispute-card:hover {
  border-color: var(--accent-color);
  transform: translateY(-2px);
}

.aprisco-dispute-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.aprisco-dispute-card__badges {
  display: flex;
  gap: 8px;
}

.aprisco-dispute-type-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
}

.aprisco-dispute-status-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
}

.aprisco-dispute-id {
  font-size: 12px;
  color: var(--text-secondary);
  font-family: monospace;
}

.aprisco-dispute-card__title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-dispute-card__description {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 16px;
}

.aprisco-dispute-card__parties {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
}

.aprisco-dispute-party {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.aprisco-dispute-party__role {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-dispute-party__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-dispute-vs {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-color);
  padding: 4px 8px;
  background: rgba(79, 70, 229, 0.1);
  border-radius: 4px;
}

.aprisco-dispute-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-dispute-card__meta-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-dispute-card__meta-item--deadline {
  color: #f59e0b;
}

.aprisco-dispute-card__verdict {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 6px;
  border: 1px solid;
}

.aprisco-dispute-card__verdict-icon {
  font-size: 16px;
}

.aprisco-dispute-card__verdict-text {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
}

/* New Dispute Modal */
.aprisco-dispute-modal__content {
  max-width: 650px;
  max-height: 90vh;
  overflow-y: auto;
}

.aprisco-dispute-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-dispute-modal__header h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-dispute-modal__close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--text-secondary);
  cursor: pointer;
}

.aprisco-dispute-modal__body {
  padding: 24px;
}

.aprisco-dispute-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid var(--border-color);
}

/* Dispute Steps Indicator */
.aprisco-dispute-steps {
  display: flex;
  justify-content: space-between;
  margin-bottom: 32px;
  position: relative;
}

.aprisco-dispute-steps::before {
  content: '';
  position: absolute;
  top: 14px;
  left: 40px;
  right: 40px;
  height: 2px;
  background: var(--border-color);
}

.aprisco-dispute-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  position: relative;
  z-index: 1;
}

.aprisco-dispute-step__number {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border: 2px solid var(--border-color);
  border-radius: 50%;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary);
}

.aprisco-dispute-step--active .aprisco-dispute-step__number {
  background: var(--accent-color);
  border-color: var(--accent-color);
  color: #fff;
}

.aprisco-dispute-step--completed .aprisco-dispute-step__number {
  background: #10b981;
  border-color: #10b981;
  color: #fff;
}

.aprisco-dispute-step__label {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-dispute-step--active .aprisco-dispute-step__label {
  color: var(--accent-color);
  font-weight: 500;
}

/* Dispute Form Steps */
.aprisco-dispute-form-step {
  display: none;
}

.aprisco-dispute-form-step--active {
  display: block;
}

.aprisco-dispute-form-step h4 {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 20px;
}

/* Dispute Type Options */
.aprisco-dispute-type-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-dispute-type-option {
  cursor: pointer;
}

.aprisco-dispute-type-option input {
  display: none;
}

.aprisco-dispute-type-option__content {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px;
  background: var(--bg-secondary);
  border: 2px solid transparent;
  border-radius: 10px;
  transition: all 0.2s;
}

.aprisco-dispute-type-option:hover .aprisco-dispute-type-option__content {
  border-color: var(--accent-color);
}

.aprisco-dispute-type-option input:checked + .aprisco-dispute-type-option__content {
  border-color: var(--accent-color);
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-dispute-type-option__icon {
  font-size: 24px;
  flex-shrink: 0;
}

.aprisco-dispute-type-option__title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-dispute-type-option__desc {
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.4;
}

/* Evidence Items */
.aprisco-evidence-item {
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
  margin-bottom: 12px;
}

.aprisco-evidence-item .aprisco-form-group {
  margin-bottom: 12px;
}

.aprisco-evidence-item .aprisco-form-group:last-of-type {
  margin-bottom: 0;
}

/* Dispute Review */
.aprisco-dispute-review {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px;
  background: var(--bg-secondary);
  border-radius: 10px;
  margin-bottom: 20px;
}

.aprisco-dispute-review__section {
  display: flex;
  gap: 12px;
}

.aprisco-dispute-review__section--full {
  flex-direction: column;
}

.aprisco-dispute-review__label {
  font-size: 13px;
  color: var(--text-secondary);
  min-width: 80px;
}

.aprisco-dispute-review__value {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-dispute-review__text {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.5;
  margin: 0;
}

/* Dispute Fee */
.aprisco-dispute-fee {
  padding: 16px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.2);
  border-radius: 10px;
  margin-bottom: 20px;
}

.aprisco-dispute-fee__info {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.aprisco-dispute-fee__icon {
  font-size: 24px;
}

.aprisco-dispute-fee__details {
  display: flex;
  flex-direction: column;
}

.aprisco-dispute-fee__label {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-dispute-fee__value {
  font-size: 18px;
  font-weight: 700;
  color: #f59e0b;
}

.aprisco-dispute-fee__note {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
}

/* ========================================
   SINGLE DISPUTE PAGE STYLES
   ======================================== */

/* Dispute Header */
.aprisco-dispute-header {
  background: var(--bg-card);
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 24px;
}

.aprisco-dispute-header__top {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-dispute-header__title {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-dispute-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.aprisco-dispute-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-dispute-meta a {
  color: var(--accent-color);
  text-decoration: none;
}

.aprisco-dispute-meta a:hover {
  text-decoration: underline;
}

/* Dispute Status Widget */
.aprisco-dispute-status-widget {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.aprisco-dispute-current-status {
  text-align: center;
}

.aprisco-dispute-status-desc {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 8px 0 0;
}

/* Status Timeline */
.aprisco-status-timeline-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  opacity: 0.5;
}

.aprisco-status-timeline-item--completed {
  opacity: 1;
}

.aprisco-status-timeline-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--border-color);
}

.aprisco-status-timeline-item--completed .aprisco-status-timeline-dot {
  background: var(--accent-color);
}

.aprisco-status-timeline-label {
  font-size: 13px;
  color: var(--text-secondary);
}

/* Dispute Parties Cards */
.aprisco-dispute-party-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
  margin-bottom: 8px;
}

.aprisco-dispute-party-info {
  display: flex;
  flex-direction: column;
}

.aprisco-dispute-party-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-dispute-party-role {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-dispute-vs-separator {
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent-color);
  padding: 8px 0;
}

/* Dispute Tabs */
.aprisco-dispute-tab {
  display: none;
}

.aprisco-dispute-tab--active {
  display: block;
}

/* Dispute Description */
.aprisco-dispute-description,
.aprisco-dispute-resolution {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.6;
}

/* Response Cards */
.aprisco-response-card {
  margin-bottom: 20px;
}

.aprisco-response-card--claimant {
  border-left: 4px solid #10b981;
}

.aprisco-response-card--respondent {
  border-left: 4px solid #f59e0b;
}

.aprisco-response-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-response-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aprisco-response-author-info {
  display: flex;
  flex-direction: column;
}

.aprisco-response-author-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-response-author-role {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-response-date {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-response-content {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.6;
}

/* AI Analysis */
.aprisco-ai-analysis {
  border: 1px solid rgba(79, 70, 229, 0.2);
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.05), rgba(139, 92, 246, 0.05));
}

.aprisco-ai-analysis-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.aprisco-ai-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--accent-color);
  border-radius: 20px;
}

.aprisco-ai-badge__icon {
  font-size: 20px;
}

.aprisco-ai-badge__text {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}

.aprisco-ai-analysis-date {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-ai-analysis-section {
  margin-bottom: 24px;
}

.aprisco-ai-analysis-section:last-child {
  margin-bottom: 0;
}

.aprisco-ai-analysis-section h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--accent-color);
  margin-bottom: 12px;
}

.aprisco-ai-analysis-section p {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.6;
  margin: 0;
}

.aprisco-ai-analysis-section ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.aprisco-ai-analysis-section li {
  padding: 8px 0;
  padding-left: 24px;
  position: relative;
  font-size: 14px;
  color: var(--text-primary);
  border-bottom: 1px solid var(--border-color);
}

.aprisco-ai-analysis-section li:last-child {
  border-bottom: none;
}

.aprisco-ai-analysis-section li::before {
  content: '•';
  position: absolute;
  left: 8px;
  color: var(--accent-color);
}

/* Verdict */
.aprisco-verdict {
  text-align: center;
}

.aprisco-verdict-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.aprisco-verdict-icon {
  font-size: 48px;
}

.aprisco-verdict-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
}

.aprisco-verdict-result {
  padding: 20px;
  background: var(--bg-secondary);
  border-radius: 10px;
  margin-bottom: 24px;
}

.aprisco-verdict-label {
  display: block;
  font-size: 12px;
  color: var(--text-secondary);
  margin-bottom: 4px;
}

.aprisco-verdict-value {
  font-size: 24px;
  font-weight: 700;
}

.aprisco-verdict-explanation {
  text-align: left;
  margin-bottom: 24px;
}

.aprisco-verdict-explanation h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-verdict-explanation p {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.6;
}

.aprisco-verdict-actions {
  text-align: left;
}

.aprisco-verdict-actions h4,
.aprisco-verdict-penalties h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-verdict-actions ul,
.aprisco-verdict-penalties ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.aprisco-verdict-actions li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 6px;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--text-primary);
}

.aprisco-verdict-actions li::before {
  content: '✓';
  color: #10b981;
  font-weight: bold;
}

.aprisco-verdict-penalties {
  text-align: left;
  margin-top: 24px;
}

.aprisco-verdict-penalties li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  background: rgba(239, 68, 68, 0.1);
  border-radius: 6px;
  margin-bottom: 8px;
  font-size: 14px;
  color: #ef4444;
}

/* Pending Decision */
.aprisco-pending-decision {
  text-align: center;
  padding: 40px;
}

.aprisco-pending-decision__icon {
  font-size: 64px;
  margin-bottom: 16px;
}

.aprisco-pending-decision h3 {
  font-size: 20px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-pending-decision p {
  font-size: 14px;
  color: var(--text-secondary);
  margin-bottom: 24px;
}

.aprisco-pending-decision__progress {
  max-width: 300px;
  margin: 0 auto;
}

.aprisco-pending-decision__progress-bar {
  height: 8px;
  background: var(--bg-secondary);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 8px;
}

.aprisco-pending-decision__progress-fill {
  height: 100%;
  background: var(--accent-color);
  border-radius: 4px;
  animation: progressPulse 2s ease-in-out infinite;
}

@keyframes progressPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.aprisco-pending-decision__progress-text {
  font-size: 12px;
  color: var(--text-secondary);
}

/* Appeal Section */
.aprisco-appeal-section {
  border: 1px solid rgba(245, 158, 11, 0.2);
  background: rgba(245, 158, 11, 0.05);
}

.aprisco-appeal-fee {
  display: flex;
  justify-content: space-between;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
  margin-bottom: 16px;
}

.aprisco-appeal-fee__label {
  font-size: 14px;
  color: var(--text-secondary);
}

.aprisco-appeal-fee__value {
  font-size: 14px;
  font-weight: 600;
  color: #f59e0b;
}

/* Dispute Timeline */
.aprisco-dispute-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-left: 20px;
  border-left: 2px solid var(--border-color);
}

.aprisco-timeline-item {
  position: relative;
  padding: 16px 0 16px 20px;
}

.aprisco-timeline-dot {
  position: absolute;
  left: -27px;
  top: 20px;
  width: 12px;
  height: 12px;
  background: var(--accent-color);
  border-radius: 50%;
  border: 2px solid var(--bg-card);
}

.aprisco-timeline-dot--created { background: #10b981; }
.aprisco-timeline-dot--evidence { background: #3b82f6; }
.aprisco-timeline-dot--response { background: #f59e0b; }
.aprisco-timeline-dot--analysis { background: #8b5cf6; }
.aprisco-timeline-dot--verdict { background: #ec4899; }

.aprisco-timeline-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.aprisco-timeline-date {
  font-size: 12px;
  color: var(--text-secondary);
}

.aprisco-timeline-description {
  font-size: 14px;
  color: var(--text-primary);
}

/* Dispute Info */
.aprisco-dispute-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-dispute-info-item {
  display: flex;
  justify-content: space-between;
}

.aprisco-dispute-info-label {
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-dispute-info-value {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

/* Related Project Widget */
.aprisco-related-project-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-related-project-link:hover {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-related-project-icon {
  font-size: 24px;
}

.aprisco-related-project-info {
  display: flex;
  flex-direction: column;
}

.aprisco-related-project-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-related-project-action {
  font-size: 12px;
  color: var(--accent-color);
}

/* Similar Disputes */
.aprisco-similar-dispute-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  background: var(--bg-secondary);
  border-radius: 8px;
  text-decoration: none;
  margin-bottom: 8px;
  transition: background 0.2s;
}

.aprisco-similar-dispute-item:hover {
  background: rgba(79, 70, 229, 0.1);
}

.aprisco-similar-dispute-id {
  font-size: 11px;
  color: var(--text-secondary);
  font-family: monospace;
}

.aprisco-similar-dispute-title {
  font-size: 13px;
  color: var(--text-primary);
}

.aprisco-similar-dispute-status {
  font-size: 11px;
  font-weight: 500;
}

/* Evidence Card */
.aprisco-evidence-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 12px;
}

.aprisco-evidence-card {
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 10px;
}

.aprisco-evidence-card__type {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  background: var(--bg-card);
  border-radius: 4px;
  font-size: 11px;
  color: var(--text-secondary);
  margin-bottom: 8px;
}

.aprisco-evidence-card__link {
  display: block;
  font-size: 13px;
  color: var(--accent-color);
  text-decoration: none;
  word-break: break-all;
  margin-bottom: 8px;
}

.aprisco-evidence-card__link:hover {
  text-decoration: underline;
}

.aprisco-evidence-card__context {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
}

/* Watchers */
.aprisco-watchers {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 12px;
}

/* Mobile Responsive - Arbitration */
@media (max-width: 768px) {
  .aprisco-ai-banner {
    flex-direction: column;
    text-align: center;
  }

  .aprisco-ai-banner__icon {
    font-size: 40px;
  }

  .aprisco-dispute-card__parties {
    flex-direction: column;
    gap: 8px;
  }

  .aprisco-dispute-vs {
    align-self: center;
  }

  .aprisco-dispute-steps {
    gap: 8px;
  }

  .aprisco-dispute-steps::before {
    left: 20px;
    right: 20px;
  }

  .aprisco-dispute-step__label {
    font-size: 10px;
  }

  .aprisco-evidence-grid {
    grid-template-columns: 1fr;
  }

  .aprisco-response-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* ============================================================================
   PHASE 15: BIBLE STUDIES SYSTEM
   ============================================================================ */

/* Studies Quick Actions Widget */
.aprisco-studies-quick {
  text-align: center;
}

.aprisco-studies-quick .aprisco-card__title {
  margin-bottom: 4px;
}

.aprisco-studies-quick .aprisco-text--muted {
  margin-bottom: 16px;
  font-size: 13px;
}

.aprisco-studies-quick .aprisco-btn {
  margin-bottom: 8px;
}

/* My Studies List */
.aprisco-studies-my-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

.aprisco-my-study {
  display: block;
  padding: 10px;
  background: var(--bg-tertiary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-my-study:hover {
  background: var(--bg-hover);
}

.aprisco-my-study__title {
  display: block;
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 8px;
}

.aprisco-my-study__progress {
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-my-study__bar {
  flex: 1;
  height: 4px;
  background: var(--bg-secondary);
  border-radius: 2px;
  overflow: hidden;
}

.aprisco-my-study__fill {
  height: 100%;
  background: var(--primary);
  border-radius: 2px;
}

.aprisco-my-study__percent {
  font-size: 11px;
  color: var(--text-muted);
  min-width: 32px;
  text-align: right;
}

/* Reading Plans */
.aprisco-reading-plans {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 12px;
}

.aprisco-reading-plan {
  padding: 10px;
  background: var(--bg-tertiary);
  border-radius: 8px;
}

.aprisco-reading-plan__info {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.aprisco-reading-plan__name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-reading-plan__day {
  font-size: 12px;
  color: var(--primary);
}

.aprisco-reading-plan__bar {
  height: 4px;
  background: var(--bg-secondary);
  border-radius: 2px;
  overflow: hidden;
}

.aprisco-reading-plan__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--primary), #10b981);
  border-radius: 2px;
}

/* Featured Study */
.aprisco-featured-study {
  position: relative;
  display: flex;
  align-items: center;
  padding: 24px;
  background: linear-gradient(135deg, var(--bg-tertiary) 0%, rgba(59, 130, 246, 0.1) 100%);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  margin-bottom: 24px;
  overflow: hidden;
}

.aprisco-featured-study__badge {
  position: absolute;
  top: 16px;
  left: 16px;
  padding: 4px 12px;
  background: var(--primary);
  color: white;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 12px;
}

.aprisco-featured-study__content {
  flex: 1;
  padding-right: 24px;
}

.aprisco-featured-study__book {
  font-size: 14px;
  color: var(--primary);
  font-weight: 600;
  margin-bottom: 8px;
  margin-top: 24px;
}

.aprisco-featured-study__title {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.aprisco-featured-study__description {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 16px;
}

.aprisco-featured-study__meta {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}

.aprisco-featured-study__meta span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-muted);
}

.aprisco-featured-study__actions {
  display: flex;
  gap: 12px;
}

.aprisco-featured-study__image {
  flex-shrink: 0;
  width: 150px;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(59, 130, 246, 0.1);
  border-radius: 12px;
}

.aprisco-bible-icon {
  font-size: 64px;
  opacity: 0.8;
}

/* Studies Grid */
.aprisco-studies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
  margin-bottom: 24px;
}

.aprisco-study-card {
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}

.aprisco-study-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.aprisco-study-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.aprisco-study-card__type {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 6px;
}

.aprisco-study-card__group {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--text-muted);
}

.aprisco-study-card__book {
  font-size: 13px;
  color: var(--primary);
  font-weight: 600;
  margin-bottom: 6px;
}

.aprisco-study-card__title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
  line-height: 1.4;
}

.aprisco-study-card__description {
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 12px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.aprisco-study-card__topics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}

.aprisco-study-card__meta {
  display: flex;
  gap: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--border-color);
  margin-bottom: 16px;
}

.aprisco-study-card__meta span {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text-muted);
}

.aprisco-study-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.aprisco-study-card__creator {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text-secondary);
}

/* Bible Widget */
.aprisco-bible-widget {
  background: linear-gradient(135deg, var(--bg-secondary) 0%, rgba(59, 130, 246, 0.05) 100%);
}

.aprisco-verse-card {
  padding: 16px;
  background: var(--bg-tertiary);
  border-radius: 8px;
  margin-bottom: 12px;
}

.aprisco-verse-card__text {
  font-size: 14px;
  font-style: italic;
  color: var(--text-primary);
  line-height: 1.6;
  margin-bottom: 8px;
}

.aprisco-verse-card__reference {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  font-style: normal;
  margin-bottom: 4px;
}

.aprisco-verse-card__source {
  font-size: 11px;
  color: var(--text-muted);
}

/* Live Studies */
.aprisco-live-studies {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-live-study {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  background: var(--bg-tertiary);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
}

.aprisco-live-study:hover {
  background: var(--bg-hover);
}

.aprisco-live-dot {
  width: 8px;
  height: 8px;
  background: #ef4444;
  border-radius: 50%;
  animation: pulse-live 1.5s infinite;
}

@keyframes pulse-live {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.2); }
}

.aprisco-live-study__info {
  flex: 1;
}

.aprisco-live-study__title {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-live-study__meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-muted);
}

/* Topic Tags */
.aprisco-topic-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aprisco-tag--topic {
  background: var(--bg-tertiary);
  color: var(--text-secondary);
  border: 1px solid var(--border-color);
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.2s;
}

.aprisco-tag--topic:hover {
  background: var(--primary);
  color: white;
  border-color: var(--primary);
}

/* Recent Notes Widget */
.aprisco-recent-notes {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-recent-note {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-recent-note:last-child {
  border-bottom: none;
}

.aprisco-recent-note__ref {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
  margin-bottom: 4px;
}

.aprisco-recent-note__preview {
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aprisco-recent-note__time {
  font-size: 11px;
  color: var(--text-muted);
}

/* Create Study Modal */
.aprisco-study-types {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.aprisco-study-type-option input {
  display: none;
}

.aprisco-study-type-option__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 8px;
  background: var(--bg-tertiary);
  border: 2px solid var(--border-color);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-study-type-option__card span:first-child {
  font-size: 24px;
}

.aprisco-study-type-option__card span:last-child {
  font-size: 11px;
  color: var(--text-secondary);
}

.aprisco-study-type-option input:checked + .aprisco-study-type-option__card {
  border-color: var(--primary);
  background: rgba(59, 130, 246, 0.1);
}

/* Bible Selector */
.aprisco-bible-selector {
  display: flex;
  align-items: center;
  gap: 10px;
}

.aprisco-bible-selector .aprisco-select {
  flex: 1;
}

/* Quick Read */
.aprisco-quick-ref {
  display: flex;
  gap: 12px;
}

.aprisco-quick-ref .aprisco-input {
  flex: 1;
}

.aprisco-quick-books__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.aprisco-quick-book {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-quick-book:hover {
  background: var(--primary);
  color: white;
  border-color: var(--primary);
}

.aprisco-quick-reading {
  margin-top: 24px;
  padding: 20px;
  background: var(--bg-tertiary);
  border-radius: 12px;
}

.aprisco-quick-reading__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-quick-reading__header h3 {
  font-size: 18px;
  color: var(--primary);
}

.aprisco-quick-reading__content {
  font-size: 15px;
  line-height: 1.8;
  color: var(--text-primary);
}

.aprisco-quick-reading__footer {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border-color);
}

/* Reading Plans */
.aprisco-reading-plans-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
}

.aprisco-plan-card {
  padding: 20px;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  text-align: center;
}

.aprisco-plan-card__icon {
  font-size: 48px;
  margin-bottom: 12px;
}

.aprisco-plan-card__title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-plan-card__description {
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 16px;
}

/* Study Room Layout */
.aprisco-study-room {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 60px);
  padding-top: 60px;
}

/* Study Header */
.aprisco-study-header {
  padding: 20px 24px;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-color);
}

.aprisco-study-header__nav {
  margin-bottom: 16px;
}

.aprisco-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 13px;
}

.aprisco-back-link:hover {
  color: var(--primary);
}

.aprisco-study-header__badges {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.aprisco-badge--book {
  background: rgba(59, 130, 246, 0.15);
  color: #3b82f6;
}

.aprisco-badge--public {
  background: rgba(16, 185, 129, 0.15);
  color: #10b981;
}

.aprisco-badge--active {
  background: rgba(245, 158, 11, 0.15);
  color: #f59e0b;
}

.aprisco-badge--leader {
  background: rgba(139, 92, 246, 0.15);
  color: #8b5cf6;
}

.aprisco-study-header__title {
  font-size: 28px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.aprisco-study-header__subtitle {
  font-size: 15px;
  color: var(--text-secondary);
  margin-bottom: 16px;
}

.aprisco-study-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.aprisco-study-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-study-header__actions {
  display: flex;
  gap: 12px;
  margin-top: 16px;
}

/* Study Content Split View */
.aprisco-study-content {
  display: grid;
  grid-template-columns: 1fr 400px;
  flex: 1;
  overflow: hidden;
}

/* Study Panel */
.aprisco-study-panel {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 240px);
  overflow: hidden;
}

.aprisco-study-panel--scripture {
  background: var(--bg-primary);
  border-right: 1px solid var(--border-color);
}

.aprisco-study-panel--notes {
  background: var(--bg-secondary);
}

.aprisco-study-panel__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-color);
}

.aprisco-study-panel__header h3 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}

.aprisco-study-panel__controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-study-panel__body {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
}

.aprisco-study-panel__footer {
  padding: 12px 20px;
  border-top: 1px solid var(--border-color);
  background: var(--bg-secondary);
}

.aprisco-study-panel__tabs {
  display: flex;
  padding: 0 16px;
  background: var(--bg-tertiary);
  border-bottom: 1px solid var(--border-color);
}

.aprisco-study-panel__tabs .aprisco-tab {
  padding: 12px 16px;
  font-size: 13px;
}

.aprisco-study-panel__content {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
}

/* Scripture Reader */
.aprisco-scripture-reader {
  max-width: 700px;
  margin: 0 auto;
}

.aprisco-scripture-header {
  text-align: center;
  margin-bottom: 24px;
}

.aprisco-scripture-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.aprisco-scripture-source {
  font-size: 12px;
  color: var(--text-muted);
}

.aprisco-scripture-text {
  line-height: 2;
}

.aprisco-verse {
  position: relative;
  padding: 8px 40px 8px 8px;
  margin-bottom: 4px;
  border-radius: 4px;
  transition: background 0.2s;
}

.aprisco-verse:hover {
  background: var(--bg-hover);
}

.aprisco-verse--selected {
  background: rgba(59, 130, 246, 0.1) !important;
  border-left: 3px solid var(--primary);
  padding-left: 12px;
}

.aprisco-verse--has-notes {
  background: rgba(245, 158, 11, 0.05);
}

.aprisco-verse__number {
  display: inline-block;
  min-width: 24px;
  font-size: 11px;
  font-weight: 700;
  color: var(--primary);
  vertical-align: super;
  margin-right: 4px;
}

.aprisco-verse__text {
  font-size: 16px;
  color: var(--text-primary);
  cursor: pointer;
}

.aprisco-verse__note-count {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  background: rgba(245, 158, 11, 0.2);
  color: #f59e0b;
  font-size: 10px;
  font-weight: 600;
  border-radius: 10px;
  cursor: pointer;
}

.aprisco-verse__action {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 4px;
  padding: 4px 8px;
  cursor: pointer;
  transition: opacity 0.2s;
}

.aprisco-verse:hover .aprisco-verse__action {
  opacity: 1;
}

.aprisco-verse__action:hover {
  background: var(--primary);
  color: white;
}

/* Scripture Navigation */
.aprisco-scripture-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aprisco-scripture-progress {
  font-size: 13px;
  color: var(--text-muted);
}

/* Study Progress Bar */
.aprisco-study-progress {
  padding: 16px 24px;
  background: var(--bg-secondary);
  border-top: 1px solid var(--border-color);
}

.aprisco-study-progress__info {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-study-progress__bar {
  height: 6px;
  background: var(--bg-tertiary);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 12px;
}

.aprisco-study-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--primary), #10b981);
  border-radius: 3px;
}

.aprisco-study-progress__chapters {
  display: flex;
  justify-content: center;
  gap: 4px;
}

.aprisco-chapter-dot {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 6px;
  font-size: 11px;
  color: var(--text-muted);
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-chapter-dot:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.aprisco-chapter-dot--current {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
}

.aprisco-chapter-dot--completed {
  background: rgba(16, 185, 129, 0.15);
  border-color: #10b981;
  color: #10b981;
}

.aprisco-chapter-dot--more {
  background: transparent;
  border: none;
  cursor: default;
}

/* Verse Context */
.aprisco-verse-context {
  padding: 12px;
  background: rgba(59, 130, 246, 0.1);
  border: 1px solid rgba(59, 130, 246, 0.3);
  border-radius: 8px;
  margin-bottom: 16px;
}

.aprisco-verse-context__header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.aprisco-verse-context__ref {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
}

.aprisco-verse-context__text {
  font-size: 13px;
  color: var(--text-secondary);
  font-style: italic;
}

/* Notes Header & Filter */
.aprisco-notes-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.aprisco-notes-filter {
  display: flex;
  gap: 8px;
}

.aprisco-filter-btn {
  padding: 6px 12px;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.aprisco-filter-btn:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.aprisco-filter-btn--active {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
}

/* Notes List */
.aprisco-notes-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-note-card {
  padding: 14px;
  background: var(--bg-tertiary);
  border: 1px solid var(--border-color);
  border-radius: 10px;
}

.aprisco-note-card--mine {
  border-color: rgba(59, 130, 246, 0.3);
  background: rgba(59, 130, 246, 0.05);
}

.aprisco-note-card__header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.aprisco-note-card__author {
  display: flex;
  align-items: center;
  gap: 8px;
}

.aprisco-note-card__name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-note-card__ref {
  font-size: 11px;
  font-weight: 600;
  color: var(--primary);
  background: rgba(59, 130, 246, 0.1);
  padding: 2px 8px;
  border-radius: 4px;
}

.aprisco-note-card__body {
  margin-bottom: 12px;
}

.aprisco-note-card__body p {
  font-size: 13px;
  line-height: 1.6;
  color: var(--text-secondary);
}

.aprisco-note-card__footer {
  display: flex;
  justify-content: space-between;
}

.aprisco-note-card__time {
  font-size: 11px;
  color: var(--text-muted);
}

.aprisco-note-card__actions {
  display: flex;
  gap: 8px;
}

/* Note Types */
.aprisco-note-types {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.aprisco-note-type input {
  display: none;
}

.aprisco-note-type__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 8px;
  background: var(--bg-tertiary);
  border: 2px solid var(--border-color);
  border-radius: 8px;
  cursor: pointer;
  font-size: 11px;
  color: var(--text-secondary);
  transition: all 0.2s;
}

.aprisco-note-type input:checked + .aprisco-note-type__card {
  border-color: var(--primary);
  background: rgba(59, 130, 246, 0.1);
  color: var(--primary);
}

/* Discussion Panel */
.aprisco-discussion-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 16px;
}

.aprisco-discussion-thread__main {
  display: flex;
  gap: 12px;
}

.aprisco-discussion-content {
  flex: 1;
}

.aprisco-discussion-header {
  display: flex;
  gap: 8px;
  margin-bottom: 6px;
}

.aprisco-discussion-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
}

.aprisco-discussion-time {
  font-size: 11px;
  color: var(--text-muted);
}

.aprisco-discussion-text {
  font-size: 13px;
  line-height: 1.6;
  color: var(--text-secondary);
  margin-bottom: 8px;
}

.aprisco-discussion-replies {
  margin-left: 48px;
  margin-top: 12px;
  padding-left: 12px;
  border-left: 2px solid var(--border-color);
}

.aprisco-discussion-reply {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.aprisco-discussion-reply__content {
  font-size: 13px;
}

.aprisco-discussion-reply__content p {
  color: var(--text-secondary);
  line-height: 1.5;
  margin-bottom: 4px;
}

.aprisco-discussion-input {
  display: flex;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--border-color);
}

.aprisco-discussion-input__field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Participants Panel */
.aprisco-participants-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-participants-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-participant {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-tertiary);
  border-radius: 8px;
}

.aprisco-participant--you {
  background: rgba(59, 130, 246, 0.1);
  border: 1px solid rgba(59, 130, 246, 0.2);
}

.aprisco-participant__info {
  flex: 1;
}

.aprisco-participant__name {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 2px;
}

.aprisco-participant__role {
  font-size: 11px;
  color: var(--text-muted);
}

.aprisco-online-dot {
  width: 8px;
  height: 8px;
  background: #10b981;
  border-radius: 50%;
}

/* Resources Panel */
.aprisco-resources-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
  font-size: 13px;
  color: var(--text-secondary);
}

.aprisco-resources-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.aprisco-resource {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-tertiary);
  border-radius: 8px;
}

.aprisco-resource__icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border-radius: 8px;
  font-size: 20px;
}

.aprisco-resource__info {
  flex: 1;
}

.aprisco-resource__title {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
  text-decoration: none;
  margin-bottom: 2px;
}

.aprisco-resource__title:hover {
  color: var(--primary);
}

.aprisco-resource__type {
  font-size: 11px;
  color: var(--text-muted);
}

/* Copy Link */
.aprisco-copy-link {
  display: flex;
  gap: 8px;
}

.aprisco-copy-link .aprisco-input {
  flex: 1;
  font-size: 12px;
  background: var(--bg-tertiary);
}

/* Invite Results */
.aprisco-invite-results {
  max-height: 200px;
  overflow-y: auto;
  margin: 12px 0;
}

.aprisco-invite-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--bg-tertiary);
  border-radius: 8px;
  margin-bottom: 8px;
}

.aprisco-invite-user span {
  flex: 1;
  font-size: 13px;
  color: var(--text-primary);
}

/* Responsive - Studies */
@media (max-width: 992px) {
  .aprisco-study-content {
    grid-template-columns: 1fr;
  }

  .aprisco-study-panel--notes {
    display: none;
  }

  .aprisco-featured-study {
    flex-direction: column;
    text-align: center;
  }

  .aprisco-featured-study__content {
    padding-right: 0;
  }

  .aprisco-featured-study__meta {
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .aprisco-studies-grid {
    grid-template-columns: 1fr;
  }

  .aprisco-study-types {
    grid-template-columns: repeat(3, 1fr);
  }

  .aprisco-note-types {
    grid-template-columns: repeat(2, 1fr);
  }

  .aprisco-study-header__title {
    font-size: 22px;
  }

  .aprisco-reading-plans-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .aprisco-study-types {
    grid-template-columns: repeat(2, 1fr);
  }

  .aprisco-quick-ref {
    flex-direction: column;
  }
}

/* ============================================
   FEED CONTROLS - Sort Tabs + Filter Chips
   (Inspirado em dev.to: Relevant/Latest/Top)
   ============================================ */
.aprisco-feed-controls {
  padding: 12px 20px;
}

.aprisco-sort-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--gray-800, #1f2937);
  padding-bottom: 12px;
}

body.light-mode .aprisco-sort-tabs {
  border-color: #e5e7eb;
}

.aprisco-sort-tab {
  padding: 8px 16px;
  border: none;
  background: transparent;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 500;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.aprisco-sort-tab:hover {
  background: var(--gray-800, #1f2937);
  color: var(--text-white, #ffffff);
}

body.light-mode .aprisco-sort-tab:hover {
  background: #f3f4f6;
  color: #0f172a;
}

.aprisco-sort-tab--active {
  background: var(--accent, #c46849);
  color: #ffffff;
  font-weight: 600;
}

.aprisco-sort-tab--active:hover {
  background: var(--accent, #c46849);
  color: #ffffff;
}

body.light-mode .aprisco-sort-tab--active {
  background: var(--accent, #8B4513);
  color: #ffffff;
}

body.light-mode .aprisco-sort-tab--active:hover {
  background: var(--accent, #8B4513);
  color: #ffffff;
}

.aprisco-filter-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}

.aprisco-filter-chips::-webkit-scrollbar {
  display: none;
}

.aprisco-filter-chip {
  padding: 4px 12px;
  border: 1px solid var(--gray-700, #374151);
  background: transparent;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  border-radius: 20px;
  font-size: 0.8rem;
  transition: all 0.2s;
  white-space: nowrap;
}

body.light-mode .aprisco-filter-chip {
  border-color: #d1d5db;
  color: #6b7280;
}

.aprisco-filter-chip:hover {
  border-color: var(--accent, #c46849);
  color: var(--accent, #c46849);
}

.aprisco-filter-chip--active {
  background: var(--accent, #c46849);
  border-color: var(--accent, #c46849);
  color: #ffffff;
}

body.light-mode .aprisco-filter-chip--active {
  background: var(--accent, #8B4513);
  border-color: var(--accent, #8B4513);
  color: #ffffff;
}

/* ============================================
   POST SUBLINE - Time + Reading Time
   ============================================ */
.aprisco-post__subline {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  color: var(--gray-500, #6b7280);
}

.aprisco-post__reading-time {
  color: var(--gray-500, #6b7280);
}

.aprisco-post__reading-time::before {
  content: '·';
  margin-right: 8px;
}

/* ============================================
   REACTIONS BAR - Contadores Individuais
   (Inspirado em dev.to: heart/unicorn/fire)
   ============================================ */
.aprisco-post__reactions {
  display: flex;
  gap: 4px;
  padding: 8px 0;
  flex-wrap: wrap;
}

.aprisco-reaction {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border: 1px solid var(--gray-800, #1f2937);
  background: transparent;
  color: var(--gray-400, #9ca3af);
  cursor: pointer;
  border-radius: 20px;
  font-size: 0.85rem;
  transition: all 0.2s;
}

body.light-mode .aprisco-reaction {
  border-color: #e5e7eb;
  color: #6b7280;
}

.aprisco-reaction:hover {
  background: var(--gray-800, #1f2937);
  border-color: var(--gray-700, #374151);
  transform: scale(1.05);
}

body.light-mode .aprisco-reaction:hover {
  background: #f9fafb;
  border-color: #d1d5db;
}

.aprisco-reaction--active {
  border-color: var(--accent, #c46849);
  background: rgba(196, 104, 73, 0.1);
  color: var(--accent, #c46849);
}

body.light-mode .aprisco-reaction--active {
  border-color: var(--accent, #8B4513);
  background: rgba(139, 69, 19, 0.1);
  color: var(--accent, #8B4513);
}

.aprisco-reaction__icon {
  font-size: 1rem;
  line-height: 1;
}

.aprisco-reaction__count {
  font-size: 0.8rem;
  font-weight: 500;
  min-width: 12px;
  text-align: center;
}

/* ============================================
   THIS WEEK WIDGET - "Acontecendo Esta Semana"
   (Inspirado em dev.to: "What's happening")
   ============================================ */
.aprisco-thisweek-widget__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-white, #ffffff);
  margin-bottom: 16px;
}

body.light-mode .aprisco-thisweek-widget__title {
  color: #0f172a;
}

.aprisco-thisweek-widget__items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.aprisco-thisweek-widget__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px;
  border-radius: 8px;
  background: var(--gray-900, #111827);
  transition: background 0.2s;
}

body.light-mode .aprisco-thisweek-widget__item {
  background: #f9fafb;
}

.aprisco-thisweek-widget__item:hover {
  background: var(--gray-800, #1f2937);
}

body.light-mode .aprisco-thisweek-widget__item:hover {
  background: #f3f4f6;
}

.aprisco-thisweek-widget__icon {
  font-size: 1.2rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.aprisco-thisweek-widget__content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.aprisco-thisweek-widget__title {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--text-white, #ffffff);
  text-decoration: none;
  line-height: 1.3;
}

a.aprisco-thisweek-widget__title:hover {
  color: var(--accent, #c46849);
}

body.light-mode .aprisco-thisweek-widget__title {
  color: #1f2937;
}

body.light-mode a.aprisco-thisweek-widget__title:hover {
  color: var(--accent, #8B4513);
}

.aprisco-thisweek-widget__detail {
  font-size: 0.75rem;
  color: var(--gray-500, #6b7280);
}

/* ============================================
   RESPONSIVE - Feed Controls
   ============================================ */
@media (max-width: 768px) {
  .aprisco-sort-tabs {
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .aprisco-sort-tabs::-webkit-scrollbar {
    display: none;
  }

  .aprisco-sort-tab {
    font-size: 0.8rem;
    padding: 6px 12px;
  }

  .aprisco-filter-chip {
    font-size: 0.75rem;
    padding: 3px 10px;
  }

  .aprisco-reaction {
    padding: 4px 8px;
    font-size: 0.8rem;
  }

  .aprisco-reaction__icon {
    font-size: 0.9rem;
  }
}
