[ Avaa Bypassed ]

/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 05.01.2018, 17:26:23
    Author     : saeed
*/

$textColor : white; 
$ionContentColor : #000 !important;
$itemColor : black;
$avatarBgColor : azure;
$itemInnerColor : yellow;
$ionLabelColor : yellow;
$messageBgColor : #333333;
$headerBgColor : black;
$inputBorderColor : yellowgreen;
$pColor : white;
$inputBgColor : black;
$toolbarTitleColor : yellow;
$toolbarBgColor : black;
$addFriendDialogBgColor : black;
$btnBorderColor : steelblue;
$btnBgColor : black;
$inputBorderColor : #00b7ff;
$menuItemColor : #666666;
$navarBtnColor : yellow;
$addFriendDialogInputColor : #00b7ff;
$h1Color : yellow;
$fabBtnBgColor : black;
$actionSheetTitleColor : #90a207;
$actionSheetBgColor : black;
$actionSheetBtnColor : yellow;
$addFriendDialogInputBgColor : #676767;
$sendToolsBtnBorderColor : white;
$footerBgColor : black;
$sendToolsBgColor : black;
$sendToolsBtnColor : white;
$iconColor : yellow;
$fabIconColor : white;

$black: #000;
$dark: #3e3e3e;
$gray: #717171;
$white: #fff;
$primary:#3880ff;

.dark-theme {
        h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .toolbar-title,
    .bar-button-default,
    body,
    div {
      transition: all 1.1s ease;
      color: $textColor;
    }
    .item {
        background: $menuItemColor;
    }
    ion-content {
        /*background-color: $ionContentColor;*/
        transition: all 1.1s ease;
        background-color: $dark;
        //--ion-background-color:#000;
        //--ion-background-color: var(--ionContentColor);
        --background:$dark;
        ion-item.item {
            // border: 1px solid greenyellow;
            background-color: $itemColor;
            transition: all 1.1s ease;
            background-color: $black !important;
            --background:$black !important;
            /*background: #666666 !important;*/
            color:$white !important;
            ion-icon, .titleArea {
                color:$white !important;
            }


            ion-avatar {
                margin: 0px;
                margin-bottom: 0px;
                margin-right: 6px;
                border-radius: 100%;
                /*width: 50px;*/
                /*height : 50px;*/
                /*height: 100%;*/
                background: $avatarBgColor;
                p {
                    background: none;
                    text-align: center;
                    /*vertical-align: middle;*/
                    margin-top: 4px;
                    font-size: 30px;
                    /*margin: 0px;*/
                    /*padding: 0px;*/
                }
            }
            .item-inner {
                border-color: $itemInnerColor;
                border-bottom: 1px solid;
                ion-label.label {
                    color : $itemInnerColor;
                }
            }
        }
        ion-list {
                    ion-label.label {
                        color : $ionLabelColor;
                    }
        }

        message {
            background : $messageBgColor; 
            border-radius: 5px;
            word-item {
                ion-item {
                    padding : 0px;
                    div.item-inner {

                        padding : 0px;
                        ion-icon.speechIcon {
                            position: absolute;
                            right: 2px;
                        }
                        ion-label {
                            margin : 0px;
                        }
                    }
                    ion-row {
                        color : #c5c5c5;
                    }
                    ion-col {
                        padding-top: 0px;
                        padding-bottom: 0px;
                        color : #c5c5c5;
                    }
                }
                ion-grid {
                    padding : 0px;
                    color: $gray;
                }
                noun {
                    p {
                        color : $black;

                    }
                }
                verb {
                    button {
                        padding : 6px;
                    }
                }
            }
        }
    }
    .header .toolbar-title{
        /*color : white;*/
    }
    .header .toolbar-background {
        background-color: $headerBgColor;
    }
    ion-header {
        ion-title {
            .toolbar-title{
                color : $toolbarTitleColor;
            }
        }
        ion-input {
            border : 1px solid $inputBorderColor;
            background: $inputBgColor;
        }
        ion-toolbar.toolbar {
                       ion-buttons {
                    button {
                        color: $navarBtnColor;
                    }
                }
            .toolbar-background {
                background: $toolbarBgColor;
            }
            
        }
    }
    ion-action-sheet {
        .action-sheet-wrapper {
            .action-sheet-title {
                color : $actionSheetTitleColor;
            }
            .action-sheet-container {
                background : $actionSheetBgColor;
                button {
                    color : $actionSheetBtnColor;
                }
            }
        }
    }
    ion-slide.swiper-slide {
        background: black;
    }
    comp-footer {
        /*background-color: black;*/
        background: $footerBgColor;
        .bayaTab{
            p {
                color : $pColor;
            }
        }
        ion-icon {
            color :$iconColor;
        }
        
    }
        dialog-menu-option-message {
           .optionMenu {
                background: gray;
                border: 1px solid rgb(149, 168, 214);
                box-shadow: 1px 1px 10px rgba(66, 66, 66, 0.4588235294117647);
           }
    }
    example-modal,conjugation-modal {
        background: #545454;
    }
    chat-input {
        ion-fab {
            height: 100%;
            background : $sendToolsBgColor;
            width: 42px;
            ion-icon {
                color : $fabIconColor;
                font-size: 20px;
            }
            button {
                background : $sendToolsBgColor;
                border : 1px solid $sendToolsBtnColor;
                border-radius: 15%;
                /*height :100%;*/
            }
        }
        
        .sendTools {
            min-height: 45px;
            background-color: $sendToolsBgColor;
            ion-col.mic,ion-col.send {
                 background: $sendToolsBgColor;
                 border-radius: 15%;
                 /*border: $sendToolsBtnBorderColor solid 1px;*/

            }
            .micBtn,.sendBtn{
                background: $sendToolsBgColor;
                /*border-radius: 40%;*/
                height: 100%;
                border-radius:15%;
                color : $sendToolsBtnColor;
            }
            ion-item {
                background-color: black;
            }
        }
    }
    ion-fab {
        button.fab{
            background-color: $fabBtnBgColor;
                border-radius: 17px;
        }
    }
    add-friend-dialog {
        .dialog {
            ion-card.card {
                border-radius: 8px;
                h1 { color : $h1Color; }
                ion-input {    
                    border-radius: 10px;
                    border: 1px solid $addFriendDialogInputColor;
                    background: $addFriendDialogInputBgColor;
                    width: 99%;
                    border: 1px solid $inputBorderColor;
                    margin: 12px auto 12px auto;
                }
                button {
                        border-radius: 11px;
                        padding: 19px;
                        padding-left: 29px;
                        border: 1px solid $btnBorderColor;
                        background: $btnBgColor;
                        padding-right: 29px;
                }
                button.cancel{
                        float: right;
                        width: 99px;
                }
                background: $addFriendDialogBgColor;
            }
        }
    }

    
}

.dark-theme {
    .menu-content, .menu-list, ion-toolbar, .toolsRow, .toolsRow ion-item {
        background-color: $black !important;
        transition: all 1.1s ease;
        --background:$black !important;
    }
    ion-fab-button {
        --background:$black !important;
        span {
            color:$white;
        }
    }
    comp-footer ion-icon {
        color: $primary;
    }
    collection {
        background-color: #191919;
    }
    ion-toolbar {
        ion-icon, ion-title {
            color:$white;
        }
    }
    ion-toggle {
        --background: #ccc;
    }
    .lang-setting {
        background-color: #424242  !important;
        ion-list {
            --ion-background-color: #424242  !important;
            ion-item {
                background-color: #424242  !important;
            }
        }
    }
    .textToShare {
        background: rgba(0, 0, 0, 0.25) !important;
    }
}