/* =============================================
   Lebenslauf V2 – Premium Resume CSS
   Scope: .resume-premium-v2
   (Quelle: lebenslauf-v2.css — bitte bei Design-Updates beide synchron halten)
   ============================================= */

.resume-premium-v2 {
  /* Farben */
  --dark: #2d2d2d;
  --accent: #8b1a1a;
  --sidebar-bg: #2d2d2d;
  --sidebar-light-bg: #3a3a3a;
  --text-white: #ffffff;
  --text-gray-300: #d1d5db;
  --text-gray-400: #9ca3af;
  --text-gray-500: #6b7280;
  --text-gray-600: #4b5563;
  --text-gray-999: #999999;
  --page2-sidebar-bg: #f5f5f5;
  /* Kontakt-Zeilenfarbe wie Template 1 (--text-gray-300 = #d1d5db) */
  --text-white-muted: #d1d5db;

  /* Maße */
  --page-width: 210mm;
  --page-height: 297mm;
  --sidebar-width: 70mm;

  /* Schrift */
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-size-xs: 10px;
  --font-size-sm: 11px;
  --font-size-base: 12px;
  --font-size-section: 13px;
  --font-size-main-section: 15px;
  --font-size-firstname: 14px;
  --font-size-lastname: 36px;

  /* Abstände */
  --spacing-xs: 4px;
  --spacing-sm: 6px;
  --spacing-md: 12px;
  --spacing-lg: 20px;
  --spacing-xl: 24px;
  --spacing-xxl: 32px;
}

/* ---- Scoped Reset ---- */
.resume-premium-v2 *,
.resume-premium-v2 *::before,
.resume-premium-v2 *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.resume-premium-v2 {
  font-family: var(--font-family);
  color: var(--dark);
  line-height: 1.5;
}

/* =============================================
   Page
   ============================================= */
.rv2-page {
  width: var(--page-width);
  min-height: var(--page-height);
  margin: var(--spacing-xxl) auto;
  display: flex;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
  overflow: visible;
}

/* =============================================
   Sidebar (dark – Seite 1)
   ============================================= */
.rv2-sidebar {
  width: var(--sidebar-width);
  flex-shrink: 0;
  background: var(--sidebar-bg);
  color: var(--text-white);
  display: flex;
  flex-direction: column;
}

/* Foto wie Template 1: proportional, nicht beschneiden (object-fit: contain) */
.resume-premium-v2 .photo-frame {
  margin: var(--spacing-xl) var(--spacing-lg) var(--spacing-md);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

.resume-premium-v2 .photo-frame .photo {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

.resume-premium-v2 .photo.rv2-photo--empty {
  min-height: 45%;
  background: rgba(255, 255, 255, 0.08);
}

/* Sidebar inner padding */
.rv2-sidebar__body {
  padding: 0 var(--spacing-lg) var(--spacing-xl);
  flex: 1;
}

/* Sidebar Section Title */
.rv2-sidebar-title {
  font-size: var(--font-size-section);
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--accent);
  margin-bottom: var(--spacing-md);
}

.rv2-sidebar-section {
  margin-bottom: var(--spacing-xl);
}

/* ---- Kontakt wie Template 1 (rosa SVG-Icons) ---- */
.resume-premium-v2 .contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--spacing-sm);
  color: var(--text-white-muted);
  font-size: var(--font-size-xs);
}

.resume-premium-v2 .contact-list li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  min-width: 0;
}

.resume-premium-v2 .contact-icon {
  width: 18px;
  height: 18px;
  margin-top: 1px;
  flex-shrink: 0;
  border: none;
  border-radius: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.resume-premium-v2 .contact-icon--phone {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e891b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.resume-premium-v2 .contact-icon--email {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e891b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}

.resume-premium-v2 .contact-icon--address {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e891b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.resume-premium-v2 .contact-icon--linkedin {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e891b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-4 0v7h-4v-12h4v1.6'/%3E%3Crect x='2' y='9' width='4' height='12'/%3E%3Ccircle cx='4' cy='4' r='2'/%3E%3C/svg%3E");
}

.resume-premium-v2 .contact-text {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

/* ---- Education ---- */
.rv2-edu-list {
  list-style: none;
  font-size: var(--font-size-sm);
}

.rv2-edu-list li {
  margin-bottom: var(--spacing-md);
}

.rv2-edu-degree {
  color: var(--text-white);
  font-size: var(--font-size-base);
  font-weight: 600;
  text-transform: uppercase;
}

.rv2-edu-school {
  color: var(--text-gray-400);
  font-style: italic;
}

.rv2-edu-date {
  color: var(--text-gray-500);
}

.rv2-edu-details {
  color: var(--text-gray-400);
  margin-top: 2px;
}

/* ---- Skills (dot list) ---- */
.rv2-skills-label {
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-gray-500);
  margin-bottom: var(--spacing-sm);
}

.rv2-skill-dots {
  list-style: none;
  font-size: var(--font-size-sm);
  color: var(--text-gray-300);
}

.rv2-skill-dots li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--spacing-xs);
}

.rv2-skill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  flex-shrink: 0;
}

