/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements.  See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

/* Expansion Panels */

/* stylelint-disable-next-line at-rule-no-unknown */
@use 'sass:map';

@mixin fds-expansion-panels-theme($theme) {
    $primary-color: map.get(map.get($theme, primary), 500);
    $primary-color-hover: map.get(map.get($theme, primary), 100);
    $accent-color: map.get(map.get($theme, accent), 500);
    $accent-color-hover: map.get(map.get($theme, accent), 100);

    body[fds] td-expansion-panel:not(:last-of-type) .td-expanded {
        margin-bottom: 0;
    }

    body[fds] .td-expansion-panel-header-content {
        height: 80px !important;
        padding: 0 30px !important;
        border-bottom: 1px solid $grey7;
    }

    body[fds] .td-expansion-content {
        background: $grey6;
    }

    body[fds] .td-expansion-content form {
        padding: 15px 10px 20px 20px;
    }

    body[fds] td-expansion-panel .td-expansion-panel-header .td-expansion-panel-header-content mat-icon.td-expand-icon {
        font-size: 28px;
        color: $accent-color;
        font-weight: bold;
    }

    body[fds] td-expansion-panel .td-expansion-panel-header {
        &:focus {
            background: #fff;
        }

        &:hover:not(.mat-disabled) {
            background: $accent-color-hover;
        }
    }

    body[fds] td-expansion-panel .td-expansion-panel-header:focus .td-expansion-panel-header-content {
        border-bottom: 1px solid $primary-color;
    }

    body[fds] .td-expansion-label {
        font-size: 20px;
    }
}