/* =========================================================
   SiteDesign - Post Author Box
   Default: Modern Editorial Style (optimized for news sites)
   Optional modifiers:
     - .sd-author-box.is-card   (Enhanced card)
     - .sd-author-box.is-inline (Minimal inline)
     - .sd-author-box.is-minimal (Clean minimal)
   Version: 1.2.0
   ========================================================= */

/* ---------- Base wrapper ---------- */
.sd-author-box {
  --sd-author-bg: #f8f9fa;
  --sd-author-border: #e1e4e8;
  --sd-author-text: #1a1a1a;
  --sd-author-muted: #6c757d;
  --sd-author-accent: #0066cc;

  --sd-radius: 10px;
  --sd-pad-y: 16px;
  --sd-pad-x: 18px;

  --sd-avatar-size: 50px;
  --sd-gap: 14px;

  display: block;
  max-width: 100%;
}

/* Inner container */
.sd-author-box .sd-author-inner {
  background: var(--sd-author-bg);
  border: 1px solid var(--sd-author-border);
  border-left: 4px solid var(--sd-author-accent);
  border-radius: var(--sd-radius);
  padding: var(--sd-pad-y) var(--sd-pad-x);
  transition: box-shadow 200ms ease, border-color 200ms ease;
}

/* Layout row */
.sd-author-box .sd-author-inner {
  display: flex;
  align-items: center;
  gap: var(--sd-gap);
}

/* Avatar */
.sd-author-box .sd-author-avatar-wrap {
  width: var(--sd-avatar-size);
  height: var(--sd-avatar-size);
  flex: 0 0 var(--sd-avatar-size);
  border-radius: 999px;
  overflow: hidden;
  border: 2px solid #ffffff;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  line-height: 0;
}

.sd-author-box img.sd-author-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Text container */
.sd-author-box .sd-author-text {
  min-width: 0;
  line-height: 1.4;
  flex: 1;
  width: 8rem;
}

