@charset "utf-8";




/******************************************************************** Shadow content ************************************************/
@media only screen and (min-width: 10px)
{

	/******************************************************************** Checkout Form ************************************************/
	.mpwpb_styles .checkout .custom-form-container
	{
        display: flex;
        justify-content: left;
        align-items: center;
		/* padding-top: 5em; */
        /* height: 100vh; */
    }

    .mpwpb_styles .checkout .custom-form
	{
        min-width: 400px;
        margin: 0 auto;
        padding: 20px;
        background: #f4f4f4;
        border: 1px solid #ccc;
        border-radius: 5px;
    }

	.mpwpb_styles .checkout .custom-form h2
	{
		text-align: center;
	}

    .mpwpb_styles .checkout .custom-form label
	{
        display: block;
        margin-bottom: 10px;
    }

    .mpwpb_styles .checkout .custom-form input[type="text"],
    .mpwpb_styles .checkout .custom-form input[type="email"],
    .mpwpb_styles .checkout .custom-form select,
    .mpwpb_styles .checkout .custom-form textarea
	{
        width: 100%;
        padding: 10px;
        margin-bottom: 15px;
        border: 1px solid #ccc;
        border-radius: 3px;
    }

    .mpwpb_styles .checkout .custom-form textarea
	{
        resize: vertical;
    }

	.mpwpb_styles .checkout .custom-form input[type="radio"],
    .mpwpb_styles .checkout .custom-form input[type="checkbox"]
	{
        margin-right: 5px;
    }

    .mpwpb_styles .checkout .custom-form button
	{
        background-color: #0073cc;
		color: white;
		margin: 10px 10px 10px 0;
        border: none;
        padding: 10px 20px;
        cursor: pointer;
        border-radius: 3px;
    }

	/******************************************************************** Checkout Tab List ************************************************/

	.mpwpb_styles .checkout .tab-container
	{
		display: flex;
		padding: 20px;
	}

	.mpwpb_styles .checkout .tab-menu
	{
		list-style: none;
		margin: 0;
		padding: 0;
		background-color: #d5d9dc;
		border-right: 3px solid #02223b;
	}

	.mpwpb_styles .checkout .tab-menu h3
	{
		font-weight: bold;
		text-align: center;
	}

	.mpwpb_styles .checkout .tab-item
	{
		font-size: 16px;
		padding: 10px 20px;
		cursor: pointer;
		color: #666;
		transition: color 0.3s ease-in-out;
	}

	.mpwpb_styles .checkout .tab-item:hover
	{
		color: #333;
	}

	.mpwpb_styles .checkout .tab-item.active
	{
		color: #fff;
		background-color: #333;
	}

	.mpwpb_styles .checkout .tab-content-container
	{
		flex-grow: 1;
	}

	.mpwpb_styles .checkout .tab-content
	{
		display: none;
		padding: 20px;
		background-color: #f8f8f8;
	}

	.mpwpb_styles .checkout .tab-content.active
	{
		display: block;
		background-color: #d5d9dc;
	}

	.mpwpb_styles .checkout .text-switch-button
	{
		display: inline;
	}

	.mpwpb_styles .checkout .hl
	{
		display: flex;
		height: 3px;
		background-color: #02223b;
		margin: 10px 0;
	}

	.mpwpb_styles .checkout .tab-container .action-button
	{
        display: flex;
		justify-content: right;
        align-items: right;

    }

    .mpwpb_styles .checkout .tab-container .action-button .button
	{
        display: flex;
        align-items: center;
		min-height: 26px;
        cursor: pointer;
		background-color: #0073cc;
		color: white;
		margin: 10px;
		border-radius: 5px;
    }

    .mpwpb_styles .checkout .tab-container .action-button .dashicons
	{
        margin-right: 5px;
    }

	/********************************************************* Modal ***************************/

    .mpwpb_styles .checkout .modal
	{
        display: none !important;
        position: fixed !important;
		z-index: 99999 !important;
		background-color: rgba(0, 0, 0, 0.4) !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        height: 100% !important;
        overflow-y: auto !important;
    }

    .mpwpb_styles .checkout .modal.modal-show {
        display: block !important;
    }

    .mpwpb_styles .checkout .modal-content {
        background-color: white !important;
        margin: 10% auto !important;
        padding: 20px !important;
        border: 1px solid #888 !important;
        width: 80% !important;
        max-width: 500px !important;
        position: relative !important;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
        border-radius: 5px !important;
        z-index: 100000 !important;
    }

    .mpwpb_styles .checkout .close {
        position: absolute !important;
        top: 0 !important;
        right: 10px !important;
        font-size: 24px !important;
        font-weight: bold !important;
        cursor: pointer !important;
        color: #333 !important;
        z-index: 100001 !important;
    }

    .mpwpb_styles .checkout .close:hover {
        color: #f00 !important;
    }

	/*----------------------------------------------------------------*/

    .mpwpb_styles .checkout .custom-var-attr-section .option-row
	{
		display: flex;
		justify-content: center;
		align-items: center;
    }

	.mpwpb_styles .checkout .custom-var-attr-section .option-row .action-plus,
	.mpwpb_styles .checkout .custom-var-attr-section .option-row .action-minus,
	.mpwpb_styles .checkout .custom-var-attr-section .option-row .action-move
	{
		text-decoration: none;
	}

	/*****************************************************************/
	.mpwpb_styles .checkout .checkout-disabled
	{
		color: red;
	}

	/*.......................Switch Button..............................*/
	.mpwpb_styles .checkout .switch
	{
		position: relative;
		display: inline-block;
		width: 60px;
		height: 34px;
	}

	.mpwpb_styles .checkout .switch input
	{
		opacity: 0;
		width: 0;
		height: 0;
	}

	.mpwpb_styles .checkout .slider
	{
		position: absolute;
		cursor: pointer;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #ccc;
		-webkit-transition: .4s;
		transition: .4s;
		border-radius: 34px;
	}

	.mpwpb_styles .checkout .slider:before
	{
		position: absolute;
		content: "";
		height: 26px;
		width: 26px;
		left: 4px;
		bottom: 4px;
		background-color: white;
		-webkit-transition: .4s;
		transition: .4s;
		border-radius: 50%;
	}

	.mpwpb_styles .checkout input:checked + .slider
	{
		background-color: #2196F3;
	}

	.mpwpb_styles .checkout input:focus + .slider
	{
		box-shadow: 0 0 1px #2196F3;
	}

	.mpwpb_styles .checkout input:checked + .slider:before
	{
		-webkit-transform: translateX(26px);
		-ms-transform: translateX(26px);
		transform: translateX(26px);
	}


}
