@extends('mobile.layout.index')
@section('title')

@endsection
@push('css-mobile')
    <script src="/plugins/socket/socket-2.0.4.js"></script>
    <script src="/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <link rel="stylesheet" href="/chat_files/jquery-ui.min.css">
    <link rel="stylesheet" href="/chat_files/font-awesome.min.css">
    <link rel="stylesheet" href="/chat_files/emojione.min.css">
    <link rel="stylesheet" href="/chat_files/emojionearea.min.css">
    <script src="/chat_files/nanoscroller.min.js"></script>
    <script src="https://unpkg.com/vue@2.6.12/dist/vue.js"></script>
    <script src="/chat_files/lodash.min.js"></script>
    <script src="/js/vue-paginate.js"></script>
    <script>
        var laravel_authorization_data = {
            "media-write": true,
            "tag-write": true,
        };

        function authorize(expression, target) {
            return _.get(laravel_authorization_data, expression, false);
        }

        Vue.prototype.authorize = authorize;

    </script>
    {{--    <link rel="stylesheet" href="{{asset('css/tag/app.css')}}">--}}
    <link rel="stylesheet" href="/css/mobile/chat-11.css?v={{config("sns-line.version")}}">
    <script src="/plugins/socket/socket-2.0.4.js"></script>
    <style>
        .label-mb-card{
            background-color: rgb(8, 191, 149);
            color: white;
            margin: 0 auto;
            padding: 7px;
            border-radius: 4px;
            text-align: center;
        }
        .box-folder{
            display: flex;
            justify-content: space-between;
            border: 2px solid #08bf95;
            border-radius: 4px;
            color: #08bf95;
            padding: 4px 7px 0;
            align-items: baseline;
            margin-top: 25px !important;
        }
        .title-mb-modal{
            color: #08bf95;
            font-size: 16px;
            font-weight: 600;
            margin: 0 auto;
            text-align: center;
            padding: 11px;
        }
        .item-label{
            display: flex;
            justify-content: flex-start;
            align-items: flex-start;
            margin-top: 8px
        }
        .remove-label{
            color: rgba(87,153,219,1) ;
            font-size: 19px;
            margin-right: 8px
        }
        .url-check{
            display: flex;
            align-items: center;
            margin-left: 6px;
        }
        .url-check input{
            margin-right: 10px;
        }
        .url-check label{
            font-weight: initial;
        }
        .radio-ml label{
            margin-left: 6px;
        }
        #mbModalChatSetting input[type=checkbox] {
            transform: scale(1.5);
        }
        #mbModalChatSetting .checkbox {
            margin-left: 6px;
        }
        #mbModalChatSetting input[type=radio] {
            transform: scale(1.5);
            margin-right: 8px;
        }
        #mbModalChatSetting .modal-footer {
            border-top: unset;
            background-color: rgba(248,248,248,1);
            justify-content: space-around;
        }
        #mbModalChatSetting .modal-footer .btn-primary{
            background-color: rgba(87,153,219,1);
            border-color: rgba(87,153,219,1);
            width: 68px;
        }
        #mbModalChatSetting .modal-footer .btn-clear{
            background-color: rgb(195, 195, 195);
        }
        .ml-10{
            margin-left: 10px;
        }
        .ic-file-i{
            font-size: 19px;
            color: white;
            padding: 11px;
            border-radius: 50%;
            background: #7d9094;
            margin-right: 8px;
        }
        .box-file-a{
            background: #aaaaaa5e;
            border-radius: 5px;
            padding: 7px;
            margin: 5px;
            display: flex;
            align-items: flex-start;
        }
        .div-icon-file{
            width: 45px;
            height: 45px;
            border-radius: 50%;
            background: #7d9094;
            text-align: center;
            float: left;
            margin-right: 10px  ;
        }
        .div-ic-download-file{
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: #b0c1c57a;
            text-align: center;
            margin: 0 auto;
        }
        #areaEmoji{
            padding: 9px;
        }
    </style>
@endpush
@section('content')