/* Apoapsis Cloud: el área de clientes con la paleta y el aire de www.apoapsis.cl
   (cabecera blanca con sombra, fondos slate, azul #1a73e8, botones azul→cian, pie navy).
   Se carga después de theme.min.css de Twenty-One; solo se tocan los selectores de ese tema. */

:root {
    --ap-azul: #1a73e8;
    --ap-azul-oscuro: #1557b0;
    --ap-cian: #0891b2;
    --ap-navy: #1b2937;
    --ap-navy-suave: #2d3e50;
    --ap-slate-50: #f8fafc;
    --ap-slate-200: #e2e8f0;
    --ap-slate-500: #64748b;
    --ap-slate-700: #334155;
    --ap-slate-900: #0f172a;
    --ap-sombra: 0 10px 25px rgba(15, 23, 42, .06);
}

body,
body.primary-bg-color {
    background-color: var(--ap-slate-50);
    color: var(--ap-slate-900);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--ap-azul); }
a:hover { color: var(--ap-azul-oscuro); }

/* Cabecera: blanca, pegada arriba, con el borde y la sombra del sitio */
.header {
    background-color: #fff;
    border-bottom: 1px solid var(--ap-slate-200);
    box-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 10px 20px -15px rgba(15, 23, 42, .15);
}
.header .navbar-light { padding-top: .75rem; padding-bottom: .5rem; }
.logo-img { max-height: 56px; }
.main-navbar-wrapper { background-color: #fff; }
#nav > li > a,
.main-navbar-wrapper .navbar-nav .nav-link {
    color: var(--ap-slate-700);
    font-weight: 500;
}
#nav > li > a:hover,
#nav > li.active > a,
.main-navbar-wrapper .navbar-nav .nav-link:hover { color: var(--ap-azul); }
.navbar-nav.toolbar .nav-link { color: var(--ap-slate-500); }
.navbar-nav.toolbar .nav-link:hover { color: var(--ap-azul); }

/* Botones: degradado azul→cian y esquinas redondeadas, como los CTA del sitio */
.btn { border-radius: .75rem; font-weight: 600; }
.btn-primary,
.btn-styled,
.btn-success {
    color: #fff;
    border: 0;
    background: linear-gradient(90deg, #2563eb, var(--ap-cian));
    box-shadow: 0 4px 14px rgba(37, 99, 235, .25);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-styled:hover, .btn-success:hover {
    color: #fff;
    background: linear-gradient(90deg, #1d4ed8, #0e7490);
}
.btn-default,
.btn-secondary,
.btn-light {
    color: var(--ap-slate-700);
    background-color: #fff;
    border: 1px solid var(--ap-slate-200);
}
.btn-default:hover, .btn-secondary:hover, .btn-light:hover {
    color: var(--ap-azul);
    background-color: var(--ap-slate-50);
    border-color: var(--ap-azul);
}

/* Tarjetas y paneles: esquinas amplias, borde tenue y sombra suave */
.card,
.panel,
.tile {
    border: 1px solid rgba(226, 232, 240, .7);
    border-radius: 1rem;
    box-shadow: var(--ap-sombra);
}
.card-header, .panel-heading { border-radius: 1rem 1rem 0 0; }
.action-icon-btns a {
    border-radius: 1rem;
    border: 1px solid rgba(226, 232, 240, .7);
    box-shadow: var(--ap-sombra);
    color: var(--ap-slate-700);
}
.action-icon-btns a:hover { color: var(--ap-azul); transform: translateY(-2px); }
.card-accent-teal, .card-accent-pomegranate, .card-accent-sun-flower, .card-accent-asbestos,
.card-accent-carrot, .card-accent-emerald, .card-accent-peter-river, .card-accent-wisteria {
    border-top-color: var(--ap-azul);
}

/* Formularios: foco azul, bordes slate */
.form-control { border-color: var(--ap-slate-200); border-radius: .5rem; }
.form-control:focus {
    border-color: var(--ap-azul);
    box-shadow: 0 0 0 .2rem rgba(26, 115, 232, .2);
}
.field-icon { color: var(--ap-slate-500); }

/* Breadcrumb: sin franja gris bajo la cabecera */
.master-breadcrumb { background-color: #fff; border-bottom: 1px solid var(--ap-slate-200); }
.master-breadcrumb .breadcrumb { background: transparent; margin-bottom: 0; }

/* Avisos y tablas */
.alert { border-radius: .75rem; }
.table thead th { border-top: 0; color: var(--ap-slate-500); font-weight: 600; }
.badge, .label { border-radius: .5rem; }

/* Pie: degradado navy como el de apoapsis.cl */
.footer {
    background: linear-gradient(180deg, var(--ap-navy-suave), var(--ap-navy));
    color: rgba(255, 255, 255, .85);
    padding: 40px 0 60px;
}
.footer a { color: #fff; }
.footer a:hover { color: #7cc4ff; }
.back-to-top { background-color: var(--ap-azul); }

/* Tienda (order form standard_cart). Su all.min.css se carga después de este archivo, por eso los selectores
   llevan «body» delante. En el listado de planes se oculta el sidebar (una sola categoría, «ver carrito» ya está
   en la cabecera) y queda solo el selector de divisa; los planes van de a tres en una sola fila. */
@media (min-width: 1200px) {
    body #order-standard_cart .row:has(> .cart-body .products) > .cart-sidebar { display: none; }
    body #order-standard_cart .row:has(> .cart-body .products) > .cart-body { float: none; width: 100%; }
    body #order-standard_cart .cart-body:has(.products) .sidebar-collapsed { display: block; }
}
body #order-standard_cart .cart-body:has(.products) .sidebar-collapsed { margin: 0; padding: 0; }
body #order-standard_cart .cart-body:has(.products) .sidebar-collapsed > .panel { display: none; }
body #order-standard_cart .sidebar-collapsed .form-inline { margin-bottom: .5rem; }
body #order-standard_cart .products { display: flex; flex-wrap: wrap; margin: 10px -15px; }
body #order-standard_cart .products > .row { display: contents; }
@media (min-width: 992px) {
    body #order-standard_cart .products .col-md-6 { flex: 0 0 33.3333%; max-width: 33.3333%; }
}
body #order-standard_cart .cart-sidebar .list-group-item.active,
body #order-standard_cart .cart-sidebar .list-group-item.active:hover {
    color: var(--ap-azul);
    background-color: #eef4ff;
    border-color: var(--ap-slate-200);
    font-weight: 600;
}

/* Cada plan: nombre arriba, lista «etiqueta … valor» a lo ancho y, pegado abajo, precio a la izquierda y botón a la derecha */
body #order-standard_cart .products .product {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
    margin: 0 0 1.5rem;
    border: 1px solid rgba(226, 232, 240, .8);
    border-radius: 1rem;
    box-shadow: var(--ap-sombra);
    overflow: hidden;
}
body #order-standard_cart .products .product header {
    margin: 0;
    padding: 1.1rem 1.5rem .9rem;
    background: #fff;
    border-bottom: 2px solid var(--ap-azul);
    border-radius: 0;
}
body #order-standard_cart .products .product header span {
    color: var(--ap-slate-900);
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -.01em;
}
body #order-standard_cart .products .product div.product-desc {
    float: none;
    width: auto;
    padding: .5rem 1.5rem 0;
    font-size: .9rem;
}
body #order-standard_cart .products .product div.product-desc ul { margin: 0; padding: 0; list-style: none; }
body #order-standard_cart .products .product div.product-desc ul li {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    padding: .4rem 0;
    border-bottom: 1px solid #f1f5f9;
    color: var(--ap-slate-500);
}
body #order-standard_cart .products .product div.product-desc ul li:last-child { border-bottom: 0; }
body #order-standard_cart .products .product div.product-desc ul li::before {
    content: "\2713";
    flex: 0 0 auto;
    color: var(--ap-azul);
    font-weight: 700;
}
body #order-standard_cart .products .product span.feature-value {
    order: 2;
    margin-left: auto;
    text-align: right;
    font-weight: 600;
    color: var(--ap-slate-900);
}
body #order-standard_cart .products .product div.product-desc ul li.feature-no,
body #order-standard_cart .products .product li.feature-no span.feature-value { color: #cbd5e1; font-weight: 500; }
body #order-standard_cart .products .product div.product-desc ul li.feature-no::before { content: "\2013"; color: #cbd5e1; }
body #order-standard_cart .products .product footer {
    float: none;
    width: auto;
    margin: auto 0 0;
    padding: 1rem 1.5rem 1.25rem;
    border-top: 1px solid #f1f5f9;
    font-size: .85rem;
    text-align: left;
    color: var(--ap-slate-500);
}
body #order-standard_cart .products .product div.product-pricing { margin: 0; line-height: 1.3; }
body #order-standard_cart .products .product div.product-pricing span.price {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--ap-slate-900);
    letter-spacing: -.02em;
}
body #order-standard_cart .products .product .btn-order-now {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    margin: .9rem 0 0;
    padding: .65rem 1.1rem;
    font-size: .95rem;
}
body #order-standard_cart .products .product .btn-order-now .fas { margin-right: .4rem; }

/* Carrito: sin la pestaña «Estimar impuestos»; el IVA se aplica igual a todos y solo confunde */
body #order-standard_cart .view-cart-tabs .nav-item:has(> a[href="#calcTaxes"]),
body #order-standard_cart .view-cart-tabs #calcTaxes { display: none; }

/* Checkout: el aviso de entorno seguro como nota neutra, con el candado centrado a la altura del texto.
   Sin flex: el texto va suelto junto al <strong> de la IP y flex lo partiría en tres columnas. */
body #order-standard_cart .checkout-security-msg {
    position: relative;
    margin: 1.25rem 0;
    padding: .9rem 1.25rem .9rem 4.25rem;
    font-size: .85rem;
    line-height: 1.5;
    color: var(--ap-slate-700);
    background-color: #eef4ff;
    border: 1px solid #c7dafc;
    border-radius: .75rem;
}
body #order-standard_cart .checkout-security-msg i {
    float: none;
    position: absolute;
    left: 1.25rem;
    top: 50%;
    margin: 0;
    transform: translateY(-50%);
    font-size: 1.75rem;
    color: var(--ap-azul);
}
