/* Styling for dimension lines and labels */
.dimension-line {
    position: absolute;*/
    background-color: #000 !important;
    z-index: 100;
    visibility: visible !important; 
    opacity: 1 !important;
}

.dimension-vertical-line {
    position: absolute;
    width: 1px;
    height: 1px; /* Will be set by JS */
    background-color: #000;
    z-index: 100;
}

/* Horizontally center the arrows on the dimension line */
.dimension-arrow.arrow-left,
.dimension-arrow.arrow-right {
    top: 50%;
    transform: translateY(-50%);
}


.dimension-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border: solid transparent;
    z-index: 100;
}

.arrow-left {
    left: 0;
    top: -4px;
    border-width: 4px 8px 4px 0;
    border-right-color: #000;
}

.arrow-right {
    right: 0;
    top: -4px;
    border-width: 4px 0 4px 8px;
    border-left-color: #000;
}

.arrow-top {
    top: 0;
    left: -4px;
    border-width: 0 4px 8px 4px;
    border-bottom-color: #000;
}

.arrow-bottom {
    bottom: 0;
    left: -4px;
    border-width: 8px 4px 0 4px;
    border-top-color: #000;
}

/* Adjust inner width dimension line position to account for border */
.aperture-width-line {
    left: 0 !important; /* Override any existing left positioning */
    width: 100% !important; /* was 100Ensure it spans the full width */
}

/* Adjust inner vertical dimension line position to account for border */
.aperture-height-line {
    top: 0 !important; /* Override any existing top positioning */
    height: 100% !important; /* Ensure it spans the full height */
}

/* fpr the outer mount  */
.dimension-text {
    position: absolute;
    background-color: white;
    border: 1px solid #777;
    padding: 2px 6px;
    font-size: 14px;/* was 14px  */
    font-family: Arial, sans-serif;
    transform: translate(-50%, -50%);
    z-index: 160; /* Increased z-index to ensure text is above the line */
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* Text for vertical dimension - centered on line */
.dimension-text-vertical {
    transform: translate(-50%, -50%);
}

/* Connector lines 
.connector-line {
  position: absolute;
  background-color: #090;
  z-index: 100;
  height: 1px;
  visibility: visible;
}*/

/* Styles for editable dimension text */
.dimension-text.editable {
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.dimension-text.editable:hover {
    background-color: #f5f5f5;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.dimension-text.editable:focus {
    outline: 2px solid #4a90e2;
    background-color: #fff;
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

/* Prevent dimension text selection unless in edit mode */
.dimension-text {
    user-select: none;
}

.dimension-text:focus {
    user-select: text;
}

.mount-dimension-line {
    position: absolute;
    height: 1px !important;
    background-color: #000 !important;
    z-index: 100;
    visibility: visible !important; 
    opacity: 1 !important;
}