html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* --- Room Visualizer and Furniture Panel Styles (migrated) --- */
.main-flex-row {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    align-items: flex-start;
    width: 100%;
    overflow-x: auto;
}
.room-panel {
    flex: 2 1 0%;
    min-width: 350px;
    max-width: 100%;
}
.furniture-panel {
    flex: 1 0 320px;
    min-width: 320px;
    max-width: 400px;
}
@media (max-width: 900px) {
    .main-flex-row {
        flex-direction: column;
        gap: 1.5rem;
        align-items: stretch;
    }
    .room-panel, .furniture-panel {
        min-width: 0;
        max-width: 100%;
    }
}
@media (max-width: 600px) {
    .main-flex-row {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    .room-panel, .furniture-panel {
        min-width: 0;
        max-width: 100%;
    }
    .card {
        margin-bottom: 1rem;
    }
    .room-action-btn, .btn, button {
        font-size: 1.1rem;
        min-width: 100px;
        height: 44px;
        padding: 0.5rem 1rem;
    }
    .furniture-item img {
        width: 48px;
        height: 48px;
    }
}
#camera, #roomCanvas {
    max-width: 100%;
    height: auto;
    background-color: #000;
}
.furniture-grid {
    max-height: 600px;
    overflow-y: auto;
}
.furniture-item {
    cursor: grab;
    transition: transform 0.2s;
    margin: 0.25rem;
}
.furniture-item:hover {
    transform: scale(1.05);
}
.furniture-item img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    max-width: unset;
    max-height: unset;
}
.placed-furniture {
    user-select: none;
    display: inline-block;
    transform-origin: center center;
    perspective: 1000px;
}
.placed-furniture img {
    pointer-events: none;
    width: 150px;
    height: auto;
    transition: none;
    backface-visibility: visible;
}
.resize-handle {
    z-index: 1001;
    background-color: white !important;
    border: 1px solid #666 !important;
    margin: 0.25rem;
}
.resize-handle:hover {
    background-color: #ddd !important;
}
.rotate-handle {
    z-index: 1001;
    background-color: white !important;
    border: 1px solid #666 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    margin: 0.25rem;
}
.rotate-handle:hover {
    background-color: #ddd !important;
}
.rotate-horizontal {
    cursor: grab;
}
.rotate-vertical {
    cursor: grab;
}
.btn-success {
    background-color: #28a745;
    border-color: #28a745;
}
.btn-success:hover {
    background-color: #218838;
    border-color: #1e7e34;
}
.room-action-btn {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
    min-width: 80px;
    height: 32px;
    border-radius: 0.2rem;
    line-height: 1.5;
}