@charset "UTF-8";

/* APP DEFAULT SETTING -> BACK AND COLOR */
:root {
 --back-color-default: var(--luna-black);
 --color-default: var(--luna-white);
 --link: var(--luna-yellow);

 /* TABLE HTML */
 --th-back-color: #080808;
 --tr-nth-child: var(--luna-light);

 /* PANEL */
 --panel-head-back-color: #080808;
 --panel-body-back-color: var(--back-color-default);

 /* BACKGROUND COLOR */
 --back-color-dark: var(--luna-dark);
 --back-color-light: var(--luna-white);
 --back-color-row: var(--back-color-default);

 /* BORDER */
 --border-default: var(--luna-silver);
 --luna-border-color-default: var(--luna-silver);
 --luna-text-color-default: var(--luna);

 /* BUTTON */
 --btn-delete-back-color: var(--color-red);
 --btn-delete-text-color: var(--color-white);

 /* CARD */
 --card-back-color: var(--back-color-default);
 --card-border-color: var(--border-default);
 --card-box-shadow-color: var(--border-default);

 /* DETAILS */
 --details-back-color: var(--back-color-default);
 --details-border-color: var(--border-default);
 --details-border-radius: 4px;

 /* FORM */
 --form-back-color: var(--back-color-default);
 --form-control-back-color: var(--back-color-default);
 --form-box-shadow: var(--luna);
 --form-text: var(--luna);

 /* INCONS */
 --icon-back-color: var(--back-color-default);
 --icon-color: var(--color-default);
 --icon-link: var(--color-blue);

 --icon-set-layout-active-back-color: var(--luna-light);
 --icon-delete-color: transparent;
 --icon-delete-text-color: var(--color-white);

 /* INPUT HTML */
 --inputs-text: var(--color-default);
 --input-back-color: var(--back-color-default);
 --input-placeholder-text: var(--color-default);

 /* LIST UL OL AND LI */
 --list-header-back-color: var(--back-color-default);

 /* MODAL */
 --modal-back-color: var(--back-color-default);
 --modal-content-back-color: var(--back-color-default);
 --modal-content-border: var(--color-silver);
 --modal-close: var(--color-default);
 --modal-close-focus: var(--color-default);

 /* NAVBAR */
 --nav-back-color: var(--back-color-default);
 --nav-link: var(--color-default);

 /* NAVBAR */
 --nav-dark-back-color: var(--luna-dark);
 --nav-light-back-color: var(--luna-light);

 /* PROMPT */
 --prompt-back-color: var(--luna-dark);
 --prompt-text-color: var(--color-white);

 /* TEXT */
 --text-pagination: var(--color-white);
}

label,
span,
strong {
 background: transparent;
 color: var(--color-default);
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
 filter: invert(1);
}