.pi-post-shell{--bg:var(--mek-brand-navy-deep);--bg-2:#111f3a;--panel:#08213d;--panel-2:#0a294b;--panel-3:#0b3157;--line:rgb(var(--mek-brand-primary-rgb)/.34);--line-soft:rgb(var(--mek-brand-primary-rgb)/.16);--text:var(--mek-color-on-dark);--muted:#9db6d2;--blue:var(--mek-brand-primary);--blue-2:var(--mek-brand-primary);--blue-3:#75c3ff;--shadow:0 24px 70px rgba(0,0,0,.22);--radius:var(--mek-radius);--page-container:1440px;--page-extra-pad:75px;display:flow-root;min-width:0;overflow:hidden;color:var(--text);background:radial-gradient(circle at 78% 3%,rgb(var(--mek-brand-primary-rgb)/.12),transparent 28rem),linear-gradient(180deg,#06182e 0%,#05182d 64%,var(--mek-brand-navy-deep) 100%);font-family:var(--mek-font-site-sans);font-size:16px;line-height:1.5} .pi-post-shell,.pi-post-shell *{box-sizing:border-box} .pi-post-shell button{font-family:inherit} .pi-post-shell .post-row{color:var(--text);text-decoration:none} .pi-post-shell .post-row:focus-visible{outline:2px solid var(--mek-brand-primary);outline-offset:2px} .pi-post-shell .posts-list{min-width:0} .pi-post-shell .viewer-stage{border:1px solid #2a5e91;padding:0;cursor:zoom-in;text-align:unset;appearance:none} .pi-post-shell .viewer-stage[disabled]{cursor:wait} .pi-post-shell .viewer-stage img{pointer-events:none} .pi-post-shell .posts-empty{position:relative;inset:auto;min-height:130px} .pi-post-shell .posts-list:has(.posts-empty:not([hidden])){grid-auto-rows:auto;min-height:130px} .pi-post-shell .post-row:not([hidden]){flex:none} .pi-post-shell .posts-list:has(.post-row:not([hidden])) .posts-empty[hidden]{display:none} .pi-post-shell .posts-list:empty::before{content:'Henüz yayımlanmış post bulunmuyor.';padding:20px} .pi-post-shell .viewer-loading{min-height:260px;display:grid;place-items:center;color:var(--muted);text-align:center;font-weight:700} .pi-post-shell .viewer-loading[hidden]{display:none} .pi-post-shell .viewer-panel[hidden]{display:none!important} .pi-post-shell .detail-empty[hidden]{display:none!important} @media(max-width:820px){.pi-post-shell .posts-list:has(.posts-empty:not([hidden])){height:auto}.pi-post-shell .posts-header{isolation:isolate}} .pi-post-shell{--bg:var(--mek-brand-navy-deep); --bg-2:color-mix(in srgb,var(--mek-brand-navy-deep) 90%,var(--mek-brand-primary) 10%); --panel:#08213d; --panel-2:#0a294b; --panel-3:#0b3157; --line:rgb(var(--mek-brand-primary-rgb)/.34); --line-soft:rgba(98,163,226,.16); --text:var(--mek-color-on-dark); --muted:#9db6d2; --blue:var(--mek-brand-primary); --blue-2:var(--mek-brand-primary); --blue-3:color-mix(in srgb,var(--mek-brand-primary) 48%,white); --shadow:0 24px 70px rgba(0,0,0,.22); --radius:var(--mek-radius); --page-container:1440px; --page-extra-pad:75px;} .pi-post-shell, .pi-post-shell *{box-sizing:border-box} .pi-post-shell button, .pi-post-shell a{font:inherit} .pi-post-shell button{color:inherit} .pi-post-shell svg{display:block} .pi-post-shell .pi-post-content{width:min(var(--page-container),calc(100% - 104px)); margin:32px auto 80px; position:relative; z-index:3; padding-inline:var(--page-extra-pad);} .pi-post-shell .pi-post-main-grid{display:grid; grid-template-columns:445px minmax(0,1fr); gap:12px; min-height:490px;} .pi-post-shell .detail-panel{min-width:0; display:flex; align-items:center; justify-content:center; overflow:hidden;} .pi-post-shell .panel{border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(180deg,rgba(8,35,65,.96),rgba(6,28,52,.97)); box-shadow:inset 0 1px 0 rgba(255,255,255,.015),var(--shadow);} .pi-post-shell .panel-title{font-size:18px;line-height:1;margin:16px 16px 10px;font-weight:900;letter-spacing:-.02em} .pi-post-shell .posts-panel{padding:0 10px 10px;display:flex;flex-direction:column} .pi-post-shell .posts-list{display:grid;gap:6px;grid-auto-rows:84px;height:444px;max-height:444px;overflow-y:auto;padding-right:8px;align-content:start} .pi-post-shell .post-row{position:relative; min-height:84px; display:grid; grid-template-columns:66px minmax(0,1fr) 18px; align-items:center; gap:11px; padding:7px 9px; border:1px solid rgba(88,146,200,.12); border-radius:11px; background:linear-gradient(180deg,rgba(12,48,84,.55),rgba(7,32,59,.68)); cursor:pointer; transition:.18s ease;} .pi-post-shell .post-row:hover{border-color:rgba(58,157,255,.45);background:linear-gradient(180deg,rgba(13,59,104,.68),rgba(8,38,70,.78))} .pi-post-shell .post-row.is-active{border-color:var(--mek-brand-primary); background:linear-gradient(180deg,rgba(13,67,118,.95),rgba(7,47,87,.96)); box-shadow:0 0 0 1px rgba(29,157,255,.08),inset 0 0 26px rgba(18,128,234,.09);} .pi-post-shell .thumb{width:66px;height:66px;border-radius:8px;overflow:hidden;background:#0a3159;box-shadow:0 5px 14px rgba(0,0,0,.24)} .pi-post-shell .thumb img{width:100%;height:100%;object-fit:cover;display:block} .pi-post-shell .row-copy{min-width:0} .pi-post-shell .row-title{font-size:13.5px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pi-post-shell .row-meta{display:flex;gap:10px;align-items:center;margin-top:5px;color:#a7bdd4;font-size:11px;font-weight:600} .pi-post-shell .meta-item{display:flex;align-items:center;gap:5px;white-space:nowrap} .pi-post-shell .meta-item svg{width:14px;height:14px;color:#a7c9ec} .pi-post-shell .row-arrow{width:17px;height:17px;display:grid;place-items:center;color:#8dc9ff} .pi-post-shell .row-arrow svg{width:15px;height:15px} .pi-post-shell .posts-list::-webkit-scrollbar{width:8px} .pi-post-shell .posts-list::-webkit-scrollbar-track{background:rgba(7,31,57,.42);border-radius:999px} .pi-post-shell .posts-list::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--mek-brand-primary),#0b67d0);border-radius:999px;border:2px solid rgba(7,31,57,.42)} .pi-post-shell .posts-list{scrollbar-width:thin;scrollbar-color:var(--mek-brand-primary) rgba(7,31,57,.42)} .pi-post-shell .viewer-panel{width:100%;min-width:0;padding:28px 20px 19px;display:flex;flex-direction:column;align-items:center;justify-content:center} .pi-post-shell .viewer-shell{width:100%; display:grid; grid-template-columns:44px minmax(0,412px) 44px; grid-template-rows:auto auto; align-items:center; justify-content:center; column-gap:22px; row-gap:22px; transform:translateY(-4px);} .pi-post-shell .viewer-stage{grid-column:2; grid-row:1; width:412px;height:412px;border-radius:13px;position:relative;overflow:hidden; background:#082c54;border:1px solid #2a5e91;box-shadow:0 14px 36px rgba(0,0,0,.30);} .pi-post-shell .viewer-stage img{width:100%;height:100%;object-fit:cover;display:block; transform:scale(1.075);transform-origin:center center;} .pi-post-shell .counter{position:absolute;right:12px;top:12px;z-index:5; min-width:46px;height:27px;padding:0 10px;border-radius:14px; display:flex;align-items:center;justify-content:center; background:rgba(5,28,54,.88); font-size:11px;font-weight:900;box-shadow:0 5px 14px rgba(0,0,0,.18);} .pi-post-shell .arrow-btn{position:static; width:44px;height:44px;border-radius:50%; display:grid;place-items:center;border:1px solid #2876b6; background:rgba(7,31,57,.92);box-shadow:0 10px 24px rgba(0,0,0,.25); cursor:pointer;} .pi-post-shell .arrow-btn:hover{background:#0b4274} .pi-post-shell .arrow-btn svg{width:20px;height:20px} .pi-post-shell .arrow-btn.prev{grid-column:1;grid-row:1} .pi-post-shell .arrow-btn.next{grid-column:3;grid-row:1} .pi-post-shell .dots{grid-column:2; grid-row:2; display:flex; justify-content:center; gap:11px; min-height:9px; margin-top:6px;} .pi-post-shell .dot{width:8px;height:8px;border-radius:50%;background:#6583a3;border:0;padding:0;box-shadow:none} .pi-post-shell .dot.is-active{background:var(--mek-brand-primary);box-shadow:0 0 11px rgba(20,157,255,.85)} @media (max-width:1450px){ .pi-post-shell{--page-extra-pad:40px;} .pi-post-shell .pi-post-content{width:calc(100% - 80px);} .pi-post-shell .pi-post-main-grid{grid-template-columns:420px minmax(0,1fr);} .pi-post-shell .viewer-panel{padding-inline:0;} } @media (max-width:1350px){ .pi-post-shell{--page-extra-pad:clamp(22px,2.7vw,38px);} .pi-post-shell .pi-post-content{width:calc(100% - 56px);} .pi-post-shell .pi-post-main-grid{grid-template-columns:clamp(325px,38%,400px) minmax(0,1fr);} .pi-post-shell .viewer-panel{padding-inline:10px;} .pi-post-shell .viewer-shell{grid-template-columns:40px minmax(0,390px) 40px; column-gap:clamp(11px,1.4vw,18px);} .pi-post-shell .viewer-stage{width:100%;height:auto;aspect-ratio:1;} .pi-post-shell .arrow-btn{width:40px;height:40px;} } @media (max-width:1180px){ .pi-post-shell .pi-post-main-grid{grid-template-columns:clamp(315px,37%,385px) minmax(0,1fr);} .pi-post-shell .viewer-shell{grid-template-columns:38px minmax(0,360px) 38px; column-gap:12px;} .pi-post-shell .arrow-btn{width:38px;height:38px;} } @media (max-width:1050px){ .pi-post-shell{--page-extra-pad:clamp(14px,2.2vw,24px);} .pi-post-shell .pi-post-content{width:calc(100% - 40px);} .pi-post-shell .pi-post-main-grid{grid-template-columns:clamp(284px,37%,365px) minmax(0,1fr);gap:12px;min-height:0;} .pi-post-shell .posts-panel, .pi-post-shell .detail-panel{min-width:0;} .pi-post-shell .viewer-panel{padding:18px 6px 18px;} .pi-post-shell .viewer-shell{grid-template-columns:36px minmax(0,390px) 36px; column-gap:10px; row-gap:18px; transform:none;} .pi-post-shell .viewer-stage{width:100%;height:auto;aspect-ratio:1;} .pi-post-shell .arrow-btn{width:36px;height:36px;} .pi-post-shell .posts-list{overscroll-behavior:contain;} } @media (max-width:820px){ .pi-post-shell{--page-extra-pad:clamp(18px,3vw,26px);} .pi-post-shell .pi-post-content{width:calc(100% - 32px);} .pi-post-shell .pi-post-main-grid{grid-template-columns:minmax(0,1fr);gap:14px;} .pi-post-shell .posts-panel, .pi-post-shell .detail-panel{min-width:0;width:100%;} .pi-post-shell .viewer-panel{padding:28px 14px 24px;} .pi-post-shell .viewer-shell{grid-template-columns:44px minmax(0,412px) 44px; column-gap:20px; transform:translateY(-4px);} .pi-post-shell .viewer-stage{width:100%;height:auto;aspect-ratio:1;} .pi-post-shell .arrow-btn{width:44px;height:44px;} } @media (max-width:760px){ .pi-post-shell{--page-extra-pad:clamp(10px,2.2vw,18px);} .pi-post-shell .pi-post-content{width:calc(100% - 24px);margin-top:24px;} .pi-post-shell .pi-post-main-grid{gap:12px;} .pi-post-shell .posts-panel{padding-inline:10px;} .pi-post-shell .viewer-panel{padding:23px 12px 22px;} .pi-post-shell .viewer-shell{grid-template-columns:40px minmax(0,390px) 40px; column-gap:12px;row-gap:16px;transform:none;} .pi-post-shell .viewer-stage{width:100%;height:auto;aspect-ratio:1;} .pi-post-shell .arrow-btn{width:40px;height:40px;} .pi-post-shell .detail-panel{min-height:0;} } @media (max-width:640px){ .pi-post-shell .pi-post-content{width:calc(100% - 24px);} .pi-post-shell .posts-panel{padding:0 9px 11px;} .pi-post-shell .panel-title{margin:15px 15px 10px;} .pi-post-shell .posts-list{scrollbar-gutter:stable;} .pi-post-shell .viewer-panel{padding:20px 14px 22px;} .pi-post-shell .viewer-shell{width:min(100%,440px); grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto; column-gap:0;row-gap:17px; transform:none;} .pi-post-shell .viewer-stage{grid-column:1;grid-row:1;width:100%;height:auto;aspect-ratio:1;} .pi-post-shell .arrow-btn, .pi-post-shell .arrow-btn.prev, .pi-post-shell .arrow-btn.next{grid-column:1;grid-row:1; align-self:center;z-index:6; width:42px;height:42px; border-color:rgba(123,197,255,.75); background:rgba(4,24,46,.83); box-shadow:0 5px 16px rgba(0,0,0,.34);} .pi-post-shell .arrow-btn.prev{justify-self:start;margin-left:9px;} .pi-post-shell .arrow-btn.next{justify-self:end;margin-right:9px;} .pi-post-shell .dots{grid-column:1;grid-row:2;margin:0;gap:4px;min-height:24px;align-items:center;} .pi-post-shell .dot{width:20px;height:24px;display:grid;place-items:center;background:transparent;box-shadow:none;cursor:pointer;} .pi-post-shell .dot::before{content:"";display:block;width:8px;height:8px;border-radius:50%;background:#6583a3;} .pi-post-shell .dot.is-active{background:transparent;box-shadow:none;} .pi-post-shell .dot.is-active::before{background:var(--mek-brand-primary);box-shadow:0 0 11px rgba(20,157,255,.85);} } @media (max-width:430px){ .pi-post-shell .pi-post-content{margin-top:20px;} .pi-post-shell .viewer-panel{padding:16px 10px 19px;} .pi-post-shell .viewer-shell{row-gap:13px;} .pi-post-shell .arrow-btn, .pi-post-shell .arrow-btn.prev, .pi-post-shell .arrow-btn.next{width:38px;height:38px;} .pi-post-shell .arrow-btn svg{width:19px;height:19px;} .pi-post-shell .posts-list{padding-right:5px;} .pi-post-shell .post-row{grid-template-columns:58px minmax(0,1fr) 15px;gap:8px;padding:7px 8px;} .pi-post-shell .thumb{width:58px;height:58px;} .pi-post-shell .row-title{font-size:13px;} .pi-post-shell .row-meta{gap:8px;font-size:10.5px;} .pi-post-shell .meta-item{gap:4px;} .pi-post-shell .meta-item svg{width:13px;height:13px;flex:none;} .pi-post-shell .row-arrow{width:15px;height:15px;} .pi-post-shell .arrow-btn.prev{margin-left:7px;} .pi-post-shell .arrow-btn.next{margin-right:7px;} } @media (max-width:360px){ .pi-post-shell .pi-post-content{width:calc(100% - 16px);} .pi-post-shell{--page-extra-pad:8px;} .pi-post-shell .posts-panel{padding-inline:7px;} .pi-post-shell .post-row{grid-template-columns:54px minmax(0,1fr) 13px;gap:7px;padding-inline:7px;} .pi-post-shell .thumb{width:54px;height:54px;} .pi-post-shell .row-meta{gap:6px;font-size:10px;} .pi-post-shell .viewer-panel{padding-inline:8px;} } @media (prefers-reduced-motion:reduce){ .pi-post-shell .post-row{transition:none;} } .pi-post-shell .post-row:focus-visible, .pi-post-shell .arrow-btn:focus-visible, .pi-post-shell .dot:focus-visible{outline:2px solid #72c8ff;outline-offset:3px;} .pi-post-shell .mobile-detail-header{display:none;} @media (max-width:820px){ .pi-post-shell .pi-post-main-grid{display:block; min-height:0;} .pi-post-shell .pi-post-main-grid:not(.is-detail-view) .detail-panel{display:none;} .pi-post-shell .pi-post-main-grid.is-detail-view .posts-panel{display:none;} .pi-post-shell .pi-post-main-grid.is-detail-view .detail-panel{display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; min-height:0; overflow:hidden;} .pi-post-shell .posts-list{height:auto; max-height:none; overflow:visible; grid-auto-rows:84px; align-content:start; padding-right:0;} .pi-post-shell .posts-panel{padding-bottom:12px;} .pi-post-shell .mobile-detail-header{display:flex; flex-direction:column; gap:14px; padding:19px 22px 3px;} .pi-post-shell .mobile-back{align-self:flex-start; display:inline-flex; align-items:center; gap:9px; min-height:44px; margin:0; padding:0 14px 0 5px; background:transparent; border:0; border-radius:9px; color:#79c4ff; font-size:14px; font-weight:900; cursor:pointer;} .pi-post-shell .mobile-back svg{width:20px; height:20px;} .pi-post-shell .mobile-post-heading{margin:0; color:var(--text); font-size:clamp(18px,3.5vw,24px); font-weight:900; line-height:1.24; overflow-wrap:anywhere;} .pi-post-shell .detail-panel .viewer-panel{width:100%; min-height:0; padding-top:16px;} .pi-post-shell .viewer-stage{touch-action:pan-y;} .pi-post-shell .mobile-back:focus-visible{outline:2px solid #72c8ff; outline-offset:3px;} } @media (max-width:640px){ .pi-post-shell .mobile-detail-header{padding:12px 17px 0; gap:10px;} .pi-post-shell .detail-panel .viewer-panel{padding-top:15px;} .pi-post-shell .posts-list{scrollbar-gutter:auto;} } @media (max-width:430px){ .pi-post-shell .mobile-detail-header{padding-inline:15px;} .pi-post-shell .mobile-post-heading{font-size:19px;} } .pi-post-shell .posts-header{position:relative;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px} .pi-post-shell .posts-header .panel-title{margin:16px 0 10px 16px} .pi-post-shell .date-filter{position:relative;margin-right:3px;flex:none} .pi-post-shell .date-filter__trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:34px;padding:5px 10px;border:1px solid rgba(64,150,222,.48);border-radius:9px;background:rgba(11,48,83,.65);color:#d5eaff;font-size:12px;font-weight:800;cursor:pointer;transition:background .16s,border-color .16s} .pi-post-shell .date-filter__trigger:hover, .pi-post-shell .date-filter__trigger[aria-expanded="true"]{border-color:#329af0;background:#0b3b66} .pi-post-shell .date-filter__trigger.is-filtered{color:#fff;border-color:var(--mek-brand-primary);background:rgba(18,102,168,.67)} .pi-post-shell .date-filter__trigger svg{display:block;width:16px;height:16px;flex:none} .pi-post-shell .date-filter__trigger .date-filter__chevron{width:13px;height:13px;transition:transform .18s} .pi-post-shell .date-filter__trigger[aria-expanded="true"] .date-filter__chevron{transform:rotate(180deg)} .pi-post-shell .date-filter__popover{position:absolute;top:calc(100% + 8px);right:0;z-index:30;width:min(278px,calc(100vw - 44px));display:grid;gap:13px;padding:17px;border:1px solid #2a6497;border-radius:13px;background:#0b2745;box-shadow:0 18px 48px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.04)} .pi-post-shell .date-filter__popover[hidden]{display:none} .pi-post-shell .date-filter__heading{color:#f2f8ff;font-size:14px;font-weight:900} .pi-post-shell .date-filter__field{display:grid;gap:7px;color:#a9c8e4;font-size:12px;font-weight:800} .pi-post-shell .date-filter__field select{appearance:none;width:100%;height:41px;padding:0 34px 0 12px;border:1px solid #27577f;border-radius:9px;background:#071e35 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%2399cfff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center;color:#f0f7ff;font:inherit;font-size:13px;cursor:pointer} .pi-post-shell .date-filter__field select:focus-visible, .pi-post-shell .date-filter__trigger:focus-visible, .pi-post-shell .date-filter__reset:focus-visible{outline:2px solid #77ceff;outline-offset:2px} .pi-post-shell .date-filter__footer{display:flex;align-items:center;justify-content:space-between;gap:9px;padding-top:3px;border-top:1px solid rgba(125,179,225,.15)} .pi-post-shell .date-filter__footer span{font-size:12px;font-weight:700;color:#a5bfda} .pi-post-shell .date-filter__reset{padding:6px 10px;border:1px solid rgba(69,160,239,.55);border-radius:8px;background:rgba(18,94,154,.28);color:#d4efff;font-size:12px;font-weight:900;cursor:pointer} .pi-post-shell .date-filter__reset:hover{background:rgba(26,127,206,.4)} .pi-post-shell .post-row[hidden]{display:none!important} @media (max-width:640px){ .pi-post-shell .posts-header .panel-title{margin:15px 0 10px 15px} .pi-post-shell .date-filter{margin-right:5px} .pi-post-shell .date-filter__trigger{min-height:40px;padding:7px 10px;font-size:12px} } @media (max-width:360px){ .pi-post-shell .posts-header .panel-title{margin-left:11px} .pi-post-shell .date-filter__trigger{gap:5px} } .pi-post-shell .date-filter__popover{width:min(324px,calc(100vw - 36px));gap:12px} .pi-post-shell .date-filter__date-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px} .pi-post-shell .date-filter__date-fields .date-filter__field{min-width:0} .pi-post-shell .date-filter__date-fields select{min-width:0;padding-left:10px;padding-right:29px;background-position:right 8px center} .pi-post-shell #dateFilterLabel{display:block;max-width:128px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pi-post-shell .posts-list{position:relative} .pi-post-shell .posts-empty{position:absolute;top:25px;left:9px;right:17px;min-height:100px;padding:18px;border:1px dashed #30618d;border-radius:11px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;line-height:1.55;font-weight:700;color:#b1cce5;background:rgba(9,42,75,.4)} .pi-post-shell .posts-empty[hidden], .pi-post-shell .detail-empty[hidden]{display:none!important} .pi-post-shell .detail-empty{max-width:300px;padding:20px;text-align:center;color:#afcae3;font-size:14px;line-height:1.65;font-weight:700} .pi-post-shell .detail-panel.is-empty .viewer-panel, .pi-post-shell .detail-panel.is-empty .mobile-detail-header{display:none} @media (max-width:430px){ .pi-post-shell .date-filter__popover{width:min(324px,calc(100vw - 30px));padding:14px} .pi-post-shell .date-filter__date-fields{gap:8px} .pi-post-shell #dateFilterLabel{max-width:94px} } .pi-post-shell .date-filter__trigger{min-height:32px; gap:6px; padding:5px 9px; font-size:11.5px;} .pi-post-shell .date-filter__trigger svg{width:14px;height:14px;} .pi-post-shell .date-filter__trigger .date-filter__chevron{width:11px;height:11px;} .pi-post-shell #dateFilterLabel{max-width:none;} @media (max-width:820px){ .pi-post-shell .posts-header{display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:8px; row-gap:10px; min-height:0; padding:11px 10px 0; margin-bottom:10px;} .pi-post-shell .posts-header .panel-title{margin:0 0 0 6px;} .pi-post-shell .date-filter{display:contents;} .pi-post-shell .date-filter__trigger{grid-column:2; grid-row:1; justify-self:end; min-height:36px; padding:5px 9px; gap:6px; font-size:11.5px;} .pi-post-shell .date-filter__popover{position:static; grid-column:1/-1; grid-row:2; width:min(324px,100%); max-width:100%; justify-self:end; margin:0 0 4px;} } @media (max-width:360px){ .pi-post-shell .posts-header{padding-inline:7px;column-gap:5px;} .pi-post-shell .posts-header .panel-title{margin-left:4px;} .pi-post-shell .date-filter__trigger{padding-inline:7px;gap:4px;} } .pi-post-shell .pi-thumb-placeholder{display:grid;place-items:center;width:100%;height:100%;background:rgb(var(--mek-brand-primary-rgb)/.18);color:#9ecfff} .pi-post-shell .pi-thumb-placeholder svg{width:28px;height:28px} .pi-post-shell .arrow-btn:disabled{opacity:.45;cursor:default} .pi-post-shell #posts-heading{color:var(--mek-color-on-dark,#fff)!important} .pi-post-shell .row-meta .meta-item{display:inline-flex;align-items:center;gap:5px;line-height:14px;white-space:nowrap} .pi-post-shell .row-meta .meta-item svg{display:block;flex:0 0 14px;align-self:center;width:14px;height:14px} .pi-post-shell .row-meta .meta-item .meta-text,.pi-post-shell .row-meta .meta-item time{display:inline-flex;align-items:center;height:14px;line-height:14px} .pi-post-shell .posts-panel .posts-list .row-meta { display:flex; align-items:center; flex-wrap:nowrap; gap:10px; } .pi-post-shell .posts-panel .posts-list .row-meta .meta-item { display:inline-grid; grid-template-columns:16px max-content; grid-template-rows:18px; align-items:center; column-gap:5px; height:18px; min-height:18px; padding:0; margin:0; line-height:1; vertical-align:middle; white-space:nowrap; } .pi-post-shell .posts-panel .posts-list .row-meta .meta-icon { display:grid; width:16px; height:18px; place-items:center; margin:0; padding:0; } .pi-post-shell .posts-panel .posts-list .row-meta .meta-icon svg { display:block; position:static; width:14px; height:14px; margin:0; padding:0; flex:none; color:#a7c9ec; } .pi-post-shell .posts-panel .posts-list .row-meta .meta-item > .meta-text { display:block; position:relative; top:1px; height:16px; margin:0; padding:0; font:inherit; font-weight:600; line-height:16px; white-space:nowrap; } @media (max-width:430px) { .pi-post-shell .posts-panel .posts-list .row-meta {gap:6px} .pi-post-shell .posts-panel .posts-list .row-meta .meta-item { grid-template-columns:14px max-content; column-gap:4px; } .pi-post-shell .posts-panel .posts-list .row-meta .meta-icon {width:14px} .pi-post-shell .posts-panel .posts-list .row-meta .meta-icon svg {width:13px;height:13px} }