////
///
/// Placeholder Utility Classes
/// ===========================================================================
///
/// CSS classes for input placeholder styling.
/// All functionality is defined in mixins - classes only include them.
///
/// @group Classes.BodyAtoms.Inputs
/// @author Scape Agency
/// @link https://scape.style
/// @since 0.2.10
/// @access public
///
////

// ============================================================================
// Use
// ============================================================================

@use "../../../mixins/body_atoms/inputs/input_placeholder" as *;

// ============================================================================
// Utility Classes
// ============================================================================

///
/// Apply the placeholder styling across various browsers
///
::placeholder,
:-moz-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-ms-input-placeholder,
::-webkit-input-placeholder {
    @include input_placeholder;
}

///
/// Apply the placeholder styling to input fields
///
input.placeholder,
input::placeholder,
input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input::-ms-input-placeholder,
input::-webkit-input-placeholder {
    @include input_placeholder;
}

///
/// Apply the placeholder styling specifically for text inputs
///
input[type="text"].placeholder,
input[type="text"]::placeholder,
input[type="text"]:-moz-placeholder,
input[type="text"]::-moz-placeholder,
input[type="text"]:-ms-input-placeholder,
input[type="text"]::-ms-input-placeholder,
input[type="text"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="date"].placeholder,
input[type="date"]::placeholder,
input[type="date"]:-moz-placeholder,
input[type="date"]::-moz-placeholder,
input[type="date"]:-ms-input-placeholder,
input[type="date"]::-ms-input-placeholder,
input[type="date"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="email"].placeholder,
input[type="email"]::placeholder,
input[type="email"]:-moz-placeholder,
input[type="email"]::-moz-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="email"]::-ms-input-placeholder,
input[type="email"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="password"].placeholder,
input[type="password"]::placeholder,
input[type="password"]:-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="password"]::-ms-input-placeholder,
input[type="password"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="tel"].placeholder,
input[type="tel"]::placeholder,
input[type="tel"]:-moz-placeholder,
input[type="tel"]::-moz-placeholder,
input[type="tel"]:-ms-input-placeholder,
input[type="tel"]::-ms-input-placeholder,
input[type="tel"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="url"].placeholder,
input[type="url"]::placeholder,
input[type="url"]:-moz-placeholder,
input[type="url"]::-moz-placeholder,
input[type="url"]:-ms-input-placeholder,
input[type="url"]::-ms-input-placeholder,
input[type="url"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="search"].placeholder,
input[type="search"]::placeholder,
input[type="search"]:-moz-placeholder,
input[type="search"]::-moz-placeholder,
input[type="search"]:-ms-input-placeholder,
input[type="search"]::-ms-input-placeholder,
input[type="search"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="number"].placeholder,
input[type="number"]::placeholder,
input[type="number"]:-moz-placeholder,
input[type="number"]::-moz-placeholder,
input[type="number"]:-ms-input-placeholder,
input[type="number"]::-ms-input-placeholder,
input[type="number"]::-webkit-input-placeholder {
    @include input_placeholder;
}

input[type="file"].placeholder,
input[type="file"]::placeholder,
input[type="file"]:-moz-placeholder,
input[type="file"]::-moz-placeholder,
input[type="file"]:-ms-input-placeholder,
input[type="file"]::-ms-input-placeholder,
input[type="file"]::-webkit-input-placeholder {
    @include input_placeholder;
}

///
/// Apply the placeholder styling for text areas
///
textarea.placeholder,
textarea::placeholder,
textarea:-moz-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder,
textarea::-ms-input-placeholder,
textarea::-webkit-input-placeholder {
    @include input_placeholder;
}

///
/// Apply the placeholder styling for select elements
///
select.placeholder,
select::placeholder,
select:-moz-placeholder,
select::-moz-placeholder,
select:-ms-input-placeholder,
select::-ms-input-placeholder,
select::-webkit-input-placeholder {
    @include input_placeholder;
}

// ============================================================================
// Placeholder Styling on Focus
// ============================================================================

