/**
 * css/custom/common.css
 * Stili custom common
 * 
 * @package ItticiSurgelati
 * @version 0.0.2
 */
/*
 * css/custom/common.css
 */

:root {
    --gp-white              : #ffffff;
    --gp-white-soft         : #f7f7f7;

    --gp-gray-100           : #f0f0f0;
    --gp-gray-200           : #e0e0e0;
    --gp-gray-300           : #dee2e6;
    --gp-gray-600           : #4b5b63;

    --gp-text-primary       : #182931;
    --gp-text-secondary     : #4b5b63;

    --gp-accent             : #ff5f1f;
    --gp-accent-dark        : #e04e0e;

    --gp-blue-light         : #0075c9;
    --gp-blue-dark          : #002d74;

    --gp-aqua               : #00FFFF;


    --gp-green              : #198754;
    --gp-green-light        : #21911d;

    --gp-teal               : #20c997;


    --gp-theme-light        : var(--gp-blue-light);
    --gp-theme-dark         : var(--gp-blue-dark);

    --gp-input-bg           : #fefefe;
    --gp-input-border       : var(--gp-gray-200);
    --gp-input-focus        : var(--gp-theme-light);


    --gp-radius-sm          : 8px;
    --gp-radius-md          : 16px;
    --gp-radius-lg          : 28px;
    --gp-radius-pill        : 999px;
    
}

/** ... FORM HEADING */ 
.gp-form-heading {
    display        : inline-block;
    margin         : 0 0 12px 0;
    padding-left   : 12px;
    border-left    : 8px solid var(--gp-theme-light);
    color          : var(--gp-theme-dark);
    font-family    : 'Kondolar', sans-serif;
    font-size      : 45px;
    font-weight    : 400;
    line-height    : 1.1;
    letter-spacing : -0.3px;
}


.gp-form-container {
    margin-top : 20px;
    background : var(--gp-white);
}

.gp-form {
    width: 100%;
}

.gp-form-group {
    margin-top      : 10px;
    margin-bottom   : 10px;
}

/** ... FORM LABEL */ 
.gp-form-label {
    display        : block;
    margin-bottom  : 4px;
    color          : var(--gp-gray-600);
    font-size      : 18px;
    font-weight    : 600;
    letter-spacing : 0.7px;
}


/** ... FORM HELPER */
.gp-form-helper {
    display         : block;
    margin-top      : 8px;
    margin-bottom   : 20px;
    color           : var(--gp-text-secondary);
    font-size       : 18px;
}


.gp-form-subheading {

    font-size       : 16px;
    margin-bottom   : 20px;




}


/** ... FORM CONTROL FINPUT */
.gp-form input.gp-form-control,
.gp-form textarea.gp-form-control,
.gp-form select.gp-form-control {
    width           : 100%;
    height          : 44px;
    min-height      : 44px;

    padding         : 8px 18px;

    color           : var(--gp-theme-dark);
    background      : var(--gp-input-bg);

    border          : 1px solid var(--gp-input-border);
    border-radius   : var(--gp-radius-pill);

    font-size       : 23px;
    font-weight     : 300;
    line-height     : 1.2;

    box-shadow      : none;
    outline         : none;
    appearance      : none;
    -webkit-appearance : none;
    transition      : border-color 0.2s ease;
}

.gp-form input.gp-form-control:focus,
.gp-form textarea.gp-form-control:focus,
.gp-form select.gp-form-control:focus {
    border-color : var(--gp-input-focus);
    box-shadow   : none;
    outline      : none;
}

.gp-form-control::placeholder {
    color       : #adb5bd;
    font-weight : 400;
    opacity     : 1;
}


/** ... FORM CONTROL FINPUT DISABLED */
.gp-form input.gp-form-control-disabled {
    width           : 100%;
    height          : 44px;
    min-height      : 44px;

    padding         : 8px 18px;

    color           : var(--gp-theme-dark);

    background      : var(--gp-gray-200);

    /** border          : 1px solid var(--gp-input-border); */
    border-radius   : var(--gp-radius-pill);


    font-size       : 23px;
    font-weight     : 300;
    line-height     : 1.2;

    box-shadow      : none;
    outline         : none;
    appearance      : none;
    -webkit-appearance : none;
    transition      : border-color 0.2s ease;
}

.gp-form input.gp-form-control-disabled:focus {
    border       : 0px transparent; 
    /** border-color : var(--gp-accent-dark);   */ 
    box-shadow   : none;
    outline      : none;
}











/** .... PASSWORD */ 
.gp-form input.gp-password-field {
    padding-right: 48px;
}
.gp-password-wrapper {
    position: relative;
}
.gp-toggle-pass {
    position  : absolute;
    right     : 18px;
    top       : 70%;
    width     : 18px;
    height    : 18px;
    transform : translateY(-50%);
    cursor    : pointer;
    background : url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%236c757d"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" /></svg>') center/contain no-repeat;
    transition: all 0.2s ease;
}
.gp-toggle-pass.is-active {
    background : url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%23ff5f1f"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21" /></svg>') center/contain no-repeat;
}


