/* ==========================================
   CareerPilot Component Library
   ========================================== */


/* Primary Button */

.btn-primary{

    background: var(--primary);

    color: white;

    border: none;

    border-radius: var(--radius-medium);

    padding:14px 26px;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.25s;

    box-shadow:var(--shadow-small);

}

.btn-primary:hover{

    background:var(--primary-dark);

    transform:translateY(-2px);

}



/* Secondary Button */

.btn-secondary{

    background:white;

    color:var(--primary);

    border:2px solid var(--primary);

    border-radius:var(--radius-medium);

    padding:14px 26px;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.25s;

}

.btn-secondary:hover{

    background:var(--primary);

    color:white;

}

/* ==========================================
   Premium Card
   ========================================== */

.card{

    background: var(--surface);

    border-radius: var(--radius-large);

    padding: 32px;

    border: 1px solid var(--border);

    box-shadow: var(--shadow-small);

}

/* ==========================================
   Professional Inputs
   ========================================== */

input,
textarea,
select{

    width:100%;

    padding:14px 16px;

    border:1px solid var(--border);

    border-radius:var(--radius-medium);

    font-size:16px;

    transition:.25s;

}

input:focus,
textarea:focus,
select:focus{

    outline:none;

    border-color:var(--primary);

    box-shadow:0 0 0 4px rgba(37,99,235,.15);

}

/* ==========================================
   Professional Footer
   ========================================== */