///
/// Apply placeholder focus styling for inputs and other fields
/// @group Form
///
:focus.placeholder,
:focus::placeholder,
:focus:-moz-placeholder,
:focus::-moz-placeholder,
:focus:-ms-input-placeholder,
:focus::-ms-input-placeholder,
:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

///
/// Apply placeholder focus styling for input fields
/// @group Form
///
input:focus.placeholder,
input:focus::placeholder,
input:focus:-moz-placeholder,
input:focus::-moz-placeholder,
input:focus:-ms-input-placeholder,
input:focus::-ms-input-placeholder,
input:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="text"]:focus.placeholder,
input[type="text"]:focus::placeholder,
input[type="text"]:focus:-moz-placeholder,
input[type="text"]:focus::-moz-placeholder,
input[type="text"]:focus:-ms-input-placeholder,
input[type="text"]:focus::-ms-input-placeholder,
input[type="text"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="date"]:focus.placeholder,
input[type="date"]:focus::placeholder,
input[type="date"]:focus:-moz-placeholder,
input[type="date"]:focus::-moz-placeholder,
input[type="date"]:focus:-ms-input-placeholder,
input[type="date"]:focus::-ms-input-placeholder,
input[type="date"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="email"]:focus.placeholder,
input[type="email"]:focus::placeholder,
input[type="email"]:focus:-moz-placeholder,
input[type="email"]:focus::-moz-placeholder,
input[type="email"]:focus:-ms-input-placeholder,
input[type="email"]:focus::-ms-input-placeholder,
input[type="email"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="password"]:focus.placeholder,
input[type="password"]:focus::placeholder,
input[type="password"]:focus:-moz-placeholder,
input[type="password"]:focus::-moz-placeholder,
input[type="password"]:focus:-ms-input-placeholder,
input[type="password"]:focus::-ms-input-placeholder,
input[type="password"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="tel"]:focus.placeholder,
input[type="tel"]:focus::placeholder,
input[type="tel"]:focus:-moz-placeholder,
input[type="tel"]:focus::-moz-placeholder,
input[type="tel"]:focus:-ms-input-placeholder,
input[type="tel"]:focus::-ms-input-placeholder,
input[type="tel"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="url"]:focus.placeholder,
input[type="url"]:focus::placeholder,
input[type="url"]:focus:-moz-placeholder,
input[type="url"]:focus::-moz-placeholder,
input[type="url"]:focus:-ms-input-placeholder,
input[type="url"]:focus::-ms-input-placeholder,
input[type="url"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="search"]:focus.placeholder,
input[type="search"]:focus::placeholder,
input[type="search"]:focus:-moz-placeholder,
input[type="search"]:focus::-moz-placeholder,
input[type="search"]:focus:-ms-input-placeholder,
input[type="search"]:focus::-ms-input-placeholder,
input[type="search"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="number"]:focus.placeholder,
input[type="number"]:focus::placeholder,
input[type="number"]:focus:-moz-placeholder,
input[type="number"]:focus::-moz-placeholder,
input[type="number"]:focus:-ms-input-placeholder,
input[type="number"]:focus::-ms-input-placeholder,
input[type="number"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

input[type="file"]:focus.placeholder,
input[type="file"]:focus::placeholder,
input[type="file"]:focus:-moz-placeholder,
input[type="file"]:focus::-moz-placeholder,
input[type="file"]:focus:-ms-input-placeholder,
input[type="file"]:focus::-ms-input-placeholder,
input[type="file"]:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

textarea:focus.placeholder,
textarea:focus::placeholder,
textarea:focus:-moz-placeholder,
textarea:focus::-moz-placeholder,
textarea:focus:-ms-input-placeholder,
textarea:focus::-ms-input-placeholder,
textarea:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}

select:focus.placeholder,
select:focus::placeholder,
select:focus:-moz-placeholder,
select:focus::-moz-placeholder,
select:focus:-ms-input-placeholder,
select:focus::-ms-input-placeholder,
select:focus::-webkit-input-placeholder {
    @include input_placeholder_focus;
}
