/* ============================================
   Cultural Border Patterns — Hearth & Hygge
   CSS-only decorative borders per region,
   using inline SVG data URIs on ::before.
   ============================================ */

/* Shared pattern base */
[class*="pattern-"]::before {
  content: '';
  display: block;
  height: 16px;
  background-repeat: repeat-x;
  background-size: 32px 16px;
  margin-bottom: 1rem;
  opacity: 0.5;
}

/* --- Greece: Greek key (meander) pattern --- */
.pattern-greece::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16' viewBox='0 0 32 16'%3E%3Cpath d='M0 14h4V6h8v4h-4v4h8V2H8v4H4V2H0v12zm16 0h4V6h8v4h-4v4h8V2h-8v4h-4V2h-4v12z' fill='none' stroke='%231565C0' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 32px 16px;
}

/* --- Denmark: Nordic knotwork --- */
.pattern-denmark::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'%3E%3Cpath d='M0 8c5-6 10-6 15 0s10 6 15 0s10-6 15 0' fill='none' stroke='%231B5E20' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M-5 8c5 6 10 6 15 0s10-6 15 0s10 6 15 0' fill='none' stroke='%231B5E20' stroke-width='1.5' stroke-linecap='round' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 40px 16px;
}

/* --- Sweden: Nordic knotwork (blue) --- */
.pattern-sweden::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'%3E%3Cpath d='M0 8c5-6 10-6 15 0s10 6 15 0s10-6 15 0' fill='none' stroke='%231565C0' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M-5 8c5 6 10 6 15 0s10-6 15 0s10 6 15 0' fill='none' stroke='%231565C0' stroke-width='1.5' stroke-linecap='round' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 40px 16px;
}

/* --- Norway: Nordic knotwork (red) --- */
.pattern-norway::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'%3E%3Cpath d='M0 8c5-6 10-6 15 0s10 6 15 0s10-6 15 0' fill='none' stroke='%23B71C1C' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M-5 8c5 6 10 6 15 0s10-6 15 0s10 6 15 0' fill='none' stroke='%23B71C1C' stroke-width='1.5' stroke-linecap='round' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 40px 16px;
}

/* --- Ireland: Celtic knot loops --- */
.pattern-ireland::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16' viewBox='0 0 48 16'%3E%3Ccircle cx='8' cy='8' r='5' fill='none' stroke='%232E7D32' stroke-width='1.3'/%3E%3Ccircle cx='24' cy='8' r='5' fill='none' stroke='%232E7D32' stroke-width='1.3'/%3E%3Ccircle cx='40' cy='8' r='5' fill='none' stroke='%232E7D32' stroke-width='1.3'/%3E%3Cline x1='13' y1='8' x2='19' y2='8' stroke='%232E7D32' stroke-width='1.3'/%3E%3Cline x1='29' y1='8' x2='35' y2='8' stroke='%232E7D32' stroke-width='1.3'/%3E%3C/svg%3E");
  background-size: 48px 16px;
}

/* --- France: Fleur-de-lis repeating --- */
.pattern-france::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='16' viewBox='0 0 36 16'%3E%3Cpath d='M18 2c0 0-2 3-2 5s1 3 2 3 2-1 2-3-2-5-2-5z' fill='%231A237E' opacity='0.7'/%3E%3Cpath d='M14 6c0 0 1 3 3 4' fill='none' stroke='%231A237E' stroke-width='1' opacity='0.6'/%3E%3Cpath d='M22 6c0 0-1 3-3 4' fill='none' stroke='%231A237E' stroke-width='1' opacity='0.6'/%3E%3Cline x1='18' y1='10' x2='18' y2='14' stroke='%231A237E' stroke-width='1.2'/%3E%3Cline x1='15' y1='14' x2='21' y2='14' stroke='%231A237E' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 36px 16px;
}

/* --- Italy: Renaissance scrollwork --- */
.pattern-italy::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16' viewBox='0 0 48 16'%3E%3Cpath d='M0 8 Q6 2 12 8 Q18 14 24 8 Q30 2 36 8 Q42 14 48 8' fill='none' stroke='%23BF360C' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='8' r='1.5' fill='%23BF360C' opacity='0.4'/%3E%3Ccircle cx='36' cy='8' r='1.5' fill='%23BF360C' opacity='0.4'/%3E%3C/svg%3E");
  background-size: 48px 16px;
}

/* --- Spain: Moorish geometric (star/octagon) --- */
.pattern-spain::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16' viewBox='0 0 32 16'%3E%3Cpath d='M16 1l3 5h6l-5 3.5 2 5.5-6-4-6 4 2-5.5L7 6h6z' fill='none' stroke='%23E65100' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 32px 16px;
}

/* --- Hungary: Folk art flower/heart --- */
.pattern-hungary::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'%3E%3Cpath d='M20 13 Q14 8 14 5 Q14 2 17 2 Q20 2 20 5 Q20 2 23 2 Q26 2 26 5 Q26 8 20 13Z' fill='none' stroke='%23C62828' stroke-width='1.2'/%3E%3Ccircle cx='20' cy='6' r='1' fill='%23C62828' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 40px 16px;
}

/* --- Czechia: Folk art (same family as Hungary) --- */
.pattern-czechia::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='16' viewBox='0 0 36 16'%3E%3Ccircle cx='18' cy='8' r='4' fill='none' stroke='%23C62828' stroke-width='1'/%3E%3Ccircle cx='18' cy='8' r='1.5' fill='%23C62828' opacity='0.4'/%3E%3Cpath d='M10 8h4M22 8h4' stroke='%23C62828' stroke-width='1'/%3E%3Cpath d='M18 0v4M18 12v4' stroke='%23C62828' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 36px 16px;
}

/* --- Bulgaria: Folk art (same family) --- */
.pattern-bulgaria::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16' viewBox='0 0 32 16'%3E%3Cpath d='M16 3l3 5-3 5-3-5z' fill='none' stroke='%23C62828' stroke-width='1.2'/%3E%3Ccircle cx='6' cy='8' r='2' fill='none' stroke='%23C62828' stroke-width='1'/%3E%3Ccircle cx='26' cy='8' r='2' fill='none' stroke='%23C62828' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 32px 16px;
}

/* --- Croatia: Folk art (same family) --- */
.pattern-croatia::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16' viewBox='0 0 32 16'%3E%3Crect x='4' y='4' width='8' height='8' fill='none' stroke='%23C62828' stroke-width='1' transform='rotate(45 8 8)'/%3E%3Crect x='20' y='4' width='8' height='8' fill='none' stroke='%23C62828' stroke-width='1' transform='rotate(45 24 8)'/%3E%3C/svg%3E");
  background-size: 32px 16px;
}

/* --- Tasmania: Natural leaf/fern pattern --- */
.pattern-tasmania::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16' viewBox='0 0 48 16'%3E%3Cpath d='M24 14 Q23 10 24 2' fill='none' stroke='%2333691E' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M24 10 Q18 7 16 8' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M24 10 Q30 7 32 8' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M24 6 Q19 4 17 5' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M24 6 Q29 4 31 5' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M24 3 Q21 2 20 3' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M24 3 Q27 2 28 3' fill='none' stroke='%2333691E' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: 48px 16px;
}

/* --- England: Tudor rose outline --- */
.pattern-england::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='16' viewBox='0 0 36 16'%3E%3Ccircle cx='18' cy='8' r='2' fill='%234E342E' opacity='0.3'/%3E%3Cpath d='M18 3 Q20 5 18 6 Q16 5 18 3Z' fill='none' stroke='%234E342E' stroke-width='0.8'/%3E%3Cpath d='M22 6 Q20 7 19 6 Q20 5 22 6Z' fill='none' stroke='%234E342E' stroke-width='0.8'/%3E%3Cpath d='M21 11 Q19 10 19 8 Q20 9 21 11Z' fill='none' stroke='%234E342E' stroke-width='0.8'/%3E%3Cpath d='M15 11 Q17 10 17 8 Q16 9 15 11Z' fill='none' stroke='%234E342E' stroke-width='0.8'/%3E%3Cpath d='M14 6 Q16 7 17 6 Q16 5 14 6Z' fill='none' stroke='%234E342E' stroke-width='0.8'/%3E%3C/svg%3E");
  background-size: 36px 16px;
}

/* Hover effect for cultural patterns */
[class*="pattern-"]::before {
  transition: opacity 0.3s ease;
}
[class*="pattern-"]:hover::before {
  opacity: 0.7;
}