/*
Theme Name: Oral Design Dental Lab CRM
Theme URI: https://oraldesign.gt
Author: Oral Design CAD/CAM & Dental Lab
Author URI: https://oraldesign.gt
Description: Tema oficial para WordPress de Oral Design Dental Lab con autenticación nativa de WordPress (AJAX wp_signon), sincronización automática de usuarios en WordPress (wp-admin/users.php), roles personalizados de odontología, menú lateral fijo permanente, portal clínico digital, seguimiento de órdenes CAD/CAM, escaneos 3D STL, catálogo oficial y facturación FEL SAT.
Version: 1.5.0
Requires at least: 5.8
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oral-design-crm
Tags: dental, medical, laboratory, crm, portal, clinic, cad-cam, responsive-layout, full-width-template
*/

/* Core Reset */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    min-height: 100vh !important;
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

#oral-design-portal-app {
    display: flex !important;
    flex-direction: row !important;
    min-height: 100vh !important;
    width: 100% !important;
    background-color: #f1f5f9 !important;
    position: relative !important;
}

/* 100% FIXED SIDEBAR - NEVER SCROLLS OFF SCREEN */
#sidebarNav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 18rem !important; /* 288px */
    min-width: 18rem !important;
    max-width: 18rem !important;
    height: 100vh !important;
    flex-shrink: 0 !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    background-color: #0f172a !important;
    color: #ffffff !important;
    border-right: 1px solid #1e293b !important;
    z-index: 40 !important;
    overflow-y: auto !important;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.08) !important;
}

/* Main Content Wrapper - Permanently offset by 18rem so content never goes under sidebar */
.portal-main-content {
    margin-left: 18rem !important; /* 288px */
    width: calc(100% - 18rem) !important;
    min-width: 0 !important;
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    background-color: #f8fafc !important;
}

/* Topbar Sticky Header */
.portal-topbar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 0.75rem 1.5rem !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Custom scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.tooth-btn.selected {
    background-color: #059669 !important;
    color: #ffffff !important;
    border-color: #047857 !important;
    transform: scale(1.06) !important;
}

.badge-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}

/* WordPress Admin Bar Compatibility */
body.admin-bar #sidebarNav {
    top: 32px !important;
    height: calc(100vh - 32px) !important;
}
@media (max-width: 782px) {
    body.admin-bar #sidebarNav {
        top: 46px !important;
        height: calc(100vh - 46px) !important;
    }
}