/* =========================
   COLORES LOYALTYPRO
   ========================= */
:root {
    --lp-primary: #164A5A; /* azul oscuro */
    --lp-accent: #F7941D; /* naranja */
    --lp-bg: #F4F7FA; /* fondo suave */
    --lp-text: #1F2A33;
}

/* Fondo general */
html, body {
    background-color: var(--lp-bg) !important;
    font-family: "Segoe UI", Arial, sans-serif;
}

/* =========================
   HEADER
   ========================= */

/* Barra superior */
#header {
    background-color: #ffffff !important; /* fondo blanco */
    border-bottom: 3px solid var(--lp-accent); /* línea naranja */
    padding: 8px 0;
}

    /* Contenido del header centrado y en flex */
    #header .swagger-ui-wrap {
        max-width: 1100px;
        margin: 0 auto;
        display: flex;
        align-items: center;
    }

/* Logo LoyaltyPro usando el <a id="logo"> original */
#logo {
    display: inline-block;
    width: 180px;
    height: 32px;
    background-image: url('https://api.loyaltypro.mx/images/LoyaltyProLogo.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    text-indent: -9999px; /* esconde el texto interno */
    overflow: hidden;
    pointer-events: none; /* que no sea clickeable a swagger.io */
}

    /* Ocultar imagen y texto originales de Swagger dentro del logo */
    #logo .logo__img,
    #logo .logo__title {
        display: none !important;
    }

/* Formulario (URL, api_key, botón) alineado a la derecha */
#api_selector {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
}

    /* Quitar márgenes raros de los div.input */
    #api_selector .input {
        margin: 0;
    }

/* Campos de URL y api_key */
#header #input_baseUrl,
#header #input_apiKey {
    border-radius: 4px;
    border: 1px solid #d0d4e4;
    padding: 4px 6px;
}

#header #input_baseUrl {
    width: 420px;
}

#header #input_apiKey {
    width: 120px;
}

/* Botón Explore */
#header #explore {
    background-color: var(--lp-accent) !important;
    border-radius: 4px;
    border: none;
    text-transform: uppercase;
    font-weight: 600;
    color: #ffffff !important;
    padding: 6px 14px;
}

/* =========================
   CONTENIDO PRINCIPAL
   ========================= */

/* Solo los .swagger-ui-wrap que cuelgan directo del body (no el del header) */
body > .swagger-ui-wrap {
    max-width: 1100px;
    margin: 25px auto 40px auto;
}

    /* Título principal "LoyaltyProWebAPI" */
    body > .swagger-ui-wrap h1 {
        color: var(--lp-primary);
        font-weight: 600;
        margin-bottom: 20px;
    }

/* =========================
   RECURSOS (Articulo, Empresa, etc.)
   ========================= */
.resource {
    margin-bottom: 10px;
}

    .resource .heading {
        border-bottom: 1px solid #d0d4e4;
        padding: 8px 0;
    }

    .resource h2 {
        color: var(--lp-primary);
        font-size: 20px;
    }

    /* Links Show/Hide, List Operations, etc. */
    .resource .heading ul li a {
        color: var(--lp-accent) !important;
    }

/* =========================
   OPERACIONES
   ========================= */
.operation {
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

/* Colores de métodos */
.get .http_method a {
    background-color: #3498db !important;
}

.post .http_method a {
    background-color: #27ae60 !important;
}

.put .http_method a {
    background-color: #f39c12 !important;
}

.delete .http_method a {
    background-color: #e74c3c !important;
}

/* Texto dentro de los bloques */
.opblock-summary,
.content {
    color: var(--lp-text);
}

/* =========================
   OCULTAR [ BASE URL: , API VERSION: v1 ]
   ========================= */
.swagger-ui-wrap .info {
    display: none !important;
}

#input_baseUrl {
    display: none !important;
}

#explore {
    display: none !important;
}

#validator {
    display: none !important;
}