/* ---- Languages (bar) ---- */
.rv2-lang-list {
  list-style: none;
  font-size: var(--font-size-sm);
}

.rv2-lang-list li {
  margin-bottom: var(--spacing-sm);
}

.rv2-lang-name {
  color: var(--text-gray-300);
  margin-bottom: var(--spacing-xs);
}

.rv2-lang-bar {
  width: 100%;
  height: 4px;
  border-radius: 2px;
  background: var(--sidebar-light-bg);
}

.rv2-lang-bar-fill {
  height: 4px;
  border-radius: 2px;
  background: var(--accent);
}

/* =============================================
   Main Content Area
   ============================================= */
.rv2-main {
  flex: 1;
  padding: var(--spacing-xxl) var(--spacing-xxl) var(--spacing-xl);
}

/* Name Block */
.rv2-name-first {
  font-size: var(--font-size-firstname);
  color: var(--dark);
  letter-spacing: 8px;
  text-transform: uppercase;
  margin: 0;
}

.rv2-name-last {
  font-size: var(--font-size-lastname);
  color: var(--dark);
  letter-spacing: 4px;
  line-height: 1.1;
  text-transform: uppercase;
  margin: 0;
}

.rv2-jobtitle {
  font-size: var(--font-size-sm);
  color: var(--text-gray-999);
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-top: var(--spacing-xs);
  margin-bottom: var(--spacing-xxl);
}

/* Main Section Title */
.rv2-section-title {
  font-size: var(--font-size-main-section);
  color: var(--dark);
  text-transform: uppercase;
  letter-spacing: 2px;
  padding-bottom: var(--spacing-sm);
  margin-bottom: var(--spacing-md);
  border-bottom: 2px solid var(--accent);
}

.rv2-section {
  margin-bottom: 28px;
}

/* Summary */
.rv2-summary {
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
  line-height: 1.8;
}

/* ---- Experience Block ---- */
.rv2-exp-list {
  list-style: none;
}

.rv2-exp-list > li {
  margin-bottom: var(--spacing-lg);
}

.rv2-exp-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 2px;
}

.rv2-exp-title {
  font-size: var(--font-size-section);
  color: var(--dark);
  font-weight: 600;
}

.rv2-exp-date {
  font-size: var(--font-size-sm);
  color: var(--text-gray-400);
  font-style: italic;
  flex-shrink: 0;
  margin-left: 8px;
}

.rv2-exp-company {
  font-size: var(--font-size-sm);
  color: var(--text-gray-500);
  font-style: italic;
  margin-bottom: var(--spacing-sm);
}

.rv2-exp-desc {
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
  line-height: 1.7;
  margin-bottom: var(--spacing-sm);
}

.rv2-exp-bullets {
  margin-left: 20px;
  padding: 0;
  list-style: disc;
}

.rv2-exp-bullets li {
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
  line-height: 1.6;
  margin-bottom: var(--spacing-xs);
}

/* =============================================
   Sidebar (light – Seite 2)
   ============================================= */
.rv2-sidebar-light {
  width: var(--sidebar-width);
  flex-shrink: 0;
  background: var(--page2-sidebar-bg);
  padding: var(--spacing-xl) var(--spacing-lg);
}

.rv2-sidebar-light .rv2-sidebar-title {
  color: var(--accent);
}

/* Fortsetzung Sidebar: gleiche Klassen wie links, aber heller Hintergrund */
.rv2-sidebar-light .rv2-edu-degree {
  color: var(--dark);
}

