/*
 * MWFewoManager
 *
 * @author Küstenweb GmbH <info@mwfewomanager.de>
 * @copyright mwfewomanager.de
 */

/* --------------------------------------------------
   Toast (global)
-------------------------------------------------- */

#toast-container {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    pointer-events: none;
}

.toast {
    position: relative;
    pointer-events: auto;
    min-width: 280px;
    max-width: 380px;
    background: var(--frontend-core-color-surface);
    color: var(--frontend-core-color-text);
    border-radius: .75rem;
    padding: 1rem 1.2rem 1rem 1rem;
    box-shadow: var(--frontend-core-shadow-light);
    border-left: 4px solid var(--frontend-core-color-info);
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    opacity: 0;
    transform: translateY(-10px);
    animation: toast-in .3s ease forwards;
}

.toast--success { border-left-color: var(--frontend-core-color-success); }
.toast--error   { border-left-color: var(--frontend-core-color-danger); }
.toast--info    { border-left-color: var(--frontend-core-color-info); }
.toast--warn    { border-left-color: var(--frontend-core-color-warning); }

.toast__icon { flex-shrink: 0; font-size: 1.4rem; margin-top: .2rem; }
.toast__body { flex: 1; display: flex; flex-direction: column; }
.toast__title { font-weight: 600; margin-bottom: .25rem; font-size: .95rem; color: var(--frontend-core-color-text); }
.toast__message { line-height: 1.4; color: var(--frontend-core-color-muted); font-size: .9rem; }