.gp-form-static {
    width      : 100%;
    min-height : 44px;

    display    : flex;
    align-items: center;

    padding    : 8px 18px;

    color      : var(--gp-theme-dark);
    background : var(--gp-white-soft);

    border        : 1px solid var(--gp-input-border);
    border-radius : var(--gp-radius-pill);

    font-size   : 23px;
    font-weight : 300;
    line-height : 1.2;
}

.gp-form textarea.gp-form-control {
    height      : auto;
    min-height  : 96px;
    resize      : vertical;
    line-height : 1.35;
    border-radius: var(--gp-radius-md);
}



/** ... FORM BUTTON */ 
.gp-btn {
    display         : inline-flex;
    align-items     : center;
    justify-content : center;
    gap             : 8px;

    min-height      : 48px;
    padding         : 12px 24px;

    border          : none;
    border-radius   : var(--gp-radius-pill);

    cursor          : pointer;

    text-decoration : none;
    font-size       : 18px;
    font-weight     : 600;
    line-height     : 1;

    transition      : background-color 0.2s ease,
                      color 0.2s ease,
                      border-color 0.2s ease;
}

.gp-btn-primary {
    background : var(--gp-theme-light);
    color      : #fff;
}

.gp-btn-primary:hover {
    background : var(--gp-theme-dark);
    color      : #fff;
}

.gp-btn-outline {
    background : transparent;
    border     : 1px solid var(--gp-theme-light);
    color      : var(--gp-theme-light);
}

.gp-btn-outline:hover {
    background : var(--gp-theme-light);
    color      : #fff;
}

.gp-btn-full {
    width: 100%;
}




/** ... */
.gp-register-section {
    margin-top: 0px;
}

.gp-register-section.is-hidden {
    display : none;
}


.gp-cap-result {
    margin-top      : 20px;
    margin-bottom   : 20px;
    font-size       : 24px;
}

.gp-cap-result .is-hidden {
    display: none !important;
}


/** ... */ 
.gp-alert {
    margin-bottom   : 24px;
    padding         : 14px 0px;
    border-left     : 4px;
    line-height     : 1.4;
}

.gp-alert-success {
    margin-bottom   : 40px;
    padding         : 14px 10px;
    background:     rgba(25, 135, 84, 0.1);   
    border-left     : 1px solid var(--gp-green);
    border-color    : var(--gp-green);

    line-height     : 1.4;

    color           : var(--gp-green);  
    font-size       : 20px;



}

.gp-alert ul {
    margin       : 0;
    padding-left : 20px;
}

.gp-alert-danger {
    background  : rgba(239, 68, 68, 0.10);
    border-left : 4px solid #ef4444;
    color       : #991b1b;
}



/** ... */ 
.gp-auth-page {
    min-height : calc(100vh - 220px);
    padding    : 30px 50px;
    background : #fff;
}

.gp-auth-layout {
    max-width : 1440px;
    margin    : 0 auto;

    display   : grid;
    grid-template-columns : minmax(0, 1fr) minmax(0, 1fr);
    gap       : 48px;

    align-items : center;
}

.gp-auth-form-col,
.gp-auth-image-col {
    min-width: 0;
}

.gp-auth-image {
    width         : 100%;
    overflow      : hidden;
    border-radius : 28px;
}

.gp-auth-image img {
    display    : block;
    width      : 100%;
    height     : auto;
    object-fit : cover;
}

.gp-auth-register {
    margin-top : 20px;
    color      : var(--gp-text-secondary);
    font-size  : 17px;
}

.gp-auth-register-link {
    color           : var(--gp-accent);
    text-decoration : none;
    font-weight     : 600;
}

.gp-auth-register-link:hover {
    color: var(--gp-accent-dark);
}

.gp-auth-message {
    max-width  : 720px;
    margin     : 0 auto;
    text-align : center;
}

.gp-auth-text {
    color     : var(--gp-text-secondary);
    font-size : 20px;
}

.gp-auth-actions {
    display         : flex;
    justify-content : center;
    gap             : 12px;
    flex-wrap       : wrap;
    margin-top      : 24px;
}

/** ... */ 

@media (max-width: 991px) {
    .gp-auth-layout {
        grid-template-columns : 1fr;
        gap                   : 32px;
    }

    .gp-auth-image-col {
        display: none;
    }
}

@media (max-width: 768px) {
    .gp-auth-page {
        padding: 32px 16px;
    }

    .gp-form-heading {
        font-size: 32px;
    }

    .gp-form-control {
        font-size: 18px;
    }
}