.rv2-sidebar-light .rv2-edu-school {
  color: var(--text-gray-500);
}

.rv2-sidebar-light .rv2-edu-date {
  color: var(--text-gray-400);
}

.rv2-sidebar-light .rv2-skill-dots,
.rv2-sidebar-light .rv2-skill-dots li {
  color: var(--text-gray-600);
}

.rv2-sidebar-light .rv2-lang-name {
  color: var(--text-gray-600);
}

.rv2-sidebar-light .rv2-lang-bar {
  background: #e5e5e5;
}

/* Expertise dot list (light) */
.rv2-expertise-list {
  list-style: none;
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
}

.rv2-expertise-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--spacing-sm);
}

/* Simple list (light sidebar) */
.rv2-simple-list {
  list-style: none;
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
}

.rv2-simple-list li {
  margin-bottom: var(--spacing-xs);
}

/* Award / Membership list (light sidebar) */
.rv2-award-list {
  list-style: none;
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
}

.rv2-award-list li {
  margin-bottom: var(--spacing-md);
}

.rv2-award-name {
  font-size: var(--font-size-base);
  color: var(--dark);
  font-weight: 600;
}

.rv2-award-org {
  color: var(--text-gray-500);
}

.rv2-award-date {
  color: var(--text-gray-400);
}

.rv2-award-details {
  color: var(--text-gray-500);
  margin-top: 2px;
}

/* ---- Training ---- */
.rv2-training-list {
  list-style: none;
  font-size: var(--font-size-sm);
  color: var(--text-gray-600);
}

.rv2-training-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--spacing-md);
}

.rv2-training-name {
  font-size: var(--font-size-base);
  color: var(--dark);
  font-weight: 600;
}

.rv2-training-org {
  color: var(--text-gray-500);
}

.rv2-training-date {
  font-size: var(--font-size-sm);
  color: var(--text-gray-400);
  flex-shrink: 0;
  margin-left: 8px;
}

.rv2-training-details {
  color: var(--text-gray-500);
  margin-top: 2px;
}

/* =============================================
   Page Rules
   ============================================= */
@page {
  size: A4 portrait;
  margin: 0;
}

/* =============================================
   Print Styles
   ============================================= */
@media print {
  body {
    background: #fff !important;
  }

  .rv2-page {
    margin: 0;
    box-shadow: none;
    page-break-after: always;
    min-height: var(--page-height);
  }

  .rv2-page:last-child {
    page-break-after: auto;
  }

  .rv2-sidebar,
  .rv2-sidebar-light {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* =============================================
   BewerbungsFix: PDF-Bundle (Puppeteer)
   ============================================= */
.cv-v1-bundle .rv2-document-shell {
  padding: 0 !important;
  margin: 0 auto !important;
}

.cv-v1-bundle .resume-premium-v2 {
  background: #ffffff;
}

.cv-v1-bundle .rv2-page {
  margin: 0 auto !important;
  box-shadow: none !important;
  page-break-after: always;
  break-after: page;
}

.cv-v1-bundle .rv2-page:last-child {
  page-break-after: auto;
  break-after: auto;
}

/* =============================================
   BewerbungsFix: Live-Vorschau (nur Seite 1)
   ============================================= */
.cv-premium-v2-mount {
  position: relative;
  z-index: 4;
  flex: 1;
  min-height: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background: transparent;
  padding: 0;
  box-sizing: border-box;
  container-type: size;
  container-name: cv-premium-v2-preview;
}

.cv-premium-v2-mount .resume-premium-v2 {
  background: #ffffff;
}

.cv-premium-v2-mount .rv2-page + .rv2-page {
  display: none !important;
}

.cv-premium-v2-mount .rv2-page {
  margin: 0 !important;
}

.cv-premium-v2-mount .rv2-document-shell {
  padding: 0;
  margin: 0;
  width: max-content;
  transform-origin: center center;
  transform: scale(
    min(
      calc(100cqw / 210mm),
      calc(100cqh / 297mm)
    )
  );
}

@supports not (container-type: size) {
  .cv-premium-v2-mount .rv2-document-shell {
    transform: scale(0.4);
  }
}

.live-sheet.cv-v1-premium-active .live-sheet-lock,
.live-sheet.cv-v2-premium-active .live-sheet-lock {
  display: none;
}
