/* Style dla formularzy */

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

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

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

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

    input::placeholder {
        font-size: 0.75rem;
        opacity: 0.5;
    }

    input:focus{
        outline:2px solid var(--primary);
    }

    input[type="checkbox"]{
        min-height: 0px; /*Naprawia wczesniej nadany 36px minimalny height dla input fieldow */
        width: 1rem;
        height: 1rem;
        margin-right: 0.5rem;
        outline: none;
    }

    input[type="radio"]{
        min-height: 0px;/*Naprawia wczesniej nadany 36px minimalny height dla input fieldow */
        width: 1rem;
        height: 1rem;
        margin-right: 0.5rem;
        outline: none;
    }
    
    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;
        min-height: 36px;
        border-radius: 10px;
        margin: 0px;
        padding: 0.25rem 0.75rem;
        font-size: 0.8rem;
        line-height: 1rem;
        white-space: nowrap;
        transition: background-color 0.5s ease;
        cursor: pointer;
    }

    input[type="submit"]:hover {
        background-color: var(--secondary);
        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.75rem;
        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);
    }

    button{
        width:100%;
        background-color: var(--primary);
        color: var(--whitetxt);
        border:0rem;
        border-radius:0rem;
        padding:0.5rem;
        cursor:pointer;
    }
    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 */