/* ============================================
   BUTTONS - Sistema de botones
   ============================================ */

.btn {
    transition: all 0.15s ease;
    color: #333333;
    padding: 7px 11px;
    font-size: 10px;
    font-weight: 600;
    border: 1px solid rgba(0,0,0,0.1);
}

/* Botones específicos de herramientas */
.btn[onclick*="perimeter"],
.btn[id*="perimeterBtn"],
button[id*="perimeterBtn"] {
    background-color: #e3f2fd !important;
    color: #333 !important;
}

.btn[onclick*="area"],
.btn[id*="areaBtn"],
button[id*="areaBtn"] {
    background-color: #fff3e0 !important;
    color: #333 !important;
}

.btn[onclick*="perimeter"]:hover,
.btn[id*="perimeterBtn"]:hover,
button[id*="perimeterBtn"]:hover {
    background-color: #bbdefb !important;
    color: #333 !important;
}

.btn[onclick*="area"]:hover,
.btn[id*="areaBtn"]:hover,
button[id*="areaBtn"]:hover {
    background-color: #ffe0b2 !important;
    color: #333 !important;
}

.btn-portante,
.btn[onclick*="measurePortante"],
[id*="measurePortanteBtn"] {
    background-color: #ffebee !important;
    color: #333 !important;
}

.btn-no-portante,
.btn[onclick*="measureNoPortante"],
[id*="measureNoPortanteBtn"] {
    background-color: #fffde7 !important;
    color: #333 !important;
}

.btn[onclick*="clearFloor"],
.btn-danger {
    background-color: #ffebee !important;
    color: #333 !important;
}

.btn[onclick*="exportFloor"],
.btn-info {
    background-color: #e3f2fd !important;
    color: #333 !important;
}

.btn-success,
.btn[onclick*="confirm"],
[id*="confirmBtn"],
[id*="confirmPortanteBtn"],
[id*="confirmNoPortanteBtn"],
[id*="confirmPerimeterBtn"],
[id*="confirmAreaBtn"] {
    background-color: #e8f5e8 !important;
    color: #333 !important;
}

.btn-primary {
    background: var(--gray-200);
    border: 1px solid var(--gray-300);
    color: var(--gray-700);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    font-weight: 500;
}

.btn-primary:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: white !important;
    box-shadow: 0 2px 8px rgba(30, 58, 138, 0.3);
}

.btn-success {
    background: var(--gray-200);
    border: 1px solid var(--gray-300);
    color: var(--gray-700);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    font-weight: 500;
}

.btn-success:hover {
    background: var(--success);
    border-color: var(--success);
    color: white !important;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.3);
}

.btn-warning {
    background: var(--gray-200);
    border: 1px solid var(--gray-300);
    color: var(--gray-700);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    font-weight: 500;
}

.btn-warning:hover {
    background: var(--warning);
    border-color: var(--warning);
    color: white !important;
    box-shadow: 0 2px 8px rgba(217, 119, 6, 0.3);
}

.btn:hover {
    color: var(--gray-800) !important;
    background: var(--bg-hover);
    border-color: var(--gray-400);
}