app-vihar-info {
    ion-content {
        ion-segment {
            padding: var(--ion-padding-10);
            background: var(--ion-color-white);
            margin-top: var(--ion-margin-15);

            ion-segment-button {
                min-height: 30px;
                --indicator-height: 0;
                background: #efefef;
                text-transform: capitalize;

                ion-label {
                    margin: var(--ion-margin-0);
                    font-size: var(--ion-font-size-14);
                    letter-spacing: 0;
                }

                &.segment-button-checked {
                    border-radius: 5px;
                    background: var(--ion-color-sant);
                    color: #fff;

                    ion-label {
                        color: #fff;
                    }
                }

                &:first-child {
                    border-radius: 8px 0 0 8px;

                    &.segment-button-checked {
                        border-radius: 5px;
                    }
                }

                &:last-child {
                    border-radius: 0 8px 8px 0;

                    &.segment-button-checked {
                        border-radius: 5px;
                    }
                }
            }
        }

        h3 {
            p {
                color: var(--ion-color-sant);
                margin-top: var(--ion-margin-10);
            }
        }

        p {
            font-size: var(--ion-font-size-14);
            padding: var(--ion-padding-0) var(--ion-padding-15);
            margin-top: var(--ion-margin-0);
            color: var(--ion-content-color);
        }

        .bottom-bg-location {
            padding: var(--ion-padding-0) var(--ion-padding-15) var(--ion-padding-15);

            ion-card {
                margin: var(--ion-margin-15) var(--ion-margin-0) var(--ion-margin-0) var(--ion-margin-0);

                ion-card-header {
                    padding: var(--ion-padding-15) var(--ion-padding-10);
                    position: relative;

                    ion-card-title {
                        margin-bottom: var(--ion-margin-25);
                        display: flex;

                        h5 {
                            margin: var(--ion-margin-0) var(--ion-margin-0) 5px var(--ion-margin-0);
                        }

                        p {
                            padding: var(--ion-padding-0);
                            font-size: var(--ion-font-size-12);
                            font-weight: 500;
                            margin-bottom: 5px;
                        }

                        ion-icon {
                            width: 23px;
                            height: 23px;
                            padding: 3px;
                            background: var(--ion-background-content-sant);
                            border-radius: var(--ion-border-radius-100);
                            color: var(--ion-color-sant);
                            margin-right: var(--ion-margin-10);
                            position: relative;
                            contain: inherit;
                        }

                        &:last-child {
                            ion-icon {
                                &:before {
                                    display: none;
                                }
                            }

                            margin-bottom: var(--ion-margin-0);
                        }

                        ion-button {
                            margin: var(--ion-margin-0);
                            position: absolute;
                            right: 35px;
                            height: auto;
                            top: -10px;

                            &::part(native) {
                                --background: none;
                                padding: var(--ion-padding-0);
                                box-shadow: none;
                            }

                            ion-icon {
                                margin: var(--ion-margin-0);
                            }

                            &.ion-activated {
                                &::part(native) {
                                    --background-activated: none;
                                }
                            }

                            &.delete {
                                right: 0;

                                ion-icon {
                                    color: red;
                                    background: var(--ion-background-content);
                                }
                            }
                        }

                        &:first-child {
                            &:before {
                                position: absolute;
                                content: "";
                                width: 1px;
                                height: 150%;
                                top: 0;
                                left: 14px;
                                border-left: 1px dashed var(--ion-content-color-sant);
                                z-index: 0;
                            }
                        }

                        .right-data {
                            width: calc(100% - 40px);
                        }
                    }

                    .live-label {
                        background: var(--ion-color-sant);
                        color: var(--ion-color-white);
                        padding: 3px 5px 3px 18px;
                        position: absolute;
                        top: 50px;
                        right: 0;
                        font-size: 12px;

                        &::before {
                            content: "";
                            position: absolute;
                            left: 0;
                            transform: rotate(225deg);
                            top: 20px;
                            width: 15px;
                            height: 15px;
                            border-top: 15px var(--ion-color-white) solid;
                            transform-origin: top left;
                        }
                    }
                }

                ion-card-content {
                    border-top: 1px solid #efefef;
                    padding: var(--ion-padding-10);

                    div {
                        display: flex;
                        justify-content: space-between;
                    }

                    p {
                        padding: var(--ion-padding-0);
                        font-size: var(--ion-font-size-14);

                        span {
                            color: var(--ion-color-sant);
                        }
                    }

                    .contact-icon {
                        ion-icon {
                            margin-left: 10px;
                        }
                    }
                }
            }
        }

        ion-fab {
            width: 46px;
            height: 46px;
            margin: var(--ion-margin-0) var(--ion-margin-10) var(--ion-margin-10) 0;

            ion-fab-button {
                width: 100%;
                height: 100%;

                &::part(native) {
                    --background: var(--ion-color-sant);
                }
            }
        }
    }
}

ion-modal {
    ion-item::part(detail-icon) {
        display: none;
    }
}