/* Style dla formularzy */

/* KLASY OGÓLNE */
    /* DOMYŚLNE WYSTYLIZOWANIE FORMULARZA */
    form{
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0;
        gap: 0.5rem;
    }

    textarea{
        padding: 0.5rem;
        border-radius:10px;
        border:1px solid var(--borders);
        width:100%;
        font-size: 0.825rem;
    }

    textarea:focus{
        outline:2px solid var(--primary);
        border:1px solid var(--white);
    }
    
    textarea[type="color"] {
        cursor: pointer;
        padding:0rem;
    }

    input{
        padding: 0.5rem;
        border-radius:10px;
        border:1px solid var(--borders);
        width:100%;
        font-size: 0.825rem;
    }

    .input_div {
        position: relative; 
        display: flex; 
        flex-direction: column; 
        align-items: flex-start; 
        width:100%; 
        margin-top:10px;
    }
    .input_title_div{
        position: absolute; 
        top: -0.575rem; 
        left: 0.625rem; 
        white-space: nowrap; 
        padding: 0px 8px; 
        background-color: var(--white); 
        border-radius: 10px;
        font-size: 0.75rem;
        font-weight: 400;
        margin:0px;
    }

    input:focus{
        outline:2px solid var(--primary);
        border:1px solid var(--white);
    }
    
    input[type="color"] {
        cursor: pointer;
        padding:0rem;
    }

    input[type="file"] {
        
    }

    input[type="submit"] {
        width:100%;
        background-color: var(--primary);
        color: var(--whitetxt);
        border:0rem;
        border-radius:0rem;
        padding:0.5rem;
        cursor:pointer;
    }

    input[type="submit"]:hover {
        background-color: var(--primary);
        color: var(--whitetxt);
        filter: brightness(1.2); /* Rozjasni o 20% */
        cursor:pointer;
    }

    select{
        display: flex;
        flex-direction: row;
        text-align: center;
        border: 1px solid var(--borders);
        outline: none;
        padding: 0.5rem;
        border-radius:10px;
        width:100%;
        font-size: 0.825rem;
        background-color: var(--white);
        appearance: none; /* Wyłącza domyślny wygląd */
        -webkit-appearance: none; /* Dla WebKit (Safari, iOS) */
        -moz-appearance: none; /* Dla Mozilli */

        background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='black' d='M1.41 0L6 4.58 10.59 0 12 1.41 6 7.41 0 1.41z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 0.5rem center;
        background-size: 10px 6px;
        padding-right: 1.25rem; /* żeby tekst nie nachodził na strzałkę */
    }
    
    select:focus{
        outline:2px solid var(--primary);
        border:1px solid var(--white);
    }

    button{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width:100%;
        background-color: var(--primary);
        color: var(--whitetxt);
        border:0rem;
        border-radius:0rem;
        padding:0.5rem;
        cursor:pointer;
    }
    button:hover{
        background-color: var(--primary);
        color: var(--whitetxt);
        filter: brightness(1.2); /* Rozjasni o 20% */
        cursor:pointer;
        outline: none;
    }
    button:focus{
        background-color: var(--primary);
        color: var(--whitetxt);
        filter: brightness(1.2); /* Rozjasni o 20% */
        cursor:pointer;
        outline: none;
    }
    button:disabled {
        cursor: not-allowed;
        pointer-events: none; /* nie pozwala na kliknięcie */
    }

    a {
        text-decoration: none;  /* Usuwa podkreślenie */
        color: inherit;         /* Dziedziczy kolor z elementu nadrzędnego */
        outline: none;
        cursor: pointer;
    }
    
    a:hover,
    a:focus {
        text-decoration: none;  /* Usuwa podkreślenie na hover/focus */
        color: inherit;         /* Dziedziczy kolor z elementu nadrzędnego */
        outline: none;
    }
    
    a:active {
        color: inherit;         /* Usuwa domyślny kolor aktywnego linku */
        outline: none;
    }

    .pointer {
        cursor: pointer;
    }
    
/*KONIEC KLASY OGÓLNE */


/* KLASY DESKTOP */
    @media (min-width: 1300px) {
        /*  */
        .d-{}
    }
/* KONIEC KLASY DESKTOP */


/* KLASY TABLET */
    @media (min-width: 768px) and (max-width: 1299px) {
        /*  */
        .t-{}
    }
/* KONIEC KLASY TABLET */


/* KLASY MOBILE */
    @media (max-width: 767px) {
        /*  */
        .m-{}
    }
/* KONIEC KLASY MOBILE */