/* GLOBAL FADE ANIMATION */
.fade-in { animation: fadeIn 0.7s ease-out; }
@keyframes fadeIn {
    from { opacity:0; transform:translateY(20px); }
    to   { opacity:1; transform:translateY(0); }
}

/* BUTTON */
.ccp-btn {
    background:#ec4899;
    padding:12px 20px;
    color:white;
    border:none;
    border-radius:12px;
    cursor:pointer;
    font-weight:bold;
    display:inline-block;
    transition:0.2s;
}
.ccp-btn:hover {
    background:#db337f;
}

/* CENTER MESSAGE */
.ccp-center-msg {
    text-align:center;
    padding:20px;
    background:#fff;
    border-radius:14px;
    box-shadow:0 10px 25px rgba(0,0,0,0.07);
    max-width:500px;
    margin:40px auto;
}


/* ===============================
    PROFILE PAGE
=============================== */

.ccp-profile-wrapper {
    max-width: 1050px;
    margin: 40px auto;
    padding: 10px;
}

.ccp-profile-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 40px;
    display: flex;
    gap: 40px;
    box-shadow: 0 15px 45px rgba(0,0,0,0.08);
}

.ccp-profile-left { text-align: center; width: 290px; }

.ccp-profile-photo {
    width: 220px;
    height: 220px;
    object-fit: cover;
    border-radius: 20px;
    border: 6px solid #ec4899;
}

.ccp-profile-left h2 {
    margin:16px 0 6px;
    font-size:26px;
    color:#04202f;
}

.ccp-profession { font-size:16px; color:#555; }

.ccp-profile-right { flex:1; }

.ccp-section { margin-bottom:22px; }

.ccp-section h3 {
    color:#ec4899;
    font-size:18px;
    margin-bottom:8px;
    border-bottom:2px solid #ec4899;
    display:inline-block;
    padding-bottom:4px;
}

.ccp-info-list {
    list-style:none;
    margin:0;
    padding:0;
}
.ccp-info-list li { margin-bottom:6px; }

/* Responsive */
@media (max-width:900px){
    .ccp-profile-card { flex-direction:column; text-align:center; }
    .ccp-profile-left { width:100%; }
}



/* ===============================
    REGISTRATION FORM
=============================== */

.ccp-register-wrapper {
    max-width: 700px;
    margin: 40px auto;
    padding: 25px;
}

.ccp-register-form {
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.07);
    animation: fadeIn 0.8s ease;
}

.ccp-register-form h2 {
    text-align:center;
    color: #ec4899;
    margin-bottom: 15px;
}

.ccp-register-form label {
    display:block;
    margin: 10px 0 5px;
    font-weight:600;
}

.ccp-register-form input,
.ccp-register-form select,
.ccp-register-form textarea {
    width:100%;
    border:2px solid #eee;
    padding:12px;
    border-radius:10px;
    transition:0.2s;
}

.ccp-register-form input:focus,
.ccp-register-form select:focus,
.ccp-register-form textarea:focus {
    border-color:#ec4899;
    box-shadow:0 0 0 3px rgba(236,72,153,0.2);
}

.ccp-register-form textarea { height:120px; }

.ccp-register-error {
    background:#ffe0e0;
    padding:15px;
    border-left:5px solid red;
    margin-bottom:20px;
    border-radius:12px;
}

.ccp-register-success {
    background:#eaffea;
    padding:15px;
    border-left:5px solid #22c55e;
    margin-bottom:20px;
    border-radius:12px;
}

.ccp-register-success a {
    color:#0a7a27;
    font-weight:bold;
    text-decoration:underline;
}



/* ===============================
    FUTURE LOGIN + DIRECTORY CSS
=============================== */
/* Placeholder - will update when you request UI */