/* Keep the app offer in normal page flow so it never covers medicine content. */
.carex-app-install, .carex-app-install * { box-sizing: border-box; }
.carex-app-install {
    align-items: center;
    background: linear-gradient(120deg, #064e49, #0b655c);
    border: 1px solid #198578;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(6, 78, 73, .22);
    color: #fff;
    display: grid;
    font-family: "Roboto", Arial, sans-serif;
    gap: 10px 12px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    margin: 24px 0;
    min-width: 0;
    padding: 16px 20px;
    width: 100%;
}
.carex-app-install[hidden] { display: none; }

/* Show identity, offer and install action in one compact row on larger screens. */
.carex-app-install__identity {
    align-items: center;
    display: flex;
    gap: 10px;
    min-width: 0;
}
.carex-app-install__icon {
    background: #fff;
    border-radius: 11px;
    flex: 0 0 40px;
    height: 40px;
    object-fit: contain;
    padding: 4px;
    width: 40px;
}
.carex-app-install__content { min-width: 0; }
.carex-app-install__content h2 {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.3px;
    line-height: 1.2;
    margin: 0 0 3px;
}
.carex-app-install__store {
    align-items: center;
    color: #d7f6ed;
    display: flex;
    font-size: 11px;
    gap: 5px;
    line-height: 16px;
}
.carex-app-install__store img { height: 14px; object-fit: contain; width: 12px; }

/* Keep the offer beside the action; preserve "up to" while highlighting the maximum saving. */
.carex-app-install .carex-app-install__offer {
    color: #fff;
    font-size: 13px;
    line-height: 1.45;
    margin: 0;
}
.carex-app-install__offer strong { color: #ffe082; font-weight: 700; white-space: nowrap; }
.carex-app-install__button {
    align-items: center;
    background: #ffd54f;
    border: 1px solid #ffd54f;
    border-radius: 11px;
    color: #173c35 !important;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 6px;
    justify-content: center;
    line-height: 1.3;
    min-height: 44px;
    padding: 10px 12px;
    text-decoration: none !important;
    white-space: nowrap;
}
.carex-app-install__button:hover { background: #ffe082; border-color: #ffe082; }
.carex-app-install__button svg { flex-shrink: 0; }

/* Preserve a clear keyboard focus indicator on the remaining interactive control. */
.carex-app-install__button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

/* Stack identity above the offer and action on narrow phones without horizontal overflow. */
@media (max-width: 575px) {
    .carex-app-install {
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 14px;
    }
    .carex-app-install__identity { grid-column: 1 / -1; }
}
@media (max-width: 359px) {
    .carex-app-install { gap: 8px; padding: 12px; }
    .carex-app-install__button { gap: 5px; padding: 10px; }
}

/* Installed standalone clients and printed pages do not need an install invitation. */
@media (display-mode: standalone) {
    .carex-app-install { display: none; }
}
@media print {
    .carex-app-install { display: none; }
}
