1/**
2 * PGP Block Plugin - Unified Stylesheet
3 */
4
5/* =========================================================================
6   1. FRONTEND RENDERING (syntax.php)
7   ========================================================================= */
8
9/* The outer container for an encrypted block */
10.dokuwiki .pgpblock-container {
11    margin: 1em 0;
12    border: 1px solid #000;
13    border-radius: 2px;
14    overflow: hidden;
15    font-family: sans-serif;
16    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
17}
18
19/* Modifier: Encrypted Text Block (Blue Theme) */
20.dokuwiki .pgp-type-text {
21    border-color: #601014;
22/*    background-color: #f0f4ff; */
23}
24
25.dokuwiki .pgp-type-text .pgp-header {
26    background-color: #601014;
27}
28
29/* Modifier: Encrypted File Block (Green Theme) */
30.dokuwiki .pgp-type-file {
31    border-color: #601014;
32/*    background-color: #f0fff4; */
33}
34
35
36.dokuwiki .pgp-type-file .pgp-header {
37    background-color: #601014;
38}
39
40
41/* Header bar inside the container */
42.dokuwiki .pgp-header {
43    color: #fff;
44    padding: 6px 12px;
45    font-size: 0.85em;
46    font-weight: bold;
47    text-transform: uppercase;
48    letter-spacing: 0.05em;
49}
50
51/* The actual PGP Armored Text block */
52.dokuwiki .pgpblock {
53    display: block;
54    padding: 0.7em 1em;
55    margin: 0;
56    border: none;
57    border-top: 1px solid rgba(0,0,0,0.1);
58    border-radius: 0;
59    box-shadow: inset 0 0 0.5em rgba(0,0,0,0.1);
60    overflow: auto;
61
62    /* Background & Aesthetics */
63    /* background: pink; */ /* As per your original preference */
64    background-image: url(images/redstatic.gif);
65
66    /* Typography */
67    font-family: Program, monospace;
68    font-size: 0.80em;
69    font-style: normal !important;
70    color: #000;
71    text-align: left;
72    direction: ltr;
73
74    /* Whitespace */
75    white-space: pre-wrap;
76    word-wrap: normal;
77    max-height: 250px;
78}
79
80/* Unencrypted Plaintext fallback */
81.dokuwiki .pgpblock-plaintext {
82    display: block;
83    padding: 0.7em 1em;
84    border: 1px dashed #cc0000;
85    border-radius: 2px;
86    box-shadow: inset 0 0 0.5em #ddd;
87    overflow: auto;
88    background: white;
89
90    /* Typography */
91    font-family: Program, monospace;
92    font-size: 0.80em;
93    font-style: normal !important;
94    color: #cc0000;
95    text-align: left;
96    direction: ltr;
97
98    /* Whitespace */
99    white-space: pre-wrap;
100    word-wrap: normal;
101}
102
103/* =========================================================================
104   2. EDITOR UI TOOLBAR (script.js)
105   ========================================================================= */
106
107.pgpblock-edit-tools {
108    background: #f0f4f8;
109    border: 1px solid #ccd;
110    padding: 8px;
111    margin-bottom: 5px;
112    border-radius: 3px;
113    display: flex;
114    float: left;
115    align-items: center;
116    gap: 10px;
117    justify-content: space-between;
118    /* float: left; */ /* Removed to ensure flexbox works correctly, but added back if required by your layout */
119}
120
121.pgp-info-label {
122    font-size: 0.9em;
123    color: #334466;
124}
125
126/* =========================================================================
127   3. BUTTONS (Shared logic)
128   ========================================================================= */
129
130.pgp-btn {
131    padding: 5px 14px;
132    font-weight: bold;
133    cursor: pointer;
134    border: none;
135    border-radius: 3px;
136    color: #fff;
137    font-size: 0.9em;
138    transition: background-color 0.2s ease, transform 0.1s ease, opacity 0.2s ease;
139}
140
141/* Text Button (Blue) */
142.pgp-btn-text {
143    background-color: #601014;
144}
145.pgp-btn-text:hover {
146    background-color: #601014;
147}
148
149/* File Button (Green) */
150.pgp-btn-file {
151    background-color: #601014;
152}
153.pgp-btn-file:hover {
154    background-color: #601014;
155}
156
157/* Cancel/Secondary Button (Grey) */
158.pgp-btn-cancel {
159    background-color: #eee;
160    color: #333;
161    border: 1px solid #ccc;
162}
163.pgp-btn-cancel:hover {
164    background-color: #ddd;
165    border-color: #bbb;
166}
167
168/* Click feedback */
169.pgp-btn:active {
170    transform: translateY(1px);
171}
172
173/* Disabled state */
174.pgp-btn:disabled,
175.pgp-btn:disabled:hover {
176    opacity: 0.5;
177    background-color: #999;
178    cursor: not-allowed;
179    transform: none;
180}
181
182/* =========================================================================
183   4. PASSWORD MODAL (script.js)
184   ========================================================================= */
185
186#pgpblock-modal {
187    display: none; /* Hidden by default */
188    position: fixed;
189    top: 0; left: 0;
190    width: 100%; height: 100%;
191    background: rgba(0,0,0,0.5);
192    z-index: 10000;
193    align-items: center;
194    justify-content: center;
195}
196
197.pgp-modal-content {
198    background: #fff;
199    padding: 25px;
200    border-radius: 5px;
201    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
202    width: 360px;
203    max-width: 90%;
204    box-sizing: border-box;
205    font-family: 'Segoe UI', Tahoma, sans-serif;
206}
207
208.pgp-modal-content h3 {
209    margin: 0 0 10px 0;
210    font-size: 1.3em;
211    color: #601014;
212    border-bottom: 2px solid #f0f4f8;
213    padding-bottom: 8px;
214}
215
216.pgp-modal-content p {
217    font-size: 0.9em;
218    color: #555;
219    margin: 10px 0 15px 0;
220    line-height: 1.5;
221}
222
223.pgp-modal-content input[type="password"] {
224    width: 100%;
225    padding: 12px;
226    margin-bottom: 20px;
227    border: 2px solid #eee;
228    border-radius: 4px;
229    box-sizing: border-box;
230    font-size: 1em;
231    transition: border-color 0.2s;
232}
233
234.pgp-modal-content input[type="password"]:focus {
235    border-color: #601014;
236    outline: none;
237}
238
239.pgp-modal-actions {
240    display: flex;
241    justify-content: flex-end;
242    gap: 8px;
243}
244