/* Author label */
.sd-author-box .sd-author-text::before {
  content: 'Συντάκτης';
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--sd-author-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

/* Author name */
.sd-author-box .sd-author-name {
  display: block;
  font-weight: 600;
  font-size: 15px;
  color: var(--sd-author-text);
  letter-spacing: -0.01em;
  line-height: 1.4;
  /* Allow line breaks from <br> tags */
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

/* Keep single line if no <br> tag */
.sd-author-box .sd-author-name:not(:has(br)) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Link styling */
.sd-author-box .sd-author-link {
  text-decoration: none;
  color: inherit;
  transition: color 150ms ease;
}

.sd-author-box .sd-author-link:hover {
  color: var(--sd-author-accent);
}

.sd-author-box .sd-author-link:hover .sd-author-name {
  text-decoration: none;
}

/* Hover effect */
.sd-author-box .sd-author-inner:hover {
  border-left-color: var(--sd-author-accent);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* ---------- Tablet adjustments ---------- */
@media (max-width: 768px) {
  /* Reduce fixed width on tablets */
  .sd-author-box .sd-author-text {
    width: 6rem;  /* 96px - smaller on tablets */
  }
}

/* ---------- Mobile adjustments ---------- */
@media (max-width: 576px) {
  .sd-author-box {
    --sd-pad-y: 14px;
    --sd-pad-x: 16px;
    --sd-gap: 12px;
    --sd-avatar-size: 46px;
    margin: 1.5rem 0;  /* Keep more top spacing on mobile too */
  }

  /* Reset width on mobile - use flex instead */
  .sd-author-box .sd-author-text {
    width: auto;
    flex: 1;
  }

  .sd-author-box .sd-author-text::before {
    font-size: 10px;
  }

  .sd-author-box .sd-author-name {
    font-size: 14px;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}

/* =========================================================
   VARIANT: Enhanced Card Style
   Usage: [sd_author_box variant="card"]
   ========================================================= */
.sd-author-box.is-card {
  --sd-radius: 14px;
  --sd-pad-y: 20px;
  --sd-pad-x: 20px;
  --sd-avatar-size: 64px;
  --sd-author-bg: #ffffff;
  margin: 32px auto;
  max-width: 520px;
}

.sd-author-box.is-card .sd-author-inner {
  border: 2px solid var(--sd-author-border);
  border-left-width: 2px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
}

.sd-author-box.is-card .sd-author-text::before {
  font-size: 12px;
}

.sd-author-box.is-card .sd-author-name {
  font-size: 17px;
}

.sd-author-box.is-card .sd-author-inner:hover {
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
  transition: all 200ms ease;
}

/* Card mobile: centered stacked layout */
@media (max-width: 576px) {
  .sd-author-box.is-card {
    max-width: 100%;
    margin: 24px 0;
  }

  .sd-author-box.is-card .sd-author-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 18px;
  }

  .sd-author-box.is-card .sd-author-avatar-wrap {
    margin-bottom: 8px;
  }

  .sd-author-box.is-card .sd-author-text {
    width: 100%;
  }

  .sd-author-box.is-card .sd-author-name {
    font-size: 15px;
    -webkit-line-clamp: 3;
  }
}

/* =========================================================
   VARIANT: Minimal Inline Style
   Usage: [sd_author_box variant="inline"]
   ========================================================= */
.sd-author-box.is-inline {
  --sd-author-bg: transparent;
  --sd-author-border: transparent;
  --sd-pad-y: 0;
  --sd-pad-x: 0;
  --sd-avatar-size: 32px;
  --sd-gap: 10px;
	margin: 0px 1rem;
}

.sd-author-box.is-inline .sd-author-inner {
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
}

.sd-author-box.is-inline .sd-author-inner:hover {
  box-shadow: none;
  transform: none;
  border-left-color: transparent;
}

.sd-author-box.is-inline .sd-author-avatar-wrap {
  border: 2px solid #e1e4e8;
  background: #f8f9fa;
  box-shadow: none;
}

.sd-author-box.is-inline .sd-author-text::before {
  display: none;
}

.sd-author-box.is-inline .sd-author-name {
  font-weight: 600;
  font-size: 13px;
  color: var(--sd-author-muted);
}

/* =========================================================
   VARIANT: Clean Minimal (No background)
   Usage: [sd_author_box variant="minimal"] or class="is-minimal"
   ========================================================= */
.sd-author-box.is-minimal {
  --sd-author-bg: transparent;
  --sd-author-border: transparent;
  border-bottom: 1px solid #e9ecef;
  padding-bottom: 20px;
  margin: 0 0 32px 0;
  --sd-radius: 0;
}

.sd-author-box.is-minimal .sd-author-inner {
  background: transparent;
  border: none;
  padding: 0;
  box-shadow: none;
}

.sd-author-box.is-minimal .sd-author-inner:hover {
  box-shadow: none;
  transform: none;
  border-left-color: transparent;
}

.sd-author-box.is-minimal .sd-author-avatar-wrap {
  --sd-avatar-size: 48px;
  border: 2px solid #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.sd-author-box.is-minimal .sd-author-name {
  font-size: 16px;
  font-weight: 600;
}

/* =========================================================
   UTILITY CLASSES
   ========================================================= */

/* Remove label */
.sd-author-box.no-label .sd-author-text::before {
  display: none;
}

/* Center alignment */
.sd-author-box.is-centered {
  margin-left: auto;
  margin-right: auto;
  max-width: 480px;
}

/* Custom accent colors (can be overridden inline or in theme) */
.sd-author-box.accent-primary {
  --sd-author-accent: #0066cc;
}

.sd-author-box.accent-success {
  --sd-author-accent: #28a745;
}

.sd-author-box.accent-danger {
  --sd-author-accent: #dc3545;
}

.sd-author-box.accent-dark {
  --sd-author-accent: #343a40;
}
