/* ===== Fotomar SAT - Cliente osTicket ===== */

body {
    background: #eef2f6 !important;
    font-family: Arial, Helvetica, sans-serif !important;
}

#container {
    width: 94% !important;
    max-width: 1180px !important;
    margin: 24px auto !important;
    background: #fff !important;
    border: 1px solid #d9e3ee !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 28px rgba(0,0,0,.16) !important;
    overflow: hidden !important;
}

#header {
    height: auto !important;
    min-height: 95px !important;
    padding: 28px 42px 22px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%) !important;
    border-bottom: 1px solid #dce6f0 !important;
}

#header #logo {
    width: auto !important;
    height: auto !important;
}

#header #logo img {
    max-height: 70px !important;
    width: auto !important;
}

#header p {
    padding-top: 0 !important;
    font-size: 14px !important;
}

#nav {
    height: auto !important;
    margin: 0 32px !important;
    padding: 0 14px !important;
    background: #ffffff !important;
    border: 1px solid #dce6f0 !important;
    border-radius: 8px !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.08) !important;
}

#nav li a {
    height: auto !important;
    line-height: normal !important;
    padding: 14px 18px 14px 34px !important;
    color: #12304f !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
}

#nav li a.active,
#nav li a:hover {
    background-color: #eef6ff !important;
    color: #0078d7 !important;
}

#content {
    padding: 36px 52px 48px !important;
    margin: 0 !important;
    min-height: 430px !important;
}

/* Contenedor portada */
#landing_page {
    width: 100% !important;
    min-height: 360px !important;
    padding: 42px 46px !important;
    box-sizing: border-box !important;
    background: linear-gradient(135deg, #ffffff 0%, #f4f9ff 100%) !important;
    border: 1px solid #dce8f5 !important;
    border-radius: 14px !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.06) !important;
    overflow: hidden !important;
}

/* Columna derecha real de osTicket */
#landing_page .sidebar {
    width: 280px !important;
    float: right !important;
    margin: 24px 0 0 42px !important;
    padding: 0 !important;
    background: transparent !important;
}

#landing_page .sidebar .content {
    display: none !important;
}

#landing_page .front-page-button {
    margin: 0 !important;
    padding: 0 !important;
}

#landing_page .front-page-button p {
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
}

#landing_page .front-page-button a.button {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    padding: 14px 18px !important;
    border-radius: 8px !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: 0 5px 12px rgba(0,0,0,.20) !important;
}

#landing_page .front-page-button a.blue {
    background: linear-gradient(135deg, #1596e8 0%, #006eb8 100%) !important;
}

#landing_page .front-page-button a.green {
    background: linear-gradient(135deg, #18b84a 0%, #079337 100%) !important;
}

/* Columna izquierda real */
#landing_page .main-content {
    margin: 0 340px 0 0 !important;
    padding: 0 !important;
    width: auto !important;
    overflow: visible !important;
}

#landing_page .thread-body {
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    background: transparent !important;
    border: none !important;
}

#landing_page .sat-landing {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#landing_page .sat-landing h1 {
    color: #0d2c4d !important;
    font-size: 32px !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;
    margin: 0 0 22px !important;
    border-bottom: 4px solid #0078d7 !important;
    display: inline-block !important;
    padding-bottom: 12px !important;
}

#landing_page .sat-landing p {
    color: #263747 !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    margin: 0 0 13px !important;
    max-width: 760px !important;
}

#footer {
    background: #0d2c4d !important;
    color: #d8e6f5 !important;
    padding: 18px !important;
    text-align: center !important;
}

#footer a {
    color: #d8e6f5 !important;
}

@media (max-width: 850px) {
    #container {
        width: 96% !important;
    }

    #content {
        padding: 24px !important;
    }

    #landing_page {
        padding: 28px !important;
    }

    #landing_page .sidebar {
        float: none !important;
        width: 100% !important;
        margin: 24px 0 0 0 !important;
    }

    #landing_page .main-content {
        margin: 0 !important;
    }

    #landing_page .sat-landing h1 {
        font-size: 30px !important;
    }
}

/* ===== Ajuste barra navegación cliente ===== */

#nav {
    margin: 0 32px !important;
    padding: 0 18px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid #dce6f0 !important;
    border-radius: 8px !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.08) !important;
}

#nav li {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 28px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#nav li a {
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 0 0 28px !important;
    margin: 0 !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    color: #12304f !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-bottom: 3px solid transparent !important;
}

#nav li a.active,
#nav li a:hover {
    background-color: transparent !important;
    color: #0078d7 !important;
    border-bottom-color: #0078d7 !important;
}


/* ===== Ajuste final: alinear ancho del menú con tarjeta principal ===== */

#nav {
    margin: 0 52px !important;
    padding: 2px 10px !important;
    height: 44px !important;
    display: block !important;
    background: #ffffff !important;
    border: 1px solid #dce6f0 !important;
    border-radius: 8px !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.08) !important;
}

#nav li {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#nav li a {
    display: block !important;
    float: left !important;
    height: 40px !important;
    line-height: 40px !important;
    padding: 0 18px 0 34px !important;
    margin: 0 12px 0 0 !important;
    background-color: transparent !important;
    border-radius: 8px !important;
    border-bottom: none !important;
    color: #12304f !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

#nav li a.active {
    background-color: #eef6ff !important;
    color: #0078d7 !important;
}

#nav li a:hover {
    background-color: #eef6ff !important;
    color: #0078d7 !important;
}