/*  Kubra styles                                            */
/*  for produktLogika® Configurator Client                  */
/*                                                          */
/*  (c) nanoLogika GmbH, 2024                               */
/*                                                          */
/*  Color Scheme Kubra                                      */
/*      Rot:            #FF0000                             */
/*      Dunkelrot:      #A60000                             */
/*      Dunkelgrau:     #4D4D4D                             */
/*      Hellgrau:       #B3B3B3                             */
/************************************************************/

@import "main-window-styles.css";
@import "main-window-3D.css";
@import "pm-layout.css";
@import "pm-styles.css";
@import "pm-checkboxradio.css";
@import "icomoon.css";
@import "orbitcontrols.css";


@font-face {
	font-family: 'Meta Offc Pro';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/MetaOffcPro-Norm.ttf') format('truetype') /* Safari, Android, iOS */
}

body, input, select, button {
    font-family: 'Meta Offc Pro';
}

select option {
    font-family: 'Meta Offc Pro';
}

#renderer-container-svg {
    background-image: url("../images/Logo.png");
    background-size: 100px;
    background-position: left 20px bottom 20px;
    background-repeat: no-repeat;

    background-color: #212830;
    width: 100% !important;
    max-width: 100% !important;
    height: 100%;

    border-right: 1px solid var(--red);

    min-width: calc(50% - var(--configurator-container-width));
}

#renderer-container {
    background-image: url("../images/Logo.png");
    background-size: 100px;
    background-position: left 20px bottom 20px;
    background-repeat: no-repeat;
}

/* TODO: Change to Orbit Control Buttons */
#color-toggle-button {
    position: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50px 50px;
    border: 1px solid var(--red);
    top: 10px;
    left: 10px;
    width: 50px;
    height: 50px;
}
#color-toggle-button.black {
    background-image: url("../images/rect_black_white.svg");
}
#color-toggle-button.white {
    background-image: url("../images/rect_white_black.svg");
}

#zoom-reset-button {
    position: fixed;
    background-image: url("../images/zoom-reset.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50px 50px;
    border: 1px solid var(--red);
    top: 10px;
    left: 70px;
    width: 50px;
    height: 50px;
}
/* End TODO */

.debug {
    visibility: hidden;
}

/* smaller buttons for color picker */
.pm-picker-btn,
.pm-picker-btn-selected {
    width: 32px;
    height: 32px;
    margin-top: 0px;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    vertical-align: middle;
    background-size: contain;
}

.pm-table-cell-1 {
    width: 200px;
}

.pm-readonly-choice .pm-text-value {
    font-weight: bold;
}

.pm-table-cell-1 {
    width: 350px;
}

.pm-parameter-editor .pm-caption {
    color: var(--headline-text-color);
    font-weight: bold;
}