/* ================================================================
   Єдиний стильовий файл модуля "Електронні навчальні матеріали" (method).
   Об'єднує та модернізує css/style.css і css/file_msg.css у стилі
   решти проєкту (repository_code / p_rate): Inter/Manrope, синя палітра,
   заокруглені картки.
   ================================================================ */

@font-face{
	font-family:'Tako';
	src: url('../fonts/Tako.woff2') format('woff2'),
	     url('../fonts/Tako.woff') format('woff');
	font-weight:400 800;
	font-display:swap;
}

:root{
	--navy:        #103f95;
	--blue-mid:    #354F88;
	--blue-accent: #7d9df5;
	--btn-blue:    #3453A9;
	--sky:         #45B0E3;
	--rust:        #DE4C34;
	--rust-dark:   #CE3E26;
	--green:       #1e9e5a;
	--ink:         #23262f;
	--bg:          #F4F6FA;
	--panel:       #EAEEF1;
	--line:        #C2C7C0;
	--white:       #ffffff;
}

/* ---------- Базовий reset ---------- */
*{box-sizing:border-box;}
body{
	font-family:'Tako','Inter', Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size:14px;
	color:var(--ink);
	background:var(--bg);
	margin:0;
}
a, a:visited{color:var(--navy);text-decoration:none;}
a:hover{color:var(--blue-accent);}
ul li{list-style:none;}
img{vertical-align:middle;}
:focus, :active{outline:none;}

/* ---------- Шапка-банер (як на інших сторінках проєкту) ---------- */
.m-topbar{
	background:linear-gradient(120deg,var(--navy) 0%, #1a4fb8 100%);
	color:#fff;padding:26px 20px 24px;text-align:center;
	border-radius:0 0 20px 20px;
	box-shadow:0 14px 34px -20px rgba(16,63,149,.4);
	margin-bottom:22px;
}
.m-topbar h1, .m-topbar h3{
	font-family:'Tako','Manrope',sans-serif;font-weight:800;
	margin:0 0 4px;letter-spacing:-.01em;color:#fff;
}
.m-topbar h3{font-size:15px;font-weight:600;}

/* ---------- Картка-контейнер сторінки ---------- */
.m-card{
	max-width:1240px;margin:0 auto 22px;background:#fff;
	border:1px solid var(--line);border-radius:16px;
	padding:20px 26px;box-shadow:0 14px 34px -22px rgba(16,63,149,.28);
}
.m-wrap{max-width:1240px;margin:0 auto;padding:0 16px;}

/* ---------- Таблиці (застосовується поверх Bootstrap таблиць теж) ---------- */
.table{
	width:100%;border-collapse:collapse;font-family:'Tako','Inter',Arial,sans-serif;
}
.t{
	width:100%;max-width:1400px;border-collapse:collapse;font-family:'Tako','Inter',Arial,sans-serif;
	border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:12px;
	background:#fff;
}

/* ---------- Заміна Bootstrap-обгортки (container-fluid/row/col-md-12) ---------- */
.m-wrap-page{max-width:1240px;margin:0 auto;padding:20px 16px 50px;}
.m-narrow{max-width:1400px;margin:0 auto;}
.m-narrow > section > h2{text-align:center;}
.m-header-card{
	box-shadow:0 1px 2px rgba(16,24,40,.03);
	text-align:left;
	max-width:1400px;margin:5px auto 0;
}
.wraph.m-header-card{padding:0px 20px;}
.m-table-card{
	background:#fff;border:1px solid var(--line);border-radius:16px;
	padding:20px 24px;box-shadow:0 14px 34px -22px rgba(16,63,149,.28);
	overflow-x:auto;
}
.m-filter-bar{
	max-width:1100px;margin:0 auto 18px;background:#fff;
	border:1px solid var(--line);border-radius:14px;
	padding:12px 18px;box-shadow:0 1px 2px rgba(16,24,40,.03);
	display:flex;flex-wrap:wrap;align-items:center;gap:14px;
}
.m-filter-bar form{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.m-search-link{
	display:inline-flex;align-items:center;gap:6px;
	background:var(--panel);color:var(--blue-mid);font-weight:600;font-size:13.5px;
	padding:8px 14px;border-radius:10px;transition:.15s;
}
.m-search-link:hover{background:var(--blue-accent);color:#fff;}
.m-arc-check{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--blue-mid);font-weight:600;cursor:pointer;}
.m-arc-check input{accent-color:var(--blue-accent);width:16px;height:16px;}
.m-table{width:100%;border-collapse:collapse;font-family:'Tako','Inter',Arial,sans-serif;font-size:13.5px;}
.m-table th{
	background:linear-gradient(120deg,var(--navy) 0%, #1a4fb8 100%);
	color:#fff;font-family:'Tako','Manrope',sans-serif;font-weight:700;font-size:13px;
	padding:10px 12px;text-align:left;border:none;
}
.m-table td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle;}
.m-table tbody tr:hover td{background:#f3f6fd;}
.m-list{margin:10px 0 0;padding:0;}
.m-list li{
	background:#fff;border:1px solid var(--line);border-radius:10px;
	padding:9px 14px;margin-bottom:6px;transition:.15s;
}
.m-list li:hover{border-color:var(--blue-accent);box-shadow:0 4px 12px -6px rgba(16,63,149,.3);}
.m-dep-card{
	background:#fff;border:1px solid var(--line);border-radius:14px;
	padding:16px 20px;margin-bottom:14px;box-shadow:0 1px 2px rgba(16,24,40,.03);
}
.m-dep-card h4{
	margin:0 0 8px;font-family:'Tako','Manrope',sans-serif;font-weight:700;font-size:15px;color:var(--navy);
}
.table thead tr, .t thead tr, .th{
	background:linear-gradient(120deg,var(--navy) 0%, #1a4fb8 100%) !important;
}
.table thead th, .t thead th, .th, thead .active th{
	color:#fff !important;font-family:'Tako','Manrope',sans-serif;font-weight:700;
	font-size:13px;border:none !important;padding:10px 12px;
}
.table td{
	padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:13.5px;
}
.t td{
	padding:4px 10px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:13.5px;
	border:1px solid var(--line);
}
.t{margin:12px auto 0;}
.table-hover tbody tr:hover, .t tbody tr:not(.th):hover{background:#f3f6fd !important;}
.t tbody tr.th:hover{background:linear-gradient(120deg,var(--navy) 0%, #1a4fb8 100%) !important;}
.t td a{color:var(--navy);text-decoration:underline;text-decoration-color:rgba(16,63,149,.3);}
.t td a:hover{color:var(--blue-accent);}
.t td a.t_test{color:var(--rust-dark);}

/* ---------- Кнопки ---------- */
.nlr-create-btn{
	font-family:'Tako','Inter',sans-serif;font-weight:600;font-size:13.5px;
	border:none;border-radius:10px;padding:9px 16px;cursor:pointer;
	background:var(--btn-blue);color:#fff;
	transition:background .15s, transform .15s;
}
.nlr-create-btn:hover {
  background: var(--navy);
  transform: translateY(-1px);
}
.btn, .fb, button{
	font-family:'Tako','Inter',sans-serif;font-weight:600;font-size:13.5px;
	border:none;border-radius:10px;padding:9px 16px;cursor:pointer;
	background:var(--btn-blue);color:#fff;
	box-shadow:0 6px 14px -6px rgba(52,83,169,.6);
	transition:background .15s, box-shadow .15s;
}
.btn:hover, .fb:hover, button:hover{background:var(--navy);}
select, input[type=text], input[type=password]{
	border:1px solid var(--line);border-radius:9px;padding:7px 11px;
	font-family:'Tako','Inter',sans-serif;font-size:13.5px;color:var(--ink);
	background:#fff;outline:none;transition:border-color .15s, box-shadow .15s;
}
select:focus, input[type=text]:focus, input[type=password]:focus{
	border-color:var(--blue-accent);box-shadow:0 0 0 3px rgba(125,157,245,.18);
}

/* ---------- Форум / повідомлення (by2.php, sem2.php) ---------- */
.fblock{margin-top:10px;display:flex;gap:6px;}
.fmt-btn{
	display:inline-flex;align-items:center;justify-content:center;
	width:30px;height:30px;border-radius:8px;padding:0;line-height:1;
	background:var(--panel);color:var(--blue-mid);border:none;cursor:pointer;
	transition:.15s;
}
.fmt-btn svg{display:block;color:inherit;flex-shrink:0;}
.fmt-btn:hover{background:var(--blue-accent);color:#fff;}
.fmt-btn.active{background:var(--blue-mid);color:#fff;}
.f{width:100%;max-width:1400px;}
.farea{
	border:1px solid var(--line);border-radius:12px;padding:12px;margin:10px 0;
	max-height:180px;width:100%;max-width:1400px;
	font-family:'Tako','Inter',sans-serif;font-size:13.5px;resize:vertical;
}
.farea:focus{border-color:var(--blue-accent);box-shadow:0 0 0 3px rgba(125,157,245,.18);}
.wysiwyg-editor{overflow:auto;cursor:text;outline:none;line-height:1.5;}
.wysiwyg-editor:empty:before{content:attr(data-placeholder);color:#9099ab;pointer-events:none;}
.wysiwyg-editor a{color:var(--blue-accent);text-decoration:underline;}
.f button:hover, .f textarea:hover{box-shadow:0 4px 10px -4px rgba(16,24,40,.15);}

.brow{display:flex;align-items:center;margin:10px 0;font-size:13.5px;gap:10px;}
.brow a{
	background:var(--panel);color:var(--blue-mid);padding:10px 16px;
	border-radius:10px;font-weight:600;transition:.15s;
}
.brow a:hover{background:var(--blue-accent);color:#fff;box-shadow:0 4px 10px -4px rgba(16,63,149,.3);}

.regp{background:#fff;margin-top:10px;border-radius:12px;}
.reg > div{
	border:1px solid var(--line);border-radius:12px;margin-bottom:8px;
}
.reg div:nth-child(even){background:var(--panel);}
.regb{display:flex;align-items:center;padding:12px;max-width:100%;max-height:600px;}
.regti{margin-right:10px;max-width:75px;font-size:smaller;color:var(--blue-mid);font-weight:600;}
.regui{max-height:40px;border-radius:8px;}
.regun{margin:0 10px;color:#8b91a3;}
.regt{
	max-height:65px;width:100%;word-spacing:2px;padding-right:10px;overflow:auto;
	line-height:1.5;
}
.regt b, .regt strong{font-weight:700;}
.regt i, .regt em{font-style:italic;}
.regt u{text-decoration:underline;}
.regt a, .regt a:visited{color:var(--blue-accent);text-decoration:underline;}
.regt a:hover{color:var(--navy);}
.regred{margin:0 10px;}
.regt::-webkit-scrollbar{width:8px;}
.regt::-webkit-scrollbar-track{background:transparent;}
.regt::-webkit-scrollbar-thumb{background:var(--line);border-radius:10px;}

/* ---------- Викладач / зустрічі (sem2.php header info) ---------- */
.hteacher{display:flex;flex-wrap:wrap;gap:14px;}
.himg{height:150px;width:150px;display:flex;overflow:hidden;border-radius:12px;border:1px solid var(--line);}
.hblock{max-width:180px;margin:0;flex-shrink:0;}
.hblock span{font-size:13.5px;color:#8b91a3;}
.hb{font-size:15px;font-weight:700;color:var(--navy);font-family:'Tako','Manrope',sans-serif;}
.hit{padding-right:16px;margin-top:8px;}
.hit p{margin:0 0 2px;}
.hit div{margin:0;}
.hmeet{
	display:inline-flex;vertical-align:middle;margin-left:6px;width:22px;height:22px;
	align-items:center;justify-content:center;color:var(--navy);border-radius:6px;position:relative;
}
.hmeet:hover{background:var(--panel);}
.hmeet img{max-height:100%;}
.htwo{text-align:center;}
.ht{max-width:500px;margin-right:20px;font-size:14px;}
.ht p{padding-top:8px;}

/* ---------- Загальні контейнери-обгортки ---------- */
.wrap{padding:0 60px 20px;}
.wraph{padding:30px 60px 0;}
.wraptwo{padding:30px 40px 0;}
.fc{display:flex;justify-content:space-between;gap:14px;}
.fctwo{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;}
.b{
	display:flex;align-items:center;flex-direction:column;
	background:#fff;border:1px solid var(--line);border-radius:16px;
	padding:18px 20px;box-shadow:0 14px 34px -22px rgba(16,63,149,.28);
}
.bf{display:flex;}
.bcol{margin:10px;}
.bo{font-size:22px;font-weight:800;font-family:'Tako','Manrope',sans-serif;color:var(--navy);}
.p{margin-top:10px;font-size:16px;}
.two{margin-top:20px;}
.tb{font-weight:700;font-family:'Tako','Manrope',sans-serif;}
.fh2{margin-top:10px;font-family:'Tako','Manrope',sans-serif;font-weight:700;color:var(--navy);}
section{display:flex;flex-direction:column;}

/* ================================================================
   Випадаюче меню файлів/повідомлень (з file_msg.css), перефарбоване
   у палітру проєкту замість слейтово-синьої.
   ================================================================ */
.menu-wrap{position:relative;display:inline-block;}
.trigger{
	display:inline-flex;align-items:center;justify-content:center;
	width:38px;height:38px;border-radius:10px;
	background:var(--panel);color:var(--blue-mid);
	border:1px solid var(--line);cursor:pointer;user-select:none;
	transition:background .15s, color .15s, transform .12s, box-shadow .15s;
}
.trigger:hover{background:var(--blue-accent);color:#fff;}
.trigger:active{transform:translateY(1px);}

.menu{
	position:absolute;left:0;top:100%;margin-top:8px;
	background:#fff;border:1px solid var(--line);border-radius:12px;
	box-shadow:0 14px 34px -18px rgba(16,63,149,.35);
	padding:6px;display:flex;gap:6px;list-style:none;z-index:9999;
	opacity:0;visibility:hidden;transform:translateY(-6px);
	transition:opacity .2s, transform .2s, visibility .2s;
}
.menu-wrap:hover .menu, .menu-wrap:focus-within .menu{
	opacity:1;visibility:visible;transform:translateY(0);
}
.menu > li{position:relative;}
.menu > li > a{
	display:block;padding:9px 14px;border-radius:9px;color:var(--ink);
	transition:background .15s, color .15s;white-space:nowrap;font-size:13.5px;
}
.menu > li > a:hover, .menu > li:focus-within > a{background:var(--panel);}
.menu > li.has-sub > a::after{content:'▾';margin-left:.5ch;color:#8b91a3;}

.submenu{
	position:absolute;left:0;top:100%;margin-top:6px;min-width:180px;
	background:#fff;border:1px solid var(--line);border-radius:12px;
	box-shadow:0 14px 34px -18px rgba(16,63,149,.35);
	list-style:none;padding:6px;display:grid;gap:4px;z-index:10000;
	opacity:0;visibility:hidden;transform:translateY(-6px);
	transition:opacity .18s, transform .18s, visibility .18s;
}
.menu > li:hover .submenu, .menu > li:focus-within .submenu{
	opacity:1;visibility:visible;transform:translateY(0);
}
.submenu a{
	display:block;padding:6px 12px;border-radius:8px;color:var(--ink);
	font-size:13px;transition:background .12s, color .12s;
}
.submenu a:hover, .submenu a:focus{background:var(--blue-accent);color:#fff;outline:none;}

/* ---------- Адаптивність (перенесено зі style.css) ---------- */
@media (max-width: 1441px){
	.wrap{padding:10px 60px;}
	.wraph{padding:10px 60px;}
}
@media (max-width: 1025px){
	.wrap{padding:10px;}
	.wraptwo{padding:30px 30px 0;}
	.fc{flex-wrap:wrap;}
}
@media (max-width: 769px){
	.hteacher{flex-wrap:wrap;}
	.ht{font-size:14px;}
	.t, .regt, .regti, .regun{font-size:12px;}
	section{display:block;}
}
@media (max-width: 623px){
	.t{max-width:500px;}
	.f{max-width:500px;}
	.farea{max-width:500px;}
}
@media (max-width: 426px){
	.wraptwo{padding:10px;}
	.t td{padding:5px;}
	.regb{padding:8px;}
}