/**
 * Blueprint Theme Styles
 * Technical / Engineering / Drafting aesthetic
 */

@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');

.theme-blueprint {
  background-color: #1a3a6c;
  background-image: 
    linear-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.05) 10px, transparent 10px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.05) 10px, transparent 10px);
  background-size: 100px 100px, 100px 100px, 20px 20px, 20px 20px;
  overflow: hidden;
  position: relative;
  font-family: 'Architects Daughter', 'Courier New', monospace;
}

.theme-blueprint .blueprint-sign-text,
.theme-blueprint .blueprint-flow-text {
  color: #fff;
  font-weight: 400;
  white-space: nowrap;
  user-select: none;
  line-height: 1.1;
  text-transform: uppercase;
  
  /* Chalky / Hand-drawn effect */
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.5));
  opacity: 0.9;
  
  position: relative;
  z-index: 2;
}

/* Measurement Lines */
.blueprint-measure {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.3);
    pointer-events: none;
    z-index: 1;
}

.blueprint-measure::before,
.blueprint-measure::after {
    content: '';
    position: absolute;
    background: rgba(255, 255, 255, 0.3);
}

/* Horizontal measure */
.blueprint-measure-h {
    height: 0;
    border-top: 1px dashed rgba(255, 255, 255, 0.4);
}
.blueprint-measure-h::before { width: 1px; height: 20px; top: -10px; left: 0; }
.blueprint-measure-h::after { width: 1px; height: 20px; top: -10px; right: 0; }

/* Vertical measure */
.blueprint-measure-v {
    width: 0;
    border-left: 1px dashed rgba(255, 255, 255, 0.4);
}
.blueprint-measure-v::before { width: 20px; height: 1px; left: -10px; top: 0; }
.blueprint-measure-v::after { width: 20px; height: 1px; left: -10px; bottom: 0; }

.blueprint-label {
    position: absolute;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    background: #1a3a6c;
    padding: 0 4px;
}

/* Drafting animation */
@keyframes blueprint-draw {
    from { stroke-dashoffset: 1000; }
    to { stroke-dashoffset: 0; }
}

.blueprint-svg-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

.blueprint-path {
    stroke: rgba(255, 255, 255, 0.15);
    stroke-width: 1;
    fill: none;
    stroke-dasharray: 1000;
    animation: blueprint-draw 10s linear infinite;
}