/**
 * BAD-CER-IFD Platform - Frontend CSS
 */

:root {
    --bcif-gold: #D4AF37;
    --bcif-blue: #1E3A5F;
    --bcif-blue-dark: #0D1F33;
    --bcif-green: #059669;
    --bcif-red: #DC2626;
    --bcif-gray: #6B7280;
    --bcif-gray-light: #F3F4F6;
    --bcif-white: #FFFFFF;
    --bcif-radius: 8px;
    --bcif-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
    --bcif-transition: all 0.3s ease;
}

/* BUTTONS */
.bcif-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 24px; font-size:15px; font-weight:600; border:2px solid transparent; border-radius:var(--bcif-radius); cursor:pointer; text-decoration:none; transition:var(--bcif-transition); }
.bcif-btn-primary { background:var(--bcif-gold); color:var(--bcif-blue-dark); border-color:var(--bcif-gold); }
.bcif-btn-primary:hover { background:#C4A030; }
.bcif-btn-outline { background:transparent; color:var(--bcif-blue); border-color:var(--bcif-blue); }
.bcif-btn-outline:hover { background:var(--bcif-blue); color:var(--bcif-white); }
.bcif-btn-sm { padding:8px 16px; font-size:13px; }
.bcif-btn-lg { padding:16px 32px; font-size:16px; }
.bcif-btn-block { width:100%; }

/* ALERTS */
.bcif-alert { padding:16px 20px; border-radius:var(--bcif-radius); margin-bottom:20px; font-size:14px; }
.bcif-alert-error { background:#FEE2E2; color:#DC2626; border:1px solid #FECACA; }
.bcif-alert-success { background:#D1FAE5; color:#065F46; border:1px solid #A7F3D0; }
.bcif-alert-info { background:#DBEAFE; color:#1E40AF; border:1px solid #BFDBFE; }

/* FORMS */
.bcif-form * { box-sizing:border-box; }
.bcif-form-group { margin-bottom:20px; }
.bcif-form-group label { display:block; margin-bottom:8px; font-weight:500; color:var(--bcif-blue); font-size:14px; }
.bcif-form-group input[type="text"], .bcif-form-group input[type="email"], .bcif-form-group input[type="password"], .bcif-form-group input[type="tel"], .bcif-form-group input[type="url"], .bcif-form-group input[type="number"], .bcif-form-group input[type="date"], .bcif-form-group input[type="datetime-local"], .bcif-form-group select, .bcif-form-group textarea { width:100%; padding:12px 16px; font-size:15px; border:2px solid #E5E7EB; border-radius:var(--bcif-radius); transition:var(--bcif-transition); background:var(--bcif-white); }
.bcif-form-group input:focus, .bcif-form-group select:focus, .bcif-form-group textarea:focus { outline:none; border-color:var(--bcif-gold); box-shadow:0 0 0 3px rgba(212,175,55,0.2); }
.bcif-form-group textarea { min-height:120px; resize:vertical; }
.bcif-form-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.bcif-form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.bcif-form-row-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; }
@media (max-width:768px) { .bcif-form-row-2, .bcif-form-row-3 { grid-template-columns:1fr; } }
.bcif-checkbox { display:flex; align-items:center; gap:10px; cursor:pointer; font-size:14px; }
.bcif-checkbox input[type="checkbox"] { width:18px; height:18px; accent-color:var(--bcif-gold); }
.bcif-link { color:var(--bcif-blue); text-decoration:none; font-size:14px; }
.bcif-link:hover { color:var(--bcif-gold); text-decoration:underline; }

/* AUTH BOX */
.bcif-auth-box { max-width:450px; margin:40px auto; padding:40px; background:var(--bcif-white); border-radius:12px; box-shadow:0 10px 15px -3px rgba(0,0,0,0.1); }
.bcif-auth-footer { text-align:center; margin-top:24px; padding-top:24px; border-top:1px solid #E5E7EB; color:var(--bcif-gray); font-size:14px; }
.bcif-auth-footer a { color:var(--bcif-gold); font-weight:600; text-decoration:none; }
.bcif-logged-in { text-align:center; }

/* DASHBOARD */
.bcif-dashboard { max-width:1200px; margin:0 auto; padding:20px; }
.bcif-dashboard-header { display:flex; justify-content:space-between; align-items:center; padding:24px 30px; background:linear-gradient(135deg,var(--bcif-blue) 0%,var(--bcif-blue-dark) 100%); border-radius:12px; color:var(--bcif-white); margin-bottom:30px; }
.bcif-dashboard-user { display:flex; align-items:center; gap:16px; }
.bcif-dashboard-user img { border-radius:50%; border:3px solid var(--bcif-gold); }
.bcif-dashboard-user-info h2 { margin:0 0 4px; color:var(--bcif-white); font-size:1.5rem; }
.bcif-dashboard-user-info p { margin:0; opacity:0.8; font-size:14px; }
.bcif-dashboard-actions { display:flex; gap:12px; }
.bcif-dashboard-actions .bcif-btn-outline { color:var(--bcif-white); border-color:rgba(255,255,255,0.5); }
.bcif-dashboard-actions .bcif-btn-outline:hover { background:rgba(255,255,255,0.1); }

/* STATS */
.bcif-dashboard-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:30px; }
@media (max-width:992px) { .bcif-dashboard-stats { grid-template-columns:repeat(2,1fr); } }
@media (max-width:576px) { .bcif-dashboard-stats { grid-template-columns:1fr; } }
.bcif-stat-card { display:flex; align-items:center; gap:16px; padding:24px; background:var(--bcif-white); border-radius:var(--bcif-radius); box-shadow:var(--bcif-shadow); }
.bcif-stat-icon { font-size:2.5rem; }
.bcif-stat-content { display:flex; flex-direction:column; }
.bcif-stat-value { font-size:2rem; font-weight:700; color:var(--bcif-blue); line-height:1; }
.bcif-stat-label { font-size:14px; color:var(--bcif-gray); margin-top:4px; }

/* DASHBOARD SECTION */
.bcif-dashboard-section { background:var(--bcif-white); padding:24px; border-radius:var(--bcif-radius); box-shadow:var(--bcif-shadow); margin-bottom:24px; }
.bcif-dashboard-section h3 { margin:0 0 20px; color:var(--bcif-blue); font-size:1.1rem; padding-bottom:12px; border-bottom:2px solid var(--bcif-gray-light); }

/* QUICK ACTIONS */
.bcif-quick-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:768px) { .bcif-quick-actions { grid-template-columns:repeat(2,1fr); } }
.bcif-quick-action { display:flex; align-items:center; gap:12px; padding:16px; background:var(--bcif-gray-light); border-radius:var(--bcif-radius); text-decoration:none; color:var(--bcif-blue); font-weight:500; transition:var(--bcif-transition); }
.bcif-quick-action:hover { background:var(--bcif-gold); color:var(--bcif-blue-dark); }
.bcif-quick-icon { font-size:1.5rem; }

/* CARDS & GRIDS */
.bcif-grid { display:grid; gap:24px; }
.bcif-grid-2 { grid-template-columns:repeat(2,1fr); }
.bcif-grid-3 { grid-template-columns:repeat(3,1fr); }
.bcif-grid-4 { grid-template-columns:repeat(4,1fr); }
@media (max-width:992px) { .bcif-grid-3, .bcif-grid-4 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:576px) { .bcif-grid-2, .bcif-grid-3, .bcif-grid-4 { grid-template-columns:1fr; } }
.bcif-card { background:var(--bcif-white); border-radius:var(--bcif-radius); box-shadow:var(--bcif-shadow); overflow:hidden; transition:var(--bcif-transition); }
.bcif-card:hover { transform:translateY(-4px); box-shadow:0 10px 15px -3px rgba(0,0,0,0.1); }
.bcif-card-image { position:relative; overflow:hidden; }
.bcif-card-image img { width:100%; height:180px; object-fit:cover; display:block; }
.bcif-card-badge { position:absolute; top:12px; left:12px; padding:4px 12px; background:var(--bcif-blue); color:var(--bcif-white); border-radius:4px; font-size:12px; font-weight:600; }
.bcif-card-content { padding:20px; }
.bcif-card-title { margin:0 0 12px; font-size:16px; line-height:1.4; }
.bcif-card-title a { color:var(--bcif-blue); text-decoration:none; }
.bcif-card-title a:hover { color:var(--bcif-gold); }
.bcif-card-actions { display:flex; gap:8px; margin-top:16px; }

/* PROJECT SPECIFIC */
.bcif-project-amount { font-size:1.25rem; font-weight:700; color:var(--bcif-gold); margin-bottom:12px; }
.bcif-project-progress { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.bcif-progress-bar { flex:1; height:8px; background:#E5E7EB; border-radius:4px; overflow:hidden; }
.bcif-progress-fill { height:100%; background:var(--bcif-gold); border-radius:4px; transition:width 0.5s ease; }

/* PUBLICATION SPECIFIC */
.bcif-publication-cover img { height:220px; object-fit:cover; }
.bcif-publication-edition { font-size:12px; color:var(--bcif-gray); }

/* EVENTS */
.bcif-events-grid { display:flex; flex-direction:column; gap:20px; }
.bcif-event-card { display:flex; gap:24px; padding:24px; background:var(--bcif-white); border-radius:var(--bcif-radius); box-shadow:var(--bcif-shadow); }
.bcif-event-date-box { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:80px; padding:16px; background:var(--bcif-gold); border-radius:var(--bcif-radius); color:var(--bcif-blue-dark); text-align:center; }
.bcif-event-day { font-size:2rem; font-weight:700; line-height:1; }
.bcif-event-month { font-size:11px; text-transform:uppercase; }
.bcif-event-content h3 { margin:0 0 8px; }
.bcif-event-content h3 a { color:var(--bcif-blue); text-decoration:none; }
.bcif-event-meta { display:flex; flex-wrap:wrap; gap:16px; margin-bottom:12px; font-size:14px; color:var(--bcif-gray); }
.bcif-event-format { display:inline-block; padding:2px 8px; background:var(--bcif-blue); color:var(--bcif-white); border-radius:4px; font-size:11px; }

/* VIDEOS */
.bcif-video-thumbnail { position:relative; }
.bcif-video-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:60px; height:60px; background:rgba(0,0,0,0.7); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--bcif-white); font-size:20px; transition:var(--bcif-transition); }
.bcif-video-card:hover .bcif-video-play { background:var(--bcif-gold); color:var(--bcif-blue-dark); }
.bcif-video-duration { position:absolute; bottom:8px; right:8px; padding:4px 8px; background:rgba(0,0,0,0.8); color:var(--bcif-white); border-radius:4px; font-size:12px; }
.bcif-video-placeholder { height:180px; background:var(--bcif-gray-light); display:flex; align-items:center; justify-content:center; font-size:3rem; }

/* STATS BAR */
.bcif-stats-bar { display:flex; justify-content:space-around; padding:30px; background:linear-gradient(135deg,var(--bcif-blue) 0%,var(--bcif-blue-dark) 100%); border-radius:12px; color:var(--bcif-white); }
.bcif-stats-bar .bcif-stat { text-align:center; }
.bcif-stats-bar .bcif-stat-value { display:block; font-size:2.5rem; font-weight:700; color:var(--bcif-gold); }
.bcif-stats-bar .bcif-stat-label { font-size:14px; opacity:0.9; }
@media (max-width:768px) { .bcif-stats-bar { flex-wrap:wrap; gap:20px; } .bcif-stats-bar .bcif-stat { flex:0 0 45%; } }

/* FILTERS */
.bcif-filters { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; padding:16px; background:var(--bcif-gray-light); border-radius:var(--bcif-radius); }
.bcif-filter { padding:10px 16px; border:2px solid #E5E7EB; border-radius:var(--bcif-radius); background:var(--bcif-white); font-size:14px; min-width:180px; }
.bcif-filter:focus { outline:none; border-color:var(--bcif-gold); }

/* SUBMISSION FORM */
.bcif-submission-form { max-width:700px; margin:0 auto; padding:40px; background:var(--bcif-white); border-radius:12px; box-shadow:0 10px 15px -3px rgba(0,0,0,0.1); }
.bcif-submission-header { text-align:center; margin-bottom:30px; padding-bottom:20px; border-bottom:2px solid var(--bcif-gray-light); }
.bcif-submission-header h2 { margin:0 0 8px; color:var(--bcif-blue); }
.bcif-submission-header p { margin:0; color:var(--bcif-gray); }

/* ACCOUNT PAGE */
.bcif-account-page { max-width:600px; margin:0 auto; padding:40px; background:var(--bcif-white); border-radius:12px; box-shadow:0 10px 15px -3px rgba(0,0,0,0.1); }
.bcif-account-page h2 { margin:0 0 30px; color:var(--bcif-blue); }

/* UTILITIES */
.bcif-no-content { text-align:center; padding:40px; color:var(--bcif-gray); }
.bcif-loading { opacity:0.5; pointer-events:none; }

/* RESPONSIVE */
@media (max-width:768px) {
    .bcif-dashboard-header { flex-direction:column; text-align:center; gap:20px; }
    .bcif-dashboard-user { flex-direction:column; }
    .bcif-auth-box, .bcif-submission-form, .bcif-account-page { margin:20px; padding:24px; }
    .bcif-event-card { flex-direction:column; }
}