.toast__counter {
    position: absolute;
    top: .6rem;
    right: 2rem;
    font-size: .8rem;
    color: var(--frontend-core-color-muted);
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.toast__close {
    position: absolute;
    top: .4rem;
    right: .4rem;
    background: transparent;
    border: none;
    font-size: 1.1rem;
    color: var(--frontend-core-color-muted);
    cursor: pointer;
    padding: .2rem;
    transition: color .2s;
}

.toast__close:hover { color: var(--frontend-core-color-text); }

@keyframes toast-in { to { opacity: 1; transform: translateY(0); } }
@keyframes toast-out { to { opacity: 0; transform: translateY(-10px); } }

/* --------------------------------------------------
   Buttons – Base Layout
-------------------------------------------------- */

:root {
    --btn-bg: transparent;
    --btn-color: var(--color-text);
    --btn-border: var(--border-color);
}

/*:is(a, button, input[type="submit"]).btn,*/
/*button.submit {*/
/*    --btn-bg: transparent;*/
/*    --btn-color: var(--color-text);*/
/*    --btn-border: var(--border-color);*/

/*    display: inline-flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    gap: .5rem;*/

/*    min-height: 2.5rem;*/
/*    padding: .5rem 1rem;*/

/*    font-size: .95rem;*/
/*    font-weight: 500;*/
/*    line-height: 1;*/

/*    border-radius: var(--border-radius);*/
/*    border: 1px solid var(--btn-border);*/

/*    background: var(--btn-bg);*/
/*    color: var(--btn-color);*/

/*    transition: background-color .15s ease,*/
/*    border-color .15s ease,*/
/*    color .15s ease,*/
/*    box-shadow .15s ease,*/
/*    transform .05s ease;*/
/*}*/

/*:is(a, button, input[type="submit"]).btn:hover {*/
/*    background: color-mix(in srgb, var(--btn-bg) 90%, #000 5%);*/
/*    color: var(--btn-color);*/
/*}*/

/*:is(a, button, input[type="submit"]).btn:active {*/
/*    transform: translateY(1px);*/
/*}*/

/*:is(a, button, input[type="submit"]).btn:focus-visible {*/
/*    outline: 2px solid var(--color-primary);*/
/*    outline-offset: 2px;*/
/*}*/

:is(a, button, input[type="submit"]).btn:disabled,
:is(a, button, input[type="submit"]).btn[disabled] {
    opacity: .6;
    cursor: not-allowed;
}

/* Variants */

:is(a, button, input[type="submit"]).btn--primary {
    --btn-bg: var(--btn-primary-bg);
    --btn-color: var(--btn-primary-text);
    --btn-border: var(--btn-primary-border);
}

:is(a, button, input[type="submit"]).btn--primary:hover {
    --btn-bg: var(--btn-primary-bg-hover);
    --btn-border: var(--btn-primary-bg-hover);
}

/*button.submit {*/
/*    --btn-bg: var(--btn-primary-bg);*/
/*    --btn-color: var(--btn-primary-text);*/
/*    --btn-border: var(--btn-primary-border);*/
/*}*/

/*button.submit:hover {*/
/*    --btn-bg: var(--btn-primary-bg-hover);*/
/*    --btn-border: var(--btn-primary-bg-hover);*/
/*}*/

:is(a, button, input[type="submit"]).btn--secondary {
    --btn-bg: var(--btn-secondary-bg);
    --btn-color: var(--btn-secondary-text);
    --btn-border: var(--btn-secondary-border);
}

:is(a, button, input[type="submit"]).btn--secondary:hover {
    --btn-bg: var(--btn-secondary-bg-hover);
}

:is(a, button, input[type="submit"]).btn--clear {
    --btn-bg: var(--btn-clear-bg);
    --btn-border: var(--btn-clear-border);
    --btn-color: var(--btn-clear-text);
}

:is(a, button, input[type="submit"]).btn--cancel {
    --btn-bg: var(--btn-cancel-bg);
    --btn-border: var(--btn-cancel-border);
    --btn-color: var(--btn-cancel-text);
}

:is(a, button, input[type="submit"]).btn--apply {
    --btn-bg: var(--btn-apply-bg);
    --btn-border: var(--btn-apply-border);
    --btn-color: var(--btn-apply-text);
}

:is(a, button, input[type="submit"]).btn--apply:hover {
    --btn-bg: var(--btn-apply-bg-hover);
}

:is(a, button, input[type="submit"]).btn--prev,
:is(a, button, input[type="submit"]).btn--next,
:is(a, button, input[type="submit"]).btn--close {
    background: var(--btn-bg);
    color: var(--btn-color);
}

:is(a, button, input[type="submit"]).btn--prev:hover,
:is(a, button, input[type="submit"]).btn--next:hover,
:is(a, button, input[type="submit"]).btn--close:hover{
    background: color-mix(in srgb, var(--btn-bg) 90%, #000 5%);
    color: var(--btn-color);
}


/* Booking */
:is(a, button, input[type="submit"]).btn--book {
    --btn-bg: var(--btn-book-bg);
    --btn-border: var(--btn-book-border);
    --btn-color: var(--btn-book-text);
}

:is(a, button, input[type="submit"]).btn--book:hover {
    --btn-bg: var(--btn-book-bg-hover);
    --btn-border: var(--btn-book-bg-hover);
}

/* Request */
:is(a, button, input[type="submit"]).btn--request {
    --btn-bg: var(--btn-request-bg);
    --btn-border: var(--btn-request-border);
    --btn-color: var(--btn-request-text);
}

:is(a, button, input[type="submit"]).btn--request:hover {
    --btn-bg: var(--btn-request-bg-hover);
    --btn-border: var(--btn-request-bg-hover);
}

/* Danger */
:is(a, button, input[type="submit"]).btn--danger {
    --btn-bg: var(--btn-danger-bg);
    --btn-border: var(--btn-danger-border);
    --btn-color: var(--btn-danger-text);
}

:is(a, button, input[type="submit"]).btn--danger:hover {
    --btn-bg: var(--btn-danger-bg-hover);
    --btn-border: var(--btn-danger-bg-hover);
}

/* Stepper Buttons */
:is(a, button, input[type="submit"]).btn--increment,
:is(a, button, input[type="submit"]).btn--decrement {
    width: var(--personpicker-stepper-min-width);
    height: var(--personpicker-stepper-min-width);
    padding: 0;
    font-size: 1.1rem;
    /*border-radius: 50%;*/
    --btn-bg: var(--btn-stepper-bg);
    --btn-border: var(--btn-stepper-border);
    --btn-color: var(--btn-stepper-text);
}

:is(a, button, input[type="submit"]).btn--increment:hover,
:is(a, button, input[type="submit"]).btn--decrement:hover {
    --btn-bg: var(--btn-stepper-bg-hover);
}

/* Legacy aliases */
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-muted { color: var(--frontend-core-color-muted); }
.text-center { text-align: center; }
.text-right { text-align: right; }
.hidden { display: none; }

/* Legacy grid helpers */
.row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -1rem;
    margin-right: -1rem;
}
.col {
    padding-right: 1rem;
    padding-left: 1rem;
    flex: 1 1 0;
    max-width: 100%;
    position: relative;
    width: 100%;
    min-height: 1px;
}



.error {
    color: var(--color-danger);
    font-size: 0.9rem;
}

.price-range {
    display: flex;
    align-items: center;
    gap: .5rem;
}