/*
|--------------------------------------------------------------------------
| PENGUMUMAN DETAIL
|--------------------------------------------------------------------------
*/

.announcement-detail-page{

padding:60px 0;

}

.announcement-back{

display:inline-flex;

align-items:center;

gap:10px;

margin-bottom:30px;

text-decoration:none;

font-weight:600;

color:var(--primary);

}

.announcement-detail-card{

background:#fff;

padding:45px;

border-radius:24px;

box-shadow:0 12px 35px rgba(0,0,0,.08);

}

.announcement-important{

display:inline-flex;

align-items:center;

gap:8px;

background:#ffc107;

color:#222;

padding:8px 16px;

border-radius:50px;

font-weight:700;

margin-bottom:18px;

}

.announcement-category{

display:inline-block;

padding:6px 14px;

border-radius:40px;

background:var(--primary);

color:#fff;

font-size:14px;

margin-bottom:20px;

}

.announcement-detail-card h1{

margin:0;

font-size:48px;

line-height:1.2;

color:var(--primary);

margin-bottom:20px;

}

.announcement-info{

display:flex;

gap:25px;

flex-wrap:wrap;

margin-bottom:35px;

color:#777;

font-size:15px;

}

.announcement-info span{

display:flex;

align-items:center;

gap:8px;

}

.announcement-content{

font-size:18px;

line-height:2;

color:#444;

white-space:pre-line;

}

.announcement-file{

margin-top:40px;

padding-top:25px;

border-top:1px solid #eee;

}

.announcement-file a{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 22px;

background:var(--primary);

color:#fff;

text-decoration:none;

border-radius:10px;

transition:.3s;

}

.announcement-file a:hover{

background:var(--secondary);

}

@media(max-width:768px){

.announcement-detail-page{

padding:35px 0;

}

.announcement-detail-card{

padding:25px;

}

.announcement-detail-card h1{

font-size:32px;

}

.announcement-content{

font-size:16px;

line-height:1.9;

}

.announcement-info{

gap:12px;

font-size:14px;

flex-direction:column;